/* Color Palette */
:root {

    --base-50: #fbf8eb;
    --base-100: #f6edcb;
    --base-200: #efda99;
    --base-300: #e5be5f;
    --base-400: #dea83c;
    --base-500: #cd8e25;
    --base-600: #b06e1e;
    --base-700: #8d4f1b;
    --base-800: #76401d;
    --base-900: #65371e;
    --base-950: #3a1b0e;

    --base-primary: #B25818;
    --base-dark: #191A19;
    --base-yellow-primary: #CD8E25;
    --base-yellow-secondary: #DEA83C;
    --base-white: #fafafa;
    --base-gray: #f4f4f4;

    --blog-meta: #b3b3b3;
    --slider-prev-btn: #bababa;
}

/* Reset Everything Color */
* {
    color: var(--base-dark);
}



#services-section {
    background: url('../media/imgs/bg/about-us-section.webp') no-repeat center;
    background-size: cover;
}

/* Why choose us */
#why-choose-us-section {
    background: url('../media/imgs/bg/why-choose-us-section.webp') no-repeat center !important;
    background-size: cover !important;
}

/* header background */
#header {
    background: url('../media/imgs/bg/header.webp') no-repeat center ;
    background-size: cover;
    background-attachment: fixed;
}

/* footer background */
#footer {
    background-image: url('../media/imgs/bg/bg-footer.webp') !important;
    background-size: cover;
}

#why-choose-us-section .card-body img {
    content: url('../media/imgs/icon/feature.webp') !important;
}

#blog-section .card-footer img {
    content: url('../media/imgs/blog/read-more.webp') !important;
}
#blog-cards-section .card-footer img {
    content: url('../media/imgs/blog/read-more.webp') !important;
}
#services-slider .hstack img {
    content: url('../media/imgs/service/read-more.webp') !important;
}
#service-cards-section .hstack img {
    content: url('../media/imgs/service/read-more.webp') !important;
}
#about-us-section .hstack img {
    content: url('../media/imgs/icon/value.webp') !important;
}

/* Buttons */
.btn-primary {
    background: linear-gradient(90deg, var(--base-yellow-secondary) 0%, var(--base-yellow-primary) 100%);
    color: var(--base-white) !important;
    border: none !important;
}

.btn-primary>span{
    color: var(--base-white) !important;
}

.btn:hover>svg {
    transform: var(--bs-icon-link-transform, translate3d(.2em, 0, 0)) !important;
}

.btn>svg {
    fill: var(--base-white) !important;
    vertical-align: text-top !important;
    transition: transform 0.3s ease-in-out !important;
}

.service-card-details-overlay {
    height: 0;
    overflow: hidden;
    background: linear-gradient(180deg, rgba(112, 53, 23, 0.56) 0%, #703517 100%);
}

.services-slider-next-btn,
.services-slider-prev-btn {
    max-width: 32px !important;
    max-height: 32px !important;
}

.services-slider-next-btn {
    background: linear-gradient(44.12deg, var(--base-400) 1.93%, var(--base-primary) 99.58%);
}

.services-slider-next-btn svg {
    fill: var(--base-white);
    color: var(--base-white);
}

.services-slider-prev-btn,
.services-slider-prev-btn>svg,
.services-slider-prev-btn:hover {
    fill: var(--slider-prev-btn)!important;
    color: var(--slider-prev-btn)!important;
    border-color: var(--slider-prev-btn) !important;
}

.service-card .service-card-details-overlay,
.service-card .read-more-img {
    transition: .3s ease;
}

.service-card:hover .service-card-details-overlay {
    height: 100% !important;
}

.service-card:hover .read-more-img {
    opacity: 1 !important;
}

.bg-gray,
.bg-section-gray {
    background-color: var(--base-gray) !important;
}

.bg-dark {
    background-color: var(--base-dark) !important;
}

.text-dark {
    color: var(--base-dark) !important;
}

.text-white,
.text-white * {
    color: #FAFAFA !important;
}

.bg-primary {
    background: var(--base-primary) !important;
}

.text-primary-subheading {
    color: var(--base-primary) !important;
}

.navbar-font-size {
    font-size: 14px;
}

.text-yellow-primary {
    color: var(--base-yellow-primary) !important;
}

.text-yellow-primary svg * {
    fill: var(--base-yellow-primary) !important;
    color: var(--base-yellow-primary) !important;
}

.service-areas .area-name {
    color: var(--base-white) !important;
}

.glassmorphism-card {
    /* From https://css.glass */
    background: rgba(236, 229, 229, 0.25);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    border: 1px solid rgba(236, 229, 229, 0.28);
}

.why-choose-us-pb {
    padding-bottom: 6rem !important;
}

.blog-small-circle {
    background: linear-gradient(180deg, rgba(254, 191, 26, 0.5) 0%, rgba(254, 212, 75, 0.5) 100%);
    width: 56px;
    height: 56px;
}

.blog-quote-circle {
    width: 36px;
    height: 36px;
}

.blog-card {
    margin-top: -8rem;
}

.bg-locations-shadow {
    box-shadow: 0px 0px 40px 0px #401B0852;
}

.bg-locations-gradient {
    background-color: #401B08;
}

.blog-title {
    color: var(--base-dark) !important;
}

.blog-meta,
.blog-meta svg,
.blog-meta span {
    font-size: 12px !important;
    fill: var(--blog-meta) !important;
    color: var(--blog-meta) !important;
}

.blog-meta span.author-name {
    color: var(--base-primary) !important;
}

.bullet-points *,
.table-of-content * {
    color: var(--base-primary) !important;
}

/* Backgrounds */
.bg-primary {
    background: var(--base-primary) !important;
}

@media (max-width: 767px) {

    .btn-submit,
    .btn-load-more {
        width: 100% !important;
    }
}

/* Card Icon(s) */
.card-icon {
    width: 80px;
    height: 80px;
}

.small-icon {
    width: 48px;
    height: 48px;
}

.small-icon svg {
    fill: var(--base-white) !important;
    color: var(--base-white) !important;
}

/* Form */
form .form-label {
    color: var(--base-dark);
}

form select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23a9b2b7' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
}

.form-input {
    border: 1px solid var(--base-dark) !important;
    color: var(--base-dark) !important;
    border-radius: 8px !important;
}

::placeholder,
.form-input-dark::placeholder {
    color: var(--base-dark) !important;
}

.form-input-dark {
    border: 1px solid var(--base-dark) !important;
    color: var(--base-dark) !important;
    border-radius: 8px !important;
}

/* Others (Extras) */

.border-primary {
    border-color: var(--base-primary) !important;
}

.svg-fill-primary {
    color: var(--base-primary) !important;
    fill: var(--base-primary) !important;
}

.svg-fill-dark {
    color: var(--base-950) !important;
    fill: var(--base-950) !important;
}

.text-primary {
    color: var(--base-primary) !important;
}

/* Common Styles */
/* Top Infobar */
.top-infobar {
    background-color: var(--base-dark) !important;
}

.top-infobar .top-infobar-icons a:hover {
    color: var(--base-primary) !important;
}

/* Top Navbar + Header Styles */
.fixed-top {
    position: fixed !important;
    top: 0 !important;
    z-index: 1030 !important;
}


.offcanvas-mobile-menu .mobile-menu-list li>a,
.offcanvas-mobile-menu .mobile-menu-list ul>a,
.offcanvas-mobile-menu .mobile-menu-icons a {
    color: var(--base-white) !important;
}

.navbar-nav.navbar-desktop-menu .nav-item a.nav-link {
    color: var(--base-white) !important;
}

header .header-icons a svg {
    fill: var(--base-primary) !important;
}

header .header-content h1 {
    color: var(--base-white) !important;
}

header .header-content h1>span {
    color: var(--base-primary) !important;
}

header .header-content p {
    color: var(--base-white) !important;
}

header .header-content p.text-primary {
    color: var(--base-primary) !important;
}

.header-sm {
    min-height: 60vh !important;
}

.top-navbar,
.navbar-nav .nav-item a.nav-link,
.navbar-nav.navbar-mobile-menu .dropdown-item {
    transition: background-color 0.5s, border-bottom-color 0.5s !important;
}

.navbar-nav.navbar-desktop-menu .nav-item a.nav-link.active,
.navbar-nav.navbar-desktop-menu .nav-item:hover a.nav-link {
    color: var(--base-white) !important;
    border-bottom: 2px solid var(--base-yellow-primary) !important;
}

.navbar-nav.navbar-mobile-menu .nav-item a.nav-link.active,
.navbar-nav.navbar-mobile-menu .nav-item:hover a.nav-link,
.navbar-nav.navbar-mobile-menu .dropdown-item:hover {
    color: var(--base-white) !important;
    background: var(--base-dark) !important;
}

.navbar-border,
.hr-border {
    border-color: var(--base-600) !important;
}

/* Services (Custom) Dropdown */
.custom-dropdown {
    display: none !important;
    border: 1px solid var(--base-950);
    animation: 0.5s slideup !important;
}

.custom-nav-item:hover .custom-dropdown.slideup {
    display: block !important;
    position: absolute !important;
    margin-top: 1px !important;
}

.custom-dropdown a.custom-nav-link {
    display: block !important;
    padding: 0.25rem 0.75rem !important;
    text-decoration: none !important;
    color: var(--base-white) !important;
}

.custom-dropdown a.custom-nav-link:hover,
.custom-dropdown a.custom-nav-link.active,
.dropdown-item.active,
.dropdown-item:active {
    color: var(--base-white) !important;
    background: var(--base-dark) !important;
}

@keyframes slideup {
    from {
        transform: translateY(10%);
    }

    to {
        transform: translateY(0);
    }
}

/* Sections Styles - START */

/* Footer */
/* set `color` for all (*) content inside `footer` */
#footer * {
    color: var(--base-white);
}

/* Sections Styles - END */
/* Common Cards Styles */

/* Services Carousel Customization */
@media (min-width: 768px) {

    .services-carousel .service-card {
        margin-bottom: 3rem !important;
    }
}

.services-carousel .service-card {
    margin: 3rem 0;
}
