:root{
    --primary-600 : #C78D10;
    --primary-50 : #FFF4E2;
    --primary-700 : #9C6B02;
    --primary-500 : #EDAF29;
    --primary-100 : #FFE7C3;
    --primary-200 : #FFD596;
    --primary-300 : #F3BF71;
    --primary-400 : #EFA941;
    --gray-blue-200 : #D5D9EB;
    --moss-200 : #CEEAB0;
    --gray-25  : #FCFCFD;
    --gray-100 : #F2F4F7;
    --gray-200 : #EAECF0;
    --gray-300 : #D0D5DD;
    --gray-400 : #98A2B3;
    --gray-500 : #667085;
    --gray-600 : #475467;
    --gray-700 : #344054;
    --gray-900 : #101828;
    --gray-50 : #F9FAFB;
    --blue-light-600 : #0086C9;
    --blue-50 : #EFF8FF;
    --blue-200 : #D5D9EB;
    --blue-700 : #175CD3;
    --gray-cool-300: #B9C0D4;
    --gray-cool-400 : #7D89B0;

    --bs-border-radius: 8px;

    --bs-border-color: #D0D5DD;

    --bs-border-radius-xxl: 48px;

}
body{
    font-family: 'Manrope', sans-serif;
}

[x-cloak] { display: none !important; }


.ff-roboto{
    font-family: 'Roboto Slab', serif;
}

/* Navbar */
.navbar{
    --bs-navbar-nav-link-padding-x: 16px;
}
.nav-link{
    --bs-nav-link-color: var(--gray-500);
}
.dropdown-menu{
    --bs-dropdown-font-size: 0.875rem;
    --bs-dropdown-border-color: var(--gray-300);
    --bs-dropdown-link-active-bg: var(--primary-600);
    --bs-dropdown-link-color: var(--gray-500);
}
@media(max-width:992px){
    .navbar-collapse{
        position: absolute;
        top: calc(100% + 22px);
        right: 12px;
        min-width: 200px;
        border: 1px solid var(--gray-300);
        border-radius: 12px;
        background-color: white;
        z-index: 100;
    }
}


/* Buttons */
.btn{
    --bs-btn-padding-x: 18px;
    --bs-btn-padding-y: 10px;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 500;
}
.btn-primary{
    --bs-btn-bg: hsl(41, 85%, 42%);
    --bs-btn-border-color: hsl(41, 85%, 42%);

    --bs-btn-hover-bg: hsl(41, 85%, 48%);
    --bs-btn-hover-border-color: hsl(41, 85%, 48%);

    --bs-btn-active-bg: hsl(41, 85%, 42%);
    --bs-btn-active-border-color: hsl(41, 85%, 42%);
}

.btn-outline-primary{
    background-color: white;
    --bs-btn-color: var(--primary-700);
    --bs-btn-border-color: var(--primary-500);

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--primary-600);
    --bs-btn-hover-border-color: var(--primary-600);

    --bs-btn-active-bg: var(--primary-500);
    --bs-btn-active-border-color: var(--primary-500);
}
.btn-link{
    --bs-btn-hover-color: var(--primary-700);
    --bs-btn-active-color: var(--primary-600);
}
.btn-light{
    --bs-btn-color: var(--gray-700);
    --bs-btn-bg: white;
    --bs-btn-border-color: var(--gray-300);

    --bs-btn-hover-color: var(--gray-700);
    --bs-btn-hover-bg: #f8f9fa;
    --bs-btn-hover-border-color: var(--gray-300);

    --bs-btn-active-color: var(--gray-700);
    --bs-btn-active-bg: white;
    --bs-btn-active-border-color: var(--gray-300);
}

/* Fonts */
.fs-14{
    font-size: 14px;
}
.fs-18{
    font-size: 18px;
}
.fs-30{
    font-size: 30px;
}
.fs-36{
    font-size: 36px;
}

/* Gaps */
.gap-12{
    gap: 12px;
}
.gap-20{
    gap: 20px;
}
.gap-32{
    gap: 32px;
}
.g-32, .gy-32 {
    --bs-gutter-y: 32px;
}
.g-32, .gx-32 {
    --bs-gutter-x: 32px;
}
.g-12, .gx-12 {
    --bs-gutter-x: 12px;
}
.g-12, .gy-12 {
    --bs-gutter-y: 12px;
}

@media (min-width: 768px){
    .g-md-32, .gy-md-32 {
        --bs-gutter-y: 32px;
    }
}
@media (min-width: 768px){
    .g-md-32, .gx-md-32 {
        --bs-gutter-x: 32px;
    }
}


/* Spacing */
.p-10{
    padding: 10px;
}
.px-10{
    padding-left: 10px;
    padding-right: 10px;
}
.px-12{
    padding-left: 12px;
    padding-right: 12px;
}
.p-12{
    padding: 12px;
}
.py-18{
    padding-top: 18px;
    padding-bottom: 18px;
}
.px-32{
    padding-left: 32px;
    padding-right: 32px;
}
.pb-32{
    padding-bottom: 32px;
}
.pt-32{
    padding-top: 32px;
}
.py-32{
    padding-top: 32px;
    padding-bottom: 32px;
}

.p-32{
    padding: 32px;
}
.py-35{
    padding-top: 35px;
    padding-bottom: 35px;
}
.py-40{
    padding-top: 40px;
    padding-bottom: 40px;
}
.py-64{
    padding-top: 64px;
    padding-bottom: 64px;
}
.pt-64{
    padding-top: 64px;
}
.pb-64{
    padding-bottom: 64px;
}
.py-96{
    padding-top: 96px;
    padding-bottom: 96px;
}
.pt-96{
    padding-top: 96px;
}
.pb-96{
    padding-bottom: 96px;
}

.mb-12{
    margin-bottom: 12px;
}
.mb-20{
    margin-bottom: 24px;
}
.mb-32{
    margin-bottom: 32px;
}
.mb-80{
    margin-bottom: 80px;
}

/* Text Colors */
.text-primary-300{
    color: var(--primary-300);
}
.text-primary-400{
    color: var(--primary-400);
}
.text-primary-600{
    color: var(--primary-600);
}
.text-primary-700{
    color: var(--primary-700);
}
.text-blue-700{
    color: var(--blue-700);
}
.text-gray-400{
    color: var(--gray-400);
}
.text-gray-500{
    color: var(--gray-500);
}
.text-gray-600{
    color: var(--gray-600);
}
.text-gray-700{
    color: var(--gray-700);
}
.text-gray-900{
    color: var(--gray-900);
}
.border-gray-100{
    border-color: var(--gray-100) !important;
}

/* Background Colors */
.bg-primary-200{
    background-color: var(--primary-200);
}
.bg-primary-50{
    background-color: var(--primary-50);
}
.bg-primary-100,.hover-bg-primary-100:hover{
    background-color: var(--primary-100);
}

.bg-primary-300{
    background-color: var(--primary-300);
}
.bg-primary-400{
    background-color: var(--primary-400);
}
.bg-primary-500{
    background-color: var(--primary-500);
}
.bg-blue-200{
    background-color: var(--blue-200);
}
.bg-blue-50{
    background-color: var(--blue-50);
}
.bg-gray-25{
    background-color: var(--gray-25);
}
.bg-gray-50{
    background-color: var(--gray-50);
}
.bg-gray-100{
    background-color: var(--gray-100);
}
.bg-gray-300{
    background-color: var(--gray-300);
}
.bg-gray-500{
    background-color: var(--gray-500);
}
.bg-gray-600{
    background-color: var(--gray-600);
}
.bg-gray-900{
    background-color: var(--gray-900);
}
.bg-cool-gray-300{
    background-color: var(--gray-cool-300);
}
.bg-cool-gray-400{
    background-color: var(--gray-cool-400);
}
.bg-moss-200{
    background-color: var(--moss-200);
}

/* borders */
.border-blue-light-600{
    border-color: var(--blue-light-600);
}
.border-gray-200{
    border-color: var(--gray-200);
}
.border-gray-300{
    border-color: var(--gray-300) !important;
}
.border-gray-400{
    border-color: var(--gray-400) !important;
}
.borde-primary-500{
    border-color: var(--primary-500);
}
.border-primary-600{
    border-color: var(--primary-600) !important;
}

.border-dashed{
    border-style: dashed !important;
}
.border-s-dashed{
    border-left-style: dashed !important;
}
/* Opacity */
.opacity-20{
    opacity: .2;
}
.opacity-60{
    opacity: .6;
}
.link-hover-opacity:hover{
    opacity: .8;
}
/* Forms */
.form-control{
    padding: 10px 14px;
}
.form-select{
    padding-top: 10px;
    padding-left: 14px;
    padding-bottom: 10px;
}
.form-control:focus,.form-select:focus{
    box-shadow: none;
    border-color: var(--primary-600);
}

/* Aside Images */
@media (min-width: 992px)
{
    .aside-img {
        min-width: 50vw;
    }
}
@media(min-width:1200px){
    .banner-bg{
        width: calc(100% - 60px) !important;
        height: calc(100% - 60px) !important;
    }
}


/* Banner */
@media(min-width:992px){
    .banner-header{
        height: 658px;
    }
}
@media(min-width:1200px){
.banner-header{
    height: 800px;
}
}
@media(min-width:1400px){
    .banner-header{
        height: 963px;
    }
}


@media(min-width:1200px){
    .page-header{
        padding: 200px 0px;
    }
    
}

.cta-section{
    padding-top: 244px;
    padding-bottom: 184px;
    margin-top: -84px;
    z-index: -1;
}

/* Tabs */
@media(min-width:992px) {
    .mock-tabs{
        border-top-width: 4px;
        border-top-style: solid;
    }
}
@media(max-width:992px) {
    .mock-tabs{
        border-left-width: 4px;
        border-left-style: solid;
    }
}


.rounded-aside-md-left{
    border-radius: 0px 32px 32px 0px;
}
.rounded-aside-md-right{
    border-radius: 32px 0px 0px 32px;
}
@media(max-width:992px) {
    .rounded-aside-md-left,.rounded-aside-md-right{
        border-radius: 32px;
    }
}

.rounded-aside-left{
    border-radius: 0px 48px 48px 0px;
}
.rounded-aside-right{
    border-radius: 48px 0px 0px 48px;
}
@media(max-width:992px) {
    .rounded-aside-left,.rounded-aside-right{
        border-radius: 48px;
    }
}
/* -------------- Accordion ------------------- */
.accordion-item{
    padding: 32px 0px;
}
.accordion{
    --bs-accordion-active-color: var(--gray-900);
}
.accordion-item .accordion-button::after{
    height: 24px;
    width: 24px;
    background-image: url(../images/icon/plus.svg);
}
.accordion-item .accordion-button:not(.collapsed)::after{
    background-image: url(../images/icon/minus.svg);
}
.accordion-button
{
    background-color: transparent !important;
    box-shadow: none !important;
}
.accordion-button:not(.collapsed){
    border: 0px;  
}

.footer-nav .nav-link{
    color: var(--gray-500);
}


.boxed-cout{
    width: 120px;
    height: 120px;
    font-size: 72px;
    border-radius: 32px;
}
@media(max-width:992px){
    .boxed-cout{
        width: 70px;
        height: 70px;
        font-size: 30px;
        border-radius: 18px;
    } 
}

.boxed-cout-first{
    border-radius: 48px 48px 0px 0px;
}
.boxed-cout-last{
    border-radius: 0px 0px 48px 48px;
}

@media(min-width:992px){
    .strategy-tile1{
        max-width: 223px;
        min-height: 300px;
    }
    .strategy-tile2{
        max-width: 287px;
        min-height: 160px;
    }
    
    .strategy-tile3{
        max-width: 212px;
        min-height: 157px;
    }
    .strategy-tile4{
        min-height: 182px;
    }
}

.shadow-portfolio-moc{
    box-shadow: 32px 32px 64px 0px rgba(52, 64, 84, 0.08);
}
@media(min-width:992px){
    .proof-mock-thumb{
        min-width: 50vw;
        height: 548px;
    }
}
@media(max-width:992px){
    .case-study-pointer{
        border-radius: 24px;
    }
}

@media (min-width: 1200px){
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1064px;
    }
    .container-extended{
        max-width: 1140px;
    }
}

.contact-aside{
    padding: 56px;
}
.contact-aside h1{
    font-size: 36px;
}

@media (min-width: 1400px){
    .contact-aside{
        min-width: 56vw;
    }
}
.blog-header{
    padding-top: 136px;
    padding-bottom: 240px;
    padding-left: 56px;
    padding-right: 56px;
    max-width: 1190px;
    border-radius: 48px;
}

.shadow-lg{
    box-shadow: 0px 4px 6px -2px rgba(16, 24, 40, 0.03), 
    0px 12px 16px -4px rgba(16, 24, 40, 0.08) !important;
}

.blog-list-section{
    margin-top: -153px;
}


.pagination{
    --bs-pagination-border-width: 0px;
    --bs-pagination-color: black;
    --bs-pagination-hover-color:#1D2939;
    --bs-pagination-active-bg:#F9FAFB;
    --bs-pagination-hover-bg: var(--primary-400);
    --bs-pagination-active-color:#1D2939;
    --bs-pagination-bg: transparent;
    --bs-pagination-padding-x: 16px;
    --bs-pagination-padding-y: 8px;
    --bs-pagination-focus-box-shadow: none;
}
.pagination .page-item .page-link {
    border-radius: 8px;
}

.swiper-btn{
    width: 56px;
    height: 56px;
}

@media (min-width: 1400px)
{
    .container-extended{
        max-width: 1280px;
    }
}
.highlighted-slide{
    transition: all ease-in-out 300ms 1s;
    flex-shrink: 0;
}
@media(min-width:992px){
    .clients-slider.complete .highlighted-slide{
        margin-right: 0px;
    }
    .highlighted-slide{
        width: 346px;
        margin-right: -346px;
    }
}

@media(max-width:992px){
    .clients-slider.complete .highlighted-slide{
       height: auto;
    }
    .highlighted-slide{
       height: 0px;
    }
}
.testimonial-block{
    padding-top: 85px;
    padding-bottom: 85px;
}
@media(min-width:992px){
    .testimonial-block{
        padding-top: 142px;
        margin-top: -46px;
    }
}
@media(min-width:1400px){
    .px-xl-96{
        padding-left: 96px !important;
        padding-right: 96px !important;
    }
}


@media(min-width:992px){
    .podcast-sidebar{
        max-width: 420px;
        height: 100%;
    }
    .podcast-main{
        height: 100%;
    }
}

.filter-tag{
    background-color: #F8F9FC;
    color: #363F72;
}
.podcast-content-container{
    max-width: 696px;
}
.mb-6{
    margin-bottom: 6px;
}
.w-56{
    width: 56px;
}
.fs-12{
    font-size: 12px;
}