@layer framework, resets, utils, intern, connor, zoe;
@import 'bootstrap.styles.css'; /* wrapped in an @layer framework */
@font-face {font-family:'Catamaran';font-display:swap;font-style:normal;font-weight:300;src:url(https://injurycareco.exceleron.dev/catamaran-light.ttf) format('truetype');}
@font-face {font-family:'Catamaran';font-display:swap;font-style:normal;font-weight:400;src:url(https://injurycareco.exceleron.dev/catamaran-regular.ttf) format('truetype');}
@font-face {font-family:'Catamaran';font-display:swap;font-style:normal;font-weight:500;src:url(https://injurycareco.exceleron.dev/catamaran-medium.ttf) format('truetype');}
@font-face {font-family:'Catamaran';font-display:swap;font-style:normal;font-weight:600;src:url(https://injurycareco.exceleron.dev/catamaran-semibold.ttf) format('truetype');}
@font-face {font-family:'Catamaran';font-display:swap;font-style:normal;font-weight:700;src:url(https://injurycareco.exceleron.dev/catamaran-bold.ttf) format('truetype');}

@font-face {font-family:'Nunito Sans';font-display:swap;font-style:normal;font-weight:200 1000;src:url(https://injurycareco.exceleron.dev/assets/files/nunitosans-variablefont-ytlc_opsz_wdth_wght.ttf) format('truetype');}
@font-face {font-family:'Nunito Sans';font-display:swap;font-style:italic;font-weight:200 1000;src:url(https://injurycareco.exceleron.dev/assets/files/nunitosans-italic-variablefont-ytlc_opsz_wdth_wght.ttf) format('truetype');}
@font-face {font-family:'Caveat';font-display:block;font-style:normal;font-weight:400 600;src:url(https://injurycareco.exceleron.dev/caveat.variable.ttf) format('truetype');}

 
 
 
 
 
 
 
 
 
 
 
:root {
    --bs-primary-rgb: 0, 114, 188;
    --bs-primary-hsl: 204 100% 36.9%;
    --bs-primary-hex: #0072bc;
    --bs-primary: rgb(0, 114, 188);
    --bs-secondary-rgb: 128, 137, 146;
    --bs-secondary-hsl: 210 7.6% 53.7%;
    --bs-secondary-hex: #808992;
    --bs-secondary: rgb(128, 137, 146);
    --bs-secondary-bg-rgb: 249, 249, 249;
    --bs-secondary-bg-hsl: 0 0% 97.6%;
    --bs-secondary-bg-hex: #f9f9f9;
    --bs-secondary-bg: rgb(249, 249, 249);
    --bs-secondary-border-rgb: 231, 231, 231;
    --bs-secondary-border-hsl: 0 0% 90.6%;
    --bs-secondary-border-hex: #e7e7e7;
    --bs-secondary-border: rgb(231, 231, 231);
    --bs-tertiary-rgb: 30, 45, 59;
    --bs-tertiary-hsl: 209 32.6% 17.5%;
    --bs-tertiary-hex: #1e2d3b;
    --bs-tertiary: rgb(30, 45, 59);
    --bs-light-rgb: 242, 248, 252;
    --bs-light-hsl: 204 62.5% 96.9%;
    --bs-light-hex: #f2f8fc;
    --bs-light: rgb(242, 248, 252);
    --bs-dark-rgb: 33, 33, 36;
    --bs-dark-hsl: 240 4.3% 13.5%;
    --bs-dark-hex: #212124;
    --bs-dark: rgb(33, 33, 36);
    --bs-heading-color-rgb: 33, 33, 36;
    --bs-heading-color-hsl: 240 4.3% 13.5%;
    --bs-heading-color-hex: #212124;
    --bs-heading-color: rgb(33, 33, 36);
    --bs-dark-bg-rgb: 0, 0, 0;
    --bs-dark-bg-hsl: 0 0% 0%;
    --bs-dark-bg-hex: #000;
    --bs-dark-bg: rgb(0, 0, 0);
    --bs-warning-rgb: 255, 210, 64;
    --bs-warning-hsl: 46 100% 62.5%;
    --bs-warning-hex: #ffd240;
    --bs-warning: rgb(255, 210, 64);
    --bs-dark-bg-subtle-rgb: 30, 45, 59;
    --bs-dark-bg-subtle-hsl: 209 32.6% 17.5%;
    --bs-dark-bg-subtle-hex: #1e2d3b;
    --bs-dark-bg-subtle: rgb(30, 45, 59);
}
/* Separated so there wasn't as much error listing with the correct */
:root {
    --nunito: "Nunito Sans", sans-serif;
    --caveat: "Caveat", cursive;
    --catamaran: "Catamaran", sans-serif;
    --blue-trans: rgba(var(--bs-primary-rgb), 0.3);
    --blue-darktrans: rgba(var(--bs-primary-rgb), 0.7);
    --size: 0.25em;
    --focus: 0 0 0 0.2em var(--blue_trans);
    --focus-dark: 0 0 0 0.25em var(--blue_darktrans);
    --focus-white: 0 0 0 var(--size) rgba(255, 255, 255, 0.45);
    --focus-white-large: 0 0 0 0.4em rgba(255, 255, 255, 0.45);
    --sm: 35px;
    --md: 85px;
    --lg: 120px;
    --display-1: 60px;
    --display-2:50px;
    --fz-title-1: 42px;
    --fz-title-2: 32px;
    --fz-title-3: 24px;
    --fz-title-4: 21px;
    --fz-title-5: 18px;
    --fz-title-6: 16px;
    --bs-border-radius: 10px;
    --fz-content-base: var(--fz-title-6);
    --bs-body-color: var(--bs-secondary);
    --bs-font-sans-serif: var(--catamaran);
    font-size: var(--fz-content-base);
}
@media (min-width:768px) {
    :root {
        --fz-title-1: 54px;
        --display-1: 82px;
        --display-2: 72px;
    }
}
@media (min-width:992px) {
    :root {
        --display-1: 94px;
    }
}
@media (min-width:1200px) {
    :root {
        --display-1: 108px;
    }
}
@layer resets {
    body{
        letter-spacing: 0.025em;
        width:100%;
        overflow-x:hidden;
    }
    .fst-oblique{
        font-style: oblique 20deg;
    }
    h1,h2,h3,h4,h5,h6,
    .h1,.h2,.h3,.h4,.h5,.h6 {
        font-family: var(--nunito);
    }
    .display-1 {
        font-family: var(--caveat);
        font-size: var(--display-1);
        line-height: calc(96 / 108);
        font-weight: 400;
    }
    .display-2{
        font-family: var(--nunito);
        font-size: var(--display-2);
        line-height: 1;
        font-weight: 700;
    }
    h1, .h1{
        font-family: var(--nunito);
        font-size: var(--fz-title-1);
        line-height: calc(64 / 54);
        font-weight: 400;
    }
    h2, .h2{
        font-family: var(--nunito);
        font-size: var(--fz-title-2);
        line-height: calc(40 / 32);
        font-weight: 400;
    }
    h3, .h3{
        font-family: var(--nunito);
        font-size: var(--fz-title-3);
        line-height: calc(34 / 24);
        font-weight: 400;
    }
    h4, .h4{
        font-size: var(--fz-title-4);
        line-height: calc(30 / 21);
        font-weight: 400;
    }
    h5, .h5{
        font-size: var(--fz-title-5);
        line-height: 30px;
        font-weight: 400;
    }
    h6, .h6{
        font-size: var(--fz-title-6);
        font-weight: 400;
    }
    .btn{
        --bs-btn-padding-x: 1.5rem;
        border-radius:30px;
        border-width:2px;
        letter-spacing:0.025em;
        font-size:21px;
        &:is(input){
            --bs-btn-padding-x: .5rem;
        }
    }
    .btn-sm{
        font-size:16px;
        letter-spacing: 0.025em;
    }
    .btn-primary {
        --bs-btn-color: #fff;
        --bs-btn-bg: var(--bs-primary);
        --bs-btn-border-color: var(--bs-primary);
        --bs-btn-hover-color: var(--bs-primary);
        --bs-btn-hover-bg: #fff;
        --bs-btn-hover-border-color: var(--bs-primary);
        --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
        --bs-btn-active-color: var(--bs-primary);
        --bs-btn-active-bg: #fff;
        --bs-btn-active-border-color: var(--bs-primary);
        --bs-btn-active-shadow: inset 0 3px 5px rgba(var(--bs-primary-rgb), 0.125);
        --bs-btn-disabled-color: #fff;
        --bs-btn-disabled-bg: var(--bs-primary);
        --bs-btn-disabled-border-color:var(--bs-primary);
    }
    .btn-outline-primary {
        --bs-btn-color: var(--bs-primary);
        --bs-btn-border-color: var(--bs-primary);
        --bs-btn-hover-color: #fff;
        --bs-btn-hover-bg: var(--bs-primary);
        --bs-btn-hover-border-color: var(--bs-primary);
        --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
        --bs-btn-active-color: #fff;
        --bs-btn-active-bg: var(--bs-primary);
        --bs-btn-active-border-color: var(--bs-primary);
        --bs-btn-active-shadow: inset 0 3px 5px rgba(var(--bs-primary-rgb), 0.125);
        --bs-btn-disabled-color: var(--bs-primary);
        --bs-btn-disabled-bg: transparent;
        --bs-btn-disabled-border-color: var(--bs-primary);
        --bs-gradient: none;
    }
    .btn-light {
        --bs-btn-color: var(--bs-primary);
        --bs-btn-bg: #fff;
        --bs-btn-border-color: #fff;
        --bs-btn-hover-color: #fff;
        --bs-btn-hover-bg: var(--bs-primary);
        --bs-btn-hover-border-color: #fff;
        --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
        --bs-btn-active-color: #fff;
        --bs-btn-active-bg: var(--bs-primary);
        --bs-btn-active-border-color: #fff;
        --bs-btn-active-shadow: inset 0 3px 5px rgba(var(--bs-primary-rgb), 0.125);
        --bs-btn-disabled-color: var(--bs-primary);
        --bs-btn-disabled-bg: #fff;
        --bs-btn-disabled-border-color: #fff;
    }
    .btn-warning {
        --bs-btn-color: #000;
        --bs-btn-bg: var(--bs-warning);
        --bs-btn-border-color: var(--bs-warning);
        --bs-btn-hover-color: var(--bs-warning);
        --bs-btn-hover-bg: #000;
        --bs-btn-hover-border-color: var(--bs-warning);
        --bs-btn-focus-shadow-rgb: var(--bs-warning-rgb);
        --bs-btn-active-color: var(--bs-warning);
        --bs-btn-active-bg: #000;
        --bs-btn-active-border-color: var(--bs-warning);
        --bs-btn-active-shadow: inset 0 3px 5px rgba(var(--bs-warning-rgb), 0.125);
        --bs-btn-disabled-color: #000;
        --bs-btn-disabled-bg: var(--bs-warning);
        --bs-btn-disabled-border-color: var(--bs-warning);
    }
}

@layer utils {
    img {
        max-width: 100%;
        height: auto;
    }
    .pt-sm,
    .py-sm {
        padding-top: var(--sm);
    }
    .pb-sm,
    .py-sm {
        padding-bottom: var(--sm);
    }
    .pt-md,
    .py-md {
        padding-top: var(--md);
    }
    .pb-md,
    .py-md {
        padding-bottom: var(--md);
    }
    .pt-lg,
    .py-lg {
        padding-top: var(--lg);
    }
    .pb-lg,
    .py-lg {
        padding-bottom: var(--lg);
    }
    .mt-sm,
    .my-sm {
        margin-top: var(--sm);
    }
    .mb-sm,
    .my-sm {
        margin-bottom: var(--sm);
    }
    .mt-md,
    .my-md {
        margin-top: var(--md);
    }
    .mb-md,
    .my-md {
        margin-bottom: var(--md);
    }
    .mt-lg,
    .my-lg {
        margin-top: var(--lg);
    }
    .mb-lg,
    .my-lg {
        margin-bottom: var(--lg);
    }
    @media (min-width: 576px) {
        .pt-sm-mob,
        .py-sm-mob {
            padding-top: var(--sm);
        }
        .pb-sm-mob,
        .py-sm-mob {
            padding-bottom: var(--sm);
        }
        .pt-md-mob,
        .py-md-mob {
            padding-top: var(--md);
        }
        .pb-md-mob,
        .py-md-mob {
            padding-bottom: var(--md);
        }
        .pt-lg-mob,
        .py-lg-mob {
            padding-top: var(--lg);
        }
        .pb-lg-mob,
        .py-lg-mob {
            padding-bottom: var(--lg);
        }
        .mt-sm-mob,
        .my-sm-mob {
            margin-top: var(--sm);
        }
        .mb-sm-mob,
        .my-sm-mob {
            margin-bottom: var(--sm);
        }
        .mt-md-mob,
        .my-md-mob {
            margin-top: var(--md);
        }
        .mb-md-mob,
        .my-md-mob {
            margin-bottom: var(--md);
        }
        .mt-lg-mob,
        .my-lg-mob {
            margin-top: var(--lg);
        }
        .mb-lg-mob,
        .my-lg-mob {
            margin-bottom: var(--lg);
        }
    }
    @media (min-width: 768px) {
        .pt-sm-tab,
        .py-sm-tab {
            padding-top: var(--sm);
        }
        .pb-sm-tab,
        .py-sm-tab {
            padding-bottom: var(--sm);
        }
        .pt-md-tab,
        .py-md-tab {
            padding-top: var(--md);
        }
        .pb-md-tab,
        .py-md-tab {
            padding-bottom: var(--md);
        }
        .pt-lg-tab,
        .py-lg-tab {
            padding-top: var(--lg);
        }
        .pb-lg-tab,
        .py-lg-tab {
            padding-bottom: var(--lg);
        }
        .mt-sm-tab,
        .my-sm-tab {
            margin-top: var(--sm);
        }
        .mb-sm-tab,
        .my-sm-tab {
            margin-bottom: var(--sm);
        }
        .mt-md-tab,
        .my-md-tab {
            margin-top: var(--md);
        }
        .mb-md-tab,
        .my-md-tab {
            margin-bottom: var(--md);
        }
        .mt-lg-tab,
        .my-lg-tab {
            margin-top: var(--lg);
        }
        .mb-lg-tab,
        .my-lg-tab {
            margin-bottom: var(--lg);
        }
    }
    @media (min-width: 992px) {
        .pt-sm-lap,
        .py-sm-lap {
            padding-top: var(--sm);
        }
        .pb-sm-lap,
        .py-sm-lap {
            padding-bottom: var(--sm);
        }
        .pt-md-lap,
        .py-md-lap {
            padding-top: var(--md);
        }
        .pb-md-lap,
        .py-md-lap {
            padding-bottom: var(--md);
        }
        .pt-lg-lap,
        .py-lg-lap {
            padding-top: var(--lg);
        }
        .pb-lg-lap,
        .py-lg-lap {
            padding-bottom: var(--lg);
        }
        .mt-sm-lap,
        .my-sm-lap {
            margin-top: var(--sm);
        }
        .mb-sm-lap,
        .my-sm-lap {
            margin-bottom: var(--sm);
        }
        .mt-md-lap,
        .my-md-lap {
            margin-top: var(--md);
        }
        .mb-md-lap,
        .my-md-lap {
            margin-bottom: var(--md);
        }
        .mt-lg-lap,
        .my-lg-lap {
            margin-top: var(--lg);
        }
        .mb-lg-lap,
        .my-lg-lap {
            margin-bottom: var(--lg);
        }
    }
    @media (min-width: 1200px) {
        .pt-sm-desk,
        .py-sm-desk {
            padding-top: var(--sm);
        }
        .pb-sm-desk,
        .py-sm-desk {
            padding-bottom: var(--sm);
        }
        .pt-md-desk,
        .py-md-desk {
            padding-top: var(--md);
        }
        .pb-md-desk,
        .py-md-desk {
            padding-bottom: var(--md);
        }
        .pt-lg-desk,
        .py-lg-desk {
            padding-top: var(--lg);
        }
        .pb-lg-desk,
        .py-lg-desk {
            padding-bottom: var(--lg);
        }
        .mt-sm-desk,
        .my-sm-desk {
            margin-top: var(--sm);
        }
        .mb-sm-desk,
        .my-sm-desk {
            margin-bottom: var(--sm);
        }
        .mt-md-desk,
        .my-md-desk {
            margin-top: var(--md);
        }
        .mb-md-desk,
        .my-md-desk {
            margin-bottom: var(--md);
        }
        .mt-lg-desk,
        .my-lg-desk {
            margin-top: var(--lg);
        }
        .mb-lg-desk,
        .my-lg-desk {
            margin-bottom: var(--lg);
        }
    }
}

@layer connor {
    .star-rating {
    font-size: 24px;
    svg {
        font-size: 21px;
        max-width: 0.95em;
    }
}
.text-bg-white {
    background-color: white;
    color: var(--bs-dark)
}
.outer-top-right {
    top: -3rem;
    right: 0;
    @media (min-width: 992px) {
        right: -3rem;
    }
}
body:has(.fred--sidebar:not(.fred--hidden)) {
    padding-left: 80px;
    transition: padding-left 0.25s ease;
}
.top-nav-flyout {
    background-color: var(--bs-primary);
}
.top-nav-flyout .offcanvas-body a {
    /** Overriding zoe's layer */
    color: white !important;
    &:hover{
        color:var(--bs-warning) !important;
    }
    &:focus{
        color:var(--bs-warning) !important;
    }
}
.top-nav-flyout li:not(:last-child):not(:has(li)) {
    border-bottom: 1px solid #fff;
}
.virtual-tour-modal {
    max-height: 600px;
    height: fit-content;
    overflow: visible;
    iframe {
        max-width: 100%;
    }
    button {
        font-size: 2rem;
        aspect-ratio: 1;
    }
    &::backdrop {
        background-color: rgba(0 0 0 / 60%);
    }
}
.location-container {
    display: grid;
    grid-template-columns: 1fr;
    @media (min-width: 992px) {
        grid-template-columns: max-content 1fr;
    }
    [data-is-active] {
        background-color: var(--bs-secondary-bg-subtle);
    }
    .location-list {
        grid-column: 1;
    }
    .location-card .card-body {
        display: grid;
        grid-template-columns: 1fr 1fr max-content;
        gap:.5rem;
        grid-template-areas: 'address address icons'
                                'contact contact contact' 'links links links';
        .address {
            grid-area: address;
        }
        .icons {
            grid-area: icons;
        }
        .contact {
            grid-area: contact;
        }
        .links {
            grid-area: links;
            align-self:end;
            display: flex;
            gap: 1ch;
        }
        @media (min-width:576px){
            grid-template-areas: 'address address icons'
                                'contact . links';
        }
    }
}
#map {
    height: 100%;
    min-height: 400px;
}
.location-container{
    & #map {
        min-height: 500px;
        @media (min-width:576px){
            min-height: 400px;
        }
    }
}
.rounded-box {
    border-radius: 4px;
}

.mega-content{
    & .vr{
        background-color:#bfc6d5;
        opacity:1;
    }
    & hr{
        border-color:#bfc6d5;
        opacity:1;
        margin: 2rem 0;
    }
} 
.nav-title{
    color:var(--bs-dark);
    margin-bottom:8px;
    font-weight:700;
}
.dropdown-menu{
    --bs-dropdown-border-radius: 0;
    --bs-dropdown-spacer: 0px;
    border:none;
    &[data-bs-popper]{
        right:0;
    }
    @media (min-width: 992px) {
        --bs-dropdown-padding-y: 3.5rem;
    }
}
.third-nav-link{
    line-height:1;
    color:var(--bs-primary);
    transition: color 0.3s ease-in-out;
    text-decoration:none;
    font-weight:700;
    &:hover{
        color:var(--bs-dark);
    }
    &:focus{
        color:var(--bs-dark);
    }
    &.active{
        color:var(--bs-dark);
    }
}
.plain-nav-link{
    line-height:1;
    color:var(--bs-dark);
    transition: color 0.3s ease-in-out;
    &:hover{
        color:var(--bs-primary);
    }
    &:focus{
        color:var(--bs-primary);
    }
    &.active{
        color:var(--bs-primary);
    }
}
.dropdown-menu:has(.mega-content) {
    --bs-dropdown-spacer: 0 !important;
    --bs-dropdown-bg: white !important;
}
.top-nav-flyout li:has(+ li [data-type="button"]) {
    border-bottom: unset;
}
.top-nav-flyout a[data-type="button"] {
    background-color: var(--bs-dark);
    color: white;
    border-radius: calc(Infinity * 1px);
    border: 1px solid var(--bs-dark);
    padding: 0.75rem 1.3rem;
    display: inline-block;
    margin-top: 1ch;
    text-align: center;
    font-weight:700;
    @media (min-width:576px){
        width:70%;
    }

    &:hover {
        border-color: white;
        background-color: white;
        color: var(--bs-dark) !important;
    }
    svg {
        --fa-display: none !important;
    }
}
.mega-menu-grid {
    display: grid;
    gap: 15px;
    .vertical {
        display: none;
    }
    @media (min-width: 1400px) {
        grid-template-columns: 1fr auto 3fr;
        .vertical {
            display: initial;
        }
    }
}
.over-link {
    position: relative;
    z-index: 1000;
}
}

@layer zoe {
    .social-media a{
    font-size:var(--fz-title-5);
    color:var(--bs-dark);
    &:hover {
        color: var(--bs-primary);
    }
    &:focus {
        color: var(--bs-primary);
    }
}
.btn-close{
    --bs-btn-close-bg: ;
    --bs-btn-close-opacity: 1;
    --bs-btn-close-hover-opacity: 1;
    --bs-btn-close-focus-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
    font-size:var(--fz-title-4);
    line-height:1;
    width:Auto;
    height:auto;
    transition: color 0.3s ease;
}
.navbar{
    --bs-navbar-padding-y: 0;
    --bs-navbar-color: var(--bs-dark);
    --bs-navbar-toggler-icon-bg: ;
    --bs-navbar-toggler-font-size: 30px;
    --bs-navbar-brand-padding-y: 0px;
    --bs-navbar-toggler-padding-y: 0.5rem;
    --bs-navbar-hover-color: var(--bs-primary);
    --bs-navbar-active-color: var(--bs-primary);
    --bs-nav-link-font-size:15px;
    --bs-navbar-nav-link-padding-x: 0.3rem;
    --bs-navbar-toggler-border-color: var(--bs-dark);
    & .navbar-toggler{
        line-height:1;
        padding-top:.6rem;
    }
    & .navbar-nav{
        --bs-nav-link-font-weight: 400;
    }
    & .border-bottom{
        --bs-border-color: rgb(187, 201, 215);
    }
    & .top-nav{
        & a{
            text-transform:uppercase;
            text-decoration:none;
            color:var(--bs-dark);
            font-size:13px;
            font-weight:600;
            line-height:38px;
            font-family:var(--nunito);
            transition: color 0.3s ease;
            &:hover{
                color:var(--bs-primary);
            }
            &:focus{
                color:var(--bs-primary);
            }
            &.active{
                color: var(--bs-primary);
            }
        }
        & div{
            color: var(--bs-dark);
            font-size: 13px;
            font-weight: 600;
            line-height: 38px;
            font-family: var(--nunito);
        }
    }
    & .navbar-brand {
        margin-right:0;
        & svg {
            width: auto;
            height: 86px;
            @media (min-width:576px){
                height: 90px;
            }
        }
    }
    & .nav-link{
        text-transform:uppercase;
        font-family:var(--nunito);
    }
    & .dropdown-toggle{
        &::after{
            display:none;
        }
    }
    & .dropdown-menu{
        --bs-dropdown-padding-y: 1rem;
        --bs-dropdown-bg: var(--bs-dark);
        --bs-dropdown-border-radius: 0;
        --bs-dropdown-link-color: var(--bs-secondary);
        --bs-dropdown-link-hover-color: #fff;
        --bs-dropdown-link-hover-bg: var(--bs-dark);
        --bs-dropdown-border-width: 0;
        --bs-dropdown-link-active-color: #fff;
        --bs-dropdown-link-active-bg: var(--bs-dark);
        & .dropdown-item{
            font-size:16px;
            transition: color 0.3s ease;
            @media (min-width:1400px){
                font-size: 14px;
            }
        }
        @media (min-width:1400px){
            --bs-dropdown-spacer: 26px;
        }
    }
    & .btn{
        text-transform:uppercase;
        font-size:16px;
        --bs-btn-padding-x: 1.3rem;
        --bs-btn-padding-y: 0.75rem;
    }
    @media (min-width:1470px){
        --bs-navbar-nav-link-padding-x: 0.75rem;
    }
}
.offcanvas:is([data-bs-theme=dark]){
    --bs-body-bg: var(--bs-dark);
    --bs-offcanvas-border-color: rgba(var(--bs-dark-rgb), 0.15);
    & .offcanvas-title{
        color:#fff;
        font-size: var(--fz-title-4);
        text-transform:uppercase;
        font-weight:700;
        font-family: var(--nunito);
    }
    & .navbar-toggler-v2{
        font-size: var(--fz-title-4);
        padding: calc(var(--bs-offcanvas-padding-y) * .5) calc(var(--bs-offcanvas-padding-x) * .5);
        &:hover {
            color: var(--bs-warning);
        }
        &:focus {
            color: var(--bs-warning);
        }
    }
    & .btn-close{
        color:#fff;
        filter:unset;
        &:hover {
            color: var(--bs-warning);
        }
        &:focus {
            color: var(--bs-warning);
        }
    }
    & .offcanvas-body{
        & .dropdown-header{
            text-transform:uppercase;
            font-size: 14px;
            font-family: var(--nunito);
            color:#fff;
            font-weight:700;
        }
        & a{
            color:var(--bs-secondary);
            font-size: 16px;
            padding: 0.65rem 0;
            transition: color 0.3s ease;
            font-weight:700;
            &:hover{
                color:#fff;
            }
            &:focus {
                color: #fff;
            }
            &.active {
                color: #fff;
            }
            @media (min-width:1400px){
                font-size: 14px;
            }
        }
    }
}
footer{
    overflow:hidden;
    position:relative;
    padding-top:var(--md);
    padding-bottom:1rem;
    & .footer-bkg{
        z-index:1;
        position:absolute;
        opacity:.05;
        top:0%;
        left:15px;
        right:15px;
        display:none;
        @media (min-width:768px) {
            top: -20%;
            display:block;
        }
        @media (min-width:992px) {
            top: -40%;
        }
        @media (min-width:1200px){
            top: -60%;
        }
    }
    & .overlay-row + .footer-bkg{
        top:unset;
        bottom:7%;
    }
    & .overlay-row{
        z-index:3;
        position:relative;
    }
    & hr{
        color:rgb(40, 39, 40);
        opacity:1;
    }
    & .copyright{
        color:var(--bs-secondary);
        font-size:13px;
        line-height:28px;
        margin-bottom:0;
        & a{
            color:inherit;
        }
    }
    & .social-media {
        & a{
            color:var(--bs-secondary);
            font-size:15px;
        }
    }
    & .foot-nav-grid{
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        position:relative;
        row-gap:30px;
        column-gap:30px;
        & .footer-item{
            position:relative;
            grid-column: span 1;
            &:first-child{
                grid-row: 1 / span 1;
            }
            &:nth-child(2){
                grid-row: span 4;
            }
            &:nth-child(3){
                grid-row:span 1;
            }
            &:nth-child(4){
                grid-row: span 2;
            }
            &:nth-child(5){
                grid-row: span 3;
            }
            &:nth-child(6){
                grid-row: span 2;
            }
            & .footer-title{
                color:#fff;
                font-family:var(--nunito);
                line-height:28px;
                margin-bottom:0px;
            }
            & ul{
                margin-bottom:0
            }
            & .footer-link{
                color: var(--bs-secondary);
                font-size: var(--fz-title-6);
                line-height:30px;
                text-decoration: none;
                padding: 0.25rem 0;
                transition: color 0.3s ease;
                &:hover {
                    color: #fff;
                }
                &:focus {
                    color: #fff;
                }
            }
            @media (min-width:576px){
                &:first-child {
                    grid-row: span 2;
                }
                &:nth-child(2) {
                    grid-row: span 5;
                }
                &:nth-child(3) {
                    grid-row: span 3;
                }
                &:nth-child(4) {
                    grid-row: span 2;
                }
                &:nth-child(5) {
                    grid-row: span 5;
                }
                &:nth-child(6) {
                    grid-row: span 3;
                }
            }
            @media (min-width:768px){
                &:nth-child(3) {
                    grid-row: span 4;
                }
            }
            @media (min-width:992px){
                &:first-child {
                    grid-row: 1 / span 2;
                }
                &:nth-child(2) {
                    grid-row: span 7;
                }
                &:nth-child(3) {
                    grid-row: span 3;
                }
                &:nth-child(4) {
                    grid-row: span 2;
                }
                &:nth-child(5) {
                    grid-row: span 3;
                }
                &:nth-child(6) {
                    grid-row: span 3;
                }
            }
        }
        @media (min-width:576px){
            grid-template-columns: repeat(2, calc(50% - 15px));
            grid-template-rows: repeat(10, 40px);
            grid-auto-rows: 45px;
            grid-auto-flow: row;
        }
        @media (min-width:992px) {
            grid-auto-flow: column dense;
            grid-template-columns: repeat(3, calc((100% - 60px) / 3));
            grid-template-rows: repeat(7, 55px);
        }
        @media (min-width:1400px) {
            grid-template-rows: repeat(7, 45px);
        }
    }
}
.home-menu-grid{
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    position: relative;
    row-gap: 1rem;
    column-gap: 1rem;
    & .home-item{
        position:relative;
        grid-column: span 1;
        grid-row: span 1;
        border-radius:10px;
        background-color:var(--bs-light);
        padding:1rem .75rem 1.25rem;
        & .home-title{
            margin-bottom:15px;
        }
        & ul{
            margin-bottom:0px;
        }
        & a{
           color:var(--bs-primary);
           text-decoration: none; 
           font-size: var(--fz-title-4);
           line-height:32px;
           &:hover{
            text-decoration: underline;
           }
           &:focus{
            text-decoration: underline;
           }
        }
        @media (min-width:768px){
            grid-row: span 4;
            &:first-child{
                grid-row: span 2;
            }
            &:nth-child(3) {
                grid-row: span 2;
            }
            &:nth-child(4) {
                grid-row: span 3;
            }
            &:nth-child(5) {
                grid-row: span 3;
            }
        }
        @media (min-width:1200px) {
            grid-row: span 7;
            &:first-child {
                grid-row: span 7;
            }
            &:nth-child(3) {
                grid-row: span 3;
            }
            &:nth-child(4) {
                grid-row: span 4;
            }
            &:nth-child(5) {
                grid-row: span 7;
            }
        }
    }
    &.loc-menu{
        & .home-item{
            @media (min-width:768px) {
                grid-row: span 1;
                &:first-child {
                    grid-row: span 1;
                }
                &:nth-child(3) {
                    grid-row: span 1;
                }
                &:nth-child(4) {
                    grid-row: span 1;
                }
            }
        
            @media (min-width:1200px) {
                grid-row: span 1;
                &:first-child {
                    grid-row: span 1;
                }
                &:nth-child(3) {
                    grid-row: span 1;
                }
                &:nth-child(4) {
                    grid-row: span 1;
                }
            }
        }
        @media (min-width:768px) {
            grid-template-rows: 1fr 1fr;
        }
        @media (min-width:1200px) {
            grid-template-rows: 1fr;
        }
    }
    @media (min-width:768px) {
        grid-template-columns: repeat(2, calc(50% - .5rem));
        grid-template-rows: repeat(7, 1fr);
    }
    @media (min-width:1200px) {
        grid-auto-flow: column dense;
        grid-template-columns: repeat(4, calc((100% - 3rem) / 4));
        grid-template-rows: repeat(7, 1fr);
    }
}
header{
    z-index:11;
    position:relative;
}
scroll-to-top{
    --_stt-bg: var(--bs-primary);
    & button:not([active]){
        pointer-events: none;
    }
}
.cta-one{
    position:relative;
    overflow:hidden;
    & p{
        margin-bottom:0;
    }
    @media (min-width:1200px){
        height: 300px;
        & svg {
            position: absolute;
            z-index: 1;
            margin-top: calc((50% - 150px) * -1);
            &.mid-svg{
                margin-top: -10%;
            }
        }
    }
    @media (min-width:1400px) {
        height: 400px;
    }
}
.cta-two {
    position: relative;
    overflow: hidden;
    & p {
        margin-bottom: 0;
    }
    @media (min-width:992px) {
        height: 330px;
    }
    @media (min-width:1200px) {
        height: 240px;
        & svg {
            position: absolute;
            z-index: 1;
            margin-top: calc((50% - 125px) * -1);
        }
    }
}
.cta-three {
    position: relative;
    overflow: hidden;
    & p {
        margin-bottom: 0;
        font-size: var(--fz-title-4);
    }
    & svg {
        width:calc(100% - 24px);
        height:auto;
        display:block;
    }
    @media (min-width:992px) {
        height: calc( 100vw * (350 / 1500));
        & svg {
            padding-top: 3rem;
            position: absolute;
            z-index: 1;
            margin-bottom: calc((50% - 85px) * -1);
        }
    }
    @media(min-width:1200px){
        height: calc( 100vw * (280 / 1500));
        & svg {
            padding-top: 1.5rem;
            margin-bottom: calc((50% - 125px) * -1);
        }
    }
}
.client-swiper{
    & .swiper-wrapper{
        align-items:center;
    }
    & .swiper-slide{
        overflow:hidden;
        & svg{
            & g{
                fill: var(--bs-secondary);
            }
            & path {
                fill: var(--bs-secondary);
            }
        }
        & img{
            filter: drop-shadow(0px 300px 0 var(--bs-secondary));
                transform: translateY(-300px);
        }
    }
}
.plain-content{
    & p{
        font-size:var(--fz-title-4);
        & a{
            color:var(--bs-primary);
            text-decoration:none;
            &:hover{
                text-decoration: underline;
            }
            &:focus {
                text-decoration: underline;
            }
        }
    }
    & li{
        font-size:var(--fz-title-4);
    }
    & :last-child{
        margin-bottom:0;
    }
}
.stats-container{
    text-align:center;
    & p{
        color:var(--bs-primary);
        margin-bottom:0;
    }
    & .stat-tpl {
        border-top:1px solid rgb(187, 201, 215);
        padding-block: 3rem;
        &:first-child {
            border-top: none;
        }
        @media (min-width:576px) {
            border-right: 1px solid rgb(187, 201, 215);
            &:last-child {
                border-right: none;
            }
            @media (max-width:1399px) {
                &:nth-child(2) {
                    border-top: none;
                }
            }
            &:nth-child(2n+0) {
                border-right: none;
            }
        }
        @media (min-width:1200px){
            &:nth-child(2n+0) {
                border-right: 1px solid rgb(187, 201, 215);
            }
            &:nth-child(4n+0) {
                border-right: none;
            }
            
            &:nth-child(2) {
                border-top: none;
            }
            &:nth-child(3) {
                border-top: none;
            }
            &:nth-child(4) {
                border-top: none;
            }
        }
        
    }
    &.odd-stats{
        & .stat-tpl {
            border-top: 1px solid rgb(187, 201, 215);
            padding-block: 3rem;
            &:first-child {
                border-top: none;
            }
            @media (min-width:576px) {
                border-right: 1px solid rgb(187, 201, 215);
                &:last-child {
                    border-right: none;
                }
                @media (max-width:991px) {
                    &:nth-child(2) {
                        border-top: none;
                    }
                }
            }
            @media (min-width:992px) {
                &:nth-child(2) {
                    border-top: none;
                }
                &:nth-child(3) {
                    border-top: none;
                }
            }
    
        }
    }
}
.member-swiper {
    & .swiper-wrapper {
        align-items: center;
    }
}
.bg-dark{
   --bs-heading-color: #fff; 
   --bs-body-color: #b1bcc7;
   & p, li{
    color:var(--bs-body-color);
   }
   &:not(footer){
    & hr{
        opacity:1;
        color:var(--bs-secondary);
    }
   }
}
.bottom-checklist{
    font-size: var(--fz-title-4);
    line-height:30px;
    & span{
        color:#fff;
        font-family:var(--nunito);
    }
}
.form {
    --bs-border-radius: 4px;
    & legend{
        color:var(--bs-primary);
        font-family: var(--nunito);
        font-size: var(--fz-title-2);
        line-height: calc(40 / 32);
    }
    & .plain-label{
        color:var(--bs-dark);
        font-size:var(--fz-title-3);
        margin-bottom:10px;
    }
    & .form-check{
        padding-left: 1.75em;
        margin-bottom:0;
        & label{
            font-size: var(--fz-title-5);
            font-family: var(--nunito);
            color:var(--bs-tertiary);
        }
        & .form-check-input {
            --bs-border-color:var(--bs-tertiary);
            width: 20px;
            height: 20px;
            margin-left: -1.75em;
            margin-top: .2em;
            &:focus {
                border-color: var(--bs-primary);
                box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .25);
            }
            &:checked{
                background-color: var(--bs-primary);
                border-color: var(--bs-primary);
            }
        }
    }
    & .form-control{
        --bs-border-color: var(--bs-tertiary);
        font-size:var(--fz-title-5);
        font-family:var(--nunito);
        background-clip:unset;
        color:var(--bs-dark);
        &:focus {
            border-color: var(--bs-primary);
            box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .25);
        }  
    }
    & .form-floating>textarea.form-control {
        height:auto;
        min-height: 150px;
    }
    & .form-floating>label{
        font-size: var(--fz-title-5);
        font-family: var(--nunito);
    }
    & .form-select {
        --bs-border-color: var(--bs-tertiary);
        font-size: var(--fz-title-5);
        font-family: var(--nunito);
        background-clip: unset;
        --bs-form-select-bg-img: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" fill="%23212124"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M201.4 374.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 306.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"/></svg>');
        &:focus {
            border-color: var(--bs-primary);
            box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .25);
        }
    }
}
.form-floating>.form-control-plaintext~label,
.form-floating>.form-control:focus~label,
.form-floating>.form-control:not(:placeholder-shown)~label,
.form-floating>.form-select~label {
    transform: scale(.75) translateY(-.5rem) translateX(.15rem);
}
.bg-secondary-bg{
    background-color:var(--bs-secondary-bg);
}
.bg-primary{
    --bs-heading-color: #fff;
    & p, li{
        color:#fff;
    }
    & .error{
        color:var(--bs-warning);
    }
    & .form-control{
        background-color: #338ec9;
        color: #fff;
        border-color:#338ec9;
        &:focus{
            border-color:#fff;
            box-shadow: 0 0 0 .25rem rgba(255,255,255, .5);
            &:is(:-webkit-autofill, :autofill) {
                border: none !important;
                color: #fff;
                -webkit-text-fill-color: #fff;
                -webkit-box-shadow: 0 0 0 10000px #338ec9 inset;
                transition: background-color 5000s ease-in-out 0s;
                outline: 2px solid #fff;
                outline-offset: -1px;
            }
        }
        &:not(:focus):is(:-webkit-autofill, :autofill) {
            border: none !important;
            color: #fff;
            -webkit-text-fill-color: #fff;
            -webkit-box-shadow: 0 0 0 10000px #338ec9 inset;
            transition: background-color 5000s ease-in-out 0s;
            outline: 2px solid #338ec9;
            outline-offset: -1px;
        }
    }
    & .form-floating>label{
        color:#fff;
    }
    & .form-select {
        background-color: #338ec9;
        color: #fff;
        border-color: #338ec9;
        --bs-form-select-bg-img: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" fill="%23fff"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M201.4 374.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 306.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"/></svg>');
        &:focus {
            border-color: #fff;
            box-shadow: 0 0 0 .25rem rgba(255, 255, 255, .5);
        }
    }
}
.card.plain-card{
    --bs-card-title-color: var(--bs-dark);
    --bs-card-bg: var(--bs-light);
    --bs-card-border-width: 0;
    --bs-card-title-spacer-y: 1rem;
    & .card-body{
        padding: 1rem .75rem 1.45rem;
        & p{
            font-size: var(--fz-title-4);
            line-height: 32px;
        }
        & .icon-wrapper{
            height:48px;
            width:40px;
            margin-top:.5rem;
            margin-bottom:.5rem;
            & svg{
                width:100%;
                height:auto;
            }
        }
    }
}
.card.location-box {
    --bs-card-title-color: var(--bs-dark);
    --bs-card-bg: var(--bs-light);
    --bs-card-border-width: 0;
    --bs-card-title-spacer-y: 1rem;

    & .card-body {
        padding: 1rem .75rem 1.45rem;
    }
    & p:not(.card-title) {
        font-size: var(--fz-title-4);
        line-height: 32px;
    }
    & .open{
        color: rgb(20, 186, 114);
    }
    & .close{
        color: #eb4c4c;
    }
}
.text-bg-light .card.location-box {
    --bs-card-bg: white;
}
.onsite-grid{
    column-gap: 1.5rem;
    row-gap: 1.5rem;
    position: relative;
    grid-template-rows: auto;
    display: grid;
    overflow:hidden;
    padding-top: var(--md);
    padding-bottom: var(--md);
    & .image{
        position: relative;
        grid-column: 1 / span 1;
        grid-row: span 1;
        z-index: 1;
        @media (min-width: 768px) {
            grid-column: 1 / span 14;
        }
        @media (min-width: 992px) {
            grid-row: 1 / span 1;
            grid-column: 7 / span 8;
        }
    }
    & .content{
        position: relative;
        grid-column: 1 / span 1;
        grid-row: span 1;
        z-index: 2;
        padding: 0 .75rem;
        @media (min-width: 768px) {
            grid-column: 1 / span 14;
        }
        @media (min-width: 992px) {
            grid-row: 1 / span 1;
            grid-column: 1 / span 7;
            
        }
        @media (min-width:1200px) {
            grid-column: 1 / span 7;
        }
        @media (min-width:1400px) {
            grid-column: 2 / span 6;
            padding: 0;
        }
    }
    @media (min-width: 768px) {
        grid-template-columns: 1fr repeat(12, calc((720px / 12) - 1.5rem)) 1fr;
    }
    @media (min-width: 992px) {
        grid-template-columns: 1fr repeat(12, calc((960px / 12) - 1.5rem)) 1fr;
    }
    @media (min-width: 1200px) {
        grid-template-columns: 1fr repeat(12, calc((1140px / 12) - 1.5rem)) 1fr;
    }
    @media (min-width:1350px){
        padding-bottom: 0;
    }
    @media (min-width: 1400px) {
        grid-template-columns: 1fr repeat(12, calc((1320px / 12) - 1.5rem)) 1fr;
        
    }
}
.accordion{
    --bs-accordion-btn-color: var(--bs-primary);
    --bs-accordion-btn-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" fill="%23212124"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M201.4 374.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 306.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"/></svg>');
    --bs-accordion-btn-active-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" fill="%23212124"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M201.4 374.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 306.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"/></svg>');
    --bs-accordion-border-width: 0;
    --bs-accordion-active-color: var(--bs-primary);
    --bs-accordion-active-bg: #fff;
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
    --bs-accordion-btn-padding-y: 2rem;
    --bs-accordion-btn-icon-width: 1rem;
    --bs-accordion-body-padding-y: 1.5rem;
    & .accordion-item{
        margin-bottom:10px;
        border-radius:var(--bs-accordion-border-radius);
        &:last-child{
            margin-bottom:0;
        }
        & .accordion-button{
            border-radius: var(--bs-accordion-inner-border-radius);
            font-size:inherit;
            line-height:inherit;
        }
        & .accordion-body{
            padding-top:0;
        }
    }
}
.mid-service{
    & p:not(.h4){
        font-size:18px;
        line-height:30px;
    }
    & .h4{
        color:#fff;
    }
    & svg{
        color:#fff;
        height:21px;
    }
    & li{
        font-size: 18px;
        line-height: 30px; 
        margin:10px 0;
        & svg{
            margin-right:10px;
            color:var(--bs-body-color);
        }
    }
    & ul{
        list-style:none;
        padding-left:0;
    }
}
.case-study-container{
    &:has(.nav-link.active[data-bs-text="Light"]){
        --bs-heading-color: #fff;
        --bs-border-color: #fff;
        & .client-logo {
            & path {
                fill: #fff;
            }
            & g {
                fill: #fff;
            }
            & circle {
                fill: #fff;
            }
            & ellipse {
                fill: #fff;
            }
            & rectangle {
                fill: #fff;
            }
            &:is(img) {
                filter: drop-shadow(0px 300px 0 #fff);
                transform: translateY(-300px);
            }
        }
        & .tab-pane {
            & p,
            li {
                color: #fff;
            }
        }
    }
    &:has(.nav-link.active[data-bs-text="Dark"]) {
        --bs-heading-color: var(--bs-dark);
        --bs-border-color: var(--bs-dark);
        & .client-logo {
            & path {
                fill: var(--bs-dark);
            }
            & g {
                fill: var(--bs-dark);
            }
            & circle {
                fill: var(--bs-dark);
            }
            & ellipse {
                fill: var(--bs-dark);
            }
            & rectangle {
                fill: var(--bs-dark);
            }
            &:is(img) {
                filter: drop-shadow(0px 300px 0 var(--bs-dark));
                transform: translateY(-300px);
            }
        }
        & .tab-pane {
            & p,
            li {
                color: var(--bs-dark);
            }
        }
    }
    & .nav{
        --bs-nav-link-color: var(--bs-primary);
        --bs-nav-link-hover-color: var(--bs-primary);
        --bs-nav-link-padding-y: 0rem;
        --bs-nav-link-font-weight: 500;
        &.nav-underline{
            --bs-nav-underline-link-active-color: var(--bs-primary);
            --bs-nav-underline-border-width: 1px;
            & .nav-link{
                line-height:1;
                &.active {
                    font-weight: 500;
                }
            }
            @media (min-width:768px){
                --bs-nav-underline-gap: 1.5rem;
            }
        }
    }
    & .client-logo{
        width:220px;
        height:auto;
    }
    & .tab-pane{
        & .plain-content{
            margin-top:1.5rem;
        }
    }
}
.grad-list{
    color:var(--bs-dark);
    font-weight:400;
    margin-top:var(--space-sm);
    font-family:var(--nunito);
    & li{
        padding:10px 0;
        font-size:18px;
        &:not(:last-child){
            border-bottom:1px solid var(--bs-secondary-border);
        }
        & svg{
            width:50px;
            font-size:var(--fz-title-4);
            text-align:left;
        }
    }
}
.img-section{
    height:auto;
    display:grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    overflow:hidden;
    position:relative;
    width:100%;
    &::before{
        background-image: linear-gradient( 180deg, rgb(255,255,255,1) 0%, rgba(255,255,255,0) 50%);
        content:'';
        z-index:2;
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        position:relative;
        width:100%;
        height:100%;
        display:block;
    }
    & .hero-picture{
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        height:auto;
        width:100%;
        position:relative;
        z-index:1;
        & .bg-image{
            width:100% !important;
            height:auto !important;
            position:relative;
        }
    }
}
.card.cta-card{
    --bs-card-title-color: #fff;
    --bs-card-title-color: var(--bs-primary);
    --bs-card-bg: var(--bs-primary);
    --bs-body-color:#fff;
    --bs-card-spacer-y: 2rem;
    --bs-card-spacer-x: 1.25rem;
    --bs-card-title-spacer-y:.75rem;
    & .card-body{
        text-align:center;
        z-index:3;
        position:relative;
        padding-bottom:0;
        & .card-title{
           font-size:21px;
           font-family: var(--nunito);
           line-height:30px; 
        }
        & .card-text{
            font-size:18px;
            line-height:30px;
            margin-bottom:40px;
        }
        & .price{
            margin:15px 0;
            font-size:21px;
            line-height:1; 
            font-family: var(--nunito);
            & span{
                font-size: var(--display-2);
                font-weight:700;
            }
        }
        & ul{
            text-align:left;
            margin-bottom:0;
            color: #fff;
            list-style:none;
            padding-left:0;
              font-family: var(--nunito);
              font-weight: 400;
              margin-top: var(--space-sm);
              & li {
                font-size: 18px;
                padding: 8px 0;
                & svg {
                    margin-right: 10px;
                  font-size: var(--fz-title-4);
                }
              }
        }
        & .btn{
            margin-bottom:1.5rem;
        }
    }
}
.btn-circle{
    width:96px;
    height:96px;
    text-align:center;
    border-radius:50%;
    font-size:24px;
    padding-top:30px;
    @media (min-width:768px){
        width: 136px;
        height: 136px;
        padding-top:50px;
    }
}
.company-grid{
    column-gap: 1rem;
    row-gap: 1rem;
    padding-left:1rem;
    padding-right:1rem;
    position: relative;
    grid-template-rows: auto;
    display: grid;
    overflow: hidden;
    & .content {
        position: relative;
        grid-column: 1 / span 1;
        grid-row: span 1;
        z-index: 2;
        & .collage-text {
            color: #fff;
            line-height:60px;
            & b{
                font-size: var(--display-2);
                display:block;
            }
        }
        & p{
            color:#b1bcc7;
            & strong{
                font-weight:400;
                color:#fff;
            }
        }
        @media (min-width: 768px) {
            grid-column: 1 / span 12;
        }
        @media (min-width: 992px) {
            grid-row: 1 / span 1;
            grid-column: 1 / span 14;
        }
        @media (min-width: 1200px) {
            grid-row: 1 / span 2;
            grid-column: 2 / span 12;
        }
    }
    & .gallery-item{
        position: relative;
        grid-column: 1 / span 1;
        grid-row: span 1;
        z-index: 1;
        border-radius: var(--bs-border-radius);
        overflow: hidden;
        & img {
            object-fit:cover;
            height:100%;
            width:100%;
        }
        @media (min-width:768px){
            grid-column: span 4;
            grid-row: span 3;
        }
        @media (min-width:992px) {
            &:nth-child(2){
                grid-column: 12 / span 3;
                grid-row: 2 / span 3;
            }
            &:nth-child(3){
                grid-column: 1 / span 3;
                grid-row: 3 / span 3;
            }
            &:nth-child(4) {
                grid-column: 4 / span 5;
                grid-row: 4 / span 3;
            }
            &:nth-child(5) {
                grid-column: 9 / span 4;
                grid-row: 5 / span 4;
            }
            &:nth-child(6) {
                grid-column: 13 / span 2;
                grid-row: 5 / span 3;
            }
            &:last-child{
                grid-column: 1 / span 3;
                grid-row: 6 / span 3;
            }
        }
        @media (min-width: 1700px) {
            &:nth-child(2) {
                grid-column: 13 / span 2;
                grid-row: 2 / span 3;
            }
            &:nth-child(3) {
                grid-column: 1 / span 2;
                grid-row: 3 / span 3;
            }
            &:nth-child(4) {
                grid-column: 3 / span 6;
                grid-row: 4 / span 3;
            }
            &:nth-child(5) {
                grid-column: 9 / span 5;
                grid-row: 5 / span 4;
            }
            &:nth-child(6) {
                grid-column: 14 / span 1;
                grid-row: 5 / span 3;
            }
            &:last-child {
                grid-column: 1 / span 2;
                grid-row: 6 / span 3;
            }
        }
    }
    @media (min-width: 768px) {
        grid-template-columns: repeat(12, 1fr);
    }
    @media (min-width: 992px) {
        --xs-row: calc(100vw * (2 / 250));
        --sm-row: calc(100vw * (7 / 300));
        --md-row: calc(100vw * (1 / 30));
        --lg-row: calc(100vw * (59 / 1500));
        --xl-row: calc(100vw * (53 / 750));
        --xxl-row: calc(100vw * (209 / 1500));
        grid-template-columns: 1fr repeat(12, calc((960px / 12) - 1.5rem)) 1fr;
        grid-template-rows: 1fr var(--lg-row) var(--xl-row) var(--sm-row) var(--md-row) var(--xxl-row) var(--xs-row) var(--xs-row);
    }
    @media (min-width: 1200px) {
        grid-template-columns: 1fr repeat(12, calc((1140px / 12) - 1.5rem)) 1fr;
    }
    @media (min-width: 1400px) {
        grid-template-columns: 1fr repeat(12, calc((1320px / 12) - 1.5rem)) 1fr;
    }
}
.logo-wrapper{
    & .client-logo{
        height:auto;
        width:100%;
        @media (min-width:576px){
            height: 100%;
            width: auto;
            max-height:120px;
        }
        @media (min-width:768px){
            width:100%;
            height:auto;
            max-height: 180px;
        }
    }
    @media (min-width:576px){
        height: 120px;
    }
    @media (min-width:768px) {
        height: 180px;
    }
}
.background-image-grid {
    height: auto;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    overflow: hidden;
    position: relative;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    & .container-lg {
        position: relative;
        z-index: 3;
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        align-self: center;
        padding-block: var(--md);
        @media (min-width:768px) {
            padding-block: 0;
        }
        @media (min-width:1400px) {
            padding-top: var(--sm);
        }
    }
    & .container-xl {
        position: relative;
        z-index: 3;
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        align-self: center;
        padding-block: var(--md);
        @media (min-width:768px) {
            padding-block: 0;
        }
        @media (min-width:1400px) {
            padding-top: var(--sm);
        }
    }
    & .hero-picture {
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        height: 100%;
        width: 100%;
        position: relative;
        z-index: 1;
        top: 0;
        background: #000;
        & .bg-image {
            width: 100% !important;
            height: 100% !important;
            object-fit: cover;
            object-position: center;
            position: relative;
            opacity: .8;
        }
        @media (min-width: 768px) {
            height: 100vh;
        }
    }
    @media (min-width: 768px) {
        height: 100vh;
    }
    &.cta {
        height: 600px;
        & .hero-picture {
            height: 600px;
            & .bg-image {
                opacity: 1;
            }
        }
        & .container-lg{
            align-self:start;
            @media (min-width:768px) {
                padding-block: 0;
                padding-top:var(--sm);
            }
        
            @media (min-width:1400px) {
                padding-top: var(--md);
            }
        }
        & p {
            font-size: var(--fz-title-4);
            line-height: 30px;
            margin-bottom: 0;
        }
    }
}
.benefit-list {
    border-bottom: 1px solid var(--bs-tertiary);
    font-size: var(--fz-title-4);
    padding-block: 25px;
    color: #fff;
    &:last-child {
        border-bottom: none;
    }
    @media (min-width:576px) {
        &:nth-last-child(2) {
            border-bottom: none;
        }
    }
    @media (min-width:992px) {
        &:nth-last-child(3) {
            border-bottom: none;
        }
    }
}
.job-table-head{
    text-transform:uppercase;
    & p{
        font-family: var(--nunito);
        color:#110d0e;
        font-size:var(--fz-title-5);
    }
}
.job-row{
    border-bottom: 1px solid rgb(187, 201, 215);
    padding-block:var(--sm);
    & p{
        margin-bottom:0;
        font-family: var(--nunito);
        color: #110d0e;
        font-size: var(--fz-title-4);
        padding-left:.75rem;
        padding-right: .75rem;
    }
}
.job-details{
    & hr{
        opacity:1;
        color:rgb(187, 201, 215);
        margin:50px 0;
    }
    & .table{
        --bs-table-color: var(--bs-secondary);
        font-size: var(--fz-title-4);
        line-height:36px;
        margin-bottom:0;
        &>:not(caption)>*>*{
            padding:0;
        }
    }
    & ol, ul{
        padding-left:2.5rem;
    }
    & li{
        margin-bottom:5px;
        &:last-child{
            margin-bottom:0;
        }
        &::marker{
            font-size:16px;
        }
    }
}
.uber-hero-grid {
    padding: 0;
    height: auto;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    width: 100%;

    & .container-lg {
        position: relative;
        z-index: 5;
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        align-self: end;
        padding-top: 7%;

        @media(min-width:1200px) {
            padding-top: 0;
        }
    }

    & .hero-picture {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 2;
        height: 100%;
        width: 100%;
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;

        & img {
            height: 100%;
            width: 100%;
            position: relative;
            object-fit: cover;
            opacity: 1;
        }
        @media (min-width:1700px) {
            height: 100vh;
        }
    }

    @media (min-width:1700px) {
        height: 100vh;
    }
}

.uber-content-grid {
    @media (min-width:1200px) {
        height: auto;
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: 1fr;
        column-gap: 30px;
        width: 100%;
    }

    & .text {
        position: relative;
        z-index: 2;
        padding-bottom: 30px;

        @media(min-width:1200px) {
            grid-column: 1 / span 7;
            grid-row: 1 / span 1;
            padding-bottom: 0;
        }
        @media (min-width:1400px){
            grid-column: 1 / span 6;
        }

        & .subtitle {
            font-size: 30px;
            line-height: 36px;
            font-family: var(--nunito);
            margin-bottom: 10px;
        }

        & h1 {
            font-weight: bold;
            line-height: calc(84 / 82);
            font-size: 48px;
            margin-bottom: 10px;

            & i {
                text-transform: uppercase;
            }

            @media (min-width:768px) {
                font-size: 82px;
            }
        }

        & .lead {
            font-size: 26px;
            line-height: 36px;
            font-family: var(--nunito);
            margin-bottom: 7%;
        }
    }

    & .image {
        position: relative;
        z-index: 1;

        @media(min-width:1200px) {
            grid-column: 6 / span 7;
            grid-row: 1 / span 1;
        }
    }
}
.icon-text-container {
    padding-block:var(--sm);
    &:not(.container-lg){
        background-color: #e5f1f8;
    }
    & .icon-wrapper {
        height: 48px;
        display: flex;
        align-items: center;
        & svg{
            height:100%;
            width:auto;
        }
    }

    & .h4 {
        color: var(--bs-dark);
    }
    & p:not(.h4){
        font-size:18px;
    }
    & .step-circle {
        background-color: var(--bs-warning);
        border-radius: 50%;
        color: var(--bs-primary);
        font-size: 46px;
        font-family: var(--nunito);
        height: 68px;
        width: 68px;
        text-align: center;
        line-height: 68px;
        display: block;
        margin: 0 auto 20px;
    }
    @media (min-width:768px){
        padding-block: var(--md);
    }
}
.file-list{
    margin-bottom:0;
    & li {
        background: #fff;
        border-radius:10px;
        padding: 1.5rem 1.5rem;
        margin-bottom:1.5rem;
        & a {
            color: var(--bs-dark);
            display: block;
            font-size: var(--fz-title-4);
            line-height: 36px;
            text-decoration: none;
            & .icon {
                font-size: inherit;
                margin-right: 0.75em;
                color: var(--primary);
                &.icon-pdf {
                    color: #eb4c4c;
                }
                &.icon-docx {
                    color: #00a2ed;
                }
                &.icon-doc {
                    color: #00a2ed;
                }
                &.icon-pptx {
                    color: #d04423;
                }
                &.icon-ppt {
                    color: #d04423;
                }
                &.icon-xlsx {
                    color: #1d6f42;
                }
                &.icon-xls {
                    color: #1d6f42;
                }
            }
            &:hover{
                color: var(--bs-primary);
                & .icon{
                    color: inherit;
                }
            }
            &:focus {
                color: var(--bs-primary);

                & .icon {
                    color: inherit;
                }
            }
        }
        &:last-child{
            margin-bottom:0;
        }
    }    
}
.card-holder{
    & .card.team-member-card{
        --bs-card-inner-border-radius: 10px;
        --bs-card-spacer-y: .75rem;
        --bs-card-spacer-x: 0;
        & p{
            margin-bottom:0;
            font-family: var(--nunito);
            font-size: var(--fz-title-4);
        }
        & h3{
            margin-bottom:0;
            color:var(--bs-dark);
            transition: color .3s ease, transform .3s ease;
        }
        & .card-body{
            z-index:3;
            position:relative;
        }
        & picture{
            position:relative;
            & img{
                position:relative;
                z-index:2;
            }
            &:after{
                position:absolute;
                content:'';
                bottom:0;
                left:0;
                right:0;
                display:block;
                border-radius:var(--bs-card-inner-border-radius);
                height: 80%;
                width:100%;
                background-color:var(--box-color);
                transition: transform .3s ease;
            }
        }
        & .stretched-link::after{
            z-index:10;
        }
        &:has(a:hover){
            & picture::after {
                transform:scaleX(.75);
            }
            & h3{
                color:var(--bs-primary);
                transform:scale(1.05);
            }
        }
        &:has(a:focus) {
            & picture::after {
                transform: scaleX(.75);
            }
            & h3 {
                color: var(--bs-primary);
                transform: scale(1.05);
            }
        }
    }
    &:nth-child(4n+1) {
        --box-color: var(--bs-primary);
    }
    &:nth-child(4n+2) {
        --box-color: var(--bs-warning);
    }
    &:nth-child(4n+3) {
        --box-color: var(--bs-secondary);
    }
    &:nth-child(4n+0) {
        --box-color: var(--bs-light);
    }
    @media (min-width:768px) {
        &:nth-child(8n+1) {
            --box-color: var(--bs-primary);
        }
        &:nth-child(8n+2) {
            --box-color: var(--bs-warning);
        }
        &:nth-child(8n+3) {
            --box-color: var(--bs-secondary);
        }
        &:nth-child(8n+4) {
            --box-color: var(--bs-primary);
        }
        &:nth-child(8n+5) {
            --box-color: var(--bs-light);
        }
        &:nth-child(8n+6) {
            --box-color: var(--bs-secondary);
        }
        &:nth-child(8n+7) {
            --box-color: var(--bs-warning);
        }
        &:nth-child(8n+0) {
            --box-color: var(--bs-light);
        }
    }
    @media (min-width:992px){
        &:nth-child(12n+1) {
            --box-color: var(--bs-primary);
        }
        &:nth-child(12n+2) {
            --box-color: var(--bs-warning);
        }
        &:nth-child(12n+3) {
            --box-color: var(--bs-secondary);
        }
        &:nth-child(12n+4) {
            --box-color: var(--bs-light);
        }
        &:nth-child(12n+5) {
            --box-color: var(--bs-primary);
        }
        &:nth-child(12n+6) {
            --box-color: var(--bs-warning);
        }
        &:nth-child(12n+7) {
            --box-color: var(--bs-secondary);
        }
        &:nth-child(12n+8) {
            --box-color: var(--bs-light);
        }
        &:nth-child(12n+9) {
            --box-color: var(--bs-primary);
        }
        &:nth-child(12n+10) {
            --box-color: var(--bs-warning);
        }
        &:nth-child(12n+11) {
            --box-color: var(--bs-secondary);
        }
        &:nth-child(12n+0) {
            --box-color: var(--bs-light);
        }
    }
}
.google-stars {
    & svg {
        height: var(--fz-title-3);
        & path {
            fill: var(--bs-warning);
        }
    }
}
.card.google-card {
    --bs-card-border-color: rgb(187, 201, 215);
    --bs-card-spacer-y: 30px;
    --bs-card-border-radius: 10px;
    --bs-card-title-spacer-y: 0.25rem;
    & .card-title {
        color: var(--bs-dark);
        font-weight: 400;
        font-size: var(--fz-title-4);
        font-family: var(--nunito);
    }
    & .card-date {
        color: var(--bs-dark);
        font-weight: 400;
        font-family: var(--nunito);
    }
    & .hstack {
        padding-bottom: 20px;
        padding-top: 4px;
    }
    & svg {
        height: var(--fz-title-4);
        & path {
            fill: var(--bs-warning);
        }
    }
    & .card-body {
        padding-bottom: 40px;
    }
    & .card-text {
        font-size: var(--fz-title-5);
        line-height: 30px;
        color:var(--bs-secondary);
    }
}
#google-review-swiper .swiper-slide{
    height:auto;
    opacity:.5;
    &.swiper-slide-fully-visible{
        opacity:1;
    }
}
.location-details{
    & p{
        margin-bottom:0;
        font-size: var(--fz-title-4);
        line-height:36px;
        & a{
            color:var(--bs-body-color);
            text-decoration:none;
            font-size:inherit;
            &:hover{
                color:var(--bs-primary);
            }
            &:focus {
                color: var(--bs-primary);
            }
        }
    }
}
.plain-hr{
    color:rgb(187, 201, 215);
}
.carousel-control-next,
.carousel-control-prev{
    font-size:30px;
    width:5%;
    &:hover{
        opacity:1;
    }
    &:focus {
        opacity: 1;
    }
    @media (min-width:992px){
        font-size: 60px;
    }
}
.case-study-section {
    background-color:var(--bkg);
    & p,
    li {
        color: var(--bs-base-color);
    }
    & .client-logo {
        & path {
            fill: var(--bs-base-color);
        }
        & g {
            fill: var(--bs-base-color);
        }
        & circle {
            fill: var(--bs-base-color);
        }
        & ellipse {
            fill: var(--bs-base-color);
        }
        & rectangle {
            fill: var(--bs-base-color);
        }
        &:is(img) {
            filter: drop-shadow(0px 300px 0 var(--bs-base-color));
            transform: translateY(-300px);
        }
    }
    & .client-logo {
        width: 220px;
        height: auto;
    }
    & .plain-content {
        margin-top: 1.5rem;
    }
}
.btn-wrapper:has(button[style]){
    display:none;
}
.date-box{
    padding:.25rem 1rem;
    font-family: var(--nunito);
}
.card.article-card{
    --bs-card-border-color: rgb(187, 201, 215);
    --bs-card-spacer-y: 15px;
    --bs-card-border-radius: 10px;
    --bs-card-title-spacer-y: 0.25rem;
    --bs-card-border-width: 0;
    & .card-title {
        color: var(--bs-dark);
        font-weight: 400;
        font-size: var(--fz-title-4);
        margin-bottom:0;
        font-family: var(--nunito);
        line-height:28px;
    }
    & time {
        color: var(--bs-primary);
        font-weight: 400;
        font-family: var(--nunito);
        font-size:14px;
    }
    & .card-body {
        padding-bottom: 30px;
    }
    & hr{
        color:rgb(187, 201, 215);
        opacity:1;
        margin-bottom:1.5rem;
    }
    & .card-text {
        font-size: var(--fz-title-5);
        line-height: 30px;
        color: var(--bs-secondary);
        padding-bottom:.5rem;
    }
}
.pagination{
    --bs-pagination-color: var(--bs-dark);
    --bs-pagination-border-color: rgb(187, 201, 215);
    --bs-pagination-hover-color: var(--bs-primary);
    --bs-pagination-hover-bg: var(--bs-light);
    --bs-pagination-hover-border-color: var(--bs-primary);
    --bs-pagination-active-bg: var(--bs-primary);
    --bs-pagination-active-border-color: var(--bs-primary);
    --bs-pagination-focus-color: var(--bs-primary);
    --bs-pagination-focus-bg: var(--bs-light);
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
    --bs-pagination-font-size: 18px;
    --bs-pagination-padding-y: 0.75rem;
    column-gap:1rem;
    & a{
        font-family: var(--nunito);
        line-height:1;
        font-weight:bold;
        border-radius:4px;
    }
}
.table.compare-table{
    --bs-table-border-color: rgb(187, 201, 215);
    --bs-table-active-color: var(--bs-primary);
    --bs-table-active-bg: var(--bs-light);
    --bs-table-color: var(--bs-dark);
    --bs-table-hover-color: var(--bs-primary);
    --bs-table-hover-bg: rgba(var(--bs-primary-rgb), 0.1);
    & thead{
        & th{
            text-align:center;
            font-family: var(--nunito);
            font-weight: 400;
            font-size: var(--fz-title-4);
            padding:1.75rem .75rem;
            line-height:1.2;
            & svg{
                width:64px;
                height:auto;
            }
            &.table-active{
                & svg{
                    width:96px;
                }
            }
        }
    }
    & tbody{
         & tr:last-child{
            & td, th{
                border-bottom:none;
            }
         }
         & td{
            color:var(--bs-primary);
            font-size:18px;
            text-align:center;
            padding: 2.25rem .75rem;
         }
         & th{
            font-family: var(--nunito);
            font-weight: 400;
            font-size: 18px;
            padding: 2.25rem .75rem;
         }
         & tr:hover{
            & .table-active{
                --bs-table-bg-state: rgba(var(--bs-primary-rgb), 0.2);
            }
         }
    }
}
.testimony-slider{
    & .testimony-text{
        font-family: var(--nunito);
        font-style:italic;
        font-size: var(--fz-title-2);
        line-height:42px;
        position:relative;
        z-index:2;
        @media (min-width:768px){
            
        }
    }
    & .quote{
        color:#fff;
        font-family: var(--nunito);
        font-weight:900;
        font-size:70px;
        line-height: 1;
        bottom: -25px;
        display: inline-block;
        z-index: 0;
        position: relative;
        @media (min-width:768px){
            font-size: 100px;
            bottom: -35px;
        }
    }
    & .carousel-item {
        overflow: hidden;
        & svg {
            & g {
                fill: #fff;
            }
            & path {
                fill: #fff;
            }
        }
        & img {
            filter: drop-shadow(0px 1000px 0 #fff);
            transform: translateY(-1000px);
        }
    }
    .client-logo{
        height: 65px;
        width:auto;
    }
}
.modal{
    --bs-modal-header-border-color: rgb(187, 201, 215);
    & .btn-close{
        color:var(--bs-dark);
        &:hover {
            color: var(--bs-primary);
        }
        &:focus {
            color: var(--bs-primary);
        }
    }
    & .label {
        font-size: 18px;
        color: var(--bs-dark);
        font-family: var(--nunito);
        line-height:1.25;
        & small{
            font-size: .65em;
        }
    }
    &.team-modal {
        & .modal-header {
            background-color: var(--bs-light);
        }
    }
    &.print-item-modal{
        --bs-modal-padding: 2.5rem 1rem;
        & .btn-close{
            position:absolute;
            top:10px;
            right:10px;
        }
        & .btn:not(.add-btn) {
            --bs-btn-padding-x: .25rem;
            --bs-btn-color: var(--bs-dark);
            --bs-btn-hover-color: var(--bs-primary);
            --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
            --bs-btn-active-color: var(--bs-primary);
            --bs-btn-active-shadow: inset 0 3px 5px rgba(var(--bs-primary-rgb), 0.125);
            --bs-btn-disabled-color: var(--bs-dark);
            --bs-btn-disabled-border-color: transparent;
            border-radius: 0;
        }
    }
    &.print-request-modal{
        & .btn-close {
            position: absolute;
            top: 10px;
            right: 10px;
        }
    }
    & .table{
        --bs-table-border-color: rgb(187, 201, 215);
        --bs-table-color: var(--bs-dark);
        & p{
            display:inline-block;
        }
        & td{
            padding-left:0;
            padding-right:0;
            &:last-child{
                text-align:center;
                vertical-align: middle;
            }
        }
        & th{
            text-align: center;
        }
    }
    & .carousel-control-next,
    .carousel-control-prev{
        color:var(--bs-dark);
        font-size:30px;
        margin-bottom: 180px;
    }
    & .carousel-control-next{
        @media (min-width: 768px){
            right:-40px;
        }
    }
    & .carousel-control-prev {
        @media (min-width: 768px) {
            left: -40px;
        }
    }
    & .carousel{
        padding-bottom: 180px;
        & .carousel-indicators{
            margin-bottom:0;
            & button{
                width: 120px;
                height:auto;
                background-color:transparent;
                border-radius:0;
                text-indent:unset;
                margin-right: 6px;
                margin-left: 6px;
            }
        }
    }
}
.cart-btn-wrapper{
    position:sticky;
    z-index:3;
    bottom:.75rem;
    margin-left:.75rem;
    & .btn{
        --bs-btn-padding-x: .75rem;
        --bs-btn-padding-y: 0.85rem;
        --bs-btn-line-height: 1;
        padding-bottom: calc(var(--bs-btn-padding-y) - .05rem);
    }
    & .badge{
        --bs-badge-font-weight: 400;
        font-family: var(--nunito);
    }
}
.print-stack{
    row-gap:var(--md);
}
.print-category{
    & hr{
        color:rgb(187, 201, 215);
        opacity:1;
        margin-bottom:1.5rem;
        margin-top:.25rem;
    }
    & .print-count{
        font-size:18px;
        color:var(--bs-dark);
        font-family: var(--nunito);
    }
    & .print-name{
        margin-top:.75rem;
        color:var(--bs-dark);
        font-size: var(--fz-title-3);
        font-family: var(--nunito);
        transition: transform .3s ease, color .3s ease;
    }
    & button.btn:not(.add-btn){
        --bs-btn-padding-x: .25rem;
        --bs-btn-color: var(--bs-dark);
        --bs-btn-hover-color: var(--bs-primary);
        --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
        --bs-btn-active-color: var(--bs-primary);
        --bs-btn-active-shadow: inset 0 3px 5px rgba(var(--bs-primary-rgb), 0.125);
        --bs-btn-disabled-color: var(--bs-dark);
        border-radius:0;
    }
    & .add-btn{
        --bs-btn-padding-x: .25rem;
        width:100%;
    }
    & .label{
        font-size: 18px;
        color: var(--bs-dark);
        font-family: var(--nunito);
    }
    & .link-wrapper{
        & img{
            transition: transform .3s ease;
        }
        &:has(a:hover) {
            & img {
                transform: scale(.95);
            }
            & .print-name {
                color: var(--bs-primary);
                transform: scale(1.05);
            }
        }
        &:has(a:focus) {
            & img {
                transform: scale(.95);
            }
            & .print-name {
                color: var(--bs-primary);
                transform: scale(1.05);
            }
        }
    }
}
.card.location-card{
    --bs-card-bg: var(--bs-secondary-bg);
    --bs-card-color: var(--bs-body-color);
    --bs-card-spacer-y: 1.5rem;
    --bs-card-spacer-x: .75rem;
    --bs-card-title-spacer-y: 0.75rem;
    --bs-card-title-color: var(--bs-dark);
    --bs-card-border-color: rgb(187, 201, 215);
    & address {
        font-size: var(--fz-title-5);
        line-height: 30px;
        color:var(--bs-card-color);
    }
    & .contact {
        font-size: var(--fz-title-5);
        line-height: 30px;
        color: var(--bs-card-color);
    }
    & .open {
        color: rgb(20, 186, 114);
    }

    & .close {
        color: #eb4c4c;
    }
    & a{
        color:var(--bs-primary);
        text-decoration:none;
        font-family:var(--nunito);
        & svg{
            fill:var(--bs-primary);
            height:18px;
            width:auto;
            margin-bottom:2px;
        }
        &:hover{
            text-decoration: underline;
        }
        &:focus {
            text-decoration:underline;
        }
    }
    .svg-icon svg{
        fill:var(--bs-dark);
        height: 20px;
        width:auto;
    }
    @media (min-width:576px){
        --bs-card-spacer-x: 2rem;
    }
}
.lined-list ul{
  color: var(--bs-dark);
  font-family: var(--nunito);
  font-weight: 400;
  margin-top: var(--space-sm);
  & li {
    font-size: 18px;
    padding: 13px 0;
    &:not(:last-child) {
      border-bottom: 1px solid var(--bs-secondary-border);
    }
    & svg {
      font-size: var(--fz-title-4);
    }
  }
}
.bg-primary .lined-list ul{
    color: #fff;
    & li {
    &:not(:last-child) {
      border-bottom: 1px solid rgba(255,255,255,.25);
    }
  }
}
fieldset:not(.active) {
    display: none;
}
.fred--panel fieldset {
    display: initial;
}
.error-message {
    color: red;
}
.error.error {
    border-color: red !important;
}
@media (min-width: 768px){
    .col-two{
        column-count:2;
        & li:nth-child(5){
            border-bottom:none;
        }
    }
}
@media (min-width:992px){
    .modal-xl {
        --bs-modal-width: 970px;
    }
}
@media (min-width:1200px) {
    .modal-xl {
        --bs-modal-width: 1140px;
    }
}
@media (min-width:1400px){
    .navbar-expand-xxl{
        flex-wrap:wrap;
    }
    .modal-xl {
        --bs-modal-width: 1320px;
    }
}
}

@layer intern {
    .text-hero-grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 500px;
    & .background {
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        width: 100%;
        height: 100%;
        position: relative;
        & img{
            width:100%;
            height:100%;
            object-fit:cover;
        }
    }
    & .carousel-container{
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        width: 100%;
        height: 100%;
        position: relative;
        z-index:1;
        & img{
            height: 500px;
            object-fit:cover;
            position:relative;
            @media (min-width: 768px) and (orientation:portrait) {
                height: clamp(600px, 80vh, 800px);
            }
            @media (min-width: 992px) and (orientation:landscape) {
                height: 100vh;
            }
            @media (min-width: 1200px) {
                height: 100vh;
            }
        }
    }
    &.rounded{
        & .background{
            border-radius:10px;
        }
        & .youtube-background{
            border-radius: 10px;
        }
        &.opacity-bkg::before{
            border-radius: 10px;
        }
    }
    & .content{
        width: 100%;
        position: relative;
        text-align: center;
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        z-index: 3;
        align-self: center;
        color: var(--bs-light);
    }
    & .youtube-background {
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        height: 100%;
        width: 100%;
        position: relative;
        z-index: 1;
        background-repeat: no-repeat;
        background-size: cover;
        & video {
            width: 100% !important;
            height: 100% !important;
            object-fit: cover;
            object-position: center;
            position: relative;
        }
        &:has(video) {
            opacity: 1;
        }
        @media (min-width: 768px) and (orientation:portrait) {
            height: clamp(600px, 80vh, 800px);
        }
        @media (min-width: 992px) and (orientation:landscape) {
            height: 100vh;
        }
        @media (min-width: 1200px) {
            height: 100vh;
        }
    }
    &.opacity-bkg::before {
        content: '';
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        position: relative;
        z-index: 2;
        display: block;
        width: 100%;
        background: rgba(0, 0, 0, .3);
        @media (min-width:768px){
            background: rgba(0, 0, 0, .2);
        }
    }
    & .hero-picture {
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        height: 500px;
        width: 100%;
        position: relative;
        z-index: 1;
        top: 0;
        background: #000;
        & .bg-image {
            width: 100% !important;
            height: 100% !important;
            object-fit: cover;
            object-position: center;
            position: relative;
            opacity: .7;
            @media (min-width:768px){
                opacity: .8;
            }
        }
        @media (min-width: 768px) and (orientation:portrait) {
            height: clamp(600px, 80vh, 800px);
        }
        @media (min-width: 992px) and (orientation:landscape) {
            height: 100vh;
        }
        @media (min-width: 1200px) {
            height: 100vh;
        }
    }
    & .map-circle {
        border-radius: 100%;
        background-color: white;
        height: 350px;
        width: 350px;
        @media (min-width:768px){
            height: 500px;
            width: 500px;
        }
    }
    & .svg-wrapper {
        align-self:end;
        justify-self:end;
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        z-index: 2;
        position: relative;
        padding-right:.85rem;
        padding-bottom: .75rem;
        & a {
            color: #fff;
            font-size:36px;
            line-height:1;
            transition: opacity .3s ease;
            &:hover{
                opacity:.5;
            }
            &:focus{
                opacity:.5;
            }
        }
    }
    @media (min-width: 768px) and (orientation:portrait) {
        height: clamp(600px, 80vh, 800px);
    }
    @media (min-width: 992px) and (orientation:landscape) {
        height: 100vh;
    }
    @media (min-width: 1200px) {
        height: 100vh;
    }
    &.location-cta{
        height:550px;
        & .hero-picture{
            height:550px;
            @media (min-width: 768px) and (orientation:portrait) {
                height: clamp(600px, 80vh, 800px);
            }
            @media (min-width: 992px) and (orientation:landscape) {
                height: 100vh;
            }
            @media (min-width: 1200px) {
                height: 100vh;
            }
        }
        @media (min-width: 768px) and (orientation:portrait) {
            height: clamp(600px, 80vh, 800px);
        }
        @media (min-width: 992px) and (orientation:landscape) {
            height: 100vh;
        }
        @media (min-width: 1200px) {
            height: 100vh;
        }
    }
}
header {
    & .map-hero{
        position:relative;
        height: 375px;
        width:100%;
        overflow: hidden;
        & .hero-picture{
            height: 375px;
            & .bg-image {
                width: 100% !important;
                height: 100% !important;
                object-fit: cover;
                object-position: center;
                position: relative;
            }
            @media (min-width:576px) {
                height:500px;
            }
            @media (min-width:768px){
                height:550px;
            }
            @media (min-width:992px){
                height: clamp(500px, 80vh, 650px);
            }
        }
        @media (min-width:576px) {
            height:500px;
        }
        @media (min-width:768px) {
            height:550px;
        }
        @media (min-width:992px) {
            height: clamp(500px, 80vh, 650px);
        }
    }
    & .text-hero-grid{
        & .carousel-container .hero-picture {
            display: block;
        }
        &.company-hero{
            height:400px;
            & .carousel-container .hero-picture{
                height:400px;
            }
        }
        @media (min-width:768px) and (orientation:portrait) {
            height: clamp(600px, 94vh, 700px);
            & .hero-picture {
                height: clamp(600px, 94vh, 700px);
            }
            & .youtube-background {
                height: clamp(600px, 94vh, 700px);
            }
            & .carousel-container .hero-picture {
                height: clamp(600px, 94vh, 700px) !important;
            }
            &.company-hero{
                height: clamp(600px, 94vh, 700px);
                & .carousel-container .hero-picture {
                    height: clamp(600px, 94vh, 700px) !important;
                }
            }
        }
        @media (min-width:992px) and (orientation:landscape) {
            height: calc(100vh - 129px - .75rem);
            & .hero-picture {
                height: calc(100vh - 129px - .75rem);
            }
            & .youtube-background {
                height: calc(100vh - 129px - .75rem);
            }
            & .carousel-container .hero-picture {
                height: calc(100vh - 129px - .75rem)!important;
            }
            &.company-hero{
                height: calc(100vh - 129px - .75rem);
                & .carousel-container .hero-picture {
                    height: calc(100vh - 129px - .75rem)!important;
                }
            }
        }
        @media (min-width:1200px) {
            height: calc(100vh - 129px - .75rem);
            & .hero-picture{
                height: calc(100vh - 129px - .75rem);
            }
            & .youtube-background {
                height: calc(100vh - 129px - .75rem);
            }
            & .carousel-container .hero-picture{
                height: calc(100vh - 129px - .75rem);
            }
            &.company-hero{
                height: calc(100vh - 129px - .75rem);
                & .carousel-container .hero-picture{
                    height: calc(100vh - 129px - .75rem);
                }
            }
        }
    }
}

.middle-card.card {
    --bs-card-spacer-y: 1.5rem;
    --bs-card-spacer-x: 2rem;
    --bs-card-title-spacer-y: 0.75rem;
    --bs-card-title-color: var(--bs-dark);
    --bs-card-icon-color: var(--bs-primary);
    --bs-card-border-width: 0;
    --bs-card-bg: var(--bs-secondary-bg);
    --bs-card-color: var(--bs-body-color);
    will-change: background-color;
    transition: background-color 0.3s ease;
    min-height:200px;
    &:has(a){
        --bs-card-title-color: var(--bs-primary);
    }
    & svg{
        width:48px;
        height:auto;
        will-change: fill;
        transition: fill 0.3s ease;
        & path{
            fill:var(--bs-card-icon-color) !important;
        }
    }
    & p{
        will-change: color;
        transition: color 0.3s ease;
    }
    & .card-text{
        color:var(--bs-card-color);
        font-size:var(--fz-title-5);
        line-height:30px;
    }
    &:has(a:hover) {
        --bs-card-title-color: #fff;
        --bs-card-icon-color: #fff;
        --bs-card-bg: var(--bs-primary);
        --bs-card-color: #fff;
    }
    &:has(a:focus) {
        --bs-card-title-color: #fff;
        --bs-card-icon-color: #fff;
        --bs-card-bg: var(--bs-primary);
        --bs-card-color: #fff;
    }
}
}