/* LG CSS Library v0.5.6 */

/* Home */
/* =========================================
   VACHELLIA PREMIER CLEANING
   HOMEPAGE CSS v1.3
   LG CSS Library
   ========================================= */


/* =========================================
   GLOBAL SECTIONS
   ========================================= */

.vpc-hero,
.vpc-why,
.vpc-about,
.vpc-services,
.vpc-contact {
    background: #ffffff;
}

.vpc-hero .row,
.vpc-why .row,
.vpc-about .row,
.vpc-cta .row,
.vpc-services .row,
.vpc-contact .row {
    max-width: 1240px;
}


/* =========================================
   HERO SECTION
   ========================================= */

.vpc-hero h1 {
    font-size: clamp(42px, 5.4vw, 76px);
    line-height: 1.06;
    letter-spacing: -0.045em;
    margin: 14px 0 25px;
    color: #111111;
}

.vpc-hero h1 span {
    color: #008ed3;
}

.vpc-eyebrow {
    color: #008ed3;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.vpc-hero .vpc-lead {
    font-size: 19px;
    line-height: 1.65;
    max-width: 550px;
    color: #4e5963;
}


/* =========================================
   GENERAL BUTTONS
   ========================================= */

.vpc-hero .button,
.vpc-about .button,
.vpc-cta .button,
.vpc-contact .button {
    margin-top: 12px;
    margin-right: 10px;
    padding: 4px 24px;
    font-weight: 700;
}

.vpc-btn-outline {
    background: transparent !important;
    border: 2px solid #008ed3 !important;
    color: #1d2327 !important;
}


/* =========================================
   GENERAL IMAGES
   ========================================= */

.vpc-photo img {
    width: 100%;
    object-fit: cover;
    border-radius: 20px;
}

.vpc-hero-photo img,
.vpc-about-photo img {
    aspect-ratio: 5 / 4;
}


/* =========================================
   SECTION HEADINGS
   ========================================= */

.vpc-why,
.vpc-services {
    text-align: center;
}

.vpc-why h2,
.vpc-about h2,
.vpc-services h2,
.vpc-contact h2 {
    font-size: clamp(30px, 3.3vw, 46px);
    line-height: 1.17;
    letter-spacing: -0.025em;
    margin: 0 0 16px;
}

.vpc-why > .section-content > .ux-text,
.vpc-services > .section-content > .ux-text {
    max-width: 760px;
    margin: 0 auto 30px;
}

.vpc-why p,
.vpc-about p,
.vpc-services p,
.vpc-contact p {
    line-height: 1.7;
    color: #53606b;
}


/* =========================================
   WHY CHOOSE US CARDS
   ========================================= */

.vpc-benefit-grid .col-inner {
    height: 100%;
    padding: 28px 20px;
    border: 1px solid #e9edf1;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.035);
}

.vpc-benefit-card h3 {
    font-size: 19px;
    margin: 12px 0 8px;
    color: #111111;
}

.vpc-benefit-card p {
    font-size: 14px;
}

.vpc-icon-placeholder {
    max-width: 64px;
    margin: 0 auto;
}

.vpc-icon-placeholder img {
    width: 64px;
    height: 64px;
    object-fit: cover;
    border-radius: 50%;
}


/* =========================================
   ABOUT US
   ========================================= */

.vpc-about-media .col-inner {
    padding-right: 25px;
}

.vpc-about-copy .col-inner {
    padding-left: 20px;
}


/* =========================================
   CALL TO ACTION
   ========================================= */

.vpc-cta {
    background: #151b21 !important;
    border-radius: 22px;
    margin: 10px auto;
    max-width: 1240px;
    overflow: hidden;
}

.vpc-cta h2,
.vpc-cta p {
    color: #ffffff !important;
}

.vpc-cta h2 {
    font-size: clamp(28px, 3vw, 42px);
    margin: 0 0 10px;
}

.vpc-cta .vpc-eyebrow {
    color: #67c7ff !important;
}

.vpc-cta-action {
    text-align: right;
}


/* =========================================
   SERVICES GRID
   EQUAL HEIGHT COLUMNS
   ========================================= */

.vpc-service-grid {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch !important;
}

/* Stretch all service columns */

.vpc-service-grid > .vpc-service-card {
    display: flex;
    flex-direction: column;
    align-self: stretch;
}

/* Main service card */

.vpc-service-grid .vpc-service-card > .col-inner {
    display: flex;
    flex-direction: column;

    flex: 1 1 auto;

    width: 100%;
    height: 100%;

    padding: 0 0 24px !important;

    background: #ffffff;

    border: 1px solid #d5d5d5 !important;
    border-radius: 22px !important;

    overflow: hidden;

    text-align: center !important;

    box-sizing: border-box;

    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

/* Remove Flatsome border overlay */

.vpc-service-grid .vpc-service-card > .col-inner > .is-border {
    display: none !important;
}

/* Card hover */

.vpc-service-grid .vpc-service-card > .col-inner:hover {
    transform: translateY(-5px);

    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
}


/* =========================================
   SERVICE IMAGES
   4:3 ASPECT RATIO
   ========================================= */

.vpc-service-grid .vpc-service-photo {
    width: 100%;
    margin: 0 0 22px !important;
    flex-shrink: 0;
}

/* Image container */

.vpc-service-grid .vpc-service-photo .img-inner {
    width: 100%;
    aspect-ratio: 4 / 3 !important;
    height: auto !important;
    overflow: hidden;
}

/* Image */

.vpc-service-grid .vpc-service-photo img {
    display: block;

    width: 100%;
    height: 100% !important;

    aspect-ratio: 4 / 3;

    object-fit: cover;

    border-radius: 0 !important;

    transition: transform 0.4s ease;
}

/* Image hover zoom */

.vpc-service-grid .vpc-service-card:hover
.vpc-service-photo img {
    transform: scale(1.04);
}


/* =========================================
   SERVICE CARD TEXT
   EQUAL LEFT AND RIGHT SPACING
   ========================================= */

/* Prevent inherited Flatsome spacing issues */

.vpc-service-grid .vpc-service-card h3,
.vpc-service-grid .vpc-service-card p {
    box-sizing: border-box;

    padding: 0 !important;

    text-align: center !important;
}

/* Service headings */

.vpc-service-grid .vpc-service-card h3 {
    display: block;

    width: calc(100% - 40px);

    margin: 0 20px 12px !important;

    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;

    color: #111111;
}

/* Service descriptions */

.vpc-service-grid .vpc-service-card p {
    display: block;

    width: calc(100% - 40px);

    margin: 0 20px 22px !important;

    font-size: 14px;
    line-height: 1.7;

    color: #53606b;
}

/* If text is inside a Flatsome UX Text element */

.vpc-service-grid .vpc-service-card .ux-text {
    width: 100%;
    padding: 0 !important;
    margin: 0 !important;

    text-align: center !important;
}


/* =========================================
   SERVICE BUTTONS
   CENTRED AND ALIGNED AT BOTTOM
   ========================================= */

.vpc-service-grid .vpc-card-button {
    display: inline-flex !important;

    align-items: center;
    justify-content: center;

    align-self: center !important;

    width: auto;
    max-width: calc(100% - 40px);

    margin-top: auto !important;
    margin-bottom: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;

    padding: 4px 22px !important;

    border-radius: 99px !important;

    background-color: #1d2327;
    color: #ffffff;

    font-size: 12px !important;
    font-weight: 700;

    text-align: center !important;

    transition:
        background-color 0.25s ease,
        transform 0.25s ease;
}

/* Button hover */

.vpc-service-grid .vpc-card-button:hover {
    background-color: #000000 !important;
    color: #ffffff !important;

    transform: translateY(-2px);
}


/* =========================================
   CONTACT SECTION
   ========================================= */

.vpc-contact-info h3 {
    font-size: 16px;
    margin: 16px 0 2px;
}

.vpc-contact-info a {
    overflow-wrap: anywhere;
    color: #008ed3;
}

.vpc-contact-panel .col-inner {
    background: #f5f8fb;
    border: 1px solid #e4edf3;
    border-radius: 20px;
    padding: 36px;
}

.vpc-contact-panel h3 {
    font-size: 27px;
}

.vpc-contact-panel .vpc-small {
    font-size: 12px;
    margin-top: 20px;
}


/* =========================================
   ANCHOR LINKS
   ========================================= */

.vpc-anchor {
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 849px) {

    .vpc-hero h1 {
        font-size: 46px;
    }

    .vpc-about-media .col-inner,
    .vpc-about-copy .col-inner {
        padding: 0;
    }

    .vpc-cta {
        border-radius: 0;
    }

    .vpc-cta-action {
        text-align: left;
    }

    .vpc-benefit-grid .col,
    .vpc-service-grid .col {
        margin-bottom: 15px;
    }

    .vpc-service-grid .vpc-service-card > .col-inner {
        padding-bottom: 24px !important;
    }

    .vpc-contact-panel .col-inner {
        padding: 24px;
    }

}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 549px) {

    .vpc-hero h1 {
        font-size: 40px;
    }

    .vpc-hero .vpc-lead {
        font-size: 16px;
    }

    .vpc-hero .button {
        margin-bottom: 8px;
    }

    .vpc-why h2,
    .vpc-about h2,
    .vpc-services h2,
    .vpc-contact h2 {
        font-size: 30px;
    }

    .vpc-cta h2 {
        font-size: 29px;
    }

    /* Service cards */

    .vpc-service-grid .vpc-service-card > .col-inner {
        border-radius: 18px !important;
        padding-bottom: 24px !important;
    }

    .vpc-service-grid .vpc-service-card h3 {
        font-size: 20px;
    }

    .vpc-service-grid .vpc-service-card p {
        font-size: 15px;
    }

    .vpc-service-grid .vpc-card-button {
        margin-left: auto !important;
        margin-right: auto !important;
    }

}


/* =========================================
   ACCESSIBILITY
   ========================================= */

@media (prefers-reduced-motion: reduce) {

    .vpc-service-grid .vpc-service-card > .col-inner,
    .vpc-service-grid .vpc-service-photo img,
    .vpc-service-grid .vpc-card-button {
        transition: none !important;
        transform: none !important;
    }

}

/* Menu Bounce */
/* =========================================
   LITTLE GOLIATH - FLATSOME MENU BOUNCE
   Animated underline + hover bounce
   ========================================= */

/* Menu links */
.header-nav.nav > li > a {
    position: relative;
    transition: color 0.25s ease;
}

/* Animated underline */
.header-nav.nav > li > a::after {
    content: "";
    position: absolute;
    bottom: 0px;
    left: 50%;
    width: 0;
    height: 2px;
    background-color: #008ed3;
    border-radius: 3px;
    transform: translateX(-50%);
    transition: width 0.3s ease;
    pointer-events: none;
}

/* Underline on hover */
.header-nav.nav > li:hover > a::after,
.header-nav.nav > li > a:hover::after {
    width: 100%;
}

/* Bounce animation */
.header-nav.nav > li:hover > a {
    animation: lg-menu-bounce 0.4s ease;
}

/* Active menu underline */
.header-nav.nav > li.active > a::after,
.header-nav.nav > li.current-menu-item > a::after,
.header-nav.nav > li.current_page_item > a::after,
.header-nav.nav > li.current-menu-ancestor > a::after {
    width: 100%;
}

/* Bounce keyframes */
@keyframes lg-menu-bounce {
    0% {
        transform: translateY(0);
    }

    35% {
        transform: translateY(-5px);
    }

    65% {
        transform: translateY(2px);
    }

    100% {
        transform: translateY(0);
    }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    .header-nav.nav > li > a {
        animation: none !important;
        transition: none !important;
    }

    .header-nav.nav > li > a::after {
        transition: none !important;
    }
}
/* Flatsome Header Menu - Uppercase */

.header-nav.nav > li > a {
    text-transform: uppercase !important;
}

/* About Us */
/* Vachellia Premier Cleaning | About Us + Services | v1.0 | LG CSS Library */
.vpc-inner-page{background:#fff;color:#222}
.vpc-inner-page .row{max-width:1240px}
.vpc-inner-page .vpc-eyebrow{color:#008ed3;font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;margin:0 0 12px}
.vpc-inner-page h1{font-size:clamp(38px,4.7vw,66px);line-height:1.12;letter-spacing:-.035em;color:#111;margin:0 0 22px}
.vpc-inner-page h2{font-size:clamp(29px,3vw,43px);line-height:1.2;letter-spacing:-.025em;color:#008ed3;margin:0 0 18px}
.vpc-inner-page h3{color:#111;line-height:1.35}
.vpc-inner-page p{font-size:16px;line-height:1.75;color:#53606b}
.vpc-inner-page .vpc-inner-lead{font-size:19px;max-width:570px;line-height:1.65}
.vpc-inner-page .vpc-inner-image{width:100%;margin:0}
.vpc-inner-page .vpc-inner-image .img-inner{border-radius:20px;overflow:hidden}
.vpc-inner-page .vpc-inner-image img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.vpc-inner-page .vpc-inner-copy{padding-right:15px}
.vpc-inner-page .vpc-section-intro{text-align:center;max-width:780px;margin:0 auto 30px}
.vpc-inner-page .vpc-section-intro p{margin-bottom:12px}
.vpc-inner-page .button{font-weight:700;padding:4px 24px}
.vpc-purpose-card,.vpc-approach-card{display:flex}
.vpc-purpose-card>.col-inner,.vpc-approach-card>.col-inner{background:#fff;border:1px solid #d9e2e9;border-radius:20px;padding:30px 25px;height:100%;width:100%;box-shadow:0 6px 22px rgba(0,0,0,.045)}
.vpc-purpose-card h3,.vpc-approach-card h3{font-size:22px;color:#008ed3;margin:0 0 13px}
.vpc-purpose-card p,.vpc-approach-card p{margin-bottom:0}
.vpc-approach-card h3{font-size:19px}
.vpc-inner-banner{background:#151b21!important;max-width:1240px;margin:20px auto;border-radius:22px;overflow:hidden}
.vpc-inner-banner h2,.vpc-inner-banner p{color:#fff!important}
.vpc-inner-banner .vpc-eyebrow{color:#67c7ff!important}
.vpc-banner-action{text-align:right}
.vpc-service-detail-alt{background:#f7fafc}
.vpc-service-detail-copy h3{font-size:21px;margin:0 0 16px}
.vpc-service-detail-copy p{max-width:600px}
.vpc-services-note{background:#f7fafc}
@media(max-width:849px){.vpc-inner-page .vpc-inner-copy{padding-right:0}.vpc-inner-banner{border-radius:0}.vpc-banner-action{text-align:left}.vpc-purpose-card,.vpc-approach-card{margin-bottom:18px}}
@media(max-width:549px){.vpc-inner-page h1{font-size:37px}.vpc-inner-page h2{font-size:30px}.vpc-inner-page .vpc-inner-lead{font-size:16px}.vpc-inner-page p{font-size:15px}.vpc-purpose-card>.col-inner,.vpc-approach-card>.col-inner{padding:25px 22px}}


/* Services */
/* Vachellia Premier Cleaning | About Us + Services | v1.0 | LG CSS Library */
.vpc-inner-page{background:#fff;color:#222}
.vpc-inner-page .row{max-width:1240px}
.vpc-inner-page .vpc-eyebrow{color:#008ed3;font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;margin:0 0 12px}
.vpc-inner-page h1{font-size:clamp(38px,4.7vw,66px);line-height:1.12;letter-spacing:-.035em;color:#111;margin:0 0 22px}
.vpc-inner-page h2{font-size:clamp(29px,3vw,43px);line-height:1.2;letter-spacing:-.025em;color:#008ed3;margin:0 0 18px}
.vpc-inner-page h3{color:#111;line-height:1.35}
.vpc-inner-page p{font-size:16px;line-height:1.75;color:#53606b}
.vpc-inner-page .vpc-inner-lead{font-size:19px;max-width:570px;line-height:1.65}
.vpc-inner-page .vpc-inner-image{width:100%;margin:0}
.vpc-inner-page .vpc-inner-image .img-inner{border-radius:20px;overflow:hidden}
.vpc-inner-page .vpc-inner-image img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.vpc-inner-page .vpc-inner-copy{padding-right:15px}
.vpc-inner-page .vpc-section-intro{text-align:center;max-width:780px;margin:0 auto 30px}
.vpc-inner-page .vpc-section-intro p{margin-bottom:12px}
.vpc-inner-page .button{font-weight:700;padding:4px 24px}
.vpc-purpose-card,.vpc-approach-card{display:flex}
.vpc-purpose-card>.col-inner,.vpc-approach-card>.col-inner{background:#fff;border:1px solid #d9e2e9;border-radius:20px;padding:30px 25px;height:100%;width:100%;box-shadow:0 6px 22px rgba(0,0,0,.045)}
.vpc-purpose-card h3,.vpc-approach-card h3{font-size:22px;color:#008ed3;margin:0 0 13px}
.vpc-purpose-card p,.vpc-approach-card p{margin-bottom:0}
.vpc-approach-card h3{font-size:19px}
.vpc-inner-banner{background:#151b21!important;max-width:1240px;margin:20px auto;border-radius:22px;overflow:hidden}
.vpc-inner-banner h2,.vpc-inner-banner p{color:#fff!important}
.vpc-inner-banner .vpc-eyebrow{color:#67c7ff!important}
.vpc-banner-action{text-align:right}
.vpc-service-detail-alt{background:#f7fafc}
.vpc-service-detail-copy h3{font-size:21px;margin:0 0 16px}
.vpc-service-detail-copy p{max-width:600px}
.vpc-services-note{background:#f7fafc}
@media(max-width:849px){.vpc-inner-page .vpc-inner-copy{padding-right:0}.vpc-inner-banner{border-radius:0}.vpc-banner-action{text-align:left}.vpc-purpose-card,.vpc-approach-card{margin-bottom:18px}}
@media(max-width:549px){.vpc-inner-page h1{font-size:37px}.vpc-inner-page h2{font-size:30px}.vpc-inner-page .vpc-inner-lead{font-size:16px}.vpc-inner-page p{font-size:15px}.vpc-purpose-card>.col-inner,.vpc-approach-card>.col-inner{padding:25px 22px}}


/* quote card */
/* Vachellia Footer Quote Card */

.vpc-footer-quote-card {
    background: rgba(0, 142, 211, 0.10);
    border: 1px solid rgba(0, 142, 211, 0.35);
    border-left: 4px solid #008ed3;
    border-radius: 12px;
    padding: 18px 22px;
    margin: 20px 0;
    transition: background 0.3s ease;
}

.vpc-footer-quote-card p {
    margin: 0 !important;
    color: #0087cd;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}

.vpc-footer-quote-card:hover {
    background: rgba(0, 142, 211, 0.18);
}

@media (max-width: 549px) {
    .vpc-footer-quote-card {
        padding: 15px 18px;
    }

    .vpc-footer-quote-card p {
        font-size: 15px;
    }
}

/* Facebook */
/* =========================================
   FLATSOME FACEBOOK ICON
   Modern Facebook Blue
   ========================================= */

/* Normal state */
a.facebook.button.circle,
a.facebook.button.circle.primary,
a.facebook.button.circle:not(:hover) {
    background: #0866FF !important;
    background-color: #0866FF !important;
    background-image: none !important;

    border: 1px solid #0866FF !important;
    border-radius: 50% !important;

    color: #ffffff !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    width: 40px;
    height: 40px;
    padding: 0 !important;

    opacity: 1 !important;

    box-shadow: 0 3px 10px rgba(8, 102, 255, 0.20);

    transition: all 0.3s ease;
}

/* Facebook symbol */
a.facebook.button.circle i,
a.facebook.button.circle i::before {
    color: #ffffff !important;
    opacity: 1 !important;
    font-size: 20px !important;
}

/* Hover and keyboard focus */
a.facebook.button.circle:hover,
a.facebook.button.circle:focus {
    background: #0055d4 !important;
    background-color: #0055d4 !important;
    background-image: none !important;

    border-color: #0055d4 !important;
    color: #ffffff !important;

    transform: translateY(-3px);

    box-shadow: 0 6px 16px rgba(8, 102, 255, 0.30);
}

/* Preserve white symbol on hover */
a.facebook.button.circle:hover i,
a.facebook.button.circle:hover i::before,
a.facebook.button.circle:focus i,
a.facebook.button.circle:focus i::before {
    color: #ffffff !important;
}