html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

main {
    display: block
}

h1 {
    font-size: 2em;
    margin: .7em 0
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    background-color: #fff0
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,
input {
    overflow: visible
}

button,
select {
    text-transform: none
}

button,
[type=button],
[type=reset],
[type=submit] {
    -webkit-appearance: button
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],
[type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

template {
    display: none
}

[hidden] {
    display: none
}

* {
    box-sizing: border-box
}

p {
    font-weight: 400;
    font-display: swap;
    line-height: 1.5;
    opacity: .9;
    color: #242424;
    text-rendering: optimizeLegibility
}

span {
    font-weight: 300;
    color: hsl(255 31% 20%);
    line-height: 1.5;
    text-rendering: optimizeLegibility
}

div {
    line-height: 1.5;
    text-rendering: optimizeLegibility
}

h1 {
    font-weight: 800;
    font-size: clamp(1.7rem, 4.1vw + 1rem, 4rem)
}

h2 {
    margin: 0;
    font-weight: 700;
    color: hsl(255 31% 20%);
    font-size: clamp(1.2rem, 2.4vw + 1rem, 2.5rem)
}

h2 br {
    display: none
}

@media (min-width:40rem) {
    h2 br {
        display: block
    }
}

h3 {
    font-size: clamp(1.2rem, 2.2vw + 1rem, 2.2rem);
    font-weight: 500;
    color: hsl(255 31% 20%)
}

h4 {
    font-size: clamp(1.1rem, 2.5vw + 1rem, 2.2rem);
    font-weight: 500
}

h5 {
    font-size: clamp(1.1rem, 2vw + 1rem, 2rem);
    font-weight: 500
}

h6 {
    font-size: clamp(1rem, 1.5vw + 1rem, 1.7rem);
    font-weight: 500
}

h1,
h2,
h3,
h4,
h5,
h6 {
    text-rendering: geometricPrecision
}

html {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    --webkit-font-smoothing: antialiased;
    background-color: #FAFAFA;
    max-width: 100%;
    overflow-x: clip;
    overscroll-behavior: none
}

html.no-scroll {
    overflow: hidden
}

body {
    overflow-x: clip;
    overscroll-behavior: none;
    font-size: clamp(0.8rem, 0.5vw + 0.9rem, 1.15rem)
}

section {
    padding: 1.2em 0
}

main a {
    color: hsl(256 35% 51% / .958)
}

.screen-reader-text {
    display: none
}

p {
    font-size: clamp(0.8rem, 0.5vw + 0.9rem, 1.15rem)
}

em {
    color: hsl(256 46% 58% / .957)
}

img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.alignwide {
    margin-left: -100px;
    margin-right: -100px
}

.filter-section {
    background: #f8f8f8;
    padding: 2em;
    border-radius: 8px;
    box-shadow: 0 2px 15px rgb(0 0 0 / .05)
}

.uk-form-label {
    font-weight: 500;
    margin-bottom: .5rem;
    display: block
}

.filter-select {
    border-radius: 1em
}

#active-filters {
    color: #666
}

li {
    color: hsl(255 31% 20%);
    font-weight: 400;
    margin: 1rem 0
}

ul.list-icons {
    list-style: none
}

.uk-accordion-title {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: start
}

@media (min-width:640px) {
    .uk-accordion-title {
        flex-direction: row;
        align-items: center
    }
}

.uk-accordion-title:before {
    display: block;
    visibility: visible;
    position: absolute;
    right: 0;
    color: #00C2AF;
    filter: brightness(0) saturate(100%) invert(63%) sepia(63%) saturate(4014%) hue-rotate(135deg) brightness(97%) contrast(101%);
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiIGQ9Ik0xMiA1djE0bS03LTdoMTQiLz48L3N2Zz4=)
}

.uk-accordion-title[aria-expanded=true]::before {
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0xOCAxMi45OThINmExIDEgMCAwIDEgMC0yaDEyYTEgMSAwIDAgMSAwIDIiLz48L3N2Zz4=)
}

.dropdowns li {
    margin-bottom: 2.5rem
}

.dropdowns .uk-accordion-content li {
    border-bottom: unset !important;
    margin: unset
}

.dropdowns .uk-accordion-content ul {
    margin: unset
}

.dropdowns h3 {
    font-size: 1.5rem;
    margin: unset;
    padding: 1rem 0;
    font-weight: 500
}

.dropdowns .uk-accordion-title {
    font-weight: 600
}

.bg-brand-purple {
    background-color: hsl(255 31% 20%);
    position: relative
}

.bg-brand-purple p,
.bg-brand-purple span,
.bg-brand-purple h2,
.bg-brand-purple h3,
.bg-brand-purple h4,
.bg-brand-purple h5,
.bg-brand-purple h6 {
    color: #FAFAFA
}

.bg-brand-purple .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.bg-brand-purple div.uk-flex-first .image:after {
    background: #FAFAFA
}

.bg-brand-purple h2 img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(40%) saturate(4000%) hue-rotate(134deg) brightness(96%) contrast(101%)
}

.bg-brand-purple .uk-accordion li {
    color: #FAFAFA;
    padding: .5rem 0;
    border-bottom: .5px solid #FAFAFA;
    transition: 0.2s ease-in-out
}

.bg-brand-purple .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-purple .uk-slider a svg polyline {
    stroke: #FAFAFA !important
}

.bg-brand-purple .uk-slider-nav a {
    height: 1rem;
    width: 1rem;
    border-color: #FAFAFA
}

.bg-brand-purple .uk-slider-nav a:hover {
    background-color: hsl(256 46% 58% / .957)
}

.bg-brand-purple .uk-slider-nav .uk-active a {
    background-color: hsl(256 46% 58% / .957)
}

.bg-brand-purple li {
    color: #FAFAFA
}

.bg-brand-purple li::marker {
    color: #00C2AF
}

.bg-brand-purple em {
    color: hsl(256 100% 78% / .958)
}

.bg-brand-purple a {
    color: hsl(256 100% 78% / .958);
    transition: 0.2s ease
}

.bg-brand-purple a:hover,
.bg-brand-purple a:focus {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
    -webkit-text-decoration-skip-ink: none;
    text-decoration-skip-ink: none;
    color: hsl(256 100% 78% / .958);
    text-decoration-color: #fff
}

.bg-brand-lite {
    background-color: #f2f2f2;
    position: relative
}

.bg-brand-lite li {
    color: hsl(255 31% 20%)
}

.bg-brand-lite li::marker {
    color: hsl(255 31% 20%)
}

.bg-brand-lite h2 img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(40%) saturate(4000%) hue-rotate(134deg) brightness(96%) contrast(101%)
}

.bg-brand-lite p,
.bg-brand-lite span {
    color: #242424
}

.bg-brand-lite .uk-accordion li {
    color: hsl(255 31% 20%);
    padding: .5rem 0;
    border-bottom: .5px solid hsl(255 31% 20%);
    transition: 0.2s ease-in-out
}

.bg-brand-lite .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-green {
    background-color: #00C2AF
}

.bg-brand-green p,
.bg-brand-green span {
    color: #242424
}

.bg-brand-green li {
    color: hsl(255 31% 20%)
}

.bg-brand-green li::marker {
    color: hsl(255 31% 20%)
}

.bg-brand-green .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.bg-brand-green div.uk-flex-first .image:after {
    background: #FAFAFA !important
}

.bg-brand-green .uk-accordion li {
    color: hsl(255 31% 20%);
    padding: .5rem 0;
    border-bottom: .5em solid hsl(255 31% 20%);
    transition: 0.2s ease-in-out
}

.bg-brand-green .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-green .uk-accordion li .uk-accordion-title:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='%232c2344' d='m5.84 9.59l5.66 5.66l5.66-5.66l-.71-.7l-4.95 4.95l-4.95-4.95z'/%3E%3C/svg%3E")
}

.bg-brand-green .uk-accordion li.uk-open>.uk-accordion-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='%232c2344' d='m5.84 15.41l5.66-5.66l5.66 5.66l-.71.7l-4.95-4.95l-4.95 4.95z'/%3E%3C/svg%3E")
}

.bg-brand-orange {
    background-color: #F60000;
    position: relative
}

.bg-brand-orange li {
    color: hsl(255 31% 20%)
}

.bg-brand-orange li::marker {
    color: hsl(255 31% 20%)
}

.bg-brand-orange p,
.bg-brand-orange span {
    color: hsl(255 31% 20%)
}

.bg-brand-orange .main-button {
    border-color: hsl(255 31% 20%);
    color: hsl(255 31% 20%)
}

.bg-brand-orange div.uk-flex-first .image:before {
    border: 1em solid #FAFAFA !important
}

.bg-brand-orange div.uk-flex-first .image:after {
    background: #FAFAFA !important
}

.bg-brand-orange .uk-accordion li {
    color: hsl(255 31% 20%);
    padding: .5rem 0;
    border-bottom: .5em solid hsl(255 31% 20%);
    transition: 0.2s ease-in-out
}

.bg-brand-orange .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-orange .uk-accordion li .uk-accordion-title:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='%232c2344' d='m5.84 9.59l5.66 5.66l5.66-5.66l-.71-.7l-4.95 4.95l-4.95-4.95z'/%3E%3C/svg%3E")
}

.bg-brand-orange .uk-accordion li.uk-open>.uk-accordion-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='%232c2344' d='m5.84 15.41l5.66-5.66l5.66 5.66l-.71.7l-4.95-4.95l-4.95 4.95z'/%3E%3C/svg%3E")
}

.bg-brand-lite-purple {
    background-color: #483A6F;
    position: relative
}

.bg-brand-lite-purple p,
.bg-brand-lite-purple span,
.bg-brand-lite-purple h2,
.bg-brand-lite-purple h3,
.bg-brand-lite-purple h4,
.bg-brand-lite-purple h5,
.bg-brand-lite-purple h6 {
    color: #FAFAFA
}

.bg-brand-lite-purple .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.bg-brand-lite-purple li {
    color: #FAFAFA
}

.bg-brand-lite-purple li::marker {
    color: #FAFAFA
}

.bg-brand-lite-purple .uk-accordion li {
    color: #FAFAFA;
    padding: .5rem 0;
    border-bottom: .5px solid #FAFAFA;
    transition: 0.2s ease-in-out
}

.bg-brand-lite-purple .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-lite-purple .uk-accordion li .uk-accordion-title:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='m5.84 9.59l5.66 5.66l5.66-5.66l-.71-.7l-4.95 4.95l-4.95-4.95z'/%3E%3C/svg%3E")
}

.bg-brand-lite-purple .uk-accordion li.uk-open>.uk-accordion-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='m5.84 15.41l5.66-5.66l5.66 5.66l-.71.7l-4.95-4.95l-4.95 4.95z'/%3E%3C/svg%3E")
}

.bg-brand-super-lite-purple {
    background-color: hsl(255 100% 97%);
    position: relative
}

.bg-brand-super-lite-purple h2 img,
.bg-brand-super-lite-purple h2 strong img {
    filter: brightness(0) saturate(100%) invert(15%) sepia(14%) saturate(2030%) hue-rotate(215deg) brightness(94%) contrast(96%)
}

.bg-brand-super-lite-purple li {
    color: hsl(255 31% 20%)
}

.bg-brand-super-lite-purple li::marker {
    color: hsl(255 31% 20%)
}

.bg-brand-super-lite-purple p,
.bg-brand-super-lite-purple span,
.bg-brand-super-lite-purple h2,
.bg-brand-super-lite-purple h3,
.bg-brand-super-lite-purple h4,
.bg-brand-super-lite-purple h5,
.bg-brand-super-lite-purple h6 {
    color: hsl(255 31% 20%)
}

.bg-brand-super-lite-purple .uk-accordion li {
    color: #FAFAFA;
    padding: .5rem 0;
    border-bottom: .5px solid #FAFAFA;
    transition: 0.2s ease-in-out
}

.bg-brand-super-lite-purple .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-super-lite-purple .uk-accordion li .uk-accordion-title:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='m5.84 9.59l5.66 5.66l5.66-5.66l-.71-.7l-4.95 4.95l-4.95-4.95z'/%3E%3C/svg%3E")
}

.bg-brand-super-lite-purple .uk-accordion li.uk-open>.uk-accordion-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='m5.84 15.41l5.66-5.66l5.66 5.66l-.71.7l-4.95-4.95l-4.95 4.95z'/%3E%3C/svg%3E")
}

.bg-brand-gradient-tb {
    background: #483a6f;
    background: linear-gradient(0deg, #483A6F 20%, hsl(255 31% 20%) 80%);
    position: relative
}

.bg-brand-gradient-tb p,
.bg-brand-gradient-tb span,
.bg-brand-gradient-tb h2,
.bg-brand-gradient-tb h3,
.bg-brand-gradient-tb h4,
.bg-brand-gradient-tb h5,
.bg-brand-gradient-tb h6 {
    color: #FAFAFA
}

.bg-brand-gradient-tb .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.bg-brand-gradient-tb .uk-accordion li {
    color: #FAFAFA;
    padding: .5rem 0;
    border-bottom: .5px solid #FAFAFA;
    transition: 0.2s ease-in-out
}

.bg-brand-gradient-tb .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-gradient-tb li {
    color: #FAFAFA
}

.bg-brand-gradient-tb li::marker {
    color: #FAFAFA !important
}

.bg-brand-gradient-tb em {
    color: hsl(256 100% 78% / .958)
}

.bg-brand-gradient-bt {
    background: #483a6f;
    background: linear-gradient(-180deg, hsl(255 31% 20%) 20%, #483A6F 80%);
    position: relative
}

.bg-brand-gradient-bt p,
.bg-brand-gradient-bt span,
.bg-brand-gradient-bt h2,
.bg-brand-gradient-bt h3,
.bg-brand-gradient-bt h4,
.bg-brand-gradient-bt h5,
.bg-brand-gradient-bt h6 {
    color: #FAFAFA
}

.bg-brand-gradient-bt .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.bg-brand-gradient-bt li {
    color: #FAFAFA
}

.bg-brand-gradient-bt li::marker {
    color: #FAFAFA
}

.bg-brand-gradient-bt .uk-accordion li {
    color: #FAFAFA;
    padding: .5rem 0;
    border-bottom: .5px solid #FAFAFA;
    transition: 0.2s ease-in-out
}

.bg-brand-gradient-bt .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-gradient-bt em {
    color: hsl(256 100% 78% / .958)
}

.bg-brand-radial-gradient {
    background-image: url(/wp/wp-content/uploads/2024/11/always-grey.png), radial-gradient(circle, hsl(256 31% 34%) 14%, hsl(255 31% 20%) 86%), radial-gradient(circle, hsl(256 31% 34%) 14%, hsl(255 31% 20%) 86%);
    position: relative
}

.bg-brand-radial-gradient li {
    color: #FAFAFA
}

.bg-brand-radial-gradient li::marker {
    color: #FAFAFA
}

.bg-brand-radial-gradient p,
.bg-brand-radial-gradient span,
.bg-brand-radial-gradient h2,
.bg-brand-radial-gradient h3,
.bg-brand-radial-gradient h4,
.bg-brand-radial-gradient h5,
.bg-brand-radial-gradient h6 {
    color: #FAFAFA
}

.bg-brand-radial-gradient .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.bg-brand-radial-gradient .uk-accordion li {
    color: #FAFAFA;
    padding: .5rem 0;
    border-bottom: .08em solid #FAFAFA;
    transition: 0.2s ease-in-out
}

.bg-brand-radial-gradient .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-radial-gradient a:not(.uk-button) {
    color: #FAFAFA;
    text-decoration: underline;
    text-underline-offset: 3px
}

.bg-brand-radial-gradient a:not(.uk-button):hover {
    text-decoration: underline;
    color: hsl(256 100% 78% / .958)
}

.bg-brand-radial-gradient em {
    color: hsl(256 100% 78% / .958)
}

.bg-brand-blue {
    background-color: #18648d;
    position: relative
}

.bg-brand-blue p,
.bg-brand-blue span,
.bg-brand-blue h2,
.bg-brand-blue h3,
.bg-brand-blue h4,
.bg-brand-blue h5 {
    color: #FAFAFA
}

.bg-brand-blue .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.bg-brand-blue div.uk-flex-first .image:before {
    border: 3px solid #FAFAFA !important
}

.bg-brand-blue div.uk-flex-first .image:after {
    background: #FAFAFA !important
}

.bg-brand-blue .uk-accordion li {
    color: #FAFAFA;
    padding: .5rem 0;
    border-bottom: .5px solid #FAFAFA;
    transition: 0.2s ease-in-out
}

.bg-brand-blue .uk-accordion li .uk-accordion-title {
    color: #FAFAFA
}

.bg-brand-blue .uk-accordion li .uk-accordion-title:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='m5.84 9.59l5.66 5.66l5.66-5.66l-.71-.7l-4.95 4.95l-4.95-4.95z'/%3E%3C/svg%3E")
}

.bg-brand-blue .uk-accordion li.uk-open>.uk-accordion-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='m5.84 15.41l5.66-5.66l5.66 5.66l-.71.7l-4.95-4.95l-4.95 4.95z'/%3E%3C/svg%3E")
}

.bg-brand-white {
    background-color: #FAFAFA;
    position: relative
}

.bg-brand-white h2 img {
    filter: brightness(0) saturate(100%) invert(15%) sepia(14%) saturate(2030%) hue-rotate(215deg) brightness(94%) contrast(96%)
}

.bg-brand-white p,
.bg-brand-white span {
    color: #242424
}

.bg-brand-white li a span {
    color: hsl(256 46% 58% / .957)
}

.bg-brand-white li a {
    color: hsl(256 46% 58% / .957)
}

.bg-brand-white a:not(.portfolio-link, .uk-button) {
    position: relative;
    text-decoration: none
}

.bg-brand-white a:not(.portfolio-link, .uk-button):before {
    position: absolute;
    bottom: -5px;
    left: 0;
    color: inherit;
    background-color: hsl(256 46% 58% / .957);
    height: .5px;
    width: 0%;
    content: "";
    transition: 0.2s ease-in-out
}

.bg-brand-white a:not(.portfolio-link, .uk-button):hover:before {
    width: 100%
}

.bg-brand-white .switcher-card * {
    color: #fff
}

.bg-brand-white .content-switcher li {
    color: hsl(255 31% 20%) !important
}

.bg-brand-white .content-switcher p,
.bg-brand-white .content-switcher span {
    color: #FAFAFA !important
}

.bg-brand-white .uk-accordion li {
    color: #FAFAFA;
    padding: .5rem 0;
    border-bottom: .5px solid hsl(255 31% 20%);
    transition: 0.2s ease-in-out
}

.bg-brand-white .uk-accordion li .uk-accordion-title {
    color: hsl(255 31% 20%)
}

.bg-brand-white .uk-accordion li .uk-accordion-title:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='%232c2344' d='m5.84 9.59l5.66 5.66l5.66-5.66l-.71-.7l-4.95 4.95l-4.95-4.95z'/%3E%3C/svg%3E")
}

.bg-brand-white .uk-accordion li.uk-open>.uk-accordion-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.7em' height='1.7em' viewBox='0 0 24 24'%3E%3Cpath fill='%232c2344' d='m5.84 15.41l5.66-5.66l5.66 5.66l-.71.7l-4.95-4.95l-4.95 4.95z'/%3E%3C/svg%3E")
}

.bg-brand-white .uk-slider-nav a {
    height: 1rem;
    width: 1rem
}

.bg-brand-white .uk-slider-nav a:hover {
    background-color: hsl(256 46% 58% / .957)
}

.bg-brand-white .uk-slider-nav .uk-active a {
    background-color: hsl(256 46% 58% / .957)
}

.overlay .uk-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.overlay .uk-container * {
    color: #FAFAFA
}

.overlay-purple {
    position: relative
}

.overlay-purple:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    content: "";
    background: hsl(255 31% 20%);
    opacity: .6;
    z-index: 10;
    height: 100%;
    width: 100%
}

.overlay-purple * {
    position: relative;
    z-index: 10;
    color: #FAFAFA !important
}

.overlay-purple .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.overlay-dark {
    position: relative
}

.overlay-dark:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    content: "";
    background: #242424;
    opacity: .7;
    z-index: 10;
    height: 100%;
    width: 100%
}

.overlay-dark .main-button {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.small-padding {
    padding-top: 1.5rem;
    padding-bottom: .8rem
}

.medium-padding {
    padding: 3rem 0
}

@media screen and (max-width:60rem) {
    .medium-padding {
        padding: 2.5rem 0
    }
}

.large-padding {
    padding: 4.5rem 0
}

@media screen and (max-width:60rem) {
    .large-padding {
        padding: 3rem 0
    }
}

.bg-w-small {
    max-width: 960px;
    margin: 0 auto
}

.bg-w-medium {
    max-width: 1100px;
    margin: 0 auto
}

.bg-w-large {
    max-width: 1400px;
    margin: 0 auto
}

.bg-w-full {
    max-width: 100%
}

.section-skewed-right {
    -webkit-clip-path: polygon(0 0, 100% 2%, 100% 98%, 0% 100%);
    clip-path: polygon(0 0, 100% 2%, 100% 98%, 0% 100%);
    padding: 3rem 0
}

@media (min-width:960px) {
    .section-skewed-right {
        -webkit-clip-path: polygon(0 0, 100% 5%, 100% 95%, 0% 100%);
        clip-path: polygon(0 0, 100% 5%, 100% 95%, 0% 100%)
    }
}

.section-skewed-left {
    -webkit-clip-path: polygon(0 2%, 100% 0, 100% 100%, 0 98%);
    clip-path: polygon(0 2%, 100% 0, 100% 100%, 0 98%);
    padding: 9rem 0
}

@media (min-width:960px) {
    .section-skewed-left {
        -webkit-clip-path: polygon(0 5%, 100% 0, 100% 100%, 0 95%);
        clip-path: polygon(0 5%, 100% 0, 100% 100%, 0 95%)
    }
}

.top-skewed-right {
    -webkit-clip-path: polygon(0 0, 100% 2%, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 2%, 100% 100%, 0 100%);
    padding-top: 7rem
}

@media (min-width:960px) {
    .top-skewed-right {
        -webkit-clip-path: polygon(0 0, 100% 4%, 100% 100%, 0 100%);
        clip-path: polygon(0 0, 100% 4%, 100% 100%, 0 100%)
    }
}

.top-skewed-left {
    -webkit-clip-path: polygon(0 2%, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 2%, 100% 0, 100% 100%, 0 100%);
    padding-top: 7rem
}

@media (min-width:960px) {
    .top-skewed-left {
        -webkit-clip-path: polygon(0 4%, 100% 0, 100% 100%, 0 100%);
        clip-path: polygon(0 4%, 100% 0, 100% 100%, 0 100%)
    }
}

.bottom-skewed-right {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 98%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 98%, 0 100%);
    padding-bottom: 4rem
}

@media (min-width:960px) {
    .bottom-skewed-right {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
        clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
        padding-bottom: 8rem
    }
}

.bottom-skewed-left {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 98%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 98%);
    padding-bottom: 4rem
}

@media (min-width:960px) {
    .bottom-skewed-left {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 92%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 92%);
        padding-bottom: 8rem
    }
}

.video-banner {
    height: 500px
}

.dark-overlay {
    position: relative
}

.dark-overlay:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgb(0 0 0 / .641);
    z-index: 1
}

.dark-overlay *:not(video, img, picture, figure, .pauseplay, .video-toggle) {
    position: relative;
    z-index: 10
}

.purple-overlay {
    position: relative
}

.purple-overlay:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: hsl(255 31% 20%);
    z-index: 1;
    opacity: .6
}

.purple-overlay *:not(video, img, picture, figure, .pauseplay, .video-toggle) {
    position: relative;
    z-index: 10
}

.blue-overlay {
    position: relative
}

.blue-overlay:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #18648d;
    z-index: 1;
    opacity: .4
}

.blue-overlay *:not(video, img, picture, figure, .pauseplay) {
    position: relative;
    z-index: 10
}

.pauseplay {
    position: absolute;
    z-index: 25 !important;
    bottom: 15%;
    right: 10%
}

.video-toggle {
    position: absolute;
    bottom: 10%;
    right: 10%;
    padding: 1.8rem;
    z-index: 25;
    height: 1.8rem;
    width: 1.8rem;
    background: none;
    border: 1px solid #FAFAFA;
    border-radius: 99999999px;
    display: flex;
    align-items: center;
    justify-content: center
}

.video-toggle i {
    color: #FAFAFA
}

@media screen and (max-width:40rem) {
    .video-toggle {
        height: 1rem;
        width: 1rem;
        padding: 1.3rem;
        bottom: 12%
    }
}

section.portfolio hgroup,
.blog hgroup {
    padding: 2rem 0
}

section.portfolio hgroup h1,
.blog hgroup h1 {
    color: hsl(256 46% 58% / .957);
    font-size: 1rem;
    font-weight: 600
}

section.portfolio hgroup h2,
.blog hgroup h2 {
    color: hsl(255 31% 20%);
    margin: unset;
    margin: .5rem 0;
    font-size: 2.5rem;
    font-weight: 700
}

section.portfolio .project-card,
.blog .project-card {
    padding: unset;
    height: 350px;
    border-radius: 20px;
    display: flex;
    align-items: end
}

section.portfolio .project-card .details,
.blog .project-card .details {
    transform: translateY(-5px);
    padding: 2rem
}

section.portfolio .project-card .details h3,
.blog .project-card .details h3 {
    color: #FAFAFA;
    font-weight: 600;
    font-size: 1.5rem
}

@media (min-width:640px) {

    section.portfolio .project-card,
    .blog .project-card {
        height: 400px
    }
}

@media (min-width:960px) {

    section.portfolio .project-card,
    .blog .project-card {
        height: 450px
    }
}

@media (min-width:1200px) {

    section.portfolio .project-card,
    .blog .project-card {
        height: 550px
    }
}

.height-large {}

@media screen and (max-width:60rem) {
    .height-large {}
}

.height-medium {
    height: 32rem
}

@media screen and (max-width:60rem) {
    .height-medium {
        height: 22rem
    }
}

.height-small {
    height: 29rem
}

@media screen and (max-width:60rem) {
    .height-small {
        height: 22rem
    }
}

.uk-container-medium {
    max-width: 1050px
}

.staff-section {
    padding: unset;
    padding-bottom: 2.5rem
}

.staff-section .staff-card {
    height: 30rem
}

.staff-section .staff-card .uk-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: end;
    position: relative;
    border-radius: 15px;
    box-shadow: 0 -103px 42px 0 rgb(0 0 0 / .745) inset;
    -webkit-box-shadow: 0 -103px 42px 0 rgb(0 0 0 / .71) inset;
    -moz-box-shadow: 0 -103px 42px 0 rgb(0 0 0 / .729) inset;
    transition: 0.3s ease-in-out;
    padding-bottom: 1.5rem
}

.staff-section .staff-card .uk-card:hover {
    transform: scale(1.02)
}

.staff-section .staff-card .staff-title {
    font-size: 1.7rem;
    color: #FAFAFA
}

.staff-section .staff-card .job-title {
    color: hsl(256 100% 78% / .958)
}

@media screen and (min-width:60rem) {
    .staff-section .staff-card {
        height: 33.5rem
    }
}

.staff-single {
    padding-top: 3.5rem;
    padding-bottom: 2.5rem
}

.staff-single .headshot {
    height: clamp(500px, 30vw + 22rem, 700px);
    display: block;
    position: relative
}

.staff-single .headshot:before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    background-color: #fff0;
    border: 3px solid hsl(256 46% 58% / .957);
    height: 20%;
    width: 20%;
    border-radius: 20px;
    z-index: 0
}

.staff-single .headshot:after {
    content: "";
    position: absolute;
    bottom: -10px;
    right: -10px;
    background: hsl(256 46% 58% / .957);
    height: 40%;
    width: 40%;
    border-radius: 20px;
    z-index: 0
}

.staff-single .headshot img {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 15px;
    position: relative;
    z-index: 1
}

.staff-single .staff-info h1 {
    font-size: unset;
    margin: unset;
    font-size: 2.5rem;
    margin: .6rem 0
}

.staff-single .staff-info h2 {
    font-size: unset;
    font-size: 1.2rem;
    font-weight: 600;
    color: hsl(256 46% 58% / .957)
}

@media screen and (min-width:60rem) {
    .staff-single .staff-info h1 {
        font-size: 3rem
    }

    .staff-single .staff-info h2 {
        font-size: 1.8rem
    }
}

.inner-hero:where(.image-banner) {
    height: 35rem;
    align-content: center
}

.inner-hero:where(.image-banner) h2 {
    color: #FAFAFA !important
}

.inner-hero:where(.image-banner) .uk-container,
.inner-hero:where(.image-banner) hgroup {
    height: 100%
}

.inner-hero:where(.image-banner) .uk-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

@media screen and (max-width:40rem) {
    .inner-hero:where(.image-banner) {
        min-height: 23rem
    }
}

section {
    transform: translateY(-2px)
}

.search_bar {
    visibility: collapse;
    position: absolute;
    right: 0
}

.uk-search-default {
    width: unset
}

.input_search {
    border-radius: 99999px;
    min-width: unset
}

@media screen and (min-width:40rem) {
    .input_search {
        min-width: 15rem
    }
}

@media screen and (min-width:60rem) {
    .input_search {
        min-width: 25rem
    }
}

.search-toggle-desktop {
    color: hsl(255 31% 20%);
    opacity: .75
}

.search-toggle-desktop:hover {
    opacity: 100%;
    color: hsl(255 31% 20%)
}

.search-toggle {
    color: hsl(255 31% 20%)
}

.search-toggle svg {
    height: unset;
    width: unset
}

a.search-toggle {
    color: hsl(255 31% 20%);
    opacity: .75
}

a.search-toggle:hover {
    color: hsl(255 31% 20%);
    opacity: 100%
}

.card-grid {
    gap: 1rem
}

@media screen and (min-width:60rem) {
    .card-grid {
        gap: unset
    }
}

.card-grid div:first-child .icon-card {
    border-radius: 35px;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0
}

.card-grid div:last-child .icon-card {
    border-radius: 35px;
    border-top-left-radius: 0;
    border-bottom-right-radius: 0
}

.icon-card {
    padding: 4rem 2rem;
    max-width: 500px;
    margin: 0 auto
}

@media screen and (max-width:60rem) {
    .icon-card {
        padding: 3rem 1rem
    }
}

.icon-card .uk-card-body {
    padding: unset;
    padding-top: 1.5rem
}

.icon-card .icon-wrapper {
    border: .5px solid hsl(255 31% 20%);
    border-radius: 50%;
    height: 4.5rem;
    width: 4.5rem;
    padding: .9rem;
    flex: none;
    display: flex;
    justify-content: center;
    align-items: center
}

.icon-card i {
    font-size: 2rem
}

.icon-card ul li {
    margin: 1.2rem 0rem;
    color: hsl(255 31% 20%);
    font-weight: 300
}

.icon-card h3 {
    color: hsl(255 31% 20%) !important
}

.testimonial-card {
    background-color: #FAFAFA;
    max-width: 500px;
    margin: 0 auto;
    border-radius: 15px
}

.testimonial-card .client {
    gap: 1rem
}

.testimonial-card .client img {
    border: 3px solid hsl(256 46% 58% / .957)
}

.testimonial-card .client small {
    color: hsl(255 31% 20%);
    opacity: .9
}

.testimonial-card h3 {
    color: hsl(255 31% 20%)
}

@media screen and (min-width:40rem) {
    .testimonial-card h3 {
        font-size: 1.5rem !important
    }
}

.testimonial-card .testimonial-content {
    padding-top: 1rem
}

.testimonial-card .client-image img {
    height: 150px;
    width: 150px;
    -o-object-fit: cover;
    object-fit: cover
}

@media screen and (min-width:40rem) {
    .testimonial-card .client-image img {
        height: 200px;
        width: 200px
    }
}

.testimonial-card__variant {
    background-color: #FAFAFA !important;
    margin: 0 auto;
    border-radius: 15px;
    position: relative
}

.testimonial-card__variant .client {
    gap: 1rem
}

.testimonial-card__variant .client .logo-container {
    background-color: #f1f1f1;
    border-radius: 999999rem;
    height: 75px;
    width: 75px;
    padding: .3rem;
    border: 1px solid hsl(256 46% 58% / .957)
}

.testimonial-card__variant .client img {
    height: auto;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.testimonial-card__variant .client small {
    color: hsl(255 31% 20%);
    opacity: .9
}

.testimonial-card__variant h3 {
    color: hsl(255 31% 20%);
    font-style: normal !important
}

@media screen and (min-width:40rem) {
    .testimonial-card__variant h3 {
        font-size: 1.5rem !important
    }
}

.testimonial-card__variant .client-company {
    font-style: normal
}

.testimonial-card__variant .testimonial-content {
    padding-top: 1rem
}

.testimonial-card__variant .client-image img {
    height: 150px;
    width: 150px;
    -o-object-fit: cover;
    object-fit: cover
}

@media screen and (min-width:40rem) {
    .testimonial-card__variant .client-image img {
        height: 200px;
        width: 200px
    }
}

section[data-component=switcher] .switch-icon {
    height: 2rem;
    width: 2rem;
    background-color: #483A6F;
    border-radius: 99999px;
    filter: brightness(250%);
    display: flex;
    justify-content: center;
    align-items: center
}

section[data-component=switcher] .switch-icon i {
    color: #483A6F;
    filter: brightness(200%)
}

section[data-component=switcher] li.uk-active a {
    background: hsl(256 46% 58% / .957);
    position: relative
}

section[data-component=switcher] li.uk-active a:focus {
    background: hsl(256 46% 58% / .957)
}

section[data-component=switcher] .uk-subnav a.switchlink {
    display: flex;
    align-items: center;
    gap: .7rem;
    color: #FAFAFA;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    text-decoration: unset;
    position: relative
}

section[data-component=switcher] .uk-subnav a.switchlink:before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;
    background: linear-gradient(90deg, rgb(139 127 186 / .4) 0%, rgb(139 127 186 / .8) 50%, rgb(139 127 186 / .4) 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: borderGlow 3s ease-in-out infinite
}

section[data-component=switcher] .uk-subnav a.switchlink:hover {
    background: hsl(256 46% 58% / .957)
}

@media screen and (max-width:60rem) {
    section[data-component=switcher] .uk-subnav a.switchlink {
        border-radius: 250px
    }
}

.switcher-card {
    background-color: hwb(258 30% 42%/0.958);
    border-bottom-right-radius: 25px;
    border-bottom-left-radius: 25px
}

@media screen and (max-width:60rem) {
    .switcher-card:first-of-type {
        border-top-right-radius: unset
    }

    .switcher-card:last-of-type {
        border-top-left-radius: unset
    }
}

.switcher-card .switch-icon {
    height: 4.5rem !important;
    width: 4.5rem !important
}

.switcher-card .switch-icon i {
    font-size: 2rem
}

.switcher-card div {
    color: #FAFAFA;
    font-weight: 300
}

.switcher-card h3 {
    color: #FAFAFA
}

.switcher-card li {
    color: #FAFAFA
}

.switcher-card a.card-button {
    background: hsl(256 46% 58% / .957);
    border: 0;
    color: #fff;
    text-decoration: none
}

.switcher-card .switcher-image {
    min-height: 30rem;
    width: 100%;
    border-radius: 1.5em;
    padding-left: 1.1em;
    background: hsl(256 46% 58% / .957);
    animation: float 6s ease-in-out infinite
}

.switcher-card .switcher-image.has-image-decoration {
    overflow: visible
}

.switcher-card .switcher-image.has-image-decoration img {
    border-radius: 20px
}

.switcher-card .switcher-image.has-image-decoration:before {
    content: "";
    position: absolute;
    top: -45px;
    right: -40px !important;
    background-image: radial-gradient(hsl(256 46% 58% / .957) 4px, transparent 0);
    background-size: 35px 35px;
    height: 50%;
    width: 40%
}

.switcher-card .switcher-image.has-image-decoration:after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: -10px;
    background: hsl(256 46% 58% / .957);
    height: 40%;
    width: 40%;
    border-radius: 20px;
    z-index: -1
}

@keyframes float {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-10px)
    }

    100% {
        transform: translateY(0)
    }
}

@media screen and (max-width:60rem) {
    .switcher-card {
        margin-top: 25px;
        border-radius: 1.475em
    }

    .switcher-card .switcher-image {
        min-height: 20rem
    }

    .switcher-card:first-of-type {
        border-radius: 1.2em
    }

    .switcher-card:last-of-type {
        border-radius: 1.2em
    }
}

a {
    text-decoration: none
}

a:hover {
    text-decoration: none
}

[data-component=recent-posts] a {
    text-decoration: none
}

[data-component=recent-posts] .read-posts-btn {
    transform: translateY(150px)
}

@media screen and (max-width:40rem) {
    [data-component=recent-posts] .read-posts-btn {
        display: none
    }
}

[data-component=recent-posts] .post-card,
.post-card {
    background-color: #f2f2f2;
    border-radius: 15px;
    height: unset
}

[data-component=recent-posts] .post-card .uk-height-small,
.post-card .uk-height-small {
    height: 200px
}

[data-component=recent-posts] .post-card img,
.post-card img {
    border-radius: unset;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    transition: 0.2s ease-in-out
}

[data-component=recent-posts] .post-card:hover img,
.post-card:hover img {
    transform: scale(1.01)
}

[data-component=recent-posts] .post-card small,
.post-card small {
    color: hsl(256 46% 58% / .957);
    font-size: .8rem
}

[data-component=recent-posts] .post-card small.author,
.post-card small.author {
    color: hsl(255 31% 20%);
    opacity: .9
}

[data-component=recent-posts] .post-card time,
.post-card time {
    color: hsl(255 31% 20%);
    opacity: .7;
    font-size: .8rem
}

[data-component=recent-posts] .post-card h3,
.post-card h3 {
    font-size: 1.3rem;
    margin: 1rem 0;
    font-weight: 700;
    position: relative
}

[data-component=recent-posts] .post-card:nth-of-type(2) h3:before,
.post-card:nth-of-type(2) h3:before {
    background-color: #F60000
}

[data-component=recent-posts] .post-card .uk-card-body,
.post-card .uk-card-body {
    padding: 30px 30px
}

.testimonial-card__variant {
    background-color: #f2f2f2;
    border-radius: 20px
}

.testimonial-card__variant h3 {
    color: hsl(255 31% 20%);
    font-size: 1.5rem
}

.blog .post-card {
    background: none;
    box-shadow: none;
    border-radius: unset
}

.blog .post-card img {
    border-radius: unset
}

.blog .post-card .uk-card-body {
    padding: unset;
    padding-top: 1rem;
    padding-left: .7rem
}

.blog .post-card small.featured {
    background: hsl(256 46% 58% / .957);
    color: #FAFAFA;
    padding: .5rem;
    border-radius: 5px
}

.results-card h3 {
    font-size: 2rem;
    color: hsl(255 31% 20%);
    font-weight: 700;
    text-align: center;
    color: hsl(255 31% 20%)
}

.uk-grid-divider>:not(.uk-first-column)::before {
    border-color: hsl(256 46% 58% / .957);
    opacity: .4
}

.result-grid div:before {
    left: unset !important
}

.testmonial-container {
    position: relative;
    padding: 30px 40px 30px 60px;
    margin: 40px 0;
    background-color: rgb(90 79 138 / .05);
    border-left: 4px solid #5a4f8a;
    border-radius: 0 4px 4px 0;
    text-align: center;
    border-radius: 10px
}

@media screen and (max-width:60rem) {
    .testmonial-container {
        padding: 2.5rem
    }
}

.testmonial-container p {
    font-size: 18px;
    line-height: 1.6;
    color: #333;
    margin-bottom: 20px
}

.testmonial-container h3 {
    font-size: 1.5rem;
    flex-wrap: wrap;
    margin-top: 20px;
    gap: .5rem
}

.testmonial-container h3 em {
    font-weight: 700
}

.testmonial-container .testimonial-quote-mark {
    position: absolute;
    width: 40px;
    height: 40px;
    fill: rgb(90 79 138 / .2)
}

.testmonial-container .quote-mark-open {
    top: 20px;
    left: 20px
}

.testmonial-container .quote-mark-close {
    bottom: 20px;
    right: 20px;
    transform: rotate(180deg)
}

.bg-brand-white.content-switcher .uk-subnav a.switchlink {
    color: hsl(255 31% 20%);
    text-decoration: unset
}

.bg-brand-white.content-switcher li:hover a {
    color: #FAFAFA !important
}

.bg-brand-white.content-switcher li.uk-active a {
    color: #FAFAFA !important
}

.author-container {
    background: #f2f2f2;
    padding: 6rem;
    border-radius: 15px
}

@media screen and (max-width:60rem) {
    .author-container {
        padding: 3rem
    }
}

@media screen and (max-width:40rem) {
    .author-container {
        padding: 2rem;
        text-align: center;
        margin-left: .6rem;
        margin-right: .6rem
    }

    .author-container .uk-flex {
        flex-wrap: wrap
    }
}

.author-container h4 {
    color: hsl(255 31% 20%);
    font-weight: 700;
    font-size: 1.8rem
}

@media screen and (max-width:60rem) {
    .author-container h4 {
        font-size: 1.2rem
    }
}

.author-container .author-pic {
    height: 160px;
    width: 160px
}

@media screen and (max-width:60rem) {
    .author-container .author-pic {
        height: 130px;
        width: 130px
    }
}

.author-container .author-description {
    font-size: 1rem;
    color: hsl(255 31% 20%);
    opacity: .87
}

@keyframes borderGlow {

    0%,
    100% {
        opacity: .5
    }

    50% {
        opacity: 1
    }
}

.project-card.has-video .portfolio-video {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    height: 100%;
    width: 100%;
    border-radius: 20px
}

.project-card.has-video video {
    border-radius: 20px
}

.project-card.has-video .shadow {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    content: "";
    box-shadow: inset 0 -140px 88px -18px hsl(256 32% 20%);
    height: 100%;
    width: 100%
}

.testimonial-card,
.testimonial-card__variant {
    border-left: 4px solid hwb(258 30% 42%/0.958);
    position: relative
}

.testimonial-card small,
.testimonial-card__variant small {
    color: hwb(258 30% 42%/0.958) !important;
    font-weight: 700
}

.testimonial-card .testimonial-quote-mark,
.testimonial-card__variant .testimonial-quote-mark {
    position: absolute;
    width: 40px;
    height: 40px;
    fill: rgb(90 79 138 / .2)
}

.testimonial-card .quote-mark-open,
.testimonial-card__variant .quote-mark-open {
    top: 20px;
    left: 20px
}

.testimonial-card .quote-mark-close,
.testimonial-card__variant .quote-mark-close {
    bottom: 20px;
    right: 20px;
    transform: rotate(180deg)
}

.testimonial-container::after {
    content: '"';
    position: absolute;
    right: 20px;
    bottom: 0;
    font-family: Georgia, serif;
    font-size: 80px;
    line-height: .4;
    color: rgb(90 79 138 / .2)
}

.testimonial-text {
    font-size: 18px;
    line-height: 1.6;
    color: #333;
    margin-bottom: 20px
}

.testimonial-attribution {
    display: flex;
    align-items: center;
    margin-top: 20px
}

.testimonial-name {
    font-weight: 700;
    font-size: 18px;
    color: #2a2347
}

.testimonial-title {
    color: #6a5ea6;
    font-style: italic;
    margin-left: 5px
}

.icon-container {
    position: relative;
    height: 50px;
    width: 50px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999rem;
    border-right: 1px solid #00C2AF;
    border-bottom: 1px solid #00C2AF
}

.icon-container img {
    filter: brightness(0) saturate(100%) invert(63%) sepia(63%) saturate(4014%) hue-rotate(135deg) brightness(97%) contrast(101%)
}

.stat-box {
    padding-left: unset;
    padding: 25px;
    border-radius: 8px;
    background: linear-gradient(135deg, rgb(0 166 156 / .05) 0%, rgb(0 166 156 / .15) 100%);
    transition: transform 0.3s ease, box-shadow 0.3s ease
}

.stat-box .stats-icon {
    font-size: 32px;
    color: #00a69c
}

.stat-box .stat-number {
    font-size: 48px;
    font-weight: 700;
    color: #fff;
    line-height: 1;
    margin-bottom: 10px
}

.stat-box .stat-description {
    font-size: 16px;
    color: #a5a5b8
}

.stat-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgb(0 0 0 / .1)
}

.card-grid .uk-card {
    border-left: 4px solid hsl(256 46% 58% / .957);
    padding: unset;
    border-radius: 15px
}

.card-grid .uk-card h3 {
    font-family: "Inter", sans-serif;
    font-weight: 700
}

.card-grid .uk-card p,
.card-grid .uk-card span,
.card-grid .uk-card div.card-content {
    color: #242424;
    opacity: .9
}

.card-grid .icon-wrapper {
    height: 56px;
    width: 56px;
    box-sizing: border-box;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 99999rem;
    border-right: 1px solid hwb(258 30% 42%/0.958);
    border-bottom: 1px solid hwb(258 30% 42%/0.958)
}

.card-grid .icon-wrapper .card-icon {
    filter: invert(44%) sepia(40%) saturate(1234%) hue-rotate(225deg) brightness(87%) contrast(89%) opacity(96%)
}

a:hover,
a:focus {
    color: hsl(255 31% 20%);
    text-decoration: underline;
    text-underline-offset: 3px
}

a:before {
    display: none
}

a.return-link {
    display: flex;
    align-items: center;
    gap: .3rem;
    color: hsl(256 46% 58% / .957);
    font-size: .91rem;
    max-width: 170px
}

a.return-link svg {
    color: hsl(256 46% 58% / .957)
}

a.return-link svg path {
    fill: hsl(256 46% 58% / .957)
}

a.grid-item {
    text-decoration: none !important
}

a.grid-item::before {
    display: none
}

.social-share a {
    color: #FAFAFA;
    transition: 0.1s ease
}

.social-share a:hover {
    color: hsl(256 100% 78% / .958)
}

.uk-button-default {
    border-color: unset
}

.uk-button-default:hover {
    border-color: #00C2AF
}

.main-button,
.gform_button,
.gform_button_select_files,
input[type=file]::file-selector-button {
    background-color: none;
    color: hsl(255 31% 20%);
    font-weight: 700;
    border: .1rem solid #00C2AF;
    transition: 0.4s ease;
    border-radius: 999999em;
    text-decoration: none !important;
    min-width: -moz-fit-content;
    min-width: fit-content
}

.main-button:hover,
.gform_button:hover,
.gform_button_select_files:hover,
input[type=file]::file-selector-button:hover {
    background-color: #00C2AF;
    box-shadow: none;
    border-color: none !important;
    box-shadow: 0 2px 4px rgb(0 0 0 / .1);
    transform: translateY(-1px)
}

.gform_button,
.gform_button_select_files {
    padding: .5em 2em
}

.main-button-filled {
    background-color: #00C2AF;
    color: hsl(255 31% 20%);
    border: none;
    gap: .7em;
    padding: 5px 30px;
    min-width: -moz-fit-content;
    min-width: fit-content;
    font-weight: 700;
    color: #FAFAFA
}

.main-button-filled:hover,
.main-button-filled:focus {
    box-shadow: 0 2px 4px rgb(0 0 0 / .1);
    transform: translateY(-1px);
    background-color: #098;
    color: #FAFAFA
}

.main-button-filled i,
.main-button-filled svg {
    background-color: #00f4db;
    padding: .2em .3em;
    height: 30px;
    width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999999em;
    color: hsl(255 31% 20%)
}

.main-button.white-variant {
    border-color: #FAFAFA;
    color: #FAFAFA
}

.main-button-filled.variant {
    display: flex;
    align-items: center;
    justify-content: center
}

.alignright {
    float: right
}

.alignleft {
    float: left
}

.top-bar {
    padding: .45rem;
    background: hsl(255 31% 20%)
}

@media screen and (max-width:640px) {
    .top-bar {
        display: none
    }
}

.top-bar a {
    color: #FAFAFA !important;
    font-size: .89rem;
    font-weight: 400;
    opacity: .98;
    transition: 0.15s ease;
    height: 100%;
    text-decoration: none
}

.top-bar a:hover {
    color: #483A6F !important;
    text-decoration: none;
    opacity: 1;
    filter: brightness(300%)
}

header.main-header {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    background-color: #FAFAFA;
    height: 3.3rem;
    box-shadow: 0 1px 1px rgb(0 0 0 / .129);
    view-transition-name: main-header
}

header.main-header .menu-container {
    max-height: 100%
}

header.main-header img {
    max-width: 10rem
}

@media screen and (min-width:640px) {
    header.main-header {
        height: 4rem
    }

    header.main-header svg {
        height: 1.3rem;
        width: 1.3rem
    }

    header.main-header img {
        max-width: 9rem
    }
}

@media screen and (min-width:960px) {
    header.main-header {
        height: 4.4rem
    }

    header.main-header img {
        max-width: 12rem
    }
}

nav#lmg-navigation {
    gap: 1.8rem
}

nav#lmg-navigation .fa-li {
    position: unset !important
}

nav#lmg-navigation ul {
    gap: 2.5rem
}

nav#lmg-navigation ul li {
    display: flex;
    gap: .4rem;
    align-items: center;
    color: hsl(255 31% 20%)
}

nav#lmg-navigation ul li a {
    color: hsl(255 31% 20%);
    font-weight: 400;
    text-transform: capitalize;
    font-size: .95rem;
    transition: 0.2s ease;
    text-decoration: none !important;
    min-height: 50px
}

@media screen and (min-width:960px) {
    nav#lmg-navigation ul li a {
        font-size: 1.1rem
    }
}

nav#lmg-navigation ul li a svg {
    color: hsl(255 31% 20%)
}

nav#lmg-navigation ul li .uk-navbar-dropdown {
    padding: 14px;
    border-radius: 0
}

nav#lmg-navigation ul li .uk-navbar-dropdown ul li {
    margin: .5rem .5rem
}

nav#lmg-navigation ul li .uk-navbar-dropdown ul li:hover {
    background: #f2f2f2;
    border-radius: 5px
}

nav#lmg-navigation ul li .uk-navbar-dropdown ul li a {
    font-size: .85rem;
    min-height: unset
}

nav#lmg-navigation ul li .uk-navbar-dropdown ul li i {
    padding: .2rem
}

#mobile-toggle {
    color: hsl(255 31% 20%)
}

.searchIcon {
    color: hsl(255 31% 20%)
}

#mobile-menu-container {
    height: 100dvh;
    width: 100%;
    position: sticky;
    transform: translateX(960px);
    top: 0;
    background-color: #FAFAFA;
    opacity: 0;
    z-index: 20;
    display: none
}

#mobile-menu-container .fa-li {
    position: unset !important
}

@media screen and (max-width:1070px) {
    #mobile-menu-container {
        display: block
    }
}

#mobile-menu-container .mobile-menu {
    height: calc(100% - 2rem);
    overflow-y: auto !important;
    position: relative;
    top: 2rem;
    padding-bottom: 5.5rem
}

#mobile-menu-container .mobile-menu li {
    position: relative;
    font-size: 1.2rem;
    font-weight: 300;
    border-bottom: .55px solid hsl(255 32% 26% / .719);
    padding: 1rem 2.2rem;
    gap: .5rem
}

#mobile-menu-container .mobile-menu li:last-child {
    border: unset
}

#mobile-menu-container .mobile-menu li i {
    display: none
}

#mobile-menu-container .mobile-menu li a {
    text-decoration: none;
    color: hsl(255 31% 20%)
}

#mobile-menu-container .mobile-menu li .uk-nav-sub i {
    display: block;
    color: hwb(258 30% 42%/0.958);
    font-size: .75rem
}

#mobile-menu-container .mobile-menu li .uk-nav-sub li {
    border: unset;
    font-size: .85rem;
    padding: .5rem 0rem;
    display: flex;
    align-items: center
}

#mobile-menu-container .mobile-contact {
    padding: 1rem 1rem
}

#mobile-menu-container .mobile-contact .top-buttons {
    gap: 1rem
}

#mobile-menu-container .mobile-contact div {
    flex: none
}

#mobile-menu-container .mobile-contact .main-button {
    font-size: .7rem;
    width: 225px;
    padding: .2rem 1.5rem
}

#mobile-menu-container .contact-info {
    margin-top: 3.5rem;
    display: flex;
    justify-content: center
}

#mobile-menu-container .contact-info ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: 1rem .5rem
}

#mobile-menu-container .contact-info ul li {
    border: unset;
    color: hsl(255 31% 20%);
    padding: unset;
    font-size: .85rem;
    opacity: .75
}

.mobile-toggle-active {
    background-color: hsl(255 31% 20%);
    border-radius: 9999px
}

.menu-container {
    position: relative
}

.uk-navbar-dropdown.uk-drop {
    top: 70px !important;
    border-radius: 0;
    border-top: 2px solid hsl(256 46% 58% / .957)
}

.uk-navbar-dropdown.uk-drop .uk-navbar-dropdown {
    right: 0 !important;
    left: 100% !important;
    top: -2px !important;
    min-width: 300px
}

#mobile-menu-container.menu-open {
    display: block;
    left: 0;
    transform: translateX(0);
    opacity: 1;
    z-index: 0
}

.site-header.scrolled {
    box-shadow: hsl(255 32% 26% / .719) 0 1px 0
}

@media (min-width:960px) {
    .hide-on-desktop {
        display: none !important
    }
}

#footer .footer-top {
    background: #483a6f;
    background: linear-gradient(180deg, #fff0 50%, hsl(255 31% 20%) 50%)
}

#footer .footer-top .footer-card {
    background-color: #FAFAFA;
    background-image: url(/wp/wp-content/uploads/2024/10/3_MDQ1Nw-4.png);
    background-repeat: repeat-x;
    background-size: contain;
    box-shadow: rgb(149 157 165 / .2) 0 8px 24px;
    height: auto;
    padding: 2.5rem 1.5rem;
    position: relative;
    z-index: 10;
    margin: 0 auto;
    border-radius: 2rem;
    display: flex;
    justify-content: center;
    align-items: center
}

@media screen and (min-width:960px) {
    #footer .footer-top .footer-card {
        padding: 4rem 1.5rem
    }
}

#footer .footer-top .footer-card span {
    padding: 0 35px
}

#footer .footer-top .footer-card:before {
    content: "";
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: #FAFAFA;
    opacity: .55;
    border-radius: 2rem
}

#footer .footer-top .footer-card * {
    position: relative;
    z-index: 10
}

#footer .footer-top .footer-card .footer-top-content {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1rem
}

#footer .footer-top .footer-card .footer-top-content .main-button {
    margin-top: 15px
}

#footer .footer-bottom {
    padding: 5rem 0rem;
    width: 100%;
    background: radial-gradient(circle, hsl(256 31% 34%) 14%, hsl(255 31% 20%) 86%)
}

@media screen and (min-width:960px) {
    #footer .footer-bottom {
        padding: 3rem 0rem
    }
}

#footer .footer-bottom .footer-bottom-content {
    padding: 1.2rem
}

#footer .footer-bottom .footer-bottom-content h3 {
    font-size: 1rem;
    color: #FAFAFA
}

@media screen and (min-width:960px) {
    #footer .footer-bottom .footer-bottom-content h3 {
        font-size: 1.2rem
    }
}

#footer .footer-bottom .footer-bottom-content .left-content {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    margin-top: 2.5rem;
    padding-left: 0;
    color: #FAFAFA
}

@media screen and (min-width:960px) {
    #footer .footer-bottom .footer-bottom-content .left-content {
        padding-left: 30px
    }
}

#footer .footer-bottom .footer-bottom-content .left-content .socials {
    gap: 1.1rem;
    padding-left: .1rem
}

#footer .footer-bottom .footer-bottom-content .left-content .socials i {
    font-size: 1.2rem
}

#footer .footer-bottom .footer-bottom-content .left-content form {
    position: relative
}

#footer .footer-bottom .footer-bottom-content .left-content form input[type=submit] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: none;
    border: none;
    content: unset;
    position: absolute;
    content: "";
    top: 0;
    height: 100%;
    width: 40px;
    opacity: 0;
    right: 0
}

#footer .footer-bottom .footer-bottom-content .left-content form.focused .ginput_container:after {
    color: #483A6F;
    filter: brightness(250%)
}

#footer .footer-bottom .footer-bottom-content .left-content .gform_body input {
    background-color: unset;
    border: unset;
    position: relative
}

#footer .footer-bottom .footer-bottom-content .left-content .gform_body input::-moz-placeholder {
    color: #FAFAFA;
    opacity: .75
}

#footer .footer-bottom .footer-bottom-content .left-content .gform_body input::placeholder {
    color: #FAFAFA;
    opacity: .75
}

#footer .footer-bottom .footer-bottom-content .left-content .gform_body .ginput_container {
    position: relative;
    display: flex
}

#footer .footer-bottom .footer-bottom-content .left-content .gform_body .ginput_container:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #FAFAFA;
    height: .5px;
    opacity: .75
}

#footer .footer-bottom .footer-bottom-content .left-content .gform_body .ginput_container input {
    color: #FAFAFA
}

#footer .footer-bottom .footer-bottom-content .left-content .gform_body .ginput_container input:focus {
    border: 1px solid #483A6F;
    border-radius: 4px;
    filter: brightness(200%)
}

#footer .footer-bottom .footer-bottom-content .left-content .gform_body .ginput_container:after {
    content: "\f061";
    font-family: "Font Awesome 6 FREE";
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    color: #FAFAFA;
    position: absolute;
    right: 0;
    top: .25rem;
    font-size: 1.3rem;
    transform: rotate(-45deg)
}

#footer .footer-bottom .footer-grid-right {
    padding-left: 40px
}

@media screen and (min-width:960px) {
    #footer .footer-bottom .footer-grid-right {
        padding-left: 0
    }
}

#footer .footer-bottom .footer-grid-right .uk-grid {
    gap: 2rem
}

#footer .footer-bottom .footer-grid-right .uk-grid div {
    padding-left: 10px
}

@media (min-width:640px) {
    #footer .footer-bottom .footer-grid-right .uk-grid {
        gap: unset
    }
}

#footer .footer-bottom .footer-grid-right .footer-menu div {
    padding-left: unset
}

#footer .footer-bottom .footer-grid-right .footer-menu ul {
    list-style: none;
    padding-left: unset
}

#footer .footer-bottom .footer-grid-right .footer-menu ul li {
    color: #FAFAFA;
    font-size: .82rem;
    margin: .8rem 0rem
}

@media screen and (min-width:960px) {
    #footer .footer-bottom .footer-grid-right .footer-menu ul li {
        font-size: .85rem
    }
}

#footer .footer-bottom .footer-grid-right .footer-menu ul li a {
    color: #FAFAFA;
    font-weight: 300;
    opacity: .8;
    text-decoration: none
}

#footer .footer-bottom .footer-grid-right .footer-menu ul li a:hover {
    opacity: 1
}

#footer .footer-bottom .copyright {
    padding: 0 0
}

#footer .footer-bottom .copyright p,
#footer .footer-bottom .copyright a,
#footer .footer-bottom .copyright span {
    color: #FAFAFA;
    font-weight: 300;
    opacity: .75;
    font-size: .85rem;
    text-decoration: none
}

#footer .footer-bottom .copyright a:hover,
#footer .footer-bottom .copyright a:focus {
    opacity: 1
}

#footer .footer-bottom .copyright .copy-grid {
    padding-left: 0
}

#footer .footer-bottom .copyright .copy-grid div {
    text-align: center
}

@media screen and (min-width:640px) {
    #footer .footer-bottom .copyright .copy-grid div {
        text-align: left
    }
}

@media screen and (min-width:960px) {
    #footer .footer-bottom .copyright .copy-grid div.copy-l {
        padding-left: 3.89rem
    }
}

@media screen and (min-width:960px) {
    #footer .footer-bottom .copyright .copy-grid div.copy-r {
        margin-left: -2.5rem
    }
}

#footer .footer-bottom address {
    margin-top: 10px;
    display: flex;
    gap: .8rem;
    flex-direction: column
}

#footer .footer-bottom address a {
    color: #fff;
    opacity: .8;
    font-weight: 300;
    font-size: .9rem;
    text-decoration: none
}

#footer .footer-bottom address a:hover {
    opacity: 1
}

#footer .socials a {
    color: #fff;
    transition: color 0.2s ease
}

#footer .socials a:hover,
#footer .socials a:focus {
    color: hsl(256 100% 78% / .958)
}

.search-result {
    border-radius: 20px
}

#gallery-project_gallery .uk-container {
    padding: 1rem
}

#gallery-carousel_gallery .gallery-item img {
    border-radius: 15px
}

main .layouts .gallery-container section:first-of-type {
    margin: unset
}

.gallery-container .gallery-content {
    padding: 2rem 0rem
}

.gallery-container .gallery-content h2 {
    max-width: 650px
}

#gallery-project_gallery .uk-container {
    padding: 1rem
}

#gallery-carousel_gallery .gallery-item img {
    border-radius: 15px
}

main .layouts .gallery-container section:first-of-type {
    margin: unset
}

.gallery-container .gallery-content {
    padding: 2rem 0rem
}

.gallery-container .gallery-content h2 {
    max-width: 650px
}

.project-gallery-grid .details-container,
.related_projects .details-container {
    position: relative;
    height: 100%
}

.project-gallery-grid .details-container .details,
.project-gallery-grid .details-container .arrow-link,
.related_projects .details-container .details,
.related_projects .details-container .arrow-link {
    display: none
}

@media (min-width:768px) {

    .project-gallery-grid .details-container .details,
    .project-gallery-grid .details-container .arrow-link,
    .related_projects .details-container .details,
    .related_projects .details-container .arrow-link {
        display: block
    }
}

.project-gallery-grid .details-container .project-title h3,
.related_projects .details-container .project-title h3 {
    color: #FAFAFA;
    font-size: 1.4rem;
    z-index: 10;
    position: relative
}

.project-gallery-grid .grid-item,
.related_projects .grid-item {
    height: auto;
    min-height: 25rem;
    overflow: visible;
    width: 100%;
    position: relative
}

.project-gallery-grid .grid-item a,
.related_projects .grid-item a {
    color: white !important;
    text-decoration: underline !important;
    text-underline-offset: 3px
}

.project-gallery-grid .grid-item a:before,
.related_projects .grid-item a:before {
    display: none
}

@media screen and (min-width:960px) {

    .project-gallery-grid .grid-item,
    .related_projects .grid-item {
        width: 50%;
        height: 35rem
    }
}

.project-gallery-grid .grid-item a,
.related_projects .grid-item a {
    text-decoration: none !important
}

.project-gallery-grid .grid-item .project-card,
.related_projects .grid-item .project-card {
    background-position: center center;
    height: 100%;
    width: 100%;
    position: relative;
    border-radius: 15px;
    padding: 2rem 2rem;
    overflow: visible;
    background-size: 110%;
    box-shadow: inset -4px -45px 98px 32px rgb(0 0 0 / .75)
}

.project-gallery-grid .grid-item .project-card div,
.project-gallery-grid .grid-item .project-card p,
.project-gallery-grid .grid-item .project-card span,
.related_projects .grid-item .project-card div,
.related_projects .grid-item .project-card p,
.related_projects .grid-item .project-card span {
    font-size: .8rem
}

@media screen and (min-width:960px) {

    .project-gallery-grid .grid-item .project-card div,
    .project-gallery-grid .grid-item .project-card p,
    .project-gallery-grid .grid-item .project-card span,
    .related_projects .grid-item .project-card div,
    .related_projects .grid-item .project-card p,
    .related_projects .grid-item .project-card span {
        font-size: 1rem
    }
}

@media screen and (min-width:960px) {

    .project-gallery-grid .grid-item .project-card,
    .related_projects .grid-item .project-card {
        padding: 3rem 3.5rem
    }
}

.project-gallery-grid .grid-item .project-card .arrow-link,
.related_projects .grid-item .project-card .arrow-link {
    flex: none;
    opacity: 0;
    position: relative;
    z-index: 10;
    transform: scaleX(-1);
    padding: 1rem;
    border: 1px solid #FAFAFA;
    border-radius: 9999px
}

.project-gallery-grid .grid-item .project-card .arrow-link svg,
.related_projects .grid-item .project-card .arrow-link svg {
    height: 1.8rem;
    width: 1.8rem;
    color: #FAFAFA
}

.project-gallery-grid .grid-item .project-card:before,
.related_projects .grid-item .project-card:before {
    position: absolute;
    border-radius: 5px;
    height: 100%;
    opacity: 0;
    width: 100%;
    content: "";
    background-color: hsl(255 32% 26% / .719);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    transform-origin: top;
    transition: 0.4s ease-in-out;
    border-radius: 15px
}

.project-gallery-grid .grid-item .project-card:after,
.related_projects .grid-item .project-card:after {
    content: "";
    position: absolute;
    transform: scale(0);
    transform-origin: center;
    transition: 0.6s ease-in-out;
    top: -6px;
    left: -6px;
    right: -6px;
    height: calc(100% + 12px);
    width: calc(100% + 12px);
    background: linear-gradient(60deg, hsl(256 46% 58% / .957), hsl(256 100% 78% / .958), #00C2AF, #F60000, #18648d);
    border-radius: 22px;
    z-index: -1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%
}

.project-gallery-grid .grid-item .project-card:hover:before,
.related_projects .grid-item .project-card:hover:before {
    opacity: 0
}

@media screen and (min-width:768px) {

    .project-gallery-grid .grid-item .project-card:hover:before,
    .related_projects .grid-item .project-card:hover:before {
        opacity: 1
    }
}

.project-gallery-grid .grid-item .project-card:hover:after,
.related_projects .grid-item .project-card:hover:after {
    transform: scale(1)
}

.project-gallery-grid .grid-item .project-card .details-container,
.related_projects .grid-item .project-card .details-container {
    display: flex;
    align-items: end
}

.project-gallery-grid .grid-item .project-card .details,
.related_projects .grid-item .project-card .details {
    transition: 1s cubic-bezier(.17, .67, .83, .67);
    position: relative;
    z-index: 10;
    max-height: 0rem;
    overflow: hidden
}

.project-gallery-grid .grid-item .project-card .details .cats,
.related_projects .grid-item .project-card .details .cats {
    display: flex;
    align-items: center;
    gap: 1rem;
    row-gap: .8rem;
    flex-wrap: wrap
}

.project-gallery-grid .grid-item .project-card .details .cats ul,
.related_projects .grid-item .project-card .details .cats ul {
    list-style: none;
    padding-left: 0;
    gap: .5rem;
    margin: unset
}

.project-gallery-grid .grid-item .project-card .details .cats ul li,
.related_projects .grid-item .project-card .details .cats ul li {
    border: 1px solid #FAFAFA;
    border-radius: 9999px;
    min-width: -moz-fit-content;
    min-width: fit-content;
    padding: .2rem .7rem
}

.project-gallery-grid .grid-item .project-card .details .cats ul li small,
.related_projects .grid-item .project-card .details .cats ul li small {
    color: #FAFAFA
}

.project-gallery-grid .grid-item .project-card .details .term,
.related_projects .grid-item .project-card .details .term {
    color: #FAFAFA;
    padding: .2rem 1.5rem;
    border: 1px solid #FAFAFA;
    border-radius: 99999px
}

.project-gallery-grid .grid-item .project-card .details h3,
.related_projects .grid-item .project-card .details h3 {
    color: #FAFAFA;
    font-size: 1rem
}

@media screen and (min-width:960px) {

    .project-gallery-grid .grid-item .project-card .details h3,
    .related_projects .grid-item .project-card .details h3 {
        font-size: 1.3rem
    }
}

.project-gallery-grid .grid-item .project-card .details p,
.related_projects .grid-item .project-card .details p {
    color: #FAFAFA
}

.project-gallery-grid .grid-item .project-card:hover .details,
.related_projects .grid-item .project-card:hover .details {
    max-height: 35rem;
    opacity: 1
}

.project-gallery-grid .grid-item .project-card:hover .arrow-link,
.related_projects .grid-item .project-card:hover .arrow-link {
    opacity: 1
}

.project-gallery-grid .grid-item:first-child,
.project-gallery-grid .grid-item:nth-child(4n),
.related_projects .grid-item:first-child,
.related_projects .grid-item:nth-child(4n) {
    min-height: 28rem;
    height: auto;
    overflow: unset;
    width: 100%
}

@media screen and (min-width:960px) {

    .project-gallery-grid .grid-item:first-child,
    .project-gallery-grid .grid-item:nth-child(4n),
    .related_projects .grid-item:first-child,
    .related_projects .grid-item:nth-child(4n) {
        height: 35rem
    }
}

.project-gallery-grid .grid-item:first-child .details,
.project-gallery-grid .grid-item:nth-child(4n) .details,
.related_projects .grid-item:first-child .details,
.related_projects .grid-item:nth-child(4n) .details {
    max-width: 730px
}

.logo-grid .client-logo {
    opacity: .7;
    filter: grayscale(1);
    transition: 0.25s ease-in-out;
    mix-blend-mode: multiply
}

.logo-grid .client-logo:hover {
    opacity: unset;
    filter: unset
}

[data-component=standard-gallery] .grid-item {
    height: 20rem;
    max-height: 37rem;
    position: relative
}

[data-component=standard-gallery] .grid-item a {
    text-decoration: none !important
}

[data-component=standard-gallery] .grid-item .uk-container {
    height: 100%;
    align-content: center
}

[data-component=standard-gallery] .grid-item:hover .details {
    opacity: 1
}

[data-component=standard-gallery] .grid-item:hover .arrow-link {
    opacity: 1
}

[data-component=standard-gallery] .grid-item:hover .project-title {
    visibility: hidden
}

[data-component=standard-gallery] img {
    border-radius: 10px
}

.logo-grid .client-logo {
    opacity: .7;
    filter: grayscale(1);
    transition: 0.25s ease-in-out;
    mix-blend-mode: multiply
}

.logo-grid .client-logo:hover {
    opacity: unset;
    filter: unset
}

.related_projects .project-card {
    position: relative
}

.related_projects .project-card:before {
    position: absolute;
    height: 100%;
    opacity: 0;
    width: 100%;
    content: "";
    background-color: hsl(255 32% 26% / .684);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    transform-origin: top;
    transition: 0.4s ease-in-out;
    border-radius: 20px
}

.gallery {
    display: flex;
    align-items: center
}

@media (min-width:960px) {
    section[data-component=project-gallery] .grid-item:nth-child(3n) {
        width: 100%;
        height: 600px
    }

    section[data-component=project-gallery] .grid-item:nth-child(3n) .uk-height-large {
        -o-object-fit: cover;
        object-fit: cover;
        height: 100%;
        width: 100%
    }
}

.portfolio .uk-child-width-1-2\@m .related-project,
.related_projects .uk-child-width-1-2\@m .related-project,
.project-grid .uk-child-width-1-2\@m .related-project {
    transition: 0.2s ease
}

.portfolio .uk-child-width-1-2\@m .related-project .project-card,
.related_projects .uk-child-width-1-2\@m .related-project .project-card,
.project-grid .uk-child-width-1-2\@m .related-project .project-card {
    -o-border-image: none;
    border-image: none;
    transition: 0.2s ease;
    box-sizing: padding-box;
    position: relative
}

.portfolio .uk-child-width-1-2\@m .related-project .project-card:before,
.related_projects .uk-child-width-1-2\@m .related-project .project-card:before,
.project-grid .uk-child-width-1-2\@m .related-project .project-card:before {
    transition: 0.6s ease;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 1;
    height: 0;
    width: 100%;
    background-color: hsl(255 32% 26% / .719)
}

.portfolio .uk-child-width-1-2\@m .related-project .project-card .project-categories,
.related_projects .uk-child-width-1-2\@m .related-project .project-card .project-categories,
.project-grid .uk-child-width-1-2\@m .related-project .project-card .project-categories {
    list-style: none;
    padding-left: 0;
    flex-wrap: wrap;
    row-gap: .4rem;
    -moz-column-gap: .3rem;
    column-gap: .3rem;
    overflow: hidden;
    interpolate-size: allow-keywords;
    visibility: hidden;
    transition: transform 0.4s ease;
    position: relative;
    transform: translateY(100px);
    top: 0;
    opacity: 0;
    margin: unset
}

.portfolio .uk-child-width-1-2\@m .related-project .project-card .project-categories li,
.related_projects .uk-child-width-1-2\@m .related-project .project-card .project-categories li,
.project-grid .uk-child-width-1-2\@m .related-project .project-card .project-categories li {
    color: #FAFAFA;
    border: 1px solid #FAFAFA;
    border-radius: 99999rem;
    padding: .2rem 1rem;
    min-width: -moz-fit-content;
    min-width: fit-content;
    margin: unset;
    font-size: smaller
}

.portfolio .uk-child-width-1-2\@m .related-project .project-card .project-title,
.related_projects .uk-child-width-1-2\@m .related-project .project-card .project-title,
.project-grid .uk-child-width-1-2\@m .related-project .project-card .project-title {
    position: relative;
    z-index: 10;
    transition: transform 0.4s ease
}

.portfolio .uk-child-width-1-2\@m .related-project .project-card .project-title h3,
.related_projects .uk-child-width-1-2\@m .related-project .project-card .project-title h3,
.project-grid .uk-child-width-1-2\@m .related-project .project-card .project-title h3 {
    font-size: 1.4rem
}

.portfolio .uk-child-width-1-2\@m .related-project .project-card:hover:before,
.related_projects .uk-child-width-1-2\@m .related-project .project-card:hover:before,
.project-grid .uk-child-width-1-2\@m .related-project .project-card:hover:before {
    height: 100%;
    opacity: 1
}

.portfolio .uk-child-width-1-2\@m .related-project .project-card:hover .project-categories,
.related_projects .uk-child-width-1-2\@m .related-project .project-card:hover .project-categories,
.project-grid .uk-child-width-1-2\@m .related-project .project-card:hover .project-categories {
    height: auto;
    visibility: visible;
    opacity: 1;
    transform: translateY(0)
}

.portfolio .uk-child-width-1-3\@m .project-card,
.portfolio .uk-child-width-1-3\@l .project-card,
.related_projects .uk-child-width-1-3\@m .project-card,
.related_projects .uk-child-width-1-3\@l .project-card,
.project-grid .uk-child-width-1-3\@m .project-card,
.project-grid .uk-child-width-1-3\@l .project-card {
    -o-border-image: none;
    border-image: none;
    transition: 0.2s ease;
    box-sizing: padding-box;
    position: relative
}

.portfolio .uk-child-width-1-3\@m .project-card:before,
.portfolio .uk-child-width-1-3\@l .project-card:before,
.related_projects .uk-child-width-1-3\@m .project-card:before,
.related_projects .uk-child-width-1-3\@l .project-card:before,
.project-grid .uk-child-width-1-3\@m .project-card:before,
.project-grid .uk-child-width-1-3\@l .project-card:before {
    transition: 0.5s ease-in-out;
    content: "";
    position: absolute;
    left: 0;
    opacity: 0;
    z-index: 5;
    height: 0;
    width: 100%;
    background-color: hsl(255 32% 26% / .719);
    bottom: 0
}

.portfolio .uk-child-width-1-3\@m .project-card:after,
.portfolio .uk-child-width-1-3\@l .project-card:after,
.related_projects .uk-child-width-1-3\@m .project-card:after,
.related_projects .uk-child-width-1-3\@l .project-card:after,
.project-grid .uk-child-width-1-3\@m .project-card:after,
.project-grid .uk-child-width-1-3\@l .project-card:after {
    content: "";
    position: absolute;
    transform: scale(0);
    transform-origin: center;
    transition: 0.6s ease-in-out;
    top: -6px;
    left: -6px;
    right: -6px;
    height: calc(100% + 12px);
    width: calc(100% + 12px);
    background: linear-gradient(60deg, hsl(256 46% 58% / .957), hsl(256 100% 78% / .958), #00C2AF, #F60000, #18648d);
    border-radius: 22px;
    z-index: -1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%
}

.portfolio .uk-child-width-1-3\@m .project-card .cats,
.portfolio .uk-child-width-1-3\@l .project-card .cats,
.related_projects .uk-child-width-1-3\@m .project-card .cats,
.related_projects .uk-child-width-1-3\@l .project-card .cats,
.project-grid .uk-child-width-1-3\@m .project-card .cats,
.project-grid .uk-child-width-1-3\@l .project-card .cats {
    overflow: hidden;
    max-height: 0;
    interpolate-size: allow-keywords;
    transition: 0.8s ease-in-out;
    position: relative;
    z-index: 1;
    transform: translateY(0);
    opacity: 0
}

.portfolio .uk-child-width-1-3\@m .project-card .project-categories,
.portfolio .uk-child-width-1-3\@l .project-card .project-categories,
.related_projects .uk-child-width-1-3\@m .project-card .project-categories,
.related_projects .uk-child-width-1-3\@l .project-card .project-categories,
.project-grid .uk-child-width-1-3\@m .project-card .project-categories,
.project-grid .uk-child-width-1-3\@l .project-card .project-categories {
    list-style: none;
    padding-left: 0;
    flex-wrap: wrap;
    row-gap: .4rem;
    -moz-column-gap: .3rem;
    column-gap: .3rem
}

.portfolio .uk-child-width-1-3\@m .project-card .project-categories li,
.portfolio .uk-child-width-1-3\@l .project-card .project-categories li,
.related_projects .uk-child-width-1-3\@m .project-card .project-categories li,
.related_projects .uk-child-width-1-3\@l .project-card .project-categories li,
.project-grid .uk-child-width-1-3\@m .project-card .project-categories li,
.project-grid .uk-child-width-1-3\@l .project-card .project-categories li {
    color: #FAFAFA;
    border: 1px solid #FAFAFA;
    border-radius: 99999rem;
    padding: .2rem 1rem;
    min-width: -moz-fit-content;
    min-width: fit-content;
    margin: unset;
    font-size: smaller
}

.portfolio .uk-child-width-1-3\@m .project-card .project-title,
.portfolio .uk-child-width-1-3\@l .project-card .project-title,
.related_projects .uk-child-width-1-3\@m .project-card .project-title,
.related_projects .uk-child-width-1-3\@l .project-card .project-title,
.project-grid .uk-child-width-1-3\@m .project-card .project-title,
.project-grid .uk-child-width-1-3\@l .project-card .project-title {
    position: relative;
    z-index: 10;
    transition: 0.2s ease
}

.portfolio .uk-child-width-1-3\@m .project-card .project-title h3,
.portfolio .uk-child-width-1-3\@l .project-card .project-title h3,
.related_projects .uk-child-width-1-3\@m .project-card .project-title h3,
.related_projects .uk-child-width-1-3\@l .project-card .project-title h3,
.project-grid .uk-child-width-1-3\@m .project-card .project-title h3,
.project-grid .uk-child-width-1-3\@l .project-card .project-title h3 {
    font-size: 1.4rem
}

.portfolio .uk-child-width-1-3\@m .project-card:hover:after,
.portfolio .uk-child-width-1-3\@l .project-card:hover:after,
.related_projects .uk-child-width-1-3\@m .project-card:hover:after,
.related_projects .uk-child-width-1-3\@l .project-card:hover:after,
.project-grid .uk-child-width-1-3\@m .project-card:hover:after,
.project-grid .uk-child-width-1-3\@l .project-card:hover:after {
    visibility: visible;
    transform: scale(1)
}

.portfolio .uk-child-width-1-3\@m .project-card:hover:before,
.portfolio .uk-child-width-1-3\@l .project-card:hover:before,
.related_projects .uk-child-width-1-3\@m .project-card:hover:before,
.related_projects .uk-child-width-1-3\@l .project-card:hover:before,
.project-grid .uk-child-width-1-3\@m .project-card:hover:before,
.project-grid .uk-child-width-1-3\@l .project-card:hover:before {
    height: 100%;
    opacity: 1
}

.portfolio .uk-child-width-1-3\@m .project-card:hover .cats,
.portfolio .uk-child-width-1-3\@l .project-card:hover .cats,
.related_projects .uk-child-width-1-3\@m .project-card:hover .cats,
.related_projects .uk-child-width-1-3\@l .project-card:hover .cats,
.project-grid .uk-child-width-1-3\@m .project-card:hover .cats,
.project-grid .uk-child-width-1-3\@l .project-card:hover .cats {
    max-height: 8rem;
    opacity: 1
}

.project-grid .portfolio-item {
    height: auto;
    min-height: 25rem;
    overflow: visible;
    width: 100%;
    position: relative
}

.project-grid .portfolio-item a {
    color: white !important;
    text-decoration: underline !important;
    text-underline-offset: 3px
}

.project-grid .portfolio-item a:before {
    display: none
}

@media screen and (min-width:960px) {
    .project-grid .portfolio-item {
        width: 50%;
        height: 35rem
    }
}

.project-grid .portfolio-item a {
    text-decoration: none !important
}

.project-grid .portfolio-item .project-card {
    background-position: center center;
    height: 100%;
    width: 100%;
    position: relative;
    border-radius: 15px;
    padding: 2rem 2rem;
    overflow: visible;
    background-size: 110%;
    box-shadow: inset -4px -45px 98px 62px rgb(0 0 0 / .782)
}

.project-grid .portfolio-item .project-card div,
.project-grid .portfolio-item .project-card p,
.project-grid .portfolio-item .project-card span {
    font-size: .8rem
}

@media screen and (min-width:960px) {

    .project-grid .portfolio-item .project-card div,
    .project-grid .portfolio-item .project-card p,
    .project-grid .portfolio-item .project-card span {
        font-size: 1rem
    }
}

@media screen and (min-width:960px) {
    .project-grid .portfolio-item .project-card {
        padding: 3rem 3.5rem
    }
}

.project-grid .portfolio-item .project-card .arrow-link {
    flex: none;
    opacity: 0;
    position: relative;
    z-index: 10;
    transform: scaleX(-1);
    padding: 1rem;
    border: 1px solid #FAFAFA;
    border-radius: 9999px
}

.project-grid .portfolio-item .project-card .arrow-link svg {
    height: 1.8rem;
    width: 1.8rem;
    color: #FAFAFA
}

.project-grid .portfolio-item .project-card:before {
    position: absolute;
    border-radius: 5px;
    height: 100%;
    opacity: 0;
    width: 100%;
    content: "";
    background-color: hsl(255 32% 26% / .719);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    transform-origin: top;
    transition: 0.8s ease-in-out;
    border-radius: 15px
}

.project-grid .portfolio-item .project-card:after {
    content: "";
    position: absolute;
    transform: scale(0);
    transform-origin: center;
    transition: 0.6s ease-in-out;
    top: -6px;
    left: -6px;
    right: -6px;
    height: calc(100% + 12px);
    width: calc(100% + 12px);
    background: linear-gradient(60deg, hsl(256 46% 58% / .957), hsl(256 100% 78% / .958), #00C2AF, #F60000, #18648d);
    border-radius: 22px;
    z-index: -1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%
}

.project-grid .portfolio-item .project-card:hover:before {
    opacity: 0
}

@media screen and (min-width:768px) {
    .project-grid .portfolio-item .project-card:hover:before {
        opacity: 1
    }
}

.project-grid .portfolio-item .project-card:hover:after {
    transform: scale(1)
}

.project-grid .portfolio-item .project-card .details-container {
    display: flex;
    align-items: end
}

.project-grid .portfolio-item .project-card .details {
    transition: 1s ease-in-out;
    position: relative;
    z-index: 10;
    max-height: 0rem;
    overflow: hidden
}

.project-grid .portfolio-item .project-card .details .cats {
    display: flex;
    align-items: center;
    gap: 1rem;
    row-gap: .8rem;
    flex-wrap: wrap
}

.project-grid .portfolio-item .project-card .details .cats ul {
    list-style: none;
    padding-left: 0;
    gap: .5rem;
    row-gap: .5rem;
    margin: unset;
    flex-wrap: wrap
}

.project-grid .portfolio-item .project-card .details .cats ul li {
    border: 1px solid #FAFAFA;
    border-radius: 9999px;
    min-width: -moz-fit-content;
    min-width: fit-content;
    padding: .2rem .7rem;
    margin: unset
}

.project-grid .portfolio-item .project-card .details .cats ul li small {
    color: #FAFAFA
}

.project-grid .portfolio-item .project-card .details .term {
    color: #FAFAFA;
    padding: .2rem 1.5rem;
    border: 1px solid #FAFAFA;
    border-radius: 99999px
}

.project-grid .portfolio-item .project-card .details p {
    color: #FAFAFA
}

.project-grid .portfolio-item .project-card h3 {
    color: #FAFAFA;
    font-size: 1rem;
    position: relative;
    z-index: 10
}

@media screen and (min-width:960px) {
    .project-grid .portfolio-item .project-card h3 {
        font-size: 1.3rem
    }
}

.project-grid .portfolio-item .project-card:hover .details {
    max-height: 35rem;
    opacity: 1
}

.project-grid .portfolio-item .project-card:hover .arrow-link {
    opacity: 1
}

.related-project-grid .portfolio-item {
    height: auto;
    height: 15rem;
    overflow: visible;
    width: 100%;
    position: relative
}

@media screen and (min-width:640px) {
    .related-project-grid .portfolio-item {
        height: 20rem
    }
}

.related-project-grid .portfolio-item a {
    color: white !important;
    text-decoration: underline !important;
    text-underline-offset: 3px
}

.related-project-grid .portfolio-item a:before {
    display: none
}

@media screen and (min-width:960px) {
    .related-project-grid .portfolio-item {
        height: 35rem
    }
}

.related-project-grid .portfolio-item a {
    text-decoration: none !important
}

.related-project-grid .portfolio-item .project-card {
    background-position: center center;
    height: 100%;
    width: 100%;
    position: relative;
    border-radius: 15px;
    padding: 2rem 2rem;
    overflow: visible;
    background-size: 110%;
    box-shadow: inset -4px -45px 98px 62px rgb(0 0 0 / .782)
}

.related-project-grid .portfolio-item .project-card div,
.related-project-grid .portfolio-item .project-card p,
.related-project-grid .portfolio-item .project-card span {
    font-size: .8rem
}

@media screen and (min-width:960px) {

    .related-project-grid .portfolio-item .project-card div,
    .related-project-grid .portfolio-item .project-card p,
    .related-project-grid .portfolio-item .project-card span {
        font-size: 1rem
    }
}

@media screen and (min-width:960px) {
    .related-project-grid .portfolio-item .project-card {
        padding: 3rem 3.5rem
    }
}

.related-project-grid .portfolio-item .project-card .arrow-link {
    flex: none;
    opacity: 0;
    position: relative;
    z-index: 10;
    transform: scaleX(-1);
    padding: 1rem;
    border: 1px solid #FAFAFA;
    border-radius: 9999px
}

.related-project-grid .portfolio-item .project-card .arrow-link svg {
    height: 1.8rem;
    width: 1.8rem;
    color: #FAFAFA
}

.related-project-grid .portfolio-item .project-card:before {
    position: absolute;
    border-radius: 5px;
    height: 100%;
    opacity: 0;
    width: 100%;
    content: "";
    background-color: hsl(255 32% 26% / .719);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    transform-origin: top;
    transition: 0.8s ease-in-out;
    border-radius: 15px
}

.related-project-grid .portfolio-item .project-card:after {
    content: "";
    position: absolute;
    transform: scale(0);
    transform-origin: center;
    transition: 0.6s ease-in-out;
    top: -6px;
    left: -6px;
    right: -6px;
    height: calc(100% + 12px);
    width: calc(100% + 12px);
    background: linear-gradient(60deg, hsl(256 46% 58% / .957), hsl(256 100% 78% / .958), #00C2AF, #F60000, #18648d);
    border-radius: 22px;
    z-index: -1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%
}

.related-project-grid .portfolio-item .project-card:hover:before {
    opacity: 0
}

@media screen and (min-width:768px) {
    .related-project-grid .portfolio-item .project-card:hover:before {
        opacity: 1
    }
}

.related-project-grid .portfolio-item .project-card:hover:after {
    transform: scale(1)
}

.related-project-grid .portfolio-item .project-card .details-container {
    display: flex;
    align-items: end
}

.related-project-grid .portfolio-item .project-card .details {
    transition: 1s ease-in-out !important;
    position: relative;
    z-index: 10;
    max-height: 0rem;
    overflow: hidden
}

.related-project-grid .portfolio-item .project-card .details .cats {
    display: flex;
    align-items: center;
    gap: 1rem;
    row-gap: .8rem;
    flex-wrap: wrap
}

.related-project-grid .portfolio-item .project-card .details .cats ul {
    list-style: none;
    padding-left: 0;
    gap: .5rem;
    row-gap: .5rem;
    margin: unset;
    flex-wrap: wrap
}

.related-project-grid .portfolio-item .project-card .details .cats ul li {
    border: 1px solid #FAFAFA;
    border-radius: 9999px;
    min-width: -moz-fit-content;
    min-width: fit-content;
    padding: .2rem .7rem;
    margin: unset
}

.related-project-grid .portfolio-item .project-card .details .cats ul li small {
    color: #FAFAFA;
    font-size: .8rem
}

.related-project-grid .portfolio-item .project-card .details .term {
    color: #FAFAFA;
    padding: .2rem 1.5rem;
    border: 1px solid #FAFAFA;
    border-radius: 99999px
}

.related-project-grid .portfolio-item .project-card .details p {
    color: #FAFAFA
}

.related-project-grid .portfolio-item .project-card h3 {
    color: #FAFAFA;
    font-size: 1rem;
    position: relative;
    z-index: 10
}

@media screen and (min-width:960px) {
    .related-project-grid .portfolio-item .project-card h3 {
        font-size: 1.3rem
    }
}

.related-project-grid .portfolio-item .project-card:hover .details {
    max-height: 35rem;
    opacity: 1
}

.related-project-grid .portfolio-item .project-card:hover .arrow-link {
    opacity: 1
}

@keyframes animatedgradient {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

.wp-block-gallery,
.gallery {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none;
    padding: 0;
    margin: 0 -8px
}

.blocks-gallery-item,
.gallery-item {
    margin: 0;
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    justify-content: center;
    position: relative;
    padding: 8px
}

.blocks-gallery-item figure,
.gallery-item .gallery-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%
}

.blocks-gallery-item img,
.gallery-item img {
    display: block;
    max-width: 100%;
    height: auto;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.blocks-gallery-item figcaption,
.gallery-caption {
    position: absolute;
    bottom: 0;
    width: 100%;
    max-height: 100%;
    padding: 6px 8px;
    text-align: center;
    color: #fff;
    background: linear-gradient(0deg, rgb(0 0 0 / .7), rgb(0 0 0 / .3) 60%, transparent);
    font-size: 13px;
    margin: 0
}

.gallery-columns-1 .gallery-item {
    width: 100%
}

.gallery-columns-2 .gallery-item {
    width: 100%
}

@media (min-width:576px) {
    .gallery-columns-2 .gallery-item {
        width: 50%
    }
}

.gallery-columns-3 .gallery-item {
    width: 100%
}

@media (min-width:576px) {
    .gallery-columns-3 .gallery-item {
        width: 50%
    }
}

@media (min-width:768px) {
    .gallery-columns-3 .gallery-item {
        width: 33.33%
    }
}

.gallery-columns-4 .gallery-item {
    width: 100%
}

@media (min-width:576px) {
    .gallery-columns-4 .gallery-item {
        width: 50%
    }
}

@media (min-width:768px) {
    .gallery-columns-4 .gallery-item {
        width: 33.33%
    }
}

@media (min-width:992px) {
    .gallery-columns-4 .gallery-item {
        width: 25%
    }
}

.gallery-columns-5 .gallery-item {
    width: 100%
}

@media (min-width:576px) {
    .gallery-columns-5 .gallery-item {
        width: 50%
    }
}

@media (min-width:768px) {
    .gallery-columns-5 .gallery-item {
        width: 33.33%
    }
}

@media (min-width:992px) {
    .gallery-columns-5 .gallery-item {
        width: 25%
    }
}

@media (min-width:1200px) {
    .gallery-columns-5 .gallery-item {
        width: 20%
    }
}

.gallery-columns-6 .gallery-item {
    width: 100%
}

@media (min-width:576px) {
    .gallery-columns-6 .gallery-item {
        width: 50%
    }
}

@media (min-width:768px) {
    .gallery-columns-6 .gallery-item {
        width: 33.33%
    }
}

@media (min-width:992px) {
    .gallery-columns-6 .gallery-item {
        width: 25%
    }
}

@media (min-width:1200px) {
    .gallery-columns-6 .gallery-item {
        width: 16.66%
    }
}

.gallery-columns-7 .gallery-item {
    width: 100%
}

@media (min-width:576px) {
    .gallery-columns-7 .gallery-item {
        width: 50%
    }
}

@media (min-width:768px) {
    .gallery-columns-7 .gallery-item {
        width: 33.33%
    }
}

@media (min-width:992px) {
    .gallery-columns-7 .gallery-item {
        width: 25%
    }
}

@media (min-width:1200px) {
    .gallery-columns-7 .gallery-item {
        width: 14.28%
    }
}

.gallery-columns-8 .gallery-item {
    width: 100%
}

@media (min-width:576px) {
    .gallery-columns-8 .gallery-item {
        width: 50%
    }
}

@media (min-width:768px) {
    .gallery-columns-8 .gallery-item {
        width: 33.33%
    }
}

@media (min-width:992px) {
    .gallery-columns-8 .gallery-item {
        width: 25%
    }
}

@media (min-width:1200px) {
    .gallery-columns-8 .gallery-item {
        width: 12.5%
    }
}

.gallery-columns-9 .gallery-item {
    width: 100%
}

@media (min-width:576px) {
    .gallery-columns-9 .gallery-item {
        width: 50%
    }
}

@media (min-width:768px) {
    .gallery-columns-9 .gallery-item {
        width: 33.33%
    }
}

@media (min-width:992px) {
    .gallery-columns-9 .gallery-item {
        width: 25%
    }
}

@media (min-width:1200px) {
    .gallery-columns-9 .gallery-item {
        width: 11.11%
    }
}

@media (max-width:575px) {

    .wp-block-gallery,
    .gallery {
        margin: 0 -4px
    }

    .blocks-gallery-item,
    .gallery-item {
        padding: 4px
    }
}

.gallery-item a {
    display: block;
    width: 100%;
    height: 100%
}

.gallery-item img {
    transition: opacity 0.3s ease
}

.gallery-item:hover img {
    opacity: .9
}

@media screen and (max-width:40rem) {
    #hero br {
        display: none
    }
}

.hero {
    height: 25rem;
    max-height: 50rem;
    max-width: 100%;
    padding: 0;
    overflow: auto;
    position: relative;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 95%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 95%, 0% 100%)
}

.hero:after {
    position: absolute;
    bottom: 0;
    z-index: 10;
    width: 100%;
    height: 2.5rem;
    content: "";
    background-color: hsl(255 31% 20%);
    -webkit-clip-path: polygon(0 72%, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 72%, 100% 0, 100% 100%, 0% 100%)
}

.hero:before {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    content: "";
    background-color: hsl(255 31% 20%);
    opacity: .6
}

.hero video {
    height: 100%;
    width: 100%;
    position: absolute;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 0
}

.hero hgroup {
    height: 100%;
    position: relative;
    z-index: 10
}

.hero hgroup .uk-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.hero hgroup h1 {
    color: #FAFAFA;
    letter-spacing: .7px
}

.hero hgroup div.hero-text {
    font-size: .9rem;
    max-width: 20rem;
    color: #FAFAFA;
    font-weight: 300
}

@media screen and (min-width:40rem) {
    .hero hgroup h1 {
        color: #FAFAFA;
        font-weight: 800;
        max-width: 33rem
    }

    .hero hgroup div.hero-text {
        font-size: 1rem;
        color: #FAFAFA;
        font-weight: 300;
        max-width: 22rem
    }
}

@media screen and (min-width:60rem) {
    .hero hgroup h1 {
        color: #FAFAFA;
        font-weight: 800;
        max-width: 50rem
    }

    .hero hgroup div.hero-text {
        font-size: 1.2rem;
        color: #FAFAFA;
        font-weight: 300;
        max-width: 24rem
    }
}

@media screen and (min-width:75rem) {
    .hero hgroup h1 {
        color: #FAFAFA;
        font-weight: 800;
        max-width: 50rem
    }

    .hero hgroup div.hero-text {
        font-size: 1.5rem;
        color: #FAFAFA;
        font-weight: 300;
        max-width: 28rem
    }
}

@media screen and (min-width:100rem) {
    .hero hgroup h1 {
        color: #FAFAFA;
        font-weight: 800;
        max-width: 50rem
    }

    .hero hgroup div.hero-text {
        font-size: 1.5rem;
        color: #FAFAFA;
        font-weight: 300;
        max-width: 28rem
    }
}

@media screen and (min-width:60rem) {
    .hero {
        height: 32rem
    }
}

@media screen and (min-width:75rem) {
    .hero {
        height: 35rem
    }
}

@media screen and (min-width:100rem) {
    .hero {
        height: 42rem
    }
}

.hero.single {
    -webkit-clip-path: unset;
    clip-path: unset
}

.hero.single:before {
    display: none
}

.hero.single:after {
    display: none
}

.single-post-header {
    max-width: 3000px;
    margin: 0 auto
}

.hero.project {
    -webkit-clip-path: unset;
    clip-path: unset;
    padding-bottom: 1.8rem
}

@media (max-width:640px) {
    .hero.project .uk-grid {
        margin-left: unset
    }

    .hero.project .uk-grid>div {
        padding-left: 15px
    }

    .hero.project .stat-column {
        padding-left: unset
    }
}

.hero.project .hero-top {
    padding-top: 4.5rem;
    padding-bottom: 2rem;
    height: 100%;
    background-color: hsl(255 31% 20%);
    background-image: url(/wp/wp-content/uploads/2024/11/always-grey.png);
    background-repeat: repeat;
    background-size: 20px;
    -webkit-clip-path: unset;
    clip-path: unset;
    box-shadow: inset 0 -45px 5px 0 hsl(256 32% 20% / .796);
    transform: translateY(2px)
}

@media (min-width:960px) {
    .hero.project .hero-top {
        padding-bottom: unset
    }
}

.hero.project .hero-top p {
    color: #FAFAFA
}

.hero.project .hero-top small {
    color: hsl(256 100% 78% / .958)
}

.hero.project .hero-bottom {
    background-color: hsl(255 31% 20%);
    background: linear-gradient(0deg, #FAFAFA 50%, hsl(255 31% 20%) 50%);
    background-size: 20px;
    padding-top: 40px
}

.hero.project .hero-bottom .hero-image {
    padding-bottom: 20rem
}

@media (min-width:40rem) {
    .hero.project .hero-bottom .hero-image {
        padding-bottom: 30rem
    }
}

@media (min-width:75rem) {
    .hero.project .hero-bottom .hero-image {
        padding-bottom: 40rem
    }
}

.hero.project .hero-bottom .hero-image img {
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 20px
}

.hero.project .hero-grid {
    max-width: 3500px;
    margin: auto
}

.hero.project:before {
    display: none
}

.hero.project:after {
    display: none
}

.hero.project hgroup {
    height: unset;
    padding-right: 1.5rem
}

.hero.project hgroup small,
.hero.project hgroup a {
    color: hsl(256 100% 78% / .958);
    font-size: 1.1rem;
    letter-spacing: .7px;
    font-weight: 600
}

.hero.project hgroup h1 {
    margin: 1rem 0
}

.hero.project h1 {
    margin-bottom: 1rem;
    font-weight: 700
}

.hero.project .services-provided {
    margin-top: 0
}

@media (min-width:960px) {
    .hero.project .services-provided {
        max-height: 375px
    }
}

.hero.project .services-provided small {
    font-size: 1rem;
    position: relative;
    padding-bottom: .2rem;
    border-bottom: .1px solid hsl(256 46% 58% / .957);
    margin-bottom: .2rem
}

.hero.project .services-provided ul {
    margin-top: 1rem;
    list-style: none;
    padding-left: .1rem
}

.hero.project .services-provided ul li {
    color: #FAFAFA;
    opacity: .75;
    font-size: .95rem;
    margin: .2rem 0
}

@media screen and (max-width:60rem) {
    .hero.project {
        height: unset;
        min-height: unset;
        max-height: unset
    }
}

.hero.project .hero-image {
    height: 350px;
    margin-top: 0
}

@media screen and (min-width:60rem) {
    .hero.project .hero-image {
        height: 100%
    }
}

.hero.project .project-excerpt {
    padding: 2rem 0rem;
    padding-right: 1rem
}

@media screen and (min-width:60rem) {
    .hero.project .project-excerpt {
        padding-right: 2.2rem
    }
}

.hero.project span {
    color: #FAFAFA
}

.hero.project span.percentage {
    font-weight: 700;
    font-size: 2rem
}

.hero.project span.number {
    font-size: 2rem;
    font-weight: 700
}

.hero.project .portfolio-services {
    margin-top: 0rem;
    gap: unset;
    flex-direction: column
}

@media (min-width:60rem) {
    .hero.project .portfolio-services {
        flex-direction: row;
        gap: 3rem
    }
}

.hero.project .portfolio-services a {
    color: white !important;
    opacity: .8;
    transition: 0.2s ease
}

.hero.project .portfolio-services a:hover {
    opacity: 1
}

.hero.project .hero-image-mobile {
    height: unset;
    height: 220px;
    border-radius: 15px;
    position: relative;
    overflow: visible
}

.hero.project .hero-image-mobile:before {
    content: "";
    position: absolute;
    top: -15px;
    right: -20px !important;
    border: 2px solid hsl(256 46% 58% / .957);
    height: 30%;
    width: 40%;
    border-radius: 15px
}

.hero.project .hero-image-mobile:after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: -10px;
    background: hsl(256 46% 58% / .957);
    height: 40%;
    width: 40%;
    border-radius: 20px;
    z-index: 0
}

.hero.project .hero-image-mobile img {
    position: relative;
    z-index: 10;
    border-radius: 15px
}

.hero.single {
    height: unset;
    padding-bottom: 2.5rem
}

@media screen and (min-width:60rem) {
    .hero.single {
        height: 42rem;
        padding-bottom: unset
    }
}

.hero.single small {
    color: hsl(256 100% 78% / .958)
}

.hero.single .author {
    color: #FAFAFA;
    opacity: .9
}

.hero.single .avatar {
    height: 75px;
    width: 75px
}

.hero.single .avatar .author-pic {
    height: 100%;
    width: 100%
}

.hero.single .hero-image {
    height: 350px
}

@media screen and (min-width:60rem) {
    .hero.single .hero-image {
        height: 100%
    }
}

.hero.single .uk-grid>div {
    padding-left: unset
}

@media screen and (min-width:60rem) {
    .hero.single .uk-grid>div {
        padding-left: 40px
    }
}

br.show {
    display: block !important
}

.header-group .small {
    color: hsl(256 100% 78% / .958);
    font-size: 1.5rem;
    margin: 2.51rem 0
}

@media screen and (max-width:40rem) {
    .header-group .small {
        font-size: 1rem;
        margin: unset;
        line-height: 1.7rem;
        margin-bottom: 1rem
    }
}

.header-group h2 {
    color: hsl(255 31% 20%)
}

.default-hero {
    background: url(/wp/wp-content/uploads/2024/11/always-grey.png);
    background-color: hsl(255 31% 20%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: -1px 31px 463px 70px hsl(255 31% 20%) inset;
    -webkit-box-shadow: -1px 31px 463px 70px hsl(255 31% 20%) inset;
    -moz-box-shadow: -1px 31px 463px 70px hsl(255 31% 20%) inset
}

.default-hero hgroup {
    text-align: center;
    padding: 2.5rem 0;
    height: 100% !important;
    align-content: center
}

.default-hero hgroup h1 {
    font-size: unset;
    font-size: .9rem;
    font-weight: 600
}

.default-hero hgroup h2 {
    font-size: 1.8rem;
    color: #FAFAFA
}

.default-hero hgroup h2 em {
    color: hsl(256 100% 78% / .958)
}

@media screen and (min-width:60rem) {
    .default-hero hgroup {
        padding: 3rem 0
    }

    .default-hero hgroup h1:not(.standard-title) {
        font-size: 1.4rem !important
    }

    .default-hero hgroup h2 {
        font-size: 2.7rem
    }
}

@media screen and (min-width:60rem) {
    .default-hero {
        height: 25rem
    }
}

@media screen and (min-width:75rem) {
    .default-hero {
        height: 30rem
    }
}

.default-hero h1.standard-title {
    color: #fff;
    font-size: 2rem
}

@media (min-width:960px) {
    .default-hero h1.standard-title {
        font-size: 3rem
    }
}

.split-bg-project {
    background: #483a6f;
    background: linear-gradient(0deg, #fff0 50%, #382d57 50%)
}

.blog-hero {
    background: url(/wp/wp-content/uploads/2024/11/always-grey.png);
    background-color: hsl(255 31% 20%);
    -webkit-clip-path: unset;
    clip-path: unset;
    padding: 6.5rem 0;
    margin-bottom: 1.9rem
}

.blog-hero h2 {
    color: #FAFAFA !important
}

.inner-hero.contact-hero {
    background-color: hsl(255 31% 20%);
    background-image: url(/wp/wp-content/uploads/2024/11/always-grey.png);
    background-repeat: repeat;
    background-size: 20px;
    box-shadow: inset 0 -45px 5px 0 hsl(256 32% 20% / .796);
    padding: 6.5rem 0 3.5rem 0;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 95%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 95%, 0% 100%)
}

.inner-hero.contact-hero h1 {
    margin: unset;
    margin: .5rem 0;
    font-weight: 600
}

.inner-hero.contact-hero h2 {
    color: #FAFAFA
}

.inner-hero.contact-hero p {
    color: #FAFAFA
}

.inner-hero.contact-hero small {
    color: hsl(256 100% 78% / .958)
}

.inner-hero.contact-hero .contact-info .icon-wrapper {
    box-sizing: border-box;
    padding: .4rem;
    height: 50px;
    width: 50px;
    border-radius: 9999px;
    background-color: hsl(256 100% 78% / .958);
    border: 1px solid #fff
}

.inner-hero.contact-hero .contact-info i {
    color: #FAFAFA
}

.inner-hero.contact-hero .contact-info div:not(.location-list, .contact-method-list) {
    color: #FAFAFA;
    gap: 1rem
}

.inner-hero.contact-hero .contact-info h3 {
    color: #FAFAFA;
    font-weight: 500
}

.inner-hero.contact-hero .contact-info .location-list,
.inner-hero.contact-hero .contact-info .contact-method-list {
    margin-top: .5rem;
    padding-left: 69px
}

.inner-hero.contact-hero .contact-info h4 {
    font-size: 1rem;
    color: #FAFAFA;
    opacity: .7;
    font-weight: 300
}

.inner-hero.contact-hero .contact-info .small {
    font-size: 1.8rem
}

#hero.search-hero {
    background: url(/wp/wp-content/uploads/2024/11/always-grey.png);
    background-color: hsl(255 31% 20%);
    -webkit-clip-path: unset;
    clip-path: unset;
    padding: 4.5rem 0;
    height: unset
}

#hero.search-hero:before,
#hero.search-hero:after {
    display: none
}

#hero.search-hero h1 {
    margin: unset;
    margin-bottom: 1rem;
    font-size: clamp(1.2rem, 2.2vw + 1rem, 2.2rem);
    color: #FAFAFA
}

.hero.project em {
    color: hsl(256 100% 78% / .958)
}

#hero span {
    color: #fff
}

.portfolio-hero hgroup {
    text-align: unset;
    height: unset
}

.portfolio-hero hgroup span {
    font-weight: 700
}

.word-rotate {
    display: flex;
    align-items: start;
    flex-direction: column
}

@media (min-width:640px) {
    .word-rotate {
        align-items: center;
        flex-direction: row
    }
}

.rotating-words {
    display: inline-block;
    overflow: hidden;
    vertical-align: middle;
    height: 1.5em
}

.scroll-term {
    display: inline-block;
    transition: transform 0.5s ease, opacity 0.5s ease
}

@media (min-width:640px) {
    .scroll-term {
        text-indent: 10px
    }
}

.project-filter-container {
    background-color: #e8e8e8;
    padding: 30px 20px;
    border-radius: 15px;
    text-align: left;
    box-shadow: rgb(0 0 0 / .1) 0 10px 50px
}

.project-filter-container h3 {
    font-weight: 600;
    padding: 0rem 2rem
}

.project-filter-container #apply-filters:hover {
    background-color: #19b99a;
    box-shadow: 0 2px 4px rgb(0 0 0 / .1);
    transform: translateY(-1px)
}

.project-filter-container #clear-filters:hover {
    background-color: #f7fafc;
    border-color: #cbd5e0;
    color: #2d3748
}

.inner-hero h2 span {
    font-weight: 700
}

#hero-homepage.home {
    min-height: 34rem;
    max-height: 50rem;
    max-width: 100%;
    overflow: auto;
    position: relative;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 95%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 95%, 0% 100%)
}

#hero-homepage.home:after {
    position: absolute;
    bottom: 0;
    z-index: 10;
    width: 100%;
    height: 2.5rem;
    content: "";
    background-color: hsl(255 31% 20%);
    -webkit-clip-path: polygon(0 72%, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 72%, 100% 0, 100% 100%, 0% 100%)
}

#hero-homepage.home:before {
    position: absolute;
    z-index: 1;
    content: "";
    background: radial-gradient(circle at center, rgb(50 35 80 / .7) 0%, rgb(35 25 60 / .9) 70%);
    height: 100%;
    width: 100%;
    opacity: unset
}

#hero-homepage.home video {
    height: 100%;
    width: 100%;
    position: absolute;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 0
}

#hero-homepage.home hgroup {
    height: 100%;
    position: relative;
    z-index: 10;
    padding: 3.5rem 0
}

#hero-homepage.home hgroup h1 {
    color: #FAFAFA;
    max-width: unset;
    letter-spacing: .7px
}

#hero-homepage.home hgroup h1 em {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: -10px;
    -webkit-text-decoration-skip-ink: none;
    text-decoration-skip-ink: none;
    text-decoration-thickness: 20px;
    text-decoration-color: hsl(256 46% 58% / .957)
}

#hero-homepage.home hgroup div.hero-text {
    font-size: .9rem;
    max-width: 20rem;
    color: #FAFAFA;
    font-weight: 300;
    letter-spacing: .3px
}

#hero-homepage.home hgroup .cta a {
    letter-spacing: 1px;
    text-transform: uppercase
}

@media screen and (min-width:40rem) {
    #hero-homepage.home hgroup h1 {
        color: #FAFAFA;
        font-weight: 800
    }

    #hero-homepage.home hgroup div.hero-text {
        font-size: 1rem;
        color: #FAFAFA;
        font-weight: 300;
        max-width: 22rem
    }
}

@media screen and (min-width:60rem) {
    #hero-homepage.home hgroup h1 {
        color: #FAFAFA;
        font-weight: 800
    }

    #hero-homepage.home hgroup div.hero-text {
        font-size: 1.2rem;
        color: #FAFAFA;
        font-weight: 300;
        max-width: 24rem
    }
}

@media screen and (min-width:75rem) {
    #hero-homepage.home hgroup h1 {
        color: #FAFAFA;
        font-weight: 800
    }

    #hero-homepage.home hgroup div.hero-text {
        font-size: 1.5rem;
        color: #FAFAFA;
        font-weight: 300;
        max-width: 28rem
    }
}

@media screen and (min-width:100rem) {
    #hero-homepage.home hgroup h1 {
        color: #FAFAFA;
        font-weight: 800
    }

    #hero-homepage.home hgroup div.hero-text {
        font-size: 1.5rem;
        color: #FAFAFA;
        font-weight: 300;
        max-width: 28rem
    }
}

@media screen and (min-width:60rem) {
    #hero-homepage.home {
        height: 32rem
    }
}

@media screen and (min-width:75rem) {
    #hero-homepage.home {
        height: 41rem
    }
}

@media screen and (min-width:100rem) {
    #hero-homepage.home {
        height: 45rem
    }
}

section.text-image div.text {
    padding: 0 4rem
}

@media screen and (max-width:75rem) {
    section.text-image div.text {
        padding: 0 3rem
    }
}

@media screen and (max-width:60rem) {
    section.text-image div.text {
        padding: 0 2rem
    }
}

section.text-image div.text p {
    margin-top: 25px
}

section.text-image img {
    border-radius: 20px;
    position: relative;
    z-index: 10
}

section.text-image div.uk-flex-first:not(.uk-flex-last\@m) .image {
    height: clamp(500px, 30vw + 22rem, 700px);
    position: relative;
    overflow: visible
}

@media screen and (max-width:40rem) {
    section.text-image div.uk-flex-first:not(.uk-flex-last\@m) .image {
        height: 350px
    }
}

section.text-image div.uk-flex-first:not(.uk-flex-last\@m) .image.image-effect:before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    background-color: #fff0;
    border: 3px solid hsl(256 46% 58% / .957);
    height: 20%;
    width: 20%;
    border-radius: 20px
}

section.text-image div.uk-flex-first:not(.uk-flex-last\@m) .image.image-effect:after {
    content: "";
    position: absolute;
    bottom: -10px;
    right: -10px;
    background: hsl(256 46% 58% / .957);
    height: 40%;
    width: 40%;
    border-radius: 20px;
    z-index: 0
}

section.text-image div.uk-flex-first:not(.uk-flex-last\@m) .image img {
    height: 100%;
    display: inline-block;
    vertical-align: top
}

section.text-image div.uk-flex-first.uk-flex-last\@m .image {
    height: clamp(500px, 30vw + 24rem, 670px);
    position: relative;
    overflow: visible
}

@media screen and (max-width:40rem) {
    section.text-image div.uk-flex-first.uk-flex-last\@m .image {
        height: 350px
    }
}

section.text-image div.uk-flex-first.uk-flex-last\@m .image.image-effect:before {
    content: "";
    position: absolute;
    top: -45px;
    right: -40px !important;
    background-image: radial-gradient(hsl(256 46% 58% / .957) 4px, transparent 0);
    background-size: 35px 35px;
    height: 50%;
    width: 40%
}

section.text-image div.uk-flex-first.uk-flex-last\@m .image.image-effect:after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: -10px;
    background: hsl(256 46% 58% / .957);
    height: 40%;
    width: 40%;
    border-radius: 20px;
    z-index: 0
}

section.text-image img {
    height: 100%;
    display: inline-block;
    vertical-align: top
}

.blendimage img {
    mix-blend-mode: multiply
}

.plans .uk-card {
    border-radius: 1rem
}

.plans .uk-card ul {
    margin: unset;
    margin-left: 1rem
}

.plans .uk-card li i {
    color: hsl(256 35% 51% / .958);
    margin-right: .5rem
}

.plans .uk-card .uk-card-header {
    background-color: hsl(255 31% 20%);
    border-top-right-radius: 1rem;
    border-top-left-radius: 1rem
}

.plans .uk-card .uk-card-header h3 {
    color: #FAFAFA
}

.plans .uk-card .plan-details h3 {
    font-size: 1.5rem;
    font-weight: 700
}

.plans .uk-card .plan-details h4 {
    font-weight: 700;
    font-size: 2rem
}

.plans .uk-card .plan-details h4 em {
    font-size: 1.2rem;
    color: hsl(256 35% 51% / .958);
    opacity: .7
}

.plans .uk-card .plan-details h5 {
    font-size: 1.2rem;
    font-weight: 700;
    opacity: .9
}

.plans .uk-card .plan-details h5 em {
    font-size: 1.2rem;
    color: hsl(256 35% 51% / .958);
    opacity: .7
}

.icon-columns .icons {
    margin-left: 10px
}

.icon-columns .icons li {
    padding-right: 1rem
}

@media (min-width:450px) {
    .icon-columns .icons {
        margin-left: 20px
    }

    .icon-columns .icons li {
        padding-right: 1rem
    }
}

@media (min-width:750px) {
    .icon-columns .icons {
        margin-left: 40px
    }

    .icon-columns .icons li {
        padding-right: 2rem
    }
}

@media (min-width:75rem) {
    .icon-columns .icons {
        margin-left: 70px
    }

    .icon-columns .icons li {
        padding-right: 3rem
    }
}

.icon-columns .icons .fa-li {
    left: -10px;
    top: 2px
}

@media (min-width:25rem) {
    .icon-columns .icons .fa-li {
        top: 6px
    }
}

@media (min-width:60rem) {
    .icon-columns .icons .fa-li {
        top: 9px
    }
}

@media (min-width:75rem) {
    .icon-columns .icons .fa-li {
        left: 10px
    }
}

.award-cards img {
    max-width: 100px
}

.award-cards .uk-child-width-1-2>* {
    max-width: 35%
}

@media (min-width:640px) {
    .award-cards img {
        max-width: 100%
    }

    .award-cards .uk-child-width-1-2>* {
        max-width: 50%
    }
}

.filter-bar {
    border-radius: 20px;
    min-height: 50px;
    margin: 40px 0
}

.filter-bar .uk-flex {
    height: 100%;
    padding: 0rem 2rem
}

.select2-container {
    box-shadow: rgb(0 0 0 / .1) 0 10px 50px;
    padding: .8rem .5rem;
    border-radius: 15px
}

.select2-container .select2-selection--single {
    background-color: #fff0;
    border: 0
}

.select2-container .select2-selection--single span {
    font-weight: 400;
    color: hsl(255 31% 20%) !important
}

.select2-container .select2-selection--single .select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 30%;
    right: 10px;
    width: 20px
}

.contact-form input:where([type=text], [type=email], [type=tel]),
.contact-form select,
.lmg-form input:where([type=text], [type=email], [type=tel]),
.lmg-form select,
.gform_wrapper input:where([type=text], [type=email], [type=tel]),
.gform_wrapper select {
    height: 50px;
    border: unset;
    border: 1px solid #e4e4e4;
    border-radius: 10px
}

.contact-form input:where([type=text], [type=email], [type=tel]):focus,
.contact-form select:focus,
.lmg-form input:where([type=text], [type=email], [type=tel]):focus,
.lmg-form select:focus,
.gform_wrapper input:where([type=text], [type=email], [type=tel]):focus,
.gform_wrapper select:focus {
    border-color: hsl(256 46% 58% / .957);
    outline: none
}

.contact-form textarea,
.lmg-form textarea,
.gform_wrapper textarea {
    resize: none;
    border: unset;
    border: 1px solid #e4e4e4;
    border-radius: 10px
}

.contact-form textarea:focus,
.lmg-form textarea:focus,
.gform_wrapper textarea:focus {
    border-color: hsl(256 46% 58% / .957);
    outline: none
}

.contact-form .gchoice,
.lmg-form .gchoice,
.gform_wrapper .gchoice {
    z-index: 1;
    position: relative;
    margin: 0 0 10px 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: .2rem
}

.contact-form .gchoice label,
.lmg-form .gchoice label,
.gform_wrapper .gchoice label {
    color: hsl(255 31% 20%);
    margin-left: 15px
}

.contact-form .gfield_label,
.lmg-form .gfield_label,
.gform_wrapper .gfield_label {
    color: hsl(255 31% 20%);
    font-size: 1.5rem !important;
    font-weight: 500 !important;
    margin-bottom: 1.1rem !important
}

.contact-form input.gfield-choice-input,
.contact-form input[type=radio],
.lmg-form input.gfield-choice-input,
.lmg-form input[type=radio],
.gform_wrapper input.gfield-choice-input,
.gform_wrapper input[type=radio] {
    z-index: 2;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 20px;
    border-radius: 999px;
    border: .5px solid hsl(256 46% 58% / .957);
    height: 20px;
    background: #fff0;
    transition: 0.3s all ease-in-out;
    position: relative;
    margin-top: unset !important
}

.contact-form input.gfield-choice-input:before,
.contact-form input[type=radio]:before,
.lmg-form input.gfield-choice-input:before,
.lmg-form input[type=radio]:before,
.gform_wrapper input.gfield-choice-input:before,
.gform_wrapper input[type=radio]:before {
    content: "";
    position: absolute;
    top: 14%;
    left: 16%;
    height: 13px;
    width: 13px;
    transform: scale(0);
    border-radius: 9999px;
    transform-origin: center;
    transition: all 0.2s ease-in-out;
    background-color: hsl(256 46% 58% / .957)
}

.contact-form input.gfield-choice-input:checked:before,
.contact-form input[type=radio]:checked:before,
.lmg-form input.gfield-choice-input:checked:before,
.lmg-form input[type=radio]:checked:before,
.gform_wrapper input.gfield-choice-input:checked:before,
.gform_wrapper input[type=radio]:checked:before {
    transform: scale(1)
}

.contact-form div:not(.gchoice, .ginput_container),
.lmg-form div:not(.gchoice, .ginput_container),
.gform_wrapper div:not(.gchoice, .ginput_container) {
    padding-bottom: 1.5rem
}

.contact-form fieldset,
.lmg-form fieldset,
.gform_wrapper fieldset {
    padding-bottom: 1.5rem !important
}

.search-bar input {
    height: 50px;
    border: unset;
    border: 1px solid #e4e4e4
}

.search-bar input:focus,
.search-bar input:hover {
    border-color: hsl(256 46% 58% / .957) !important;
    outline: none
}

.skip-link {
    visibility: hidden;
    position: absolute;
    top: -100%
}

section {
    padding: 2.5rem 0
}

@media screen and (max-width:960px) {
    section {
        padding: 1rem 0
    }
}

@media screen and (max-width:960px) {
    section .main-button {
        align-self: start
    }
}

.columns ul {
    margin: unset
}

article div,
article p,
article span {
    color: hsl(255 31% 20%);
    font-weight: 400
}

article h2,
article h3 {
    margin: 1.2rem 0
}

article a:not(.social-link) {
    position: relative
}

article a:not(.social-link):hover,
article a:not(.social-link):focus,
article a:not(.social-link):active {
    color: hsl(256 46% 58% / .957)
}

article a:not(.social-link):before {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    transform-origin: bottom left;
    height: 1px;
    background-color: hsl(256 46% 58% / .957);
    width: 0;
    transition: 0.4s ease-in-out
}

article a:not(.social-link):hover::before,
article a:not(.social-link):focus::before {
    width: 100%
}

.single-post-header h1 {
    font-size: unset;
    font-size: clamp(1.9rem, 3vw + 1rem, 3.1rem)
}

.single-post-header time {
    color: #FAFAFA;
    opacity: .8;
    position: relative;
    font-size: .85rem
}

.single-post-header small {
    color: #FAFAFA;
    opacity: .9;
    position: relative;
    font-size: .9rem
}

[data-component=the_problem] {
    padding: 5.5rem 0
}

@media screen and (max-width:960px) {
    [data-component=the_problem] {
        padding: 2.5rem 0
    }
}

[data-component=the_solution] .green-separator {
    height: 1.9px;
    width: 150px;
    background-color: #00C2AF
}

[data-component=the_solution] .fa-ul {
    margin-left: 3.5rem
}

[data-component=the_solution] .fa-ul .fa-li {
    left: -2.7rem
}

[data-component=the_solution] li {
    color: hsl(255 31% 20%);
    font-weight: 300;
    margin: .9rem 0
}

[data-component=the_solution] h3 {
    color: hsl(255 31% 20%);
    font-size: 1.5rem;
    font-weight: 700
}

@media screen and (max-width:960px) {
    [data-component=project-gallery] {
        padding: 2.5rem 0
    }
}

[data-component=before-after] {
    transform: translateY(-2px)
}

@media screen and (max-width:960px) {
    [data-component=before-after] {
        padding-top: 2.5rem;
        padding-bottom: 4.5rem
    }
}

[data-component=before-after] .uk-card-body {
    padding: unset
}

[data-component=before-after] h2 {
    color: #FAFAFA;
    margin: 20px 0;
    font-weight: 400
}

[data-component=before-after] .uk-card {
    height: 700px;
    border-radius: 25px;
    width: 100%
}

@media screen and (max-width:640px) {
    [data-component=before-after] .uk-card {
        height: 350px
    }
}

[data-component=before-after] .line {
    width: 100px;
    height: 1px;
    margin: 20px auto 40px auto;
    border-bottom: 1px solid #fff
}

[data-component=before-after] img {
    max-width: unset;
    width: 100%;
    height: 100%;
    display: block;
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none
}

[data-component=before-after] .container {
    width: 50%;
    display: block;
    margin: 30px auto
}

[data-component=before-after] #before-after-slider {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    border: .5px solid #FAFAFA;
    border-radius: 25px
}

[data-component=before-after] img {
    -o-object-fit: cover;
    object-fit: cover
}

[data-component=before-after] #after-image {
    display: block;
    height: 100%
}

[data-component=before-after] #before-image {
    position: absolute;
    height: 100%;
    width: 50%;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: 2
}

[data-component=before-after] #resizer {
    position: absolute;
    display: flex;
    align-items: center;
    z-index: 5;
    top: 0;
    left: 50%;
    height: 100%;
    width: .6px;
    background: #fff;
    touch-action: pan-y
}

[data-component=before-after] #resizer:after {
    background: linear-gradient(62deg, hsl(256 46% 58% / .957) 5%, hsl(255 31% 20%));
    font-family: "Font Awesome 5 Free";
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M6.45 17.45L1 12l5.45-5.45l1.41 1.41L4.83 11h14.34l-3.03-3.04l1.41-1.41L23 12l-5.45 5.45l-1.41-1.41L19.17 13H4.83l3.03 3.04z'/%3E%3C/svg%3E");
    font-weight: 900;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    position: absolute;
    margin: 0 0 0 -22px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #FAFAFA
}

[data-component=project-gallery] .uk-grid div.grid-item:nth-of-type(3n) {
    width: 100%;
    height: 650px
}

[data-component=project-gallery] .uk-grid div.grid-item:nth-of-type(3n) .uk-cover-container {
    height: 100%
}

[data-component=project-gallery] div.uk-cover-container {
    border-radius: 20px
}

.project-card {
    position: relative;
    box-shadow: inset 0 -140px 88px -18px hsl(255 31% 20%);
    border-radius: 20px;
    height: 500px;
    align-content: end
}

.project-card a {
    text-decoration: none
}

.project-card::before {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    border-radius: 20px
}

.project-card h3 {
    color: #FAFAFA
}

.portfolio-item a {
    text-decoration: none
}

.image-banner {
    padding: unset
}

.image-banner img {
    width: 100%
}

main .layouts section:first-of-type {
    margin-top: 2rem
}

.circle {
    height: 200px;
    width: 200px;
    background-color: hsl(256 46% 58% / .957);
    border-radius: 999999px
}

section.faqs p strong {
    color: hsl(256 100% 78% / .958)
}

section.faqs a.drop {
    text-decoration: none !important
}

a.drop {
    text-decoration: none !important
}

.recent-posts a {
    text-decoration: none !important
}

.sitemap h2 {
    font-size: 1.8rem
}

.sitemap a {
    color: #242424;
    opacity: .79;
    text-decoration: none;
    transition: 0.2s ease
}

.sitemap a:hover,
.sitemap a:focus {
    color: hsl(256 35% 51% / .958);
    opacity: 1
}

.page-content.error-404 {
    min-height: 55vh;
    display: flex;
    justify-content: center;
    align-items: center
}

.page-content.error-404 h1,
.page-content.error-404 p {
    color: hsl(255 31% 20%)
}

.page-content.error-404 h1 {
    margin-top: unset
}

.prose {
    color: #242424;
    max-width: 65ch;
    line-height: 1.75
}

.prose h1 {
    color: #FAFAFA;
    font-weight: 800;
    font-size: 2.25em;
    margin-top: 0;
    margin-bottom: 1rem;
    line-height: 1.1
}

.prose h2 {
    color: hsl(255 31% 20%);
    font-weight: 700;
    font-size: 1.5em;
    margin-top: 2em;
    margin-bottom: 1rem;
    line-height: 1.333
}

.prose h3,
.prose h3 a {
    color: #242424;
    font-weight: 600;
    font-size: 1.25em;
    margin-top: 1.6em;
    margin-bottom: .6em;
    text-decoration: none
}

.prose h4 {
    color: #242424;
    font-weight: 600;
    margin-top: 1.5em;
    margin-bottom: .5em
}

.prose p {
    margin-top: 1.25em;
    margin-bottom: 1.25em
}

.prose ul,
.prose ol {
    margin-top: 1.25em;
    margin-bottom: 1.25em;
    padding-left: 1.625em
}

.prose li {
    margin-top: .5em;
    margin-bottom: .5em
}

.prose ul li::marker {
    color: #3b3e43
}

.prose ol li::marker {
    color: #3b3e43
}

.prose a {
    color: hsl(256 46% 58% / .957) !important;
    text-decoration: underline;
    font-weight: 500
}

.prose a:before {
    display: none
}

.prose a span {
    color: hsl(256 46% 58% / .957)
}

.prose a:hover {
    color: hsl(256 100% 78% / .958)
}

.prose code {
    color: #111827;
    font-family: ui-monospace, SFMono-Regular, monospace;
    font-size: .875em;
    background-color: #F3F4F6;
    padding: .2em .4em;
    border-radius: .25em
}

.prose pre {
    color: #F9FAFB;
    background-color: #1F2937;
    overflow-x: auto;
    font-size: .875em;
    line-height: 1.7;
    margin-top: 1.7em;
    margin-bottom: 1.7em;
    border-radius: .5em;
    padding: 1em
}

.prose pre code {
    background-color: #fff0;
    border-width: 0;
    border-radius: 0;
    padding: 0;
    color: inherit
}

.prose blockquote {
    font-weight: 500;
    font-style: italic;
    color: #374151;
    border-left: .25rem solid #E5E7EB;
    padding-left: 1em;
    margin-top: 1.6em;
    margin-bottom: 1.6em
}

.prose hr {
    border-color: #E5E7EB;
    border-top-width: 1px;
    margin-top: 3em;
    margin-bottom: 3em
}

.prose img {
    margin-top: 2em;
    margin-bottom: 2em;
    border-radius: .5rem
}

.prose span {
    color: hsl(255 31% 20%)
}

.prose span em {
    color: hsl(255 31% 20%)
}

.blog a {
    text-decoration: none !important
}

.search-page h2 {
    font-size: 25px;
    color: hsl(255 31% 20%)
}

.search-page a {
    text-decoration: none !important
}

.uk-container-xlarge {
    max-width: 100rem
}

.uk-container {
    padding-left: 1rem;
    padding-right: 1rem
}

@media screen and (max-width:1070px) {
    .uk-visible\@m {
        display: none
    }

    .uk-hidden\@m {
        display: flex !important
    }
}

.alignleft {
    float: left
}

.alignright {
    float: right
}

@media (prefers-reduced-motion:no-preference) {
    @view-transition {
        navigation: normal
    }
}

.portfolio-hero-image {
    -o-object-fit: cover;
    object-fit: cover;
    transform-origin: center center;
    transition: transform 0.6s cubic-bezier(.33, 1, .68, 1);
    will-change: transform
}

.section-subtitle {
    position: relative;
    padding-left: 2rem
}

.section-subtitle::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1.5rem;
    height: 2px;
    background: linear-gradient(to right, #8B7FBA, transparent);
    transform: translateY(-50%)
}

.card-title {
    background: linear-gradient(90deg, #FAFAFA, hsl(256 100% 78% / .958));
    -webkit-background-clip: text;
    -webkit-text-fill-color: #fff0;
    font-weight: 700
}

.uk-container-xxsmall {
    max-width: 600px
}

.split-section {
    background: #f2f2f2;
    background: linear-gradient(180deg, #f2f2f2 70%, #FAFAFA 30%)
}