/* =========================================
   VOLTCARE - MAIN STYLESHEET
========================================= */

:root {
    --auto-primary: #142B3B;
    --auto-accent: #F28C28;
    --auto-bg: #FFFFFF;
    --auto-surface: #FFFFFF;
    --auto-text: #142B3B;
    --auto-muted: #647482;
    --auto-border: #E8EDF0;
    --auto-soft: #FFF3E8;
    --auto-container: 1320px;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: var(--auto-text);
    background: var(--auto-bg);
    line-height: 1.6;
}

button,
a {
    font-family: inherit;
    -webkit-tap-highlight-color: transparent;
}

a {
    text-decoration: none;
}

button {
    cursor: pointer;
}

.auto-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    width: 100%;
    background: var(--auto-bg);
}

.auto-container {
    width: 100%;
    max-width: var(--auto-container);
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}

/* TOP BAR */

.auto-topbar {
    width: 100%;
    background: var(--auto-primary);
    color: #FFFFFF;
}

.auto-topbar-inner {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.auto-topbar-left,
.auto-topbar-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 22px;
}

.auto-topbar-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 500;
}

.auto-topbar-item i {
    color: var(--auto-accent);
    font-size: 12px;
}

/* MAIN NAVIGATION */

.auto-navbar {
    position: relative;
    z-index: 1;
    width: 100%;
    background: var(--auto-bg);
    border-bottom: 1px solid var(--auto-border);
    box-shadow: 0 3px 18px rgba(20, 43, 59, 0.05);
}

.auto-navbar-inner {
    min-height: 86px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

/* LOGO */

.auto-logo {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    flex-shrink: 0;
}

.auto-logo-icon {
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: var(--auto-accent);
    color: #FFFFFF;
    font-size: 22px;
}

.auto-logo-content {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.auto-logo-title {
    color: var(--auto-text);
    font-size: 20px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.6px;
}

.auto-logo-subtitle {
    color: var(--auto-muted);
    font-size: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    white-space: nowrap;
}

/* NAVIGATION LINKS */

.auto-nav-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    list-style: none;
}

.auto-nav-menu li {
    list-style: none;
}

.auto-mobile-book-item {
    display: none;
}

.auto-nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 12px 0;
    color: var(--auto-text);
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    transition: color 0.25s ease;
}

.auto-nav-link::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 4px;
    width: 0;
    height: 2px;
    background: var(--auto-accent);
    transition: width 0.25s ease;
}

.auto-nav-link:hover,
.auto-nav-link.active {
    color: var(--auto-accent);
}

.auto-nav-link:hover::after,
.auto-nav-link.active::after {
    width: 100%;
}

.auto-nav-item--dropdown {
    position: relative;
}

.auto-dropdown-toggle {
    gap: 8px;
    border: 0;
    background: transparent;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}

.auto-dropdown-toggle i {
    font-size: 10px;
    transition: transform 0.2s ease;
}

.auto-nav-item--dropdown.is-open .auto-dropdown-toggle i {
    transform: rotate(180deg);
}

.auto-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10001;
    display: none;
    min-width: 160px;
    padding: 7px;
    list-style: none;
    background: var(--auto-bg);
    border: 1px solid var(--auto-border);
    border-radius: 5px;
    box-shadow: 0 10px 24px rgba(20, 43, 59, 0.12);
}

.auto-nav-item--dropdown.is-open > .auto-dropdown-menu {
    display: block;
}

.auto-dropdown-link {
    display: block;
    padding: 9px 12px;
    border-radius: 3px;
    color: var(--auto-text);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: color 0.2s ease, background 0.2s ease;
}

.auto-dropdown-link:hover,
.auto-dropdown-link[aria-current="page"] {
    background: var(--auto-soft);
    color: var(--auto-accent);
}

@media (min-width: 1025px) {
    .auto-nav-item--dropdown:hover > .auto-dropdown-menu,
    .auto-nav-item--dropdown:focus-within > .auto-dropdown-menu {
        display: block;
    }
}

/* HEADER ACTIONS */

.auto-nav-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.auto-header-phone {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: 3px;
}

.auto-phone-icon {
    width: 37px;
    height: 37px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--auto-soft);
    color: var(--auto-accent);
    font-size: 14px;
}

.auto-phone-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.auto-phone-label {
    color: var(--auto-muted);
    font-size: 9px;
    font-weight: 500;
}

.auto-phone-number {
    color: var(--auto-text);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

/* BOOKING BUTTON */

.auto-book-btn {
    min-height: 43px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 1px solid var(--auto-accent);
    border-radius: 5px;
    background: var(--auto-accent);
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    transition: background 0.25s ease, transform 0.25s ease;
}

.auto-book-btn:hover {
    background: var(--auto-primary);
    border-color: var(--auto-primary);
    color: #FFFFFF;
    transform: translateY(-2px);
}

/* RTL AND DARK BUTTONS */

.auto-rtl-toggle,
.auto-theme-toggle {
    min-width: 39px;
    height: 39px;
    padding: 0 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid var(--auto-border);
    border-radius: 5px;
    background: var(--auto-surface);
    color: var(--auto-text);
    font-size: 12px;
    transition: all 0.25s ease;
}

.auto-rtl-toggle span {
    font-size: 10px;
    font-weight: 700;
}

.auto-rtl-toggle:hover,
.auto-theme-toggle:hover,
.auto-rtl-toggle.is-active {
    border-color: var(--auto-accent);
    background: var(--auto-accent);
    color: #FFFFFF;
}

.auto-menu-toggle {
    display: none;
    min-width: 39px;
    height: 39px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--auto-border);
    border-radius: 5px;
    background: var(--auto-surface);
    color: var(--auto-text);
    font-size: 16px;
}

/* RESPONSIVE: TABLET */

@media (max-width: 1200px) {
    .auto-navbar-inner {
        gap: 15px;
    }

    .auto-nav-menu {
        gap: 16px;
    }

    .auto-logo-title {
        font-size: 18px;
    }

    .auto-nav-actions {
        gap: 7px;
    }

    .auto-header-phone {
        gap: 6px;
    }

    .auto-phone-icon {
        width: 33px;
        height: 33px;
    }

    .auto-book-btn {
        padding: 0 10px;
        gap: 6px;
    }

    .auto-rtl-toggle,
    .auto-theme-toggle {
        min-width: 35px;
        padding: 0 7px;
    }
}

/* MOBILE NAVIGATION */

@media (max-width: 1024px) {
    .auto-navbar-inner {
        min-height: 78px;
    }

    .auto-menu-toggle {
        display: inline-flex;
        flex-shrink: 0;
    }

    .auto-nav-menu {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 10px 24px 18px;
        background: var(--auto-bg);
        border-top: 1px solid var(--auto-border);
        box-shadow: 0 12px 20px rgba(20, 43, 59, 0.08);
    }

    .auto-nav-menu.is-open {
        display: flex;
    }

    .auto-nav-menu li {
        width: 100%;
    }

    .auto-mobile-book-item {
        display: block;
        padding-top: 10px;
    }

    .auto-header-book-btn {
        display: none;
    }

    .auto-mobile-book-btn {
        width: 100%;
    }

    .auto-dropdown-toggle {
        justify-content: space-between;
    }

    .auto-dropdown-menu {
        position: static;
        min-width: 0;
        padding: 0 0 8px 14px;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .auto-dropdown-link {
        padding: 10px 12px;
        white-space: normal;
    }

    .auto-nav-link {
        display: flex;
        width: 100%;
        padding: 14px 5px;
        border-bottom: 1px solid var(--auto-border);
        font-size: 13px;
    }

    .auto-nav-link::after {
        display: none;
    }

    .auto-nav-link:hover,
    .auto-nav-link.active {
        color: var(--auto-accent);
    }
}

/* MOBILE */

@media (max-width: 600px) {
    .auto-container {
        padding-left: 15px;
        padding-right: 15px;
    }

    .auto-topbar-inner {
        justify-content: center;
        min-height: 34px;
    }

    .auto-topbar-left {
        justify-content: center;
        gap: 8px 14px;
    }

    .auto-topbar-right,
    .auto-header-phone {
        display: none;
    }

    .auto-topbar-item {
        font-size: 9px;
    }

    .auto-navbar-inner {
        min-height: 72px;
        gap: 8px;
    }

    .auto-logo {
        gap: 7px;
    }

    .auto-logo-icon {
        width: 36px;
        height: 36px;
        font-size: 17px;
    }

    .auto-logo-title {
        font-size: 16px;
    }

    .auto-logo-subtitle {
        font-size: 7px;
        letter-spacing: 0.7px;
    }

    .auto-nav-actions {
        gap: 6px;
    }

    .auto-book-btn {
        min-height: 37px;
        padding: 0 9px;
        gap: 5px;
        font-size: 9px;
    }

    .auto-rtl-toggle,
    .auto-theme-toggle,
    .auto-menu-toggle {
        min-width: 34px;
        height: 35px;
        padding: 0 7px;
        font-size: 12px;
    }

    .auto-rtl-toggle {
        gap: 4px;
    }

    .auto-rtl-toggle span {
        font-size: 9px;
    }

    .auto-nav-menu {
        padding-left: 18px;
        padding-right: 18px;
    }
}

/* VERY SMALL MOBILE */

@media (max-width: 390px) {
    .auto-container {
        padding-left: 10px;
        padding-right: 10px;
    }

    .auto-logo {
        gap: 6px;
    }

    .auto-logo-icon {
        width: 32px;
        height: 32px;
        font-size: 15px;
    }

    .auto-logo-title {
        font-size: 14px;
    }

    .auto-logo-subtitle {
        font-size: 6px;
        letter-spacing: 0.5px;
    }

    .auto-nav-actions {
        gap: 4px;
    }

    .auto-book-btn {
        padding: 0 7px;
        font-size: 8px;
    }

    .auto-rtl-toggle,
    .auto-theme-toggle,
    .auto-menu-toggle {
        min-width: 30px;
        height: 32px;
        padding: 0 5px;
    }

    .auto-rtl-toggle span {
        font-size: 8px;
    }
}



/* =========================================
   VOLTCARE FOOTER
========================================= */

.auto-footer {
    background: #102534;
    color: #FFFFFF;
    padding: 65px 0 0;
    font-family: "Montserrat", sans-serif;
}

.auto-footer,
.auto-footer * {
    box-sizing: border-box;
}

.auto-footer .auto-container {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}

/* Main footer grid */

.auto-footer-main {
    display: grid;
    grid-template-columns: 1.35fr 0.8fr 1fr 1.15fr;
    gap: 38px;
    padding-bottom: 45px;
}

/* Brand */

.auto-footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #FFFFFF;
    text-decoration: none;
}

.auto-footer-logo-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 9px;
    background: #F28C28;
    color: #FFFFFF;
    font-size: 22px;
}

.auto-footer-logo-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.auto-footer-logo-text strong {
    font-size: 22px;
    font-weight: 800;
    line-height: 1.2;
}

.auto-footer-logo-text small {
    color: #B8C5CE;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.8px;
}

.auto-footer-description {
    margin: 22px 0;
    color: #C3CED6;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
}

/* Phone block */

.auto-footer-call {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #FFFFFF;
    text-decoration: none;
}

.auto-footer-call-icon {
    width: 43px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    background: rgba(242, 140, 40, 0.15);
    color: #F28C28;
    font-size: 17px;
}

.auto-footer-call > span:last-child {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.auto-footer-call small {
    color: #B8C5CE;
    font-size: 16px;
}

.auto-footer-call strong {
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 700;
}

/* Footer columns */

.auto-footer-heading {
    position: relative;
    margin: 4px 0 25px;
    padding-bottom: 13px;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: 700;
}

.auto-footer-heading::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: "";
    width: 42px;
    height: 3px;
    border-radius: 3px;
    background: #F28C28;
}

.auto-footer-links,
.auto-footer-contact-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.auto-footer-links a,
.auto-footer-contact-list a {
    color: #C3CED6;
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    overflow-wrap: anywhere;
    transition: color 0.25s ease;
}

.auto-footer-links a::before {
    content: "\f105";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 10px;
    color: #F28C28;
}

.auto-footer-links a:hover,
.auto-footer-contact-list a:hover {
    color: #F28C28;
}

/* Contact details */

.auto-footer-contact-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #C3CED6;
    font-size: 16px;
    line-height: 1.7;
}

.auto-footer-contact-icon {
    width: 20px;
    flex-shrink: 0;
    margin-top: 4px;
    color: #F28C28;
    text-align: center;
}

/* CTA strip */

.auto-footer-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 27px 30px;
    margin-bottom: 30px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-left: 4px solid #F28C28;
    border-radius: 7px;
    background: #172F40;
}

.auto-footer-cta-tag {
    display: inline-block;
    margin-bottom: 8px;
    color: #F28C28;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1px;
}

.auto-footer-cta-content h3 {
    margin-bottom: 8px;
    color: #FFFFFF;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4;
}

.auto-footer-cta-content p {
    color: #C3CED6;
    font-size: 16px;
    line-height: 1.7;
}

.auto-footer-cta-btn {
    min-height: 48px;
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-shrink: 0;
    border-radius: 5px;
    background: #F28C28;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.25s ease;
}

.auto-footer-cta-btn:hover {
    background: #FFFFFF;
    color: #102534;
}

/* Bottom bar */

.auto-footer-bottom {
    min-height: 75px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.13);
}

.auto-footer-copyright {
    color: #B8C5CE;
    font-size: 16px;
    line-height: 1.7;
}

.auto-footer-bottom-links {
    display: flex;
    gap: 22px;
}

.auto-footer-bottom-links a {
    color: #C3CED6;
    font-size: 16px;
    text-decoration: none;
    transition: color 0.25s ease;
}

.auto-footer-bottom-links a:hover {
    color: #F28C28;
}

.auto-footer-bottom-links i {
    margin-left: 6px;
    color: #F28C28;
}

/* Tablet */

@media (max-width: 1024px) {
    .auto-footer {
        padding-top: 50px;
    }

    .auto-footer-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 38px 30px;
    }

    .auto-footer-cta {
        padding: 24px;
    }
}

/* Mobile */

@media (max-width: 600px) {
    .auto-footer {
        padding-top: 40px;
    }

    .auto-footer .auto-container {
        padding-left: 18px;
        padding-right: 18px;
    }

    .auto-footer-main {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
        padding-bottom: 35px;
    }

    .auto-footer-heading {
        margin-bottom: 20px;
    }

    .auto-footer-description {
        margin: 18px 0;
    }

    .auto-footer-cta {
        align-items: flex-start;
        flex-direction: column;
        gap: 20px;
        padding: 22px 18px;
        margin-bottom: 20px;
    }

    .auto-footer-cta-content h3 {
        font-size: 21px;
    }

    .auto-footer-cta-btn {
        width: 100%;
    }

    .auto-footer-bottom {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        padding: 20px 0;
        gap: 12px;
    }
}


/* ==========================================
   VOLTCARE PREMIUM HOME HERO
========================================== */

.volt-hero {
    --volt-navy: #142B3B;
    --volt-orange: #F28C28;

    position: relative;
    width: 100%;
    min-height: 720px;
    overflow: hidden;
    isolation: isolate;
    background: var(--volt-navy);
    color: #ffffff;
    font-family: 'Montserrat', sans-serif;
}

.volt-hero *,
.volt-hero *::before,
.volt-hero *::after {
    box-sizing: border-box;
}

.volt-hero-bg {
    position: absolute;
    inset: 0;
    z-index: -3;
    background-image: url("../images/pexels-daniel-andraski-197681005-13065692.jpg");
    background-size: cover;
    background-position: center right;
    transform: scale(1.02);
    animation: voltHeroImage 1.2s ease-out both;
}

.volt-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(
            90deg,
            rgba(7, 23, 35, 0.99) 0%,
            rgba(10, 29, 43, 0.96) 32%,
            rgba(10, 29, 43, 0.78) 51%,
            rgba(10, 29, 43, 0.24) 78%,
            rgba(10, 29, 43, 0.48) 100%
        ),
        linear-gradient(
            0deg,
            rgba(8, 25, 38, 0.88) 0%,
            transparent 35%
        );
}

.volt-hero-container {
    position: relative;
    width: min(100% - 100px, 1400px);
    min-height: 720px;
    margin: 0 auto;
    padding: 92px 0 115px;
    display: flex;
    align-items: center;
}

.volt-hero-content {
    width: 64%;
    max-width: 800px;
    position: relative;
    z-index: 2;
    animation: voltHeroContent 0.9s ease-out both;
}

.volt-hero-tag {
    display: flex;
    align-items: center;
    gap: 17px;
    margin-bottom: 28px;
    color: var(--volt-orange);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1.8px;
    line-height: 1.5;
}

.volt-tag-line {
    width: 42px;
    height: 3px;
    flex-shrink: 0;
    background: var(--volt-orange);
}

.volt-hero h1 {
    max-width: 790px;
    margin: 0 0 25px;
    color: #ffffff;
    font-size: clamp(42px, 4.3vw, 70px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -2.4px;
}

.volt-heading-white {
    color: #ffffff;
}

.volt-heading-orange {
    display: block;
    color: var(--volt-orange);
}

.volt-hero-description {
    max-width: 610px;
    margin: 0 0 32px;
    color: #d4dce4;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.volt-hero-buttons {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 17px;
    margin-bottom: 58px;
}

.volt-btn {
    min-height: 58px;
    padding: 0 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.3s ease,
                color 0.3s ease,
                border-color 0.3s ease,
                transform 0.3s ease,
                box-shadow 0.3s ease;
}

.volt-btn-primary {
    background: var(--volt-orange);
    color: #142B3B;
    box-shadow: 0 9px 28px rgba(242, 140, 40, 0.18);
}

.volt-btn-primary:hover {
    background: #ffffff;
    color: #142B3B;
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
}

.volt-btn-outline {
    border-color: rgba(255, 255, 255, 0.55);
    background: rgba(20, 43, 59, 0.45);
    color: #ffffff;
}

.volt-btn-outline i {
    color: var(--volt-orange);
}

.volt-btn-outline:hover {
    background: #ffffff;
    border-color: #ffffff;
    color: #142B3B;
    transform: translateY(-4px);
}

.volt-btn-arrow {
    margin-left: 7px;
    transition: transform 0.3s ease;
}

.volt-btn-primary:hover .volt-btn-arrow {
    transform: translateX(5px);
}

/* TRUST FEATURES */

.volt-hero-features {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    width: 100%;
}

.volt-feature {
    min-height: 48px;
    padding: 0 22px;
    display: flex;
    align-items: center;
    gap: 13px;
    border-right: 1px solid rgba(255, 255, 255, 0.28);
}

.volt-feature:first-child {
    padding-left: 0;
}

.volt-feature:last-child {
    border-right: 0;
}

.volt-feature > i {
    color: var(--volt-orange);
    font-size: 27px;
    flex-shrink: 0;
}

.volt-feature span {
    color: #f2f5f8;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.65;
    white-space: nowrap;
}

/* FAST SERVICE BADGE */

.volt-hero-badge {
    position: absolute;
    top: 100px;
    right: 12px;
    width: 135px;
    height: 135px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 2px solid var(--volt-orange);
    border-radius: 50%;
    background: rgba(15, 38, 54, 0.88);
    box-shadow: 0 0 0 8px rgba(242, 140, 40, 0.10);
    text-align: center;
    animation: voltBadgeFloat 4s ease-in-out infinite;
}

.volt-badge-icon {
    color: var(--volt-orange);
    font-size: 32px;
}

.volt-hero-badge > span {
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
}

.volt-hero-badge small {
    color: #e5ebef;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 1px;
}

/* SIGNATURE */

.volt-hero-signature {
    position: absolute;
    right: 0;
    bottom: 32px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--volt-orange);
}

.volt-hero-signature span {
    font-size: 23px;
    font-weight: 700;
    font-style: italic;
    letter-spacing: -0.5px;
}

.volt-hero-signature i {
    font-size: 17px;
}

/* SCROLL INDICATOR */

.volt-hero-scroll {
    position: absolute;
    bottom: 36px;
    left: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #c4d0d9;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.5px;
}

.volt-hero-scroll span {
    width: 34px;
    height: 3px;
    border-radius: 10px;
    background: var(--volt-orange);
}

/* ENTRANCE ANIMATIONS */

@keyframes voltHeroContent {
    from {
        opacity: 0;
        transform: translateY(28px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes voltHeroImage {
    from {
        opacity: 0.5;
        transform: scale(1.08);
    }
    to {
        opacity: 1;
        transform: scale(1.02);
    }
}

@keyframes voltBadgeFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-8px);
    }
}

/* ==========================================
   RESPONSIVE: 1200px
========================================== */

@media (max-width: 1200px) {
    .volt-hero-container {
        width: calc(100% - 70px);
    }

    .volt-hero-content {
        width: 72%;
    }

    .volt-hero h1 {
        font-size: clamp(43px, 5vw, 61px);
    }

    .volt-feature {
        padding: 0 13px;
        gap: 9px;
    }

    .volt-feature > i {
        font-size: 23px;
    }

    .volt-feature span {
        font-size: 11px;
    }

    .volt-hero-badge {
        right: 0;
        width: 112px;
        height: 112px;
    }
}

/* ==========================================
   RESPONSIVE: 992px
========================================== */

@media (max-width: 992px) {
    .volt-hero,
    .volt-hero-container {
        min-height: 760px;
    }

    .volt-hero-container {
        width: calc(100% - 60px);
        padding-top: 90px;
        padding-bottom: 145px;
    }

    .volt-hero-content {
        width: 82%;
    }

    .volt-hero h1 {
        max-width: 650px;
        font-size: clamp(42px, 5.6vw, 55px);
        letter-spacing: -1.7px;
    }

    .volt-hero-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(7, 23, 35, 0.99) 0%,
                rgba(10, 29, 43, 0.92) 58%,
                rgba(10, 29, 43, 0.62) 100%
            ),
            linear-gradient(
                0deg,
                rgba(8, 25, 38, 0.9) 0%,
                transparent 50%
            );
    }

    .volt-hero-badge {
        top: 35px;
        right: 0;
        width: 94px;
        height: 94px;
    }

    .volt-badge-icon {
        font-size: 24px;
    }

    .volt-hero-badge > span {
        font-size: 9px;
    }

    .volt-hero-badge small {
        font-size: 7px;
    }

    .volt-hero-features {
        row-gap: 18px;
    }

    .volt-feature {
        width: 50%;
        padding-left: 0;
        border-right: 0;
    }

    .volt-feature span {
        font-size: 12px;
    }
}

/* ==========================================
   RESPONSIVE: 768px
========================================== */

@media (max-width: 768px) {
    .volt-hero,
    .volt-hero-container {
        min-height: auto;
    }

    .volt-hero-bg {
        background-position: 62% center;
    }

    .volt-hero-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(7, 23, 35, 0.98) 0%,
                rgba(10, 29, 43, 0.91) 100%
            ),
            linear-gradient(
                0deg,
                rgba(8, 25, 38, 0.88),
                transparent
            );
    }

    .volt-hero-container {
        width: calc(100% - 40px);
        padding: 75px 0 105px;
    }

    .volt-hero-content {
        width: 100%;
        max-width: 620px;
    }

    .volt-hero-tag {
        gap: 11px;
        margin-bottom: 23px;
        font-size: 12px;
        letter-spacing: 1.2px;
    }

    .volt-tag-line {
        width: 28px;
    }

    .volt-hero h1 {
        max-width: 570px;
        margin-bottom: 22px;
        font-size: clamp(36px, 7.5vw, 49px);
        line-height: 1.17;
        letter-spacing: -1.3px;
    }

    .volt-hero-description {
        max-width: 540px;
        margin-bottom: 27px;
        font-size: 14px;
        line-height: 1.9;
    }

    .volt-hero-buttons {
        gap: 12px;
        margin-bottom: 40px;
    }

    .volt-btn {
        min-height: 53px;
        padding: 0 16px;
        gap: 9px;
        font-size: 12px;
    }

    .volt-hero-badge {
        display: none;
    }

    .volt-hero-signature {
        right: 0;
        bottom: 20px;
    }

    .volt-hero-signature span {
        font-size: 17px;
    }

    .volt-hero-scroll {
        bottom: 27px;
        font-size: 9px;
    }
}

/* ==========================================
   RESPONSIVE: 480px
========================================== */

@media (max-width: 480px) {
    .volt-hero-container {
        width: calc(100% - 36px);
        padding: 62px 0 100px;
    }

    .volt-hero-tag {
        font-size: 10px;
        letter-spacing: 0.9px;
    }

    .volt-hero h1 {
        font-size: clamp(33px, 9vw, 41px);
        letter-spacing: -1.2px;
        line-height: 1.18;
    }

    .volt-hero-description {
        font-size: 13px;
        line-height: 1.85;
    }

    .volt-hero-buttons {
        align-items: stretch;
        flex-direction: column;
        max-width: 300px;
        margin-bottom: 35px;
    }

    .volt-btn {
        width: 100%;
        min-height: 52px;
        justify-content: center;
        font-size: 13px;
    }

    .volt-hero-features {
        row-gap: 20px;
    }

    .volt-feature {
        width: 50%;
        min-height: 42px;
        gap: 9px;
    }

    .volt-feature > i {
        font-size: 21px;
    }

    .volt-feature span {
        font-size: 10px;
        white-space: normal;
    }

    .volt-hero-signature {
        display: none;
    }

    .volt-hero-scroll {
        bottom: 28px;
    }
}

/* REDUCED MOTION ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {
    .volt-hero *,
    .volt-hero *::before,
    .volt-hero *::after {
        animation: none !important;
        transition: none !important;
    }
}


/* ========================================
   VOLTCARE - WHY CHOOSE SECTION
======================================== */

.vc-why-section {
    --vc-navy: #142B3B;
    --vc-orange: #F28C28;

    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 105px 0 0;
    background: #ffffff;
    color: var(--vc-navy);
    font-family: 'Montserrat', sans-serif;
}

.vc-why-section *,
.vc-why-section *::before,
.vc-why-section *::after {
    box-sizing: border-box;
}

.vc-why-container {
    width: min(100% - 100px, 1300px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    align-items: center;
    gap: 85px;
}

/* LEFT IMAGE */

.vc-why-visual {
    position: relative;
    min-width: 0;
    padding: 0 24px 32px 0;
}

.vc-why-image-wrap {
    position: relative;
    width: 100%;
    height: 520px;
    overflow: hidden;
    border-radius: 14px 14px 80px 14px;
    background: #e9eef1;
    box-shadow: 0 25px 65px rgba(20, 43, 59, 0.15);
}

.vc-why-image-wrap img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.8s ease;
}

.vc-why-image-wrap:hover img {
    transform: scale(1.06);
}

.vc-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        0deg,
        rgba(10, 27, 40, 0.88) 0%,
        rgba(10, 27, 40, 0.15) 42%,
        transparent 72%
    );
    pointer-events: none;
}

.vc-image-caption {
    position: absolute;
    right: 22px;
    bottom: 24px;
    left: 22px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: #ffffff;
}

.vc-caption-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 12px;
    background: var(--vc-orange);
    color: var(--vc-navy);
    font-size: 19px;
    text-align: center;
    line-height: 1;
}

.vc-caption-icon i {
    display: block;
    width: 100%;
    text-align: center;
    line-height: 1;
    margin: 0;
    padding: 0;
    padding-top: 14px;
}

.vc-image-caption strong,
.vc-image-caption span {
    display: block;
}

.vc-image-caption strong {
    margin-bottom: 6px;
    font-size: 15px;
    font-weight: 700;
}

.vc-image-caption div > span {
    color: #e0e7ed;
    font-size: 12px;
    line-height: 1.6;
}

.vc-experience-card {
    position: absolute;
    right: -4px;
    top: 48px;
    z-index: 2;
    min-width: 205px;
    padding: 17px 19px;
    display: flex;
    align-items: center;
    gap: 13px;
    border: 1px solid #e8edf0;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 12px 35px rgba(20, 43, 59, 0.12);
}

.vc-experience-icon {
    width: 43px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(242, 140, 40, 0.14);
    color: var(--vc-orange);
    font-size: 21px;
}

.vc-experience-card strong,
.vc-experience-card span {
    display: block;
}

.vc-experience-card strong {
    margin-bottom: 5px;
    color: var(--vc-navy);
    font-size: 14px;
    font-weight: 800;
}

.vc-experience-card span {
    color: #6d7a84;
    font-size: 10px;
    line-height: 1.6;
}

.vc-visual-decoration {
    position: absolute;
    right: 4px;
    bottom: 0;
    z-index: -1;
    width: 150px;
    height: 150px;
    border-right: 3px solid var(--vc-orange);
    border-bottom: 3px solid var(--vc-orange);
    border-radius: 0 0 25px 0;
}

/* RIGHT CONTENT */

.vc-why-content {
    min-width: 0;
}

.vc-section-tag {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    color: #bd6b19;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.7px;
    line-height: 1.6;
}

.vc-section-tag > span {
    width: 30px;
    height: 3px;
    flex-shrink: 0;
    background: var(--vc-orange);
}

.vc-why-heading {
    margin: 0 0 23px;
    color: var(--vc-navy);
    font-size: clamp(32px, 3.1vw, 46px);
    font-weight: 800;
    letter-spacing: -1.5px;
    line-height: 1.25;
}

.vc-why-heading span {
    display: block;
    color: var(--vc-orange);
}

.vc-why-description {
    max-width: 570px;
    margin: 0 0 28px;
    color: #64727d;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

/* BENEFIT ROWS */

.vc-benefits-list {
    margin: 0 0 25px;
}

.vc-benefit-item {
    position: relative;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) 30px;
    align-items: center;
    gap: 16px;
    padding: 20px 0;
    border-bottom: 1px solid #e7ecef;
}

.vc-benefit-icon {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f0e1d1;
    border-radius: 12px;
    background: #fff7ef;
    color: var(--vc-orange);
    font-size: 21px;
    transition: background 0.3s ease,
                color 0.3s ease,
                transform 0.3s ease;
}

.vc-benefit-item:hover .vc-benefit-icon {
    transform: translateY(-3px);
    background: var(--vc-orange);
    color: #ffffff;
}

.vc-benefit-text h3 {
    margin: 0 0 7px;
    color: var(--vc-navy);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.vc-benefit-text p {
    margin: 0;
    color: #75818a;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.75;
}

.vc-benefit-number {
    color: #bdc7ce;
    font-size: 12px;
    font-weight: 800;
    text-align: right;
}

/* LINK BUTTON */

.vc-why-link {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    color: var(--vc-navy);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.6;
    text-decoration: none;
    transition: color 0.3s ease;
}

.vc-why-link > span {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--vc-orange);
    color: var(--vc-navy);
    transition: transform 0.3s ease,
                background 0.3s ease;
}

.vc-why-link:hover {
    color: #bd6b19;
}

.vc-why-link:hover > span {
    transform: translateX(5px);
    background: #ffd4a8;
}

/* BOTTOM TRUST STRIP */

.vc-trust-strip {
    margin-top: 100px;
    padding: 26px 0;
    border-top: 1px solid #e8edf0;
    background: #f7f9fa;
}

.vc-trust-inner {
    width: min(100% - 100px, 1300px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.vc-trust-item {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.vc-trust-item i {
    color: var(--vc-orange);
    font-size: 21px;
    flex-shrink: 0;
}

.vc-trust-item span {
    color: var(--vc-navy);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
}

/* ========================================
   ENTRANCE ANIMATION
======================================== */

.vc-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity 0.75s ease,
        transform 0.75s cubic-bezier(0.2, 0.65, 0.3, 1);
}

.vc-reveal.vc-visible {
    opacity: 1;
    transform: translateY(0);
}

.vc-why-visual.vc-reveal {
    transform: translateX(-30px);
}

.vc-why-visual.vc-reveal.vc-visible {
    transform: translateX(0);
}

.vc-benefit-item:nth-child(2) {
    transition-delay: 100ms;
}

.vc-benefit-item:nth-child(3) {
    transition-delay: 200ms;
}

.vc-why-content .vc-reveal:nth-child(2) {
    transition-delay: 80ms;
}

.vc-why-content .vc-reveal:nth-child(3) {
    transition-delay: 140ms;
}

.vc-why-link.vc-reveal {
    transition-delay: 180ms;
}

/* ========================================
   RESPONSIVE - 1024px
======================================== */

@media (max-width: 1024px) {
    .vc-why-section {
        padding-top: 80px;
    }

    .vc-why-container {
        width: calc(100% - 60px);
        gap: 45px;
    }

    .vc-why-image-wrap {
        height: 470px;
    }

    .vc-why-heading {
        font-size: clamp(30px, 3.5vw, 39px);
    }

    .vc-experience-card {
        right: -8px;
        min-width: 185px;
        padding: 14px;
    }

    .vc-trust-inner {
        width: calc(100% - 60px);
        gap: 12px;
    }

    .vc-trust-item {
        gap: 8px;
    }

    .vc-trust-item span {
        font-size: 11px;
    }
}

/* ========================================
   RESPONSIVE - 768px
======================================== */

@media (max-width: 768px) {
    .vc-why-section {
        padding-top: 65px;
    }

    .vc-why-container {
        width: calc(100% - 40px);
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .vc-why-visual {
        width: 100%;
        max-width: 560px;
        margin: 0 auto;
        padding-right: 15px;
    }

    .vc-why-image-wrap {
        height: 420px;
        border-radius: 12px 12px 55px 12px;
    }

    .vc-experience-card {
        top: 25px;
        right: 0;
    }

    .vc-why-heading {
        font-size: clamp(31px, 6vw, 43px);
    }

    .vc-why-description {
        font-size: 14px;
    }

    .vc-benefit-item {
        grid-template-columns: 48px minmax(0, 1fr) 24px;
        gap: 13px;
        padding: 18px 0;
    }

    .vc-benefit-icon {
        width: 48px;
        height: 48px;
        font-size: 19px;
    }

    .vc-trust-strip {
        margin-top: 65px;
        padding: 25px 0;
    }

    .vc-trust-inner {
        width: calc(100% - 40px);
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 22px;
    }

    .vc-trust-item {
        justify-content: flex-start;
    }
}

/* ========================================
   RESPONSIVE - 480px
======================================== */

@media (max-width: 480px) {
    .vc-why-section {
        padding-top: 55px;
    }

    .vc-why-container {
        width: calc(100% - 36px);
        gap: 36px;
    }

    .vc-why-image-wrap {
        height: 330px;
        border-bottom-right-radius: 45px;
    }

    .vc-image-caption {
        right: 14px;
        bottom: 16px;
        left: 14px;
        gap: 10px;
    }

    .vc-caption-icon {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .vc-image-caption strong {
        font-size: 12px;
    }

    .vc-image-caption div > span {
        font-size: 10px;
    }

    .vc-experience-card {
        top: 18px;
        right: -2px;
        min-width: 160px;
        padding: 11px;
        gap: 9px;
    }

    .vc-experience-icon {
        width: 36px;
        height: 36px;
        font-size: 17px;
    }

    .vc-experience-card strong {
        font-size: 12px;
    }

    .vc-experience-card span {
        font-size: 9px;
    }

    .vc-section-tag {
        font-size: 10px;
        letter-spacing: 1px;
    }

    .vc-why-heading {
        font-size: 31px;
        letter-spacing: -0.8px;
    }

    .vc-why-description {
        font-size: 13px;
        line-height: 1.85;
    }

    .vc-benefit-item {
        grid-template-columns: 42px minmax(0, 1fr) 20px;
        gap: 10px;
        padding: 16px 0;
    }

    .vc-benefit-icon {
        width: 42px;
        height: 42px;
        font-size: 17px;
    }

    .vc-benefit-text h3 {
        font-size: 12px;
    }

    .vc-benefit-text p {
        font-size: 11px;
        line-height: 1.7;
    }

    .vc-benefit-number {
        font-size: 10px;
    }

    .vc-why-link {
        font-size: 12px;
    }

    .vc-trust-strip {
        margin-top: 50px;
    }

    .vc-trust-inner {
        width: calc(100% - 36px);
        gap: 18px 12px;
    }

    .vc-trust-item {
        align-items: flex-start;
        gap: 8px;
    }

    .vc-trust-item i {
        margin-top: 2px;
        font-size: 17px;
    }

    .vc-trust-item span {
        font-size: 10px;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .vc-reveal,
    .vc-reveal.vc-visible,
    .vc-why-visual.vc-reveal,
    .vc-why-visual.vc-reveal.vc-visible {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vc-why-image-wrap img,
    .vc-benefit-icon,
    .vc-why-link > span {
        transition: none;
    }
}



/* ==========================================
   VOLTCARE PREMIUM SERVICES SECTION
========================================== */

.vcs-services {
    --vcs-navy: #142B3B;
    --vcs-orange: #F28C28;

    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 105px 0 90px;
    background: #F4F6F7;
    color: var(--vcs-navy);
    font-family: 'Montserrat', sans-serif;
}

.vcs-services *,
.vcs-services *::before,
.vcs-services *::after {
    box-sizing: border-box;
}

.vcs-container {
    width: min(100% - 100px, 1300px);
    margin: 0 auto;
}

/* HEADER */

.vcs-header {
    max-width: 720px;
    margin: 0 auto 55px;
    text-align: center;
}

.vcs-eyebrow {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    color: #B96816;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
}

.vcs-eyebrow span {
    width: 25px;
    height: 2px;
    background: var(--vcs-orange);
}

.vcs-header h2 {
    margin: 0 0 20px;
    color: var(--vcs-navy);
    font-size: clamp(34px, 4vw, 49px);
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: -1.5px;
}

.vcs-header h2 span {
    display: block;
    color: var(--vcs-orange);
}

.vcs-header > p {
    max-width: 610px;
    margin: 0 auto;
    color: #687680;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* GRID */

.vcs-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
    align-items: stretch;
}

/* SERVICE CARD */

.vcs-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #E4E9EC;
    border-radius: 14px;
    background: #FFFFFF;
    box-shadow: 0 10px 35px rgba(20, 43, 59, 0.035);
    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease,
        border-color 0.4s ease;
}

.vcs-card:hover {
    transform: translateY(-9px);
    border-color: rgba(242, 140, 40, 0.55);
    box-shadow: 0 22px 48px rgba(20, 43, 59, 0.12);
}

.vcs-card-top {
    min-height: 78px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.vcs-number {
    color: #77848D;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.vcs-icon {
    width: 43px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 12px;
    background: #FFF1E3;
    color: var(--vcs-orange);
    font-size: 20px;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.vcs-card:hover .vcs-icon {
    transform: rotate(-6deg);
    background: var(--vcs-orange);
    color: var(--vcs-navy);
}

/* CARD IMAGE */

.vcs-card-image {
    position: relative;
    height: 235px;
    overflow: hidden;
    background: #DCE2E6;
}

.vcs-card-image::after {
    position: absolute;
    inset: 0;
    content: "";
    background: linear-gradient(
        0deg,
        rgba(10, 26, 39, 0.66) 0%,
        transparent 65%
    );
    pointer-events: none;
}

.vcs-card-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.vcs-card:hover .vcs-card-image img {
    transform: scale(1.07);
}

.vcs-image-label {
    position: absolute;
    bottom: 17px;
    left: 20px;
    z-index: 1;
    color: #FFFFFF;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

/* CARD CONTENT */

.vcs-card-body {
    padding: 25px 23px 26px;
}

.vcs-card-body h3 {
    margin: 0 0 13px;
    color: var(--vcs-navy);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.5;
}

.vcs-card-body p {
    min-height: 72px;
    margin: 0 0 22px;
    color: #6B7983;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

.vcs-card-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--vcs-navy);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    transition: color 0.3s ease;
}

.vcs-card-link i {
    color: var(--vcs-orange);
    transition: transform 0.3s ease;
}

.vcs-card-link:hover {
    color: #C66D19;
}

.vcs-card-link:hover i {
    transform: translateX(5px);
}

/* BOTTOM CTA */

.vcs-bottom {
    position: relative;
    margin-top: 55px;
    padding: 30px 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    overflow: hidden;
    border-radius: 14px;
    background: var(--vcs-navy);
}

.vcs-bottom::after {
    position: absolute;
    top: -70px;
    right: 210px;
    width: 180px;
    height: 180px;
    content: "";
    border: 1px solid rgba(242, 140, 40, 0.22);
    border-radius: 50%;
    pointer-events: none;
}

.vcs-bottom-content {
    position: relative;
    z-index: 1;
}

.vcs-bottom-tag {
    display: inline-block;
    margin-bottom: 10px;
    color: var(--vcs-orange);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.7px;
}

.vcs-bottom-content h3 {
    margin: 0 0 9px;
    color: #FFFFFF;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.45;
}

.vcs-bottom-content p {
    margin: 0;
    color: #C2CED7;
    font-size: 13px;
    line-height: 1.8;
}

.vcs-cta {
    position: relative;
    z-index: 1;
    min-height: 50px;
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-shrink: 0;
    border: 1px solid var(--vcs-orange);
    border-radius: 8px;
    background: var(--vcs-orange);
    color: var(--vcs-navy);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.vcs-cta:hover {
    transform: translateY(-3px);
    background: #FFFFFF;
    border-color: #FFFFFF;
    color: var(--vcs-navy);
}

.vcs-cta i {
    transition: transform 0.3s ease;
}

.vcs-cta:hover i {
    transform: translateX(4px);
}

/* ==========================================
   ENTRANCE ANIMATION
========================================== */

.vcs-reveal {
    opacity: 0;
    transform: translateY(30px);
    transition:
        opacity 0.75s ease,
        transform 0.75s cubic-bezier(0.2, 0.65, 0.3, 1);
}

.vcs-reveal.vcs-visible {
    opacity: 1;
    transform: translateY(0);
}

.vcs-card:nth-child(2) {
    transition-delay: 120ms;
}

.vcs-card:nth-child(3) {
    transition-delay: 240ms;
}

.vcs-bottom.vcs-reveal {
    transition-delay: 100ms;
}

/* ==========================================
   RESPONSIVE - 1024px
========================================== */

@media (max-width: 1024px) {
    .vcs-container {
        width: calc(100% - 60px);
    }

    .vcs-grid {
        gap: 17px;
    }

    .vcs-card-top {
        padding: 14px;
    }

    .vcs-card-image {
        height: 200px;
    }

    .vcs-card-body {
        padding: 21px 17px 23px;
    }

    .vcs-card-body h3 {
        font-size: 16px;
    }

    .vcs-card-body p {
        font-size: 12px;
    }
}

/* ==========================================
   RESPONSIVE - 768px
========================================== */

@media (max-width: 768px) {
    .vcs-services {
        padding: 75px 0 65px;
    }

    .vcs-container {
        width: calc(100% - 40px);
    }

    .vcs-header {
        margin-bottom: 35px;
    }

    .vcs-header h2 {
        font-size: clamp(31px, 6vw, 42px);
    }

    .vcs-header > p {
        font-size: 13px;
    }

    .vcs-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .vcs-card:last-child {
        grid-column: 1 / -1;
    }

    .vcs-card:last-child .vcs-card-image {
        height: 260px;
    }

    .vcs-card-body p {
        min-height: auto;
    }

    .vcs-bottom {
        margin-top: 35px;
        padding: 25px;
    }

    .vcs-bottom-content h3 {
        font-size: 18px;
    }
}

/* ==========================================
   RESPONSIVE - 480px
========================================== */

@media (max-width: 480px) {
    .vcs-services {
        padding: 60px 0 50px;
    }

    .vcs-container {
        width: calc(100% - 36px);
    }

    .vcs-header {
        margin-bottom: 28px;
    }

    .vcs-eyebrow {
        font-size: 9px;
        letter-spacing: 1.3px;
    }

    .vcs-header h2 {
        font-size: 30px;
        letter-spacing: -0.7px;
    }

    .vcs-header > p {
        font-size: 12px;
        line-height: 1.85;
    }

    .vcs-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .vcs-card:last-child {
        grid-column: auto;
    }

    .vcs-card-top {
        min-height: 70px;
        padding: 14px 18px;
    }

    .vcs-card-image,
    .vcs-card:last-child .vcs-card-image {
        height: 225px;
    }

    .vcs-card-body {
        padding: 22px 19px 24px;
    }

    .vcs-card-body h3 {
        font-size: 17px;
    }

    .vcs-card-body p {
        font-size: 12px;
        line-height: 1.8;
    }

    .vcs-bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 20px;
        padding: 23px 19px;
    }

    .vcs-bottom-content h3 {
        font-size: 17px;
    }

    .vcs-bottom-content p {
        font-size: 12px;
    }

    .vcs-cta {
        width: 100%;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .vcs-reveal,
    .vcs-reveal.vcs-visible {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vcs-card,
    .vcs-card-image img,
    .vcs-icon,
    .vcs-card-link i,
    .vcs-cta {
        transition: none;
    }
}



/* ==========================================
   VOLTCARE - BATTERY SOLUTIONS
========================================== */

.vbs-section {
    position: relative;
    overflow: hidden;
    padding: 105px 24px 35px;
    background: #f7f8fa;
    color: #142B3B;
    font-family: 'Montserrat', sans-serif;
}

.vbs-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vbs-top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 45px;
    margin-bottom: 48px;
}

.vbs-heading {
    max-width: 720px;
}

.vbs-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
    color: #142B3B;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vbs-tag-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #F28C28;
    box-shadow: 0 0 0 5px rgba(242, 140, 40, .13);
}

.vbs-heading h2 {
    margin: 0;
    color: #142B3B;
    font-size: clamp(30px, 4vw, 49px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.7px;
}

.vbs-heading h2 span {
    color: #F28C28;
}

.vbs-intro {
    max-width: 335px;
    padding-bottom: 5px;
}

.vbs-intro p {
    margin: 0 0 20px;
    color: #687784;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

.vbs-text-link {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    color: #142B3B;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: color .3s ease;
}

.vbs-text-link span {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid #d8dfe4;
    border-radius: 50%;
    transition: .3s ease;
}

.vbs-text-link:hover {
    color: #F28C28;
}

.vbs-text-link:hover span {
    color: #fff;
    background: #F28C28;
    border-color: #F28C28;
    transform: rotate(45deg);
}

.vbs-layout {
    display: grid;
    grid-template-columns: .91fr 1.09fr;
    gap: 22px;
    align-items: stretch;
}

.vbs-feature {
    position: relative;
    display: flex;
    min-height: 590px;
    overflow: hidden;
    align-items: flex-end;
    border-radius: 5px;
    background: #142B3B;
    isolation: isolate;
}

.vbs-feature-image {
    position: absolute;
    z-index: -2;
    inset: 0;
    background-image: url('../images/pexels-daniel-andraski-197681005-13065692.jpg');
    background-size: cover;
    background-position: center;
    transition: transform .8s ease;
}

.vbs-feature:hover .vbs-feature-image {
    transform: scale(1.06);
}

.vbs-feature-overlay {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(10, 27, 39, .06) 5%,
        rgba(10, 27, 39, .35) 38%,
        rgba(10, 27, 39, .96) 100%
    );
}

.vbs-feature-content {
    padding: 42px 38px;
}

.vbs-feature-label {
    display: inline-block;
    margin-bottom: 18px;
    color: #F8B36E;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vbs-feature-content h3 {
    margin: 0 0 16px;
    color: #fff;
    font-size: clamp(30px, 3vw, 39px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1px;
}

.vbs-feature-content p {
    max-width: 350px;
    margin: 0 0 25px;
    color: rgba(255,255,255,.78);
    font-size: 15px;
    line-height: 1.9;
}

.vbs-feature-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 15px 19px;
    background: #F28C28;
    color: #142B3B;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: .3s ease;
}

.vbs-feature-btn:hover {
    background: #fff;
    transform: translateY(-3px);
}

.vbs-feature-btn span {
    font-size: 17px;
}

.vbs-feature-number {
    position: absolute;
    top: 25px;
    right: 27px;
    color: rgba(255,255,255,.8);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vbs-solutions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.vbs-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 27px 23px 23px;
    background: #fff;
    border: 1px solid #e8edf0;
    transition: transform .3s ease, box-shadow .3s ease,
                border-color .3s ease;
}

.vbs-card:hover {
    transform: translateY(-5px);
    border-color: rgba(242,140,40,.5);
    box-shadow: 0 18px 38px rgba(20,43,59,.07);
}

.vbs-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 28px;
}

.vbs-icon {
    display: grid;
    width: 49px;
    height: 49px;
    flex-shrink: 0;
    place-items: center;
    background: #fff3e8;
    color: #F28C28;
}

.vbs-icon svg,
.vbs-wide-icon svg {
    width: 25px;
    height: 25px;
}

.vbs-card-index {
    color: #98a4ad;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vbs-card h3,
.vbs-wide-content h3 {
    margin: 0 0 12px;
    color: #142B3B;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
}

.vbs-card p,
.vbs-wide-content p {
    margin: 0 0 23px;
    color: #73818c;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vbs-card > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: auto;
    padding-top: 15px;
    border-top: 1px solid #edf0f2;
    color: #142B3B;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    transition: color .3s ease;
}

.vbs-card > a:hover {
    color: #F28C28;
}

.vbs-arrow {
    font-size: 17px;
    transition: transform .3s ease;
}

.vbs-card > a:hover .vbs-arrow {
    transform: translate(3px, -3px);
}

.vbs-card-accent {
    background: #142B3B;
    border-color: #142B3B;
}

.vbs-card-accent .vbs-card-index {
    color: #9eacb7;
}

.vbs-card-accent h3 {
    color: #fff;
}

.vbs-card-accent p {
    color: #bdc8d0;
}

.vbs-card-accent > a {
    border-color: rgba(255,255,255,.14);
    color: #fff;
}

.vbs-card-accent > a:hover {
    color: #F28C28;
}

.vbs-card-wide {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 25px 26px;
    background: #fff;
    border: 1px solid #e8edf0;
    transition: .3s ease;
}

.vbs-card-wide:hover {
    border-color: #F28C28;
    box-shadow: 0 12px 28px rgba(20,43,59,.06);
}

.vbs-wide-icon {
    display: grid;
    width: 53px;
    height: 53px;
    flex-shrink: 0;
    place-items: center;
    background: #142B3B;
    color: #F28C28;
}

.vbs-mini-label {
    display: block;
    margin-bottom: 7px;
    color: #F28C28;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vbs-wide-content h3 {
    margin-bottom: 5px;
}

.vbs-wide-content p {
    margin: 0;
}

.vbs-wide-arrow {
    display: grid;
    width: 39px;
    height: 39px;
    flex-shrink: 0;
    place-items: center;
    border: 1px solid #dce3e7;
    border-radius: 50%;
    color: #142B3B;
    font-size: 19px;
    text-decoration: none;
    transition: .3s ease;
}

.vbs-wide-arrow:hover {
    background: #F28C28;
    border-color: #F28C28;
    transform: rotate(45deg);
}

.vbs-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 30px;
    padding-top: 22px;
    border-top: 1px solid #e1e6e9;
    color: #82909a;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .8px;
}

.vbs-bottom i {
    padding: 0 6px;
    color: #F28C28;
}

.vbs-bottom > span:last-child {
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0;
}

/* Entrance animation */
.vbs-section .vbs-animate {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .7s ease, transform .7s ease;
}

.vbs-section .vbs-animate.vbs-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */
@media (max-width: 1024px) {
    .vbs-section {
        padding: 85px 22px 30px;
    }

    .vbs-top {
        gap: 25px;
    }

    .vbs-layout {
        grid-template-columns: .85fr 1.15fr;
        gap: 16px;
    }

    .vbs-feature {
        min-height: 620px;
    }

    .vbs-feature-content {
        padding: 32px 25px;
    }

    .vbs-solutions {
        gap: 12px;
    }

    .vbs-card {
        padding: 22px 17px;
    }

    .vbs-card-wide {
        gap: 13px;
        padding: 22px 18px;
    }
}

/* Mobile landscape */
@media (max-width: 768px) {
    .vbs-section {
        padding: 70px 18px 25px;
    }

    .vbs-top {
        display: block;
        margin-bottom: 32px;
    }

    .vbs-heading h2 {
        font-size: clamp(30px, 7vw, 42px);
        letter-spacing: -1px;
    }

    .vbs-intro {
        max-width: 480px;
        margin-top: 20px;
    }

    .vbs-intro p {
        font-size: 13px;
    }

    .vbs-layout {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .vbs-feature {
        min-height: 470px;
    }

    .vbs-feature-content {
        padding: 30px 25px;
    }

    .vbs-solutions {
        gap: 12px;
    }

    .vbs-card {
        padding: 23px 18px;
    }

    .vbs-card-top {
        margin-bottom: 22px;
    }
}

/* Small mobile */
@media (max-width: 480px) {
    .vbs-section {
        padding: 58px 15px 22px;
    }

    .vbs-tag {
        font-size: 9px;
        letter-spacing: 1.3px;
    }

    .vbs-heading h2 {
        font-size: 30px;
    }

    .vbs-feature {
        min-height: 430px;
    }

    .vbs-feature-content {
        padding: 25px 20px;
    }

    .vbs-feature-content h3 {
        font-size: 31px;
    }

    .vbs-solutions {
        grid-template-columns: 1fr;
    }

    .vbs-card {
        padding: 24px 22px;
    }

    .vbs-card-wide {
        grid-column: auto;
        grid-template-columns: auto 1fr;
        gap: 14px;
        padding: 22px 17px;
    }

    .vbs-wide-icon {
        width: 43px;
        height: 43px;
    }

    .vbs-wide-arrow {
        grid-column: 2;
        justify-self: start;
        width: 34px;
        height: 34px;
    }

    .vbs-bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 9px;
        line-height: 1.7;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vbs-section *,
    .vbs-section *::before,
    .vbs-section *::after {
        animation: none !important;
        transition-duration: .01ms !important;
    }
}




/* =========================================
   VOLTCARE - AUTO ELECTRICAL EXPERTISE
========================================= */

.vae-section {
    position: relative;
    overflow: hidden;
    padding: 100px 24px 35px;
    background: #ffffff;
    color: #142B3B;
    font-family: 'Montserrat', sans-serif;
}

.vae-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vae-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 45px;
    margin-bottom: 45px;
}

.vae-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 20px;
    color: #687784;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vae-eyebrow-line {
    width: 27px;
    height: 2px;
    background: #F28C28;
}

.vae-header h2 {
    margin: 0;
    color: #142B3B;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -1.6px;
}

.vae-header h2 span {
    color: #F28C28;
}

.vae-header-text {
    max-width: 370px;
    margin: 0 0 4px;
    color: #71808b;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.95;
}

.vae-main-grid {
    display: grid;
    grid-template-columns: .94fr 1.06fr;
    gap: 58px;
    align-items: stretch;
}

/* Visual panel */

.vae-visual {
    position: relative;
    min-height: 600px;
    overflow: hidden;
    background: #142B3B;
    isolation: isolate;
}

.vae-visual > img {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform .8s ease;
}

.vae-visual:hover > img {
    transform: scale(1.045);
}

.vae-visual-shade {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(20, 43, 59, .26) 0%,
        rgba(20, 43, 59, .08) 30%,
        rgba(12, 29, 42, .94) 100%
    );
}

.vae-visual-top {
    position: absolute;
    top: 25px;
    left: 25px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 15px;
    background: rgba(20, 43, 59, .76);
    color: #ffffff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.4px;
    backdrop-filter: blur(8px);
}

.vae-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #F28C28;
    box-shadow: 0 0 0 4px rgba(242, 140, 40, .17);
}

.vae-visual-caption {
    position: absolute;
    right: 28px;
    bottom: 35px;
    left: 28px;
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.vae-caption-number {
    display: grid;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    place-items: center;
    border: 1px solid rgba(255,255,255,.42);
    color: #F28C28;
    font-size: 15px;
    font-weight: 700;
}

.vae-visual-caption h3 {
    margin: 0 0 12px;
    color: #ffffff;
    font-size: clamp(29px, 3vw, 39px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1px;
}

.vae-visual-caption p {
    margin: 0;
    color: rgba(255,255,255,.76);
    font-size: 14px;
    line-height: 1.8;
}

.vae-visual-corner {
    position: absolute;
    top: 27px;
    right: 25px;
    color: rgba(255,255,255,.82);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* Expertise list */

.vae-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.vae-content-intro {
    padding-bottom: 19px;
}

.vae-small-label {
    display: block;
    margin-bottom: 13px;
    color: #F28C28;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.vae-content-intro > p {
    max-width: 480px;
    margin: 0;
    color: #71808b;
    font-size: 15px;
    line-height: 1.9;
}

.vae-service-row {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 17px;
    padding: 24px 0;
    border-top: 1px solid #e8edf0;
    transition: border-color .3s ease;
}

.vae-service-row:hover {
    border-color: #F28C28;
}

.vae-service-icon {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    background: #f2f5f7;
    color: #142B3B;
    transition: background .3s ease, color .3s ease;
}

.vae-service-row:hover .vae-service-icon {
    background: #F28C28;
    color: #142B3B;
}

.vae-service-icon svg {
    width: 25px;
    height: 25px;
}

.vae-service-info {
    min-width: 0;
}

.vae-service-count {
    display: block;
    margin-bottom: 6px;
    color: #F28C28;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vae-service-info h3 {
    margin: 0 0 7px;
    color: #142B3B;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.vae-service-info p {
    margin: 0;
    color: #77858f;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

.vae-service-arrow {
    display: grid;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    place-items: center;
    border: 1px solid #e0e6e9;
    border-radius: 50%;
    color: #142B3B;
    font-size: 18px;
    text-decoration: none;
    transition: .3s ease;
}

.vae-service-arrow:hover {
    background: #F28C28;
    border-color: #F28C28;
    transform: rotate(45deg);
}

.vae-bottom-note {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-top: 17px;
    padding: 19px;
    background: #f5f7f8;
}

.vae-note-mark {
    display: grid;
    width: 27px;
    height: 27px;
    flex-shrink: 0;
    place-items: center;
    background: #F28C28;
    color: #142B3B;
    font-size: 20px;
    line-height: 1;
}

.vae-bottom-note p {
    margin: 0;
    color: #71808b;
    font-size: 11px;
    line-height: 1.8;
}

.vae-bottom-note strong {
    display: block;
    margin-bottom: 3px;
    color: #142B3B;
    font-size: 12px;
}

/* Bottom strip */

.vae-footer-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 30px;
    padding-top: 22px;
    border-top: 1px solid #e8edf0;
}

.vae-footer-line > span {
    color: #81909a;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.vae-footer-line > span i {
    padding: 0 7px;
    color: #F28C28;
    font-size: 8px;
}

.vae-footer-line > a {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #142B3B;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
}

.vae-footer-line > a span {
    color: #F28C28;
    font-size: 17px;
    transition: transform .3s ease;
}

.vae-footer-line > a:hover span {
    transform: translate(3px, -3px);
}

/* Entrance animation */

.vae-section .vae-animate {
    opacity: 0;
    transform: translateY(25px);
    transition: opacity .7s ease, transform .7s ease;
}

.vae-section .vae-animate.vae-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */

@media (max-width: 1024px) {
    .vae-section {
        padding: 80px 22px 30px;
    }

    .vae-main-grid {
        grid-template-columns: .9fr 1.1fr;
        gap: 28px;
    }

    .vae-visual {
        min-height: 620px;
    }

    .vae-service-row {
        grid-template-columns: 45px minmax(0, 1fr) 34px;
        gap: 12px;
        padding: 20px 0;
    }

    .vae-service-icon {
        width: 45px;
        height: 45px;
    }

    .vae-service-info h3 {
        font-size: 13px;
    }
}

/* Mobile and tablet portrait */

@media (max-width: 768px) {
    .vae-section {
        padding: 68px 18px 28px;
    }

    .vae-header {
        display: block;
        margin-bottom: 30px;
    }

    .vae-header h2 {
        font-size: clamp(31px, 6vw, 42px);
    }

    .vae-header-text {
        max-width: 520px;
        margin-top: 18px;
    }

    .vae-main-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .vae-visual {
        min-height: 480px;
    }

    .vae-content-intro {
        padding-bottom: 22px;
    }

    .vae-service-row {
        grid-template-columns: 52px minmax(0, 1fr) 38px;
        gap: 16px;
        padding: 23px 0;
    }

    .vae-service-icon {
        width: 52px;
        height: 52px;
    }

    .vae-service-info h3 {
        font-size: 15px;
    }
}

/* Small mobile */

@media (max-width: 480px) {
    .vae-section {
        padding: 58px 15px 24px;
    }

    .vae-header h2 {
        font-size: 30px;
        letter-spacing: -1px;
    }

    .vae-eyebrow {
        font-size: 9px;
        letter-spacing: 1.3px;
    }

    .vae-visual {
        min-height: 420px;
    }

    .vae-visual-top {
        top: 16px;
        left: 15px;
        padding: 10px;
        font-size: 8px;
    }

    .vae-visual-corner {
        top: 20px;
        right: 15px;
        font-size: 8px;
    }

    .vae-visual-caption {
        right: 18px;
        bottom: 23px;
        left: 18px;
        gap: 12px;
    }

    .vae-caption-number {
        width: 32px;
        height: 32px;
    }

    .vae-visual-caption h3 {
        font-size: 29px;
    }

    .vae-service-row {
        grid-template-columns: 42px minmax(0, 1fr) 30px;
        gap: 11px;
        padding: 20px 0;
    }

    .vae-service-icon {
        width: 42px;
        height: 42px;
    }

    .vae-service-icon svg {
        width: 21px;
        height: 21px;
    }

    .vae-service-info h3 {
        font-size: 12px;
    }

    .vae-service-info p {
        font-size: 10px;
    }

    .vae-service-arrow {
        width: 29px;
        height: 29px;
        font-size: 15px;
    }

    .vae-bottom-note {
        padding: 15px;
    }

    .vae-footer-line {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vae-section *,
    .vae-section *::before,
    .vae-section *::after {
        animation: none !important;
        transition-duration: .01ms !important;
    }
}





/* =========================================
   VOLTCARE - HOW IT WORKS
========================================= */

.vhw-section {
    padding: 100px 24px 38px;
    background: #f3f6f8;
    color: #142B3B;
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.vhw-container {
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
}

.vhw-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 65px;
}

.vhw-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    color: #657581;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.vhw-eyebrow-mark {
    width: 25px;
    height: 3px;
    background: #F28C28;
}

.vhw-heading h2 {
    margin: 0;
    color: #142B3B;
    font-size: clamp(32px, 4vw, 49px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1.6px;
}

.vhw-heading h2 span {
    color: #F28C28;
}

.vhw-heading-side {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    max-width: 400px;
    padding-bottom: 5px;
}

.vhw-side-number {
    color: #dce3e8;
    font-size: 54px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -3px;
}

.vhw-heading-side p {
    margin: 0;
    color: #71808b;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* Timeline */

.vhw-process {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.vhw-process::before {
    content: "";
    position: absolute;
    top: 34px;
    left: 8%;
    right: 8%;
    height: 1px;
    background: #d8e0e5;
}

.vhw-step {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 0 20px 22px;
    background: transparent;
    border-bottom: 2px solid #d8e0e5;
    transition: border-color .3s ease, transform .3s ease;
}

.vhw-step:hover {
    transform: translateY(-5px);
    border-color: #F28C28;
}

.vhw-step-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 39px;
}

.vhw-step-number {
    display: grid;
    width: 43px;
    height: 43px;
    flex-shrink: 0;
    place-items: center;
    border: 1px solid #d1dbe1;
    border-radius: 50%;
    background: #f3f6f8;
    color: #142B3B;
    font-size: 12px;
    font-weight: 700;
    transition: .3s ease;
}

.vhw-step:hover .vhw-step-number {
    background: #F28C28;
    border-color: #F28C28;
}

.vhw-step-icon {
    display: grid;
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    place-items: center;
    background: #ffffff;
    color: #142B3B;
    box-shadow: 0 6px 22px rgba(20, 43, 59, .06);
    transition: .3s ease;
}

.vhw-step-icon svg {
    width: 24px;
    height: 24px;
}

.vhw-step:hover .vhw-step-icon {
    background: #142B3B;
    color: #F28C28;
}

.vhw-step-label {
    margin-bottom: 12px;
    color: #F28C28;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.vhw-step h3 {
    margin: 0 0 12px;
    color: #142B3B;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.45;
}

.vhw-step > p {
    flex-grow: 1;
    margin: 0 0 27px;
    color: #71808b;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vhw-step-bottom {
    padding-top: 17px;
    border-top: 1px solid #dce3e8;
    color: #142B3B;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vhw-step-bottom i {
    padding: 0 5px;
    color: #F28C28;
    font-style: normal;
}

.vhw-step-featured {
    background: #142B3B;
    border-bottom-color: #F28C28;
    padding-top: 0;
}

.vhw-step-featured .vhw-step-number {
    background: #F28C28;
    border-color: #F28C28;
    color: #142B3B;
}

.vhw-step-featured .vhw-step-icon {
    background: #263f50;
    color: #F28C28;
    box-shadow: none;
}

.vhw-step-featured h3 {
    color: #ffffff;
}

.vhw-step-featured > p {
    color: #bfccd4;
}

.vhw-step-featured .vhw-step-bottom {
    border-color: #3b5261;
    color: #ffffff;
}

/* Bottom CTA */

.vhw-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 50px;
    padding: 25px 28px;
    background: #ffffff;
    border: 1px solid #e6ebee;
}

.vhw-bottom-copy {
    display: flex;
    align-items: center;
    gap: 16px;
}

.vhw-bottom-icon {
    display: grid;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    place-items: center;
    background: #fff0e1;
    color: #F28C28;
    font-size: 22px;
}

.vhw-bottom-copy h3 {
    margin: 0 0 6px;
    color: #142B3B;
    font-size: 14px;
    font-weight: 700;
}

.vhw-bottom-copy p {
    margin: 0;
    color: #71808b;
    font-size: 11px;
    line-height: 1.8;
}

.vhw-cta {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 15px 20px;
    background: #F28C28;
    color: #142B3B;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: .3s ease;
}

.vhw-cta span {
    font-size: 17px;
    transition: transform .3s ease;
}

.vhw-cta:hover {
    background: #142B3B;
    color: #ffffff;
}

.vhw-cta:hover span {
    transform: translate(3px, -3px);
}

/* Entrance animation */

.vhw-section .vhw-animate {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease;
}

.vhw-section .vhw-animate.vhw-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */

@media (max-width: 1024px) {
    .vhw-section {
        padding: 80px 22px 32px;
    }

    .vhw-heading {
        gap: 25px;
        margin-bottom: 48px;
    }

    .vhw-heading-side {
        max-width: 340px;
        gap: 12px;
    }

    .vhw-side-number {
        font-size: 43px;
    }

    .vhw-process {
        gap: 12px;
    }

    .vhw-step {
        padding: 0 13px 20px;
    }

    .vhw-step-top {
        gap: 8px;
    }

    .vhw-step-icon {
        width: 42px;
        height: 42px;
    }

    .vhw-step h3 {
        font-size: 14px;
    }

    .vhw-step > p {
        font-size: 11px;
    }
}

/* Tablet portrait */

@media (max-width: 768px) {
    .vhw-section {
        padding: 68px 18px 28px;
    }

    .vhw-heading {
        display: block;
        margin-bottom: 38px;
    }

    .vhw-heading h2 {
        font-size: clamp(32px, 6vw, 43px);
    }

    .vhw-heading-side {
        max-width: 520px;
        margin-top: 20px;
    }

    .vhw-side-number {
        font-size: 39px;
    }

    .vhw-process {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px 16px;
    }

    .vhw-process::before {
        display: none;
    }

    .vhw-step {
        min-height: 280px;
        padding: 22px 20px;
        background: #ffffff;
        border: 1px solid #e4e9ed;
        border-bottom: 2px solid #d8e0e5;
    }

    .vhw-step-featured {
        background: #142B3B;
        border-color: #142B3B;
        border-bottom-color: #F28C28;
    }

    .vhw-step-top {
        margin-bottom: 28px;
    }

    .vhw-bottom {
        margin-top: 32px;
        padding: 22px;
    }
}

/* Mobile */

@media (max-width: 480px) {
    .vhw-section {
        padding: 58px 15px 24px;
    }

    .vhw-heading h2 {
        font-size: 30px;
        letter-spacing: -1px;
    }

    .vhw-eyebrow {
        font-size: 9px;
        letter-spacing: 1.1px;
    }

    .vhw-process {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .vhw-step {
        min-height: auto;
        padding: 22px 20px;
    }

    .vhw-step-top {
        margin-bottom: 24px;
    }

    .vhw-step h3 {
        font-size: 16px;
    }

    .vhw-step > p {
        margin-bottom: 23px;
        font-size: 12px;
    }

    .vhw-bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 20px;
        padding: 20px 17px;
    }

    .vhw-bottom-copy {
        align-items: flex-start;
        gap: 12px;
    }

    .vhw-bottom-copy h3 {
        font-size: 13px;
    }

    .vhw-cta {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vhw-section *,
    .vhw-section *::before,
    .vhw-section *::after {
        animation: none !important;
        transition-duration: .01ms !important;
    }
}






/* =========================================
   SECTION 7 - OUR REPAIR PROCESS
========================================= */

.vrp-process-section {
    position: relative;
    overflow: hidden;
    padding: 105px 24px 95px;
    background: #f4f6f8;
    color: #142B3B;
    font-family: 'Montserrat', sans-serif;
}

.vrp-process-section *,
.vrp-process-section *::before,
.vrp-process-section *::after {
    box-sizing: border-box;
}

.vrp-process-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vrp-process-heading {
    margin-bottom: 46px;
}

.vrp-process-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    color: #F28C28;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vrp-eyebrow-line {
    width: 35px;
    height: 2px;
    background: #F28C28;
}

.vrp-heading-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 35px;
}

.vrp-heading-row h2 {
    max-width: 650px;
    margin: 0;
    color: #142B3B;
    font-size: clamp(32px, 4.2vw, 52px);
    font-weight: 800;
    line-height: 1.14;
    letter-spacing: -1.7px;
}

.vrp-heading-row h2 span {
    color: #F28C28;
}

.vrp-heading-row > p {
    max-width: 390px;
    margin: 0 0 5px;
    color: #667580;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

/* Main workbench */

.vrp-workbench {
    display: grid;
    grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
    gap: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e1e6ea;
    border-radius: 8px;
    box-shadow: 0 25px 65px rgba(20, 43, 59, .08);
}

/* Diagnostic console */

.vrp-console {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 28px;
    background: #142B3B;
    color: #fff;
}

.vrp-console-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 24px;
}

.vrp-console-label {
    display: block;
    margin-bottom: 10px;
    color: #F28C28;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.vrp-console-top h3 {
    margin: 0;
    color: #fff;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.4;
}

.vrp-live-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 3px;
    color: #d7e0e5;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .5px;
    white-space: nowrap;
}

.vrp-live-status > span {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: #F28C28;
    box-shadow: 0 0 10px rgba(242,140,40,.7);
}

.vrp-console-display {
    position: relative;
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 315px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.13);
    background: #193548;
}

.vrp-display-grid {
    position: absolute;
    inset: 0;
    opacity: .25;
    background-image:
        linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
    background-size: 28px 28px;
}

.vrp-engine-symbol {
    position: relative;
    z-index: 1;
    width: 160px;
    max-width: 50%;
    margin: 8px 0 15px;
    color: #fff;
    animation: vrp-engine-float 4s ease-in-out infinite;
}

.vrp-engine-symbol svg {
    display: block;
    width: 100%;
    height: auto;
}

.vrp-display-caption {
    position: relative;
    z-index: 1;
    padding: 0 15px 22px;
    text-align: center;
}

.vrp-display-caption > span {
    display: block;
    margin-bottom: 9px;
    color: #F28C28;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.vrp-display-caption strong {
    display: block;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.6;
}

.vrp-coordinate {
    position: absolute;
    z-index: 1;
    color: rgba(255,255,255,.48);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 1px;
}

.vrp-coordinate-one {
    top: 15px;
    left: 15px;
}

.vrp-coordinate-two {
    right: 15px;
    bottom: 15px;
}

.vrp-console-stats {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 20px;
}

.vrp-console-stats > div {
    display: grid;
    grid-template-columns: 8px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(255,255,255,.1);
}

.vrp-console-stats > div:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.vrp-stat-indicator {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #F28C28;
}

.vrp-console-stats div > span:nth-child(2) {
    color: #b9c6ce;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .7px;
}

.vrp-console-stats strong {
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
}

/* Process details */

.vrp-process-details {
    min-width: 0;
    padding: 30px 34px 28px;
}

.vrp-process-intro {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 15px;
    padding-bottom: 22px;
    border-bottom: 1px solid #e8ecef;
}

.vrp-process-count {
    padding: 8px 10px;
    background: #fff3e7;
    color: #b65d0b;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
    white-space: nowrap;
}

.vrp-process-intro h3 {
    order: -1;
    margin: 0;
    color: #142B3B;
    font-size: 23px;
    font-weight: 800;
    line-height: 1.4;
    letter-spacing: -.6px;
}

.vrp-process-step {
    display: grid;
    grid-template-columns: 39px minmax(0, 1fr) 24px;
    align-items: start;
    gap: 13px;
    padding: 20px 0;
    border-bottom: 1px solid #e8ecef;
    transition: padding .25s ease, background .25s ease;
}

.vrp-process-step:hover {
    padding-right: 8px;
    padding-left: 8px;
    background: #f8fafb;
}

.vrp-step-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    border: 1px solid #dce3e8;
    border-radius: 4px;
    color: #142B3B;
    font-size: 11px;
    font-weight: 800;
    transition: color .25s ease, background .25s ease, border-color .25s ease;
}

.vrp-process-step:hover .vrp-step-number {
    border-color: #F28C28;
    background: #F28C28;
    color: #142B3B;
}

.vrp-step-content > span {
    display: block;
    margin-bottom: 6px;
    color: #d97819;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.3px;
}

.vrp-step-content h4 {
    margin: 0 0 7px;
    color: #142B3B;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.5;
}

.vrp-step-content p {
    margin: 0;
    color: #6a7882;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

.vrp-step-arrow {
    padding-top: 7px;
    color: #a4afb7;
    font-size: 18px;
    transition: color .25s ease, transform .25s ease;
}

.vrp-process-step:hover .vrp-step-arrow {
    color: #F28C28;
    transform: translate(3px, -3px);
}

.vrp-process-cta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-top: 22px;
    padding: 15px 17px;
    background: #F28C28;
    color: #142B3B;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    transition: background .25s ease, color .25s ease;
}

.vrp-process-cta:hover {
    background: #142B3B;
    color: #fff;
}

.vrp-cta-arrow {
    font-size: 19px;
    transition: transform .25s ease;
}

.vrp-process-cta:hover .vrp-cta-arrow {
    transform: translate(3px, -3px);
}

/* Bottom quality strip */

.vrp-quality-strip {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    align-items: center;
    gap: 20px;
    margin-top: 23px;
    padding: 25px 28px;
    border: 1px solid #e1e6ea;
    background: #fff;
}

.vrp-quality-title > span {
    display: block;
    margin-bottom: 7px;
    color: #d97819;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.vrp-quality-title > strong {
    display: block;
    color: #142B3B;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.6;
}

.vrp-quality-item {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.vrp-quality-item > span {
    color: #F28C28;
    font-size: 12px;
    font-weight: 800;
}

.vrp-quality-item > p {
    margin: 0;
    color: #536570;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.6;
}

/* Entrance animation */

.vrp-animate {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease;
}

.vrp-animate.vrp-visible {
    opacity: 1;
    transform: translateY(0);
}

@keyframes vrp-engine-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

/* Tablet */

@media (max-width: 1024px) {
    .vrp-process-section {
        padding: 80px 22px;
    }

    .vrp-workbench {
        grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    }

    .vrp-console {
        padding: 22px;
    }

    .vrp-console-top {
        flex-direction: column;
    }

    .vrp-process-details {
        padding: 25px;
    }

    .vrp-quality-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Mobile */

@media (max-width: 767px) {
    .vrp-process-section {
        padding: 62px 16px;
    }

    .vrp-process-heading {
        margin-bottom: 28px;
    }

    .vrp-heading-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }

    .vrp-heading-row h2 {
        font-size: clamp(30px, 8vw, 42px);
        letter-spacing: -1px;
    }

    .vrp-heading-row > p {
        max-width: 100%;
        font-size: 12px;
    }

    .vrp-workbench {
        grid-template-columns: minmax(0, 1fr);
        border-radius: 6px;
    }

    .vrp-console {
        padding: 20px;
    }

    .vrp-console-top {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .vrp-console-top h3 {
        font-size: 19px;
    }

    .vrp-console-display {
        min-height: 270px;
    }

    .vrp-process-details {
        padding: 23px 19px;
    }

    .vrp-process-intro {
        flex-wrap: wrap;
    }

    .vrp-process-intro h3 {
        font-size: 22px;
    }

    .vrp-process-step {
        grid-template-columns: 34px minmax(0, 1fr) 18px;
        gap: 10px;
        padding: 17px 0;
    }

    .vrp-step-number {
        width: 33px;
        height: 33px;
        font-size: 10px;
    }

    .vrp-step-content h4 {
        font-size: 13px;
    }

    .vrp-step-content p {
        font-size: 11px;
    }

    .vrp-quality-strip {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        padding: 22px;
    }

    .vrp-quality-item {
        padding-top: 13px;
        border-top: 1px solid #e8ecef;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vrp-process-section *,
    .vrp-process-section *::before,
    .vrp-process-section *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }

    .vrp-animate {
        opacity: 1;
        transform: none;
    }
}





/* =========================================
   SECTION 8 - BRANDS WE SUPPORT
========================================= */

.vbr-brands-section {
    position: relative;
    overflow: hidden;
    padding: 105px 24px 95px;
    background: #fff;
    color: #142B3B;
    font-family: 'Montserrat', sans-serif;
}

.vbr-brands-section *,
.vbr-brands-section *::before,
.vbr-brands-section *::after {
    box-sizing: border-box;
}

.vbr-brands-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vbr-brands-heading {
    margin-bottom: 45px;
}

.vbr-brands-label {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 20px;
    color: #d97819;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
}

.vbr-brands-label > span {
    display: inline-block;
    width: 32px;
    height: 2px;
    background: #F28C28;
}

.vbr-heading-content {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 35px;
}

.vbr-heading-content h2 {
    margin: 0;
    color: #142B3B;
    font-size: clamp(34px, 4.3vw, 53px);
    font-weight: 800;
    line-height: 1.14;
    letter-spacing: -1.8px;
}

.vbr-heading-content h2 span {
    color: #F28C28;
}

.vbr-heading-content > p {
    max-width: 390px;
    margin: 0 0 4px;
    color: #687782;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* Brand wall */

.vbr-brand-wall {
    overflow: hidden;
    background: #142B3B;
    color: #fff;
    border-radius: 5px;
    box-shadow: 0 25px 60px rgba(20,43,59,.12);
}

.vbr-brand-wall-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    padding: 30px 34px 27px;
    border-bottom: 1px solid rgba(255,255,255,.13);
}

.vbr-wall-kicker {
    display: block;
    margin-bottom: 10px;
    color: #F28C28;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.8px;
}

.vbr-brand-wall-top h3 {
    margin: 0;
    color: #fff;
    font-size: 23px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -.5px;
}

.vbr-brand-counter {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #aab8c2;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vbr-brand-counter span:first-child {
    color: #F28C28;
}

.vbr-brand-counter i {
    display: block;
    width: 35px;
    height: 1px;
    background: #647581;
}

/* Brand grid */

.vbr-brand-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.vbr-brand-item {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-width: 0;
    min-height: 195px;
    padding: 35px 18px 27px;
    overflow: hidden;
    border-right: 1px solid rgba(255,255,255,.12);
    border-bottom: 1px solid rgba(255,255,255,.12);
    transition: background .3s ease;
}

.vbr-brand-item:nth-child(3n) {
    border-right: 0;
}

.vbr-brand-item:nth-child(n+4) {
    border-bottom: 0;
}

.vbr-brand-item::before {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 3px;
    background: #F28C28;
    content: "";
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .35s ease;
}

.vbr-brand-item:hover {
    background: #1a374a;
}

.vbr-brand-item:hover::before {
    transform: scaleX(1);
}

.vbr-brand-index {
    position: absolute;
    top: 17px;
    left: 19px;
    color: #7f929f;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1.1px;
}

.vbr-brand-word {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    color: #fff;
    font-size: clamp(23px, 2.7vw, 35px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -1px;
    text-align: center;
    transition: transform .3s ease, color .3s ease;
}

.vbr-brand-item:hover .vbr-brand-word {
    transform: translateY(-3px);
}

.vbr-brand-amaron {
    letter-spacing: -1.8px;
}

.vbr-brand-amaron span,
.vbr-brand-livguard span,
.vbr-brand-moura span {
    color: #F28C28;
}

.vbr-brand-exide {
    letter-spacing: 2px;
    font-style: italic;
}

.vbr-brand-exide span {
    width: 7px;
    height: 7px;
    margin-left: 7px;
    border-radius: 50%;
    background: #F28C28;
}

.vbr-brand-bosch {
    letter-spacing: 1px;
}

.vbr-brand-bosch span,
.vbr-brand-varta span {
    align-self: flex-start;
    margin: 2px 0 0 4px;
    font-size: 10px;
    letter-spacing: 0;
}

.vbr-brand-livguard {
    font-size: clamp(20px, 2.5vw, 31px);
    letter-spacing: -1.2px;
}

.vbr-brand-moura {
    letter-spacing: 1px;
}

.vbr-brand-moura span {
    margin-left: 5px;
    font-size: 30px;
}

.vbr-brand-varta {
    letter-spacing: 2px;
}

.vbr-brand-category {
    margin-top: 15px;
    color: #9aabb7;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-align: center;
}

.vbr-brand-corner {
    position: absolute;
    top: 14px;
    right: 17px;
    color: #758895;
    font-size: 14px;
    opacity: 0;
    transform: translate(-3px, 3px);
    transition: opacity .25s ease, transform .25s ease, color .25s ease;
}

.vbr-brand-item:hover .vbr-brand-corner {
    color: #F28C28;
    opacity: 1;
    transform: translate(0, 0);
}

/* Bottom CTA strip */

.vbr-brand-wall-bottom {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 23px 32px;
    border-top: 1px solid rgba(255,255,255,.13);
    background: #102433;
}

.vbr-brand-bottom-symbol {
    display: flex;
    flex: 0 0 37px;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    border: 1px solid rgba(242,140,40,.6);
    color: #F28C28;
    font-size: 23px;
    font-weight: 400;
}

.vbr-brand-wall-bottom > p {
    flex: 1;
    margin: 0;
    color: #aebdc6;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.8;
}

.vbr-brand-wall-bottom > p strong {
    display: block;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.vbr-brand-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 13px 17px;
    background: #F28C28;
    color: #142B3B;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .6px;
    text-decoration: none;
    white-space: nowrap;
    transition: background .25s ease, color .25s ease;
}

.vbr-brand-cta > span {
    font-size: 17px;
    transition: transform .25s ease;
}

.vbr-brand-cta:hover {
    background: #fff;
    color: #142B3B;
}

.vbr-brand-cta:hover > span {
    transform: translate(3px, -3px);
}

/* Compatibility note */

.vbr-compatibility-note {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 22px;
    padding: 18px 20px;
    border: 1px solid #e4e9ed;
    background: #f8fafb;
}

.vbr-note-icon {
    display: flex;
    flex: 0 0 25px;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border: 1px solid #F28C28;
    border-radius: 50%;
    color: #b96818;
    font-size: 12px;
    font-weight: 800;
}

.vbr-compatibility-note > p {
    flex: 1;
    margin: 0;
    color: #6a7882;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.8;
}

.vbr-compatibility-note > p strong {
    color: #142B3B;
    font-weight: 800;
}

.vbr-note-mark {
    color: #8a99a3;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
    white-space: nowrap;
}

/* Reveal animation */

.vbr-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .7s ease, transform .7s ease;
}

.vbr-reveal.vbr-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */

@media (max-width: 1024px) {
    .vbr-brands-section {
        padding: 80px 22px;
    }

    .vbr-heading-content {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }

    .vbr-heading-content > p {
        max-width: 600px;
    }

    .vbr-brand-item {
        min-height: 175px;
    }

    .vbr-brand-wall-bottom {
        padding: 22px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .vbr-brands-section {
        padding: 62px 16px;
    }

    .vbr-brands-heading {
        margin-bottom: 28px;
    }

    .vbr-heading-content h2 {
        font-size: clamp(30px, 8vw, 42px);
        letter-spacing: -1px;
    }

    .vbr-brand-wall-top {
        align-items: flex-start;
        flex-direction: column;
        padding: 24px 20px;
    }

    .vbr-brand-wall-top h3 {
        font-size: 20px;
    }

    .vbr-brand-counter {
        align-self: flex-end;
    }

    .vbr-brand-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vbr-brand-item {
        min-height: 150px;
        padding: 31px 10px 20px;
    }

    .vbr-brand-item:nth-child(3n) {
        border-right: 1px solid rgba(255,255,255,.12);
    }

    .vbr-brand-item:nth-child(2n) {
        border-right: 0;
    }

    .vbr-brand-item:nth-child(n+4) {
        border-bottom: 1px solid rgba(255,255,255,.12);
    }

    .vbr-brand-item:nth-child(n+5) {
        border-bottom: 0;
    }

    .vbr-brand-index {
        top: 12px;
        left: 12px;
        font-size: 7px;
    }

    .vbr-brand-corner {
        top: 10px;
        right: 10px;
    }

    .vbr-brand-word {
        min-height: 43px;
        font-size: clamp(21px, 6vw, 30px);
    }

    .vbr-brand-category {
        margin-top: 12px;
        font-size: 7px;
        letter-spacing: .7px;
    }

    .vbr-brand-wall-bottom {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 13px;
        padding: 20px;
    }

    .vbr-brand-wall-bottom > p {
        min-width: 0;
    }

    .vbr-brand-cta {
        width: 100%;
        justify-content: space-between;
        margin-top: 4px;
    }

    .vbr-compatibility-note {
        align-items: flex-start;
        flex-wrap: wrap;
        padding: 16px;
    }

    .vbr-compatibility-note > p {
        min-width: 0;
    }

    .vbr-note-mark {
        width: 100%;
        padding-left: 40px;
    }
}

@media (max-width: 380px) {
    .vbr-brand-item {
        min-height: 135px;
    }

    .vbr-brand-word {
        font-size: 20px;
    }

    .vbr-brand-category {
        font-size: 6px;
        letter-spacing: .4px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vbr-brands-section *,
    .vbr-brands-section *::before,
    .vbr-brands-section *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }

    .vbr-reveal {
        opacity: 1;
        transform: none;
    }
}





/* =========================================
   SECTION 9 - PRICING GUIDE PREVIEW
========================================= */

.vpg-pricing-section {
    position: relative;
    overflow: hidden;
    padding: 105px 24px 95px;
    background: #f4f6f8;
    color: #142B3B;
    font-family: 'Montserrat', sans-serif;
}

.vpg-pricing-section *,
.vpg-pricing-section *::before,
.vpg-pricing-section *::after {
    box-sizing: border-box;
}

.vpg-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vpg-header {
    margin-bottom: 44px;
}

.vpg-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 20px;
    color: #c96b16;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
}

.vpg-eyebrow > span {
    width: 32px;
    height: 2px;
    background: #F28C28;
}

.vpg-heading-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 35px;
}

.vpg-heading-row h2 {
    margin: 0;
    color: #142B3B;
    font-size: clamp(33px, 4.3vw, 53px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1.8px;
}

.vpg-heading-row h2 span {
    color: #F28C28;
}

.vpg-heading-row > p {
    max-width: 390px;
    margin: 0 0 5px;
    color: #667580;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* Main layout */

.vpg-pricing-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
    align-items: stretch;
    gap: 22px;
}

/* Pricing board */

.vpg-price-board {
    min-width: 0;
    padding: 30px 32px 0;
    background: #fff;
    border: 1px solid #e0e6eb;
    box-shadow: 0 18px 50px rgba(20,43,59,.05);
}

.vpg-board-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding-bottom: 25px;
}

.vpg-board-kicker {
    display: block;
    margin-bottom: 9px;
    color: #d97819;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.6px;
}

.vpg-board-header h3 {
    margin: 0;
    color: #142B3B;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.4;
}

.vpg-board-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 47px;
    height: 47px;
    flex: 0 0 47px;
    background: #142B3B;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -1px;
}

.vpg-board-mark span {
    color: #F28C28;
}

.vpg-board-columns {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    padding: 13px 0;
    border-top: 1px solid #e3e8ec;
    border-bottom: 1px solid #e3e8ec;
    color: #85929b;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.1px;
}

.vpg-price-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 15px;
    padding: 22px 10px;
    border-bottom: 1px solid #e8ecef;
    transition: background .25s ease, padding .25s ease;
}

.vpg-price-row:hover {
    padding-right: 15px;
    padding-left: 15px;
    background: #f8fafb;
}

.vpg-price-featured {
    position: relative;
    background: #fff8f0;
}

.vpg-price-featured::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    background: #F28C28;
    content: "";
}

.vpg-price-info {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.vpg-price-number {
    display: flex;
    flex: 0 0 38px;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid #e0e6eb;
    color: #142B3B;
    font-size: 10px;
    font-weight: 800;
}

.vpg-price-info h4 {
    margin: 0 0 6px;
    color: #142B3B;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.5;
}

.vpg-price-info p {
    margin: 0;
    color: #73818b;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

.vpg-price-value {
    text-align: right;
    white-space: nowrap;
}

.vpg-price-value > span {
    display: block;
    margin-bottom: 5px;
    color: #89959d;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1px;
}

.vpg-price-value > strong {
    color: #142B3B;
    font-size: 19px;
    font-weight: 800;
}

.vpg-price-featured .vpg-price-number {
    border-color: #F28C28;
    background: #F28C28;
}

.vpg-price-featured .vpg-price-value > strong {
    color: #b96513;
}

.vpg-board-footer {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 18px 0;
    color: #71808a;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .9px;
    line-height: 1.7;
}

.vpg-footer-dot {
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #F28C28;
}

/* Estimate panel */

.vpg-estimate-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 29px 27px 22px;
    background: #142B3B;
    color: #fff;
}

.vpg-estimate-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-bottom: 25px;
}

.vpg-estimate-label {
    color: #F28C28;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.7px;
}

.vpg-estimate-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border: 1px solid rgba(255,255,255,.18);
    color: #fff;
}

.vpg-estimate-icon svg {
    display: block;
    width: 31px;
    height: 31px;
}

.vpg-estimate-panel h3 {
    margin: 0 0 13px;
    color: #fff;
    font-size: clamp(22px, 2.3vw, 29px);
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: -.7px;
}

.vpg-estimate-description {
    margin: 0;
    color: #b8c5ce;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vpg-estimate-divider {
    height: 1px;
    margin: 24px 0 4px;
    background: rgba(255,255,255,.15);
}

.vpg-estimate-benefit {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255,255,255,.1);
}

.vpg-estimate-benefit > span {
    display: flex;
    flex: 0 0 27px;
    align-items: center;
    justify-content: center;
    width: 27px;
    height: 27px;
    border: 1px solid rgba(242,140,40,.5);
    color: #F28C28;
    font-size: 9px;
    font-weight: 800;
}

.vpg-estimate-benefit strong {
    display: block;
    margin-bottom: 5px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.5;
}

.vpg-estimate-benefit p {
    margin: 0;
    color: #aebdc6;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

.vpg-estimate-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-top: 23px;
    padding: 15px 16px;
    background: #F28C28;
    color: #142B3B;
    font-size: 10px;
    font-weight: 800;
    text-decoration: none;
    transition: background .25s ease, color .25s ease;
}

.vpg-estimate-button:hover {
    background: #fff;
    color: #142B3B;
}

.vpg-button-arrow {
    font-size: 19px;
    transition: transform .25s ease;
}

.vpg-estimate-button:hover .vpg-button-arrow {
    transform: translate(3px, -3px);
}

.vpg-estimate-note {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 17px;
}

.vpg-estimate-note > span {
    display: flex;
    flex: 0 0 16px;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border: 1px solid #F28C28;
    border-radius: 50%;
    color: #F28C28;
    font-size: 9px;
    font-weight: 800;
}

.vpg-estimate-note p {
    margin: 0;
    color: #aebdc6;
    font-size: 12px;
    line-height: 1.8;
}

/* Bottom information band */

.vpg-pricing-bottom {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 22px;
    padding: 22px 25px;
    border: 1px solid #e0e6eb;
    background: #fff;
}

.vpg-bottom-symbol {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    background: #fff0e1;
    color: #bd6718;
    font-size: 19px;
    font-weight: 800;
}

.vpg-bottom-copy {
    flex: 1;
    min-width: 0;
}

.vpg-bottom-copy strong {
    display: block;
    margin-bottom: 5px;
    color: #142B3B;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.6;
}

.vpg-bottom-copy p {
    margin: 0;
    color: #6d7c86;
    font-size: 13px;
    line-height: 1.7;
}

.vpg-text-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #142B3B;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .5px;
    text-decoration: none;
    white-space: nowrap;
}

.vpg-text-link span {
    color: #d97819;
    font-size: 17px;
    transition: transform .25s ease;
}

.vpg-text-link:hover span {
    transform: translate(3px, -3px);
}

/* Reveal animation */

.vpg-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .7s ease, transform .7s ease;
}

.vpg-reveal.vpg-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */

@media (max-width: 1024px) {
    .vpg-pricing-section {
        padding: 80px 22px;
    }

    .vpg-heading-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }

    .vpg-heading-row > p {
        max-width: 600px;
    }

    .vpg-pricing-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .vpg-estimate-panel {
        padding: 28px;
    }

    .vpg-estimate-panel h3 {
        max-width: 520px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .vpg-pricing-section {
        padding: 62px 16px;
    }

    .vpg-header {
        margin-bottom: 28px;
    }

    .vpg-heading-row h2 {
        font-size: clamp(30px, 8vw, 42px);
        letter-spacing: -1px;
    }

    .vpg-price-board {
        padding: 22px 17px 0;
    }

    .vpg-board-header h3 {
        font-size: 19px;
    }

    .vpg-board-mark {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }

    .vpg-price-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 13px;
        padding: 18px 7px;
    }

    .vpg-price-row:hover {
        padding-right: 10px;
        padding-left: 10px;
    }

    .vpg-price-value {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-left: 52px;
        text-align: left;
    }

    .vpg-price-value > span {
        margin-bottom: 0;
    }

    .vpg-price-value > strong {
        font-size: 17px;
    }

    .vpg-price-info {
        gap: 12px;
    }

    .vpg-price-number {
        flex-basis: 34px;
        width: 34px;
        height: 34px;
    }

    .vpg-price-info h4 {
        font-size: 12px;
    }

    .vpg-price-info p {
        font-size: 10px;
    }

    .vpg-board-footer {
        font-size: 7px;
        letter-spacing: .6px;
    }

    .vpg-estimate-panel {
        padding: 23px 20px;
    }

    .vpg-estimate-panel h3 {
        font-size: 25px;
    }

    .vpg-pricing-bottom {
        align-items: flex-start;
        flex-wrap: wrap;
        padding: 19px;
    }

    .vpg-bottom-copy {
        flex-basis: calc(100% - 60px);
    }

    .vpg-text-link {
        width: 100%;
        justify-content: space-between;
        padding-top: 14px;
        border-top: 1px solid #e5e9ed;
    }
}

@media (max-width: 380px) {
    .vpg-board-header h3 {
        font-size: 17px;
    }

    .vpg-price-info h4 {
        font-size: 11px;
    }

    .vpg-price-info p {
        font-size: 9px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vpg-pricing-section *,
    .vpg-pricing-section *::before,
    .vpg-pricing-section *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }

    .vpg-reveal {
        opacity: 1;
        transform: none;
    }
}





/* =========================================
   SECTION 10 - CUSTOMER TESTIMONIALS
========================================= */

.vct-testimonials {
    padding: 105px 24px 95px;
    overflow: hidden;
    background: #fff;
    color: #142B3B;
    font-family: 'Montserrat', sans-serif;
}

.vct-testimonials *,
.vct-testimonials *::before,
.vct-testimonials *::after {
    box-sizing: border-box;
}

.vct-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vct-heading {
    margin-bottom: 45px;
}

.vct-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 20px;
    color: #c96b16;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
}

.vct-eyebrow > span {
    width: 32px;
    height: 2px;
    background: #F28C28;
}

.vct-heading-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 35px;
}

.vct-heading-row h2 {
    margin: 0;
    color: #142B3B;
    font-size: clamp(33px, 4.3vw, 53px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1.8px;
}

.vct-heading-row h2 span {
    color: #F28C28;
}

.vct-heading-row > p {
    max-width: 440px;
    margin: 0 0 5px;
    color: #647580;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* Editorial split */

.vct-editorial-layout {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    gap: 25px;
    align-items: stretch;
}

/* Featured panel */

.vct-featured-review {
    display: flex;
    flex-direction: column;
    min-height: 570px;
    padding: 32px;
    background: #142B3B;
    color: #fff;
}

.vct-review-topline {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    color: #bdc9d1;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.2px;
}

.vct-review-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    border: 1px solid rgba(255,255,255,.2);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
}

.vct-review-mark span {
    color: #F28C28;
}

.vct-quote-symbol {
    margin-top: 48px;
    color: #F28C28;
    font-family: Georgia, serif;
    font-size: 100px;
    line-height: .8;
}

.vct-featured-review h3 {
    max-width: 460px;
    margin: 20px 0 20px;
    color: #fff;
    font-size: clamp(26px, 3vw, 37px);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -1px;
}

.vct-featured-review h3 span {
    color: #F28C28;
}

.vct-featured-copy {
    max-width: 440px;
    margin: 0 0 30px;
    color: #bdc9d1;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vct-featured-footer {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: auto;
    padding-top: 22px;
    border-top: 1px solid rgba(255,255,255,.16);
}

.vct-featured-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    flex: 0 0 43px;
    background: #F28C28;
    color: #142B3B;
    font-size: 12px;
    font-weight: 800;
}

.vct-featured-footer > div:nth-child(2) {
    flex: 1;
}

.vct-featured-footer strong {
    display: block;
    margin-bottom: 5px;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
}

.vct-featured-footer > div:nth-child(2) span {
    color: #bdc9d1;
    font-size: 12px;
    font-weight: 400;
}

.vct-featured-arrow {
    color: #F28C28;
    font-size: 22px;
}

/* Review side */

.vct-review-side {
    min-width: 0;
    padding: 8px 0 0;
}

.vct-side-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 15px;
    padding: 0 0 22px;
    border-bottom: 1px solid #e3e8ec;
}

.vct-side-heading > div:first-child > span {
    display: block;
    margin-bottom: 9px;
    color: #c96b16;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.vct-side-heading h3 {
    margin: 0;
    color: #142B3B;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.5;
}

.vct-side-index {
    color: #929fa8;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}

.vct-review-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 20px;
    align-items: start;
    gap: 15px;
    padding: 23px 7px;
    border-bottom: 1px solid #e3e8ec;
    transition: background .25s ease, padding .25s ease;
}

.vct-review-item:hover {
    padding-right: 13px;
    padding-left: 13px;
    background: #f7f9fa;
}

.vct-review-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid #dce3e8;
    color: #142B3B;
    font-size: 11px;
    font-weight: 800;
}

.vct-review-stars {
    margin-bottom: 8px;
    color: #F28C28;
    font-size: 13px;
    letter-spacing: 3px;
}

.vct-review-content h4 {
    margin: 0 0 8px;
    color: #142B3B;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.5;
}

.vct-review-content > p {
    margin: 0 0 12px;
    color: #647580;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

.vct-review-category {
    color: #c96b16;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.vct-review-arrow {
    padding-top: 3px;
    color: #9aa7b0;
    font-size: 18px;
    transition: color .25s ease, transform .25s ease;
}

.vct-review-item:hover .vct-review-arrow {
    color: #F28C28;
    transform: translate(3px, -3px);
}

/* Bottom CTA strip */

.vct-bottom-strip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 25px;
    margin-top: 25px;
    padding: 25px 30px;
    border: 1px solid #e1e6ea;
    background: #f4f6f8;
}

.vct-bottom-copy > span {
    display: block;
    margin-bottom: 8px;
    color: #c96b16;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.vct-bottom-copy h3 {
    margin: 0;
    color: #142B3B;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.5;
}

.vct-contact-link {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    min-width: 190px;
    padding: 15px 18px;
    background: #F28C28;
    color: #142B3B;
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
    transition: background .25s ease, color .25s ease;
}

.vct-contact-link > span {
    font-size: 19px;
    transition: transform .25s ease;
}

.vct-contact-link:hover {
    background: #142B3B;
    color: #fff;
}

.vct-contact-link:hover > span {
    transform: translate(3px, -3px);
}

/* Reveal animation */

.vct-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .7s ease, transform .7s ease;
}

.vct-reveal.vct-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Tablet */

@media (max-width: 1024px) {
    .vct-testimonials {
        padding: 80px 22px;
    }

    .vct-heading-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }

    .vct-heading-row > p {
        max-width: 650px;
    }

    .vct-editorial-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .vct-featured-review {
        min-height: 450px;
    }

    .vct-review-side {
        padding-top: 10px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .vct-testimonials {
        padding: 62px 16px;
    }

    .vct-heading {
        margin-bottom: 28px;
    }

    .vct-heading-row h2 {
        font-size: clamp(30px, 8vw, 42px);
        letter-spacing: -1px;
    }

    .vct-featured-review {
        min-height: auto;
        padding: 23px;
    }

    .vct-quote-symbol {
        margin-top: 35px;
        font-size: 78px;
    }

    .vct-featured-review h3 {
        margin-top: 14px;
        font-size: 27px;
    }

    .vct-featured-copy {
        font-size: 15px;
    }

    .vct-featured-footer {
        margin-top: 10px;
    }

    .vct-side-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .vct-side-heading h3 {
        font-size: 20px;
    }

    .vct-review-item {
        grid-template-columns: 32px minmax(0, 1fr) 16px;
        gap: 11px;
        padding: 20px 3px;
    }

    .vct-review-item:hover {
        padding-right: 7px;
        padding-left: 7px;
    }

    .vct-review-number {
        width: 31px;
        height: 31px;
        font-size: 10px;
    }

    .vct-review-content h4 {
        font-size: 15px;
    }

    .vct-review-content > p {
        font-size: 15px;
    }

    .vct-bottom-strip {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .vct-bottom-copy h3 {
        font-size: 20px;
    }

    .vct-contact-link {
        width: 100%;
    }
}

@media (max-width: 380px) {
    .vct-review-item {
        grid-template-columns: 29px minmax(0, 1fr) 14px;
        gap: 8px;
    }

    .vct-review-number {
        width: 28px;
        height: 28px;
    }

    .vct-review-stars {
        font-size: 12px;
        letter-spacing: 2px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vct-testimonials *,
    .vct-testimonials *::before,
    .vct-testimonials *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }

    .vct-reveal {
        opacity: 1;
        transform: none;
    }
}


/* =========================================
   SECTION 11: PREMIUM FAQ
========================================= */

.vfaq-section {
    position: relative;
    overflow: hidden;
    padding: 110px 24px;
    background: #f5f6f7;
    color: #142b3b;
    font-family: 'Montserrat', sans-serif;
}

.vfaq-section,
.vfaq-section * {
    box-sizing: border-box;
}

.vfaq-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vfaq-layout {
    display: grid;
    grid-template-columns: 0.82fr 1.18fr;
    gap: 85px;
    align-items: start;
}

/* LEFT INTRO */

.vfaq-intro {
    position: sticky;
    top: 35px;
}

.vfaq-tag {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    color: #f28c28;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 1.7;
}

.vfaq-tag-line {
    display: inline-block;
    width: 32px;
    height: 2px;
    background: #f28c28;
}

.vfaq-intro h2 {
    margin: 0 0 23px;
    color: #142b3b;
    font-size: clamp(32px, 3.6vw, 48px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.5px;
}

.vfaq-intro h2 span {
    display: block;
    color: #f28c28;
}

.vfaq-intro-text {
    max-width: 430px;
    margin: 0 0 34px;
    color: #697680;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* HELP CARD */

.vfaq-help-card {
    display: flex;
    align-items: flex-start;
    gap: 17px;
    padding: 25px 22px;
    background: #ffffff;
    border: 1px solid #e5e8ea;
    border-radius: 12px;
    box-shadow: 0 12px 35px rgba(20, 43, 59, 0.04);
}

.vfaq-help-icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    color: #142b3b;
    background: #fff0df;
    border-radius: 10px;
    font-size: 20px;
}

.vfaq-help-content {
    min-width: 0;
}

.vfaq-help-content h3 {
    margin: 2px 0 9px;
    color: #142b3b;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
}

.vfaq-help-content p {
    margin: 0 0 17px;
    color: #697680;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

.vfaq-help-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #142b3b;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.vfaq-help-link i {
    color: #f28c28;
    transition: transform 0.3s ease;
}

.vfaq-help-link:hover {
    color: #f28c28;
}

.vfaq-help-link:hover i {
    transform: translateX(5px);
}

.vfaq-bottom-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 27px;
    color: #697680;
    font-size: 12px;
    font-weight: 600;
}

.vfaq-bottom-note i {
    color: #f28c28;
    font-size: 15px;
}

/* ACCORDION */

.vfaq-accordion {
    min-width: 0;
    padding-top: 4px;
}

.vfaq-item {
    margin: 0;
    border-bottom: 1px solid #dce1e4;
}

.vfaq-item:first-child {
    border-top: 1px solid #dce1e4;
}

.vfaq-item summary {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 17px;
    padding: 25px 4px;
    cursor: pointer;
    list-style: none;
    outline: none;
}

.vfaq-item summary::-webkit-details-marker {
    display: none;
}

.vfaq-number {
    color: #f28c28;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vfaq-question {
    color: #142b3b;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.65;
    transition: color 0.3s ease;
}

.vfaq-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid #dce1e4;
    border-radius: 50%;
    color: #142b3b;
    background: transparent;
    font-size: 12px;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.vfaq-toggle i {
    transition: transform 0.3s ease;
}

.vfaq-item[open] .vfaq-toggle {
    color: #ffffff;
    background: #f28c28;
    border-color: #f28c28;
}

.vfaq-item[open] .vfaq-toggle i {
    transform: rotate(45deg);
}

.vfaq-item[open] .vfaq-question,
.vfaq-item summary:hover .vfaq-question {
    color: #f28c28;
}

.vfaq-answer {
    padding: 0 55px 25px;
    animation: vfaqAnswerIn 0.3s ease both;
}

.vfaq-answer p {
    margin: 0;
    color: #697680;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

@keyframes vfaqAnswerIn {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ACCORDION FOOTER */

.vfaq-accordion-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 32px;
    padding-top: 24px;
}

.vfaq-accordion-footer > span {
    color: #8a949b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    line-height: 1.8;
}

.vfaq-accordion-footer a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 19px;
    color: #ffffff;
    background: #142b3b;
    border: 1px solid #142b3b;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease;
}

.vfaq-accordion-footer a:hover {
    color: #142b3b;
    background: #f28c28;
    border-color: #f28c28;
}

/* ENTRANCE ANIMATION */

.vfaq-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.vfaq-reveal.vfaq-visible {
    opacity: 1;
    transform: translateY(0);
}

/* RESPONSIVE */

@media (max-width: 1024px) {
    .vfaq-section {
        padding: 85px 24px;
    }

    .vfaq-layout {
        grid-template-columns: 0.85fr 1.15fr;
        gap: 45px;
    }

    .vfaq-intro h2 {
        font-size: 37px;
    }

    .vfaq-item summary {
        grid-template-columns: 30px minmax(0, 1fr) 34px;
        gap: 12px;
    }

    .vfaq-answer {
        padding-left: 42px;
        padding-right: 35px;
    }
}

@media (max-width: 767px) {
    .vfaq-section {
        padding: 70px 20px;
    }

    .vfaq-layout {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .vfaq-intro {
        position: relative;
        top: auto;
    }

    .vfaq-intro h2 {
        font-size: 36px;
        letter-spacing: -1px;
    }

    .vfaq-intro-text {
        max-width: 100%;
    }

    .vfaq-help-card {
        padding: 22px 18px;
    }

    .vfaq-item summary {
        grid-template-columns: 28px minmax(0, 1fr) 32px;
        gap: 10px;
        padding: 22px 0;
    }

    .vfaq-question {
        font-size: 15px;
    }

    .vfaq-answer {
        padding: 0 42px 23px 38px;
    }

    .vfaq-accordion-footer {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .vfaq-section {
        padding: 58px 16px;
    }

    .vfaq-tag {
        font-size: 10px;
        letter-spacing: 1.3px;
    }

    .vfaq-intro h2 {
        font-size: 31px;
    }

    .vfaq-help-card {
        gap: 12px;
        padding: 18px 14px;
    }

    .vfaq-help-icon {
        width: 42px;
        height: 42px;
        font-size: 17px;
    }

    .vfaq-help-content h3 {
        font-size: 16px;
    }

    .vfaq-item summary {
        grid-template-columns: 24px minmax(0, 1fr) 29px;
        gap: 8px;
    }

    .vfaq-number {
        font-size: 10px;
    }

    .vfaq-question {
        font-size: 14px;
    }

    .vfaq-toggle {
        width: 29px;
        height: 29px;
        font-size: 10px;
    }

    .vfaq-answer {
        padding: 0 0 22px 32px;
    }

    .vfaq-accordion-footer a {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vfaq-reveal,
    .vfaq-answer,
    .vfaq-toggle,
    .vfaq-help-link i {
        animation: none;
        transition: none;
    }

    .vfaq-reveal {
        opacity: 1;
        transform: none;
    }
}

/* =========================================
   SECTION 12: BOOK A REPAIR CTA
========================================= */

.vbook-section {
    position: relative;
    overflow: hidden;
    padding: 100px 24px 35px;
    background: #f5f6f7;
    color: #142b3b;
    font-family: 'Montserrat', sans-serif;
}

.vbook-section,
.vbook-section * {
    box-sizing: border-box;
}

.vbook-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vbook-panel {
    position: relative;
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    align-items: center;
    gap: 45px;
    min-height: 490px;
    padding: 65px 65px 65px 70px;
    overflow: hidden;
    background: #142b3b;
    border-radius: 16px;
    isolation: isolate;
}

/* DECORATIVE BACKGROUND */

.vbook-orbit {
    position: absolute;
    z-index: -1;
    border: 1px solid rgba(242, 140, 40, 0.15);
    border-radius: 50%;
    pointer-events: none;
}

.vbook-orbit-one {
    top: -240px;
    right: -160px;
    width: 650px;
    height: 650px;
}

.vbook-orbit-two {
    top: -150px;
    right: -70px;
    width: 470px;
    height: 470px;
}

.vbook-glow {
    position: absolute;
    z-index: -1;
    top: 25%;
    right: 8%;
    width: 300px;
    height: 300px;
    background: rgba(242, 140, 40, 0.12);
    filter: blur(90px);
    border-radius: 50%;
}

/* CONTENT */

.vbook-content {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.vbook-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 26px;
    color: #ffb66f;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.8;
    letter-spacing: 1.8px;
}

.vbook-eyebrow-line {
    display: inline-block;
    width: 30px;
    height: 2px;
    background: #f28c28;
}

.vbook-content h2 {
    max-width: 580px;
    margin: 0 0 23px;
    color: #ffffff;
    font-size: clamp(34px, 4vw, 51px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.5px;
}

.vbook-content h2 span {
    display: block;
    color: #f28c28;
}

.vbook-description {
    max-width: 480px;
    margin: 0 0 32px;
    color: #c0cbd2;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* BUTTONS */

.vbook-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 13px;
}

.vbook-primary-btn,
.vbook-secondary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 51px;
    padding: 0 22px;
    border: 1px solid transparent;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.vbook-primary-btn {
    color: #142b3b;
    background: #f28c28;
    border-color: #f28c28;
}

.vbook-primary-btn:hover {
    color: #142b3b;
    background: #ffb66f;
    border-color: #ffb66f;
    transform: translateY(-3px);
}

.vbook-secondary-btn {
    color: #ffffff;
    background: transparent;
    border-color: rgba(255, 255, 255, 0.3);
}

.vbook-secondary-btn:hover {
    color: #f28c28;
    border-color: #f28c28;
    transform: translateY(-3px);
}

.vbook-primary-btn i,
.vbook-secondary-btn i {
    font-size: 13px;
}

/* TRUST LINE */

.vbook-trust-line {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 35px;
    padding-top: 23px;
    border-top: 1px solid rgba(255, 255, 255, 0.13);
}

.vbook-trust-icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: #f28c28;
    background: rgba(242, 140, 40, 0.13);
    border-radius: 50%;
    font-size: 14px;
}

.vbook-trust-line p {
    max-width: 370px;
    margin: 0;
    color: #c0cbd2;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

/* RIGHT VISUAL */

.vbook-visual {
    position: relative;
    min-width: 0;
    padding: 15px 0;
}

.vbook-visual-frame {
    position: relative;
    overflow: hidden;
    padding: 19px;
    background: rgba(8, 24, 35, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 12px;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.15);
}

.vbook-visual-top {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #c0cbd2;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vbook-live-dot {
    width: 7px;
    height: 7px;
    background: #f28c28;
    border-radius: 50%;
    box-shadow: 0 0 12px rgba(242, 140, 40, 0.7);
}

.vbook-visual-index {
    margin-left: auto;
    color: #7d919e;
    font-size: 9px;
}

.vbook-car-illustration {
    width: 100%;
    margin: 22px auto 12px;
}

.vbook-car-illustration svg {
    display: block;
    width: 100%;
    max-width: 520px;
    height: auto;
    margin: 0 auto;
}

.vbook-visual-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.vbook-visual-bottom > div:first-child {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.vbook-small-label {
    color: #f28c28;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vbook-visual-bottom strong {
    color: #ffffff;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.6;
}

.vbook-arrow-box {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: #142b3b;
    background: #f28c28;
    border-radius: 6px;
    font-size: 14px;
}

/* FLOATING BADGE */

.vbook-floating-badge {
    position: absolute;
    right: -18px;
    bottom: -2px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px 18px;
    background: #ffffff;
    border: 1px solid #e6e9eb;
    border-radius: 9px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.18);
}

.vbook-badge-icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: #142b3b;
    background: #fff0df;
    border-radius: 7px;
    font-size: 17px;
}

.vbook-floating-badge > div {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.vbook-floating-badge strong {
    color: #142b3b;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
}

.vbook-floating-badge > div > span {
    color: #697680;
    font-size: 11px;
    font-weight: 400;
}

/* BOTTOM STRIP */

.vbook-bottom-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 25px 5px 0;
}

.vbook-bottom-strip > span {
    color: #697680;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    line-height: 1.8;
}

.vbook-bottom-strip > span b {
    padding: 0 7px;
    color: #f28c28;
}

.vbook-bottom-strip a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #142b3b;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.vbook-bottom-strip a i {
    color: #f28c28;
}

.vbook-bottom-strip a:hover {
    color: #f28c28;
}

/* ENTRANCE ANIMATION */

.vbook-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.75s ease,
        transform 0.75s ease;
}

.vbook-reveal.vbook-visible {
    opacity: 1;
    transform: translateY(0);
}

.vbook-visual.vbook-visible {
    transition-delay: 0.15s;
}

/* RESPONSIVE */

@media (max-width: 1024px) {
    .vbook-section {
        padding: 80px 22px 30px;
    }

    .vbook-panel {
        grid-template-columns: 1fr 0.9fr;
        gap: 28px;
        padding: 48px 35px;
    }

    .vbook-content h2 {
        font-size: 39px;
    }

    .vbook-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .vbook-actions a {
        width: 100%;
    }

    .vbook-floating-badge {
        right: -5px;
    }
}

@media (max-width: 767px) {
    .vbook-section {
        padding: 65px 18px 25px;
    }

    .vbook-panel {
        grid-template-columns: 1fr;
        gap: 35px;
        padding: 38px 25px 50px;
        border-radius: 12px;
    }

    .vbook-content h2 {
        font-size: 36px;
    }

    .vbook-description {
        max-width: 100%;
    }

    .vbook-actions {
        flex-direction: row;
        align-items: stretch;
    }

    .vbook-actions a {
        flex: 1 1 180px;
        width: auto;
    }

    .vbook-visual {
        max-width: 540px;
        width: 100%;
        margin: 0 auto;
        padding-bottom: 28px;
    }

    .vbook-floating-badge {
        right: 8px;
        bottom: 0;
    }

    .vbook-bottom-strip {
        align-items: flex-start;
        flex-direction: column;
        gap: 13px;
    }
}

@media (max-width: 480px) {
    .vbook-section {
        padding: 50px 14px 22px;
    }

    .vbook-panel {
        gap: 27px;
        padding: 30px 18px 40px;
    }

    .vbook-eyebrow {
        font-size: 9px;
        letter-spacing: 1px;
    }

    .vbook-content h2 {
        font-size: 30px;
        letter-spacing: -0.8px;
    }

    .vbook-description {
        font-size: 15px;
    }

    .vbook-actions {
        flex-direction: column;
    }

    .vbook-actions a {
        width: 100%;
        flex: auto;
    }

    .vbook-trust-line {
        align-items: flex-start;
    }

    .vbook-visual-frame {
        padding: 14px;
    }

    .vbook-car-illustration {
        margin: 15px auto 10px;
    }

    .vbook-visual-bottom strong {
        font-size: 13px;
    }

    .vbook-floating-badge {
        right: 4px;
        gap: 9px;
        padding: 11px 12px;
    }

    .vbook-badge-icon {
        width: 34px;
        height: 34px;
    }

    .vbook-floating-badge strong {
        font-size: 11px;
    }

    .vbook-bottom-strip > span {
        font-size: 9px;
        letter-spacing: 1px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vbook-reveal,
    .vbook-primary-btn,
    .vbook-secondary-btn {
        opacity: 1;
        transform: none;
        transition: none;
    }
}




/* =========================================
   VOLTCARE HOME 2 - PREMIUM HERO BANNER
   Prefix: va2-
========================================= */

.va2-hero,
.va2-hero * {
    box-sizing: border-box;
}

.va2-hero {
    --va2-navy: #142B3B;
    --va2-orange: #F28C28;
    --va2-white: #FFFFFF;
    --va2-muted: #B8C5CF;

    position: relative;
    width: 100%;
    min-height: 740px;
    overflow: hidden;
    isolation: isolate;
    background: #0C1B26;
    color: var(--va2-white);
    font-family: 'Montserrat', sans-serif;
    padding: 90px 5% 0;
}

.va2-hero a {
    text-decoration: none;
}

.va2-hero-container {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 1440px;
    min-height: 570px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr);
    align-items: center;
    gap: 65px;
    padding-bottom: 90px;
}

/* BACKGROUND GRID */

.va2-hero-grid {
    position: absolute;
    inset: 0;
    z-index: -3;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
    background-size: 55px 55px;
    mask-image: linear-gradient(to right, black, transparent 90%);
}

.va2-hero-glow {
    position: absolute;
    z-index: -2;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    filter: blur(100px);
    pointer-events: none;
}

.va2-hero-glow-one {
    top: -220px;
    left: 5%;
    background: rgba(242, 140, 40, 0.12);
}

.va2-hero-glow-two {
    right: -200px;
    bottom: 5%;
    background: rgba(38, 103, 139, 0.22);
}

/* LEFT CONTENT */

.va2-hero-content {
    position: relative;
    z-index: 4;
    width: 100%;
    min-width: 0;
}

.va2-hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 27px;
    color: var(--va2-orange);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 1.5;
}

.va2-tag-line {
    display: inline-block;
    width: 32px;
    height: 2px;
    background: var(--va2-orange);
}

.va2-hero-tag i {
    font-size: 15px;
}

.va2-hero-content h1 {
    max-width: 680px;
    margin: 0;
    color: #FFFFFF;
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(38px, 4.2vw, 65px);
    font-weight: 800;
    line-height: 1.13;
    letter-spacing: -2px;
}

.va2-hero-content h1 > span {
    display: block;
    color: var(--va2-orange);
}

.va2-hero-content h1 .va2-title-outline {
    color: transparent;
    -webkit-text-stroke: 1.2px rgba(255,255,255,0.8);
}

.va2-hero-description {
    max-width: 520px;
    margin: 25px 0 0;
    color: var(--va2-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* BUTTONS */

.va2-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 33px;
}

.va2-btn {
    min-height: 54px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    padding: 0 21px;
    border-radius: 5px;
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 700;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease,
        border-color 0.3s ease;
}

.va2-btn-primary {
    background: var(--va2-orange);
    color: #142B3B;
    border: 1px solid var(--va2-orange);
}

.va2-btn-primary:hover {
    background: #FFFFFF;
    color: #142B3B;
    border-color: #FFFFFF;
    transform: translateY(-3px);
}

.va2-btn-primary i {
    transition: transform 0.3s ease;
}

.va2-btn-primary:hover i {
    transform: translateX(4px);
}

.va2-btn-secondary {
    background: transparent;
    color: #FFFFFF;
    border: 1px solid rgba(255,255,255,0.23);
}

.va2-btn-secondary:hover {
    border-color: var(--va2-orange);
    color: var(--va2-orange);
    transform: translateY(-3px);
}

.va2-play-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid rgba(255,255,255,0.4);
    border-radius: 50%;
    font-size: 11px;
}

/* SERVICE HIGHLIGHTS */

.va2-hero-highlights {
    display: flex;
    align-items: center;
    gap: 23px;
    margin-top: 42px;
}

.va2-highlight-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.va2-highlight-icon {
    width: 43px;
    height: 43px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--va2-orange);
    background: rgba(242,140,40,0.1);
    border: 1px solid rgba(242,140,40,0.25);
    border-radius: 6px;
    font-size: 17px;
}

.va2-highlight-item strong {
    display: block;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
}

.va2-highlight-item div > span {
    display: block;
    margin-top: 4px;
    color: #9EADB8;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.5;
}

.va2-highlight-divider {
    width: 1px;
    height: 37px;
    background: rgba(255,255,255,0.18);
}

/* RIGHT SIDE IMAGE */

.va2-hero-visual {
    position: relative;
    z-index: 2;
    width: 100%;
    min-width: 0;
    padding: 0 0 28px;
}

.va2-image-frame {
    position: relative;
    width: 100%;
    height: 490px;
    overflow: hidden;
    background: #142B3B;
    border: 1px solid rgba(242,140,40,0.35);
    border-radius: 10px;
    box-shadow: 0 25px 70px rgba(0,0,0,0.28);
}

.va2-hero-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.7s ease;
}

.va2-image-frame:hover .va2-hero-image {
    transform: scale(1.045);
}

.va2-image-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(10,25,36,0.06) 15%,
        rgba(10,25,36,0.05) 40%,
        rgba(10,25,36,0.86) 100%
    );
}

/* TOP LABEL */

.va2-image-top-label {
    position: absolute;
    top: 22px;
    left: 22px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 11px 13px;
    background: rgba(20,43,59,0.88);
    border: 1px solid rgba(255,255,255,0.16);
    border-radius: 4px;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    backdrop-filter: blur(10px);
}

.va2-status-dot {
    width: 7px;
    height: 7px;
    flex-shrink: 0;
    background: var(--va2-orange);
    border-radius: 50%;
    box-shadow: 0 0 12px rgba(242,140,40,0.7);
    animation: va2-status-pulse 2s infinite;
}

@keyframes va2-status-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(242,140,40,0.5);
    }
    50% {
        box-shadow: 0 0 0 6px rgba(242,140,40,0);
    }
}

/* BOTTOM IMAGE BADGE */

.va2-image-badge {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 20px;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 17px;
    background: rgba(20,43,59,0.93);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 7px;
    backdrop-filter: blur(12px);
}

.va2-badge-icon {
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--va2-orange);
    color: #142B3B;
    border-radius: 6px;
    font-size: 19px;
}

.va2-badge-content {
    flex: 1;
    min-width: 0;
}

.va2-badge-content strong {
    display: block;
    margin-bottom: 6px;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.7px;
    line-height: 1.5;
}

.va2-badge-content span {
    display: block;
    color: #D7E0E7;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
}

.va2-badge-arrow {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--va2-orange);
    border: 1px solid rgba(242,140,40,0.4);
    border-radius: 50%;
    font-size: 12px;
}

/* CORNER ICON */

.va2-image-corner {
    position: absolute;
    top: 22px;
    right: 22px;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--va2-orange);
    color: #142B3B;
    border-radius: 6px;
    font-size: 18px;
}

/* FLOATING CARD */

.va2-floating-card {
    position: absolute;
    z-index: 5;
    left: -32px;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    width: min(310px, 85%);
    padding: 17px;
    background: #FFFFFF;
    border: 1px solid rgba(20,43,59,0.08);
    border-radius: 7px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.22);
    animation: va2-float 4s ease-in-out infinite;
}

.va2-floating-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    flex-shrink: 0;
    background: #FFF0E1;
    color: #142B3B;
    border-radius: 6px;
    font-size: 18px;
}

.va2-floating-text {
    flex: 1;
    min-width: 0;
}

.va2-floating-text strong {
    display: block;
    color: #142B3B;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
}

.va2-floating-text span {
    display: block;
    margin-top: 4px;
    color: #647582;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.5;
}

.va2-floating-check {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    flex-shrink: 0;
    background: #E8F5EB;
    color: #258447;
    border-radius: 50%;
    font-size: 11px;
}

@keyframes va2-float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-7px);
    }
}

.va2-visual-decoration {
    position: absolute;
    z-index: -1;
    top: -17px;
    right: -17px;
    width: 115px;
    height: 115px;
    border-top: 2px solid var(--va2-orange);
    border-right: 2px solid var(--va2-orange);
    opacity: 0.7;
}

/* BOTTOM TICKER */

.va2-ticker {
    position: relative;
    z-index: 3;
    width: calc(100% + 10.5%);
    margin-left: -5.25%;
    overflow: hidden;
    border-top: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.025);
}

.va2-ticker-track {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 42px;
    width: max-content;
    padding: 21px 0;
    animation: va2-ticker-scroll 28s linear infinite;
}

.va2-ticker:hover .va2-ticker-track {
    animation-play-state: paused;
}

.va2-ticker-track > span {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    white-space: nowrap;
    color: #D9E0E5;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.va2-ticker-track > span i {
    color: var(--va2-orange);
    font-size: 13px;
}

.va2-ticker-track > span i.fa-circle {
    font-size: 5px;
}

@keyframes va2-ticker-scroll {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

/* ENTRANCE ANIMATION */

.va2-hero-reveal {
    opacity: 0;
    transform: translateY(24px);
    animation: va2-reveal 0.8s ease forwards;
}

.va2-hero-content.va2-hero-reveal {
    animation-delay: 0.1s;
}

.va2-hero-visual.va2-hero-reveal {
    animation-delay: 0.25s;
}

@keyframes va2-reveal {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =========================================
   RESPONSIVE - 1024px
========================================= */

@media (max-width: 1024px) {

    .va2-hero {
        padding: 75px 4% 0;
    }

    .va2-hero-container {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        gap: 35px;
        min-height: 530px;
        padding-bottom: 85px;
    }

    .va2-hero-content h1 {
        font-size: clamp(36px, 4.5vw, 49px);
        letter-spacing: -1.5px;
    }

    .va2-hero-description {
        font-size: 15px;
    }

    .va2-image-frame {
        height: 430px;
    }

    .va2-hero-highlights {
        gap: 14px;
    }

    .va2-highlight-item {
        gap: 8px;
    }

    .va2-highlight-item strong {
        font-size: 11px;
    }

    .va2-highlight-item div > span {
        font-size: 10px;
    }

    .va2-floating-card {
        left: -15px;
    }

    .va2-ticker {
        width: calc(100% + 8.4%);
        margin-left: -4.2%;
    }
}

/* =========================================
   RESPONSIVE - 767px
========================================= */

@media (max-width: 767px) {

    .va2-hero {
        padding: 65px 22px 0;
    }

    .va2-hero-container {
        grid-template-columns: 1fr;
        gap: 45px;
        min-height: auto;
        padding-bottom: 65px;
    }

    .va2-hero-content {
        max-width: 620px;
    }

    .va2-hero-tag {
        margin-bottom: 22px;
        font-size: 10px;
        letter-spacing: 1.5px;
    }

    .va2-hero-content h1 {
        max-width: 600px;
        font-size: clamp(38px, 8vw, 56px);
        line-height: 1.13;
        letter-spacing: -1.5px;
    }

    .va2-hero-description {
        max-width: 550px;
        margin-top: 20px;
        font-size: 15px;
        line-height: 1.8;
    }

    .va2-hero-actions {
        gap: 12px;
        margin-top: 26px;
    }

    .va2-btn {
        min-height: 51px;
        padding: 0 16px;
        font-size: 12px;
    }

    .va2-hero-highlights {
        margin-top: 30px;
        gap: 18px;
    }

    .va2-hero-visual {
        width: 100%;
        max-width: 560px;
        margin: 0 auto;
        padding-bottom: 28px;
    }

    .va2-image-frame {
        height: 410px;
    }

    .va2-floating-card {
        left: 14px;
        bottom: 0;
    }

    .va2-visual-decoration {
        right: -8px;
    }

    .va2-ticker {
        width: calc(100% + 44px);
        margin-left: -22px;
    }

    .va2-ticker-track {
        gap: 30px;
    }
}

/* =========================================
   RESPONSIVE - 480px
========================================= */

@media (max-width: 480px) {

    .va2-hero {
        padding: 48px 18px 0;
    }

    .va2-hero-container {
        gap: 37px;
        padding-bottom: 58px;
    }

    .va2-hero-tag {
        gap: 8px;
        font-size: 9px;
        letter-spacing: 1px;
    }

    .va2-tag-line {
        width: 22px;
    }

    .va2-hero-content h1 {
        font-size: clamp(34px, 9.2vw, 43px);
        letter-spacing: -1.2px;
    }

    .va2-hero-description {
        margin-top: 18px;
        font-size: 15px;
        line-height: 1.8;
    }

    .va2-hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .va2-btn {
        width: 100%;
        min-height: 51px;
    }

    .va2-hero-highlights {
        align-items: flex-start;
        gap: 12px;
    }

    .va2-highlight-item {
        align-items: flex-start;
        gap: 8px;
    }

    .va2-highlight-icon {
        width: 35px;
        height: 35px;
        font-size: 14px;
    }

    .va2-highlight-item strong {
        font-size: 10px;
    }

    .va2-highlight-item div > span {
        font-size: 10px;
        line-height: 1.5;
    }

    .va2-highlight-divider {
        height: 34px;
    }

    .va2-image-frame {
        height: 340px;
        border-radius: 7px;
    }

    .va2-image-top-label {
        top: 12px;
        left: 12px;
        padding: 9px 10px;
        font-size: 8px;
        letter-spacing: 0.6px;
    }

    .va2-image-corner {
        top: 12px;
        right: 12px;
        width: 36px;
        height: 36px;
        font-size: 15px;
    }

    .va2-image-badge {
        left: 11px;
        right: 11px;
        bottom: 11px;
        gap: 10px;
        padding: 12px;
    }

    .va2-badge-icon {
        width: 37px;
        height: 37px;
        font-size: 16px;
    }

    .va2-badge-content strong {
        font-size: 10px;
        letter-spacing: 0.3px;
    }

    .va2-badge-content span {
        font-size: 11px;
    }

    .va2-badge-arrow {
        width: 28px;
        height: 28px;
        font-size: 10px;
    }

    .va2-floating-card {
        left: 8px;
        width: calc(100% - 16px);
        gap: 10px;
        padding: 12px;
    }

    .va2-floating-icon {
        width: 36px;
        height: 36px;
        font-size: 15px;
    }

    .va2-floating-text strong {
        font-size: 11px;
    }

    .va2-floating-text span {
        font-size: 10px;
    }

    .va2-visual-decoration {
        width: 75px;
        height: 75px;
        top: -9px;
        right: -7px;
    }

    .va2-ticker {
        width: calc(100% + 36px);
        margin-left: -18px;
    }

    .va2-ticker-track {
        gap: 24px;
        padding: 17px 0;
    }

    .va2-ticker-track > span {
        font-size: 9px;
        letter-spacing: 1px;
    }
}

/* REDUCED MOTION ACCESSIBILITY */

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

    .va2-hero *,
    .va2-hero *::before,
    .va2-hero *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .va2-hero-reveal {
        opacity: 1;
        transform: none;
    }
}

/* =========================================
   HOME 2 - SECTION 2
   Electrical Expertise
   Unique prefix: va2connect-
========================================= */

.va2connect-section,
.va2connect-section * {
    box-sizing: border-box;
}

.va2connect-section {
    --vc-navy: #142B3B;
    --vc-orange: #F28C28;
    --vc-white: #FFFFFF;
    --vc-text: #5D6A73;
    --vc-border: #E3E8EB;

    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 105px 5%;
    background: #F7F8F8;
    color: var(--vc-navy);
    font-family: 'Montserrat', sans-serif;
}

.va2connect-container {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}

/* HEADER */

.va2connect-header {
    display: grid;
    grid-template-columns: 1.1fr 0.75fr;
    align-items: end;
    gap: 60px;
    margin-bottom: 52px;
}

.va2connect-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    color: #B86B1C;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
}

.va2connect-eyebrow-line {
    width: 34px;
    height: 2px;
    background: var(--vc-orange);
}

.va2connect-heading h2 {
    max-width: 650px;
    margin: 0;
    color: var(--vc-navy);
    font-size: clamp(34px, 4vw, 55px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1.6px;
}

.va2connect-heading h2 span {
    display: block;
    color: var(--vc-orange);
}

.va2connect-intro {
    padding-bottom: 5px;
}

.va2connect-intro p {
    margin: 0 0 23px;
    color: var(--vc-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.va2connect-explore {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--vc-navy);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.va2connect-explore i {
    color: var(--vc-orange);
    transition: transform 0.3s ease;
}

.va2connect-explore:hover {
    color: #B86B1C;
}

.va2connect-explore:hover i {
    transform: translate(3px, -3px);
}

/* FEATURED CONTENT BLOCK */

.va2connect-featured {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    min-height: 440px;
    background: #FFFFFF;
    border: 1px solid var(--vc-border);
    border-radius: 9px;
    overflow: hidden;
    box-shadow: 0 15px 45px rgba(20,43,59,0.045);
}

.va2connect-featured-image {
    position: relative;
    min-height: 440px;
    overflow: hidden;
    background: var(--vc-navy);
}

.va2connect-featured-image img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 440px;
    position: absolute;
    inset: 0;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.va2connect-featured:hover .va2connect-featured-image img {
    transform: scale(1.04);
}

.va2connect-featured-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(12,27,38,0.15),
        transparent 35%,
        rgba(12,27,38,0.3)
    );
    pointer-events: none;
}

.va2connect-image-label {
    position: absolute;
    z-index: 2;
    top: 22px;
    left: 22px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 11px 14px;
    color: #FFFFFF;
    background: rgba(20,43,59,0.88);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}

.va2connect-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--vc-orange);
}

.va2connect-image-number {
    position: absolute;
    z-index: 2;
    right: 23px;
    bottom: 16px;
    color: rgba(255,255,255,0.85);
    font-size: 60px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -3px;
}

/* FEATURED TEXT */

.va2connect-featured-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 48px 45px;
}

.va2connect-small-label {
    margin-bottom: 17px;
    color: #B86B1C;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.va2connect-featured-content h3 {
    margin: 0 0 18px;
    color: var(--vc-navy);
    font-size: clamp(27px, 2.8vw, 38px);
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: -1px;
}

.va2connect-featured-content h3 span {
    display: block;
    color: var(--vc-orange);
}

.va2connect-featured-content > p {
    margin: 0;
    color: var(--vc-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

.va2connect-check-list {
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 23px 0 27px;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.va2connect-check-list li {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    color: var(--vc-navy);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.6;
}

.va2connect-check-list li i {
    margin-top: 3px;
    color: #D97B1B;
    font-size: 13px;
}

.va2connect-button {
    min-height: 49px;
    display: inline-flex;
    align-items: center;
    gap: 24px;
    padding: 7px 8px 7px 18px;
    background: var(--vc-navy);
    color: #FFFFFF;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.3s ease;
}

.va2connect-button > span {
    width: 33px;
    height: 33px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--vc-orange);
    color: var(--vc-navy);
    border-radius: 3px;
    transition: transform 0.3s ease;
}

.va2connect-button:hover {
    background: #203F53;
}

.va2connect-button:hover > span {
    transform: translateX(3px);
}

/* SYSTEM CARDS */

.va2connect-systems {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin-top: 26px;
}

.va2connect-system-card {
    position: relative;
    min-width: 0;
    min-height: 245px;
    overflow: hidden;
    padding: 27px 26px 24px;
    background: #FFFFFF;
    border: 1px solid var(--vc-border);
    border-radius: 7px;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}

.va2connect-system-card:hover {
    transform: translateY(-6px);
    border-color: rgba(242,140,40,0.65);
    box-shadow: 0 17px 35px rgba(20,43,59,0.09);
}

.va2connect-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 23px;
}

.va2connect-system-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFF1E3;
    color: #B86B1C;
    border-radius: 6px;
    font-size: 19px;
    transition:
        background 0.3s ease,
        color 0.3s ease;
}

.va2connect-system-card:hover .va2connect-system-icon {
    background: var(--vc-orange);
    color: var(--vc-navy);
}

.va2connect-card-index {
    color: #8A969E;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
}

.va2connect-system-card h3 {
    margin: 0 0 11px;
    color: var(--vc-navy);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
}

.va2connect-system-card p {
    max-width: 330px;
    margin: 0 0 22px;
    color: var(--vc-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

.va2connect-system-card > a {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--vc-navy);
    background: #F1F3F4;
    border-radius: 50%;
    font-size: 12px;
    text-decoration: none;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.va2connect-system-card > a:hover {
    background: var(--vc-orange);
    color: var(--vc-navy);
    transform: translateX(3px);
}

.va2connect-card-accent {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 55px;
    height: 3px;
    background: var(--vc-orange);
    transition: width 0.35s ease;
}

.va2connect-system-card:hover .va2connect-card-accent {
    width: 100%;
}

/* BOTTOM NOTE */

.va2connect-bottom-note {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 28px;
    padding: 16px 20px;
    background: #EDF1F3;
    border-left: 3px solid var(--vc-orange);
}

.va2connect-note-icon {
    flex-shrink: 0;
    color: #B86B1C;
    font-size: 16px;
}

.va2connect-bottom-note p {
    margin: 0;
    color: #5D6A73;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

/* =========================================
   RESPONSIVE - 1024px
========================================= */

@media (max-width: 1024px) {

    .va2connect-section {
        padding: 85px 4%;
    }

    .va2connect-header {
        grid-template-columns: 1fr 0.8fr;
        gap: 35px;
    }

    .va2connect-featured-content {
        padding: 32px;
    }

    .va2connect-featured,
    .va2connect-featured-image,
    .va2connect-featured-image img {
        min-height: 420px;
    }

    .va2connect-systems {
        gap: 16px;
    }

    .va2connect-system-card {
        padding: 22px 19px;
    }

    .va2connect-system-card h3 {
        font-size: 16px;
    }
}

/* =========================================
   RESPONSIVE - 767px
========================================= */

@media (max-width: 767px) {

    .va2connect-section {
        padding: 70px 22px;
    }

    .va2connect-header {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-bottom: 35px;
    }

    .va2connect-heading h2 {
        font-size: clamp(34px, 7vw, 45px);
        letter-spacing: -1px;
    }

    .va2connect-intro p {
        margin-bottom: 17px;
    }

    .va2connect-featured {
        grid-template-columns: 1fr;
    }

    .va2connect-featured-image {
        min-height: 350px;
    }

    .va2connect-featured-image img {
        min-height: 350px;
    }

    .va2connect-featured-content {
        padding: 32px 27px;
    }

    .va2connect-featured-content h3 {
        font-size: 31px;
    }

    .va2connect-systems {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-top: 20px;
    }

    .va2connect-system-card {
        min-height: 0;
        padding: 24px;
    }

    .va2connect-card-top {
        margin-bottom: 17px;
    }

    .va2connect-system-card p {
        max-width: 520px;
        margin-bottom: 18px;
    }
}

/* =========================================
   RESPONSIVE - 480px
========================================= */

@media (max-width: 480px) {

    .va2connect-section {
        padding: 58px 18px;
    }

    .va2connect-eyebrow {
        font-size: 10px;
        letter-spacing: 1.4px;
    }

    .va2connect-heading h2 {
        font-size: 34px;
        line-height: 1.2;
    }

    .va2connect-intro p {
        font-size: 15px;
    }

    .va2connect-featured-image,
    .va2connect-featured-image img {
        min-height: 285px;
    }

    .va2connect-image-label {
        top: 14px;
        left: 14px;
        padding: 9px 10px;
        font-size: 9px;
    }

    .va2connect-image-number {
        right: 15px;
        bottom: 12px;
        font-size: 46px;
    }

    .va2connect-featured-content {
        padding: 27px 21px;
    }

    .va2connect-featured-content h3 {
        font-size: 29px;
    }

    .va2connect-featured-content > p {
        font-size: 15px;
    }

    .va2connect-check-list li {
        font-size: 12px;
    }

    .va2connect-system-card {
        padding: 21px;
    }

    .va2connect-system-card h3 {
        font-size: 17px;
    }

    .va2connect-system-card p {
        font-size: 15px;
    }

    .va2connect-bottom-note {
        align-items: flex-start;
        padding: 14px;
    }

    .va2connect-bottom-note p {
        font-size: 12px;
    }
}

/* ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {
    .va2connect-section *,
    .va2connect-section *::before,
    .va2connect-section *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* ==========================================
   HOME 2 - SECTION 3: SERVICES
   Unique prefix: va2service-
========================================== */

.va2service-section,
.va2service-section * {
    box-sizing: border-box;
}

.va2service-section {
    --v2s-navy: #142B3B;
    --v2s-orange: #F28C28;
    --v2s-muted: #AEBCC6;

    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 105px 5%;
    background: #0C1B26;
    color: #FFFFFF;
    font-family: 'Montserrat', sans-serif;
}

.va2service-container {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}

/* HEADER */

.va2service-header {
    display: grid;
    grid-template-columns: 1.15fr 0.7fr;
    align-items: end;
    gap: 55px;
    margin-bottom: 48px;
}

.va2service-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 20px;
    color: var(--v2s-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
}

.va2service-eyebrow-line {
    width: 32px;
    height: 2px;
    background: var(--v2s-orange);
}

.va2service-heading-wrap h2 {
    max-width: 720px;
    margin: 0;
    color: #FFFFFF;
    font-size: clamp(34px, 4vw, 53px);
    font-weight: 800;
    line-height: 1.17;
    letter-spacing: -1.5px;
}

.va2service-heading-wrap h2 span {
    display: block;
    color: var(--v2s-orange);
}

.va2service-header-side p {
    margin: 0 0 20px;
    color: var(--v2s-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.va2service-header-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.va2service-header-link i {
    color: var(--v2s-orange);
    transition: transform 0.3s ease;
}

.va2service-header-link:hover {
    color: var(--v2s-orange);
}

.va2service-header-link:hover i {
    transform: translate(3px, -3px);
}

/* SERVICE GRID */

.va2service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

/* COMMON CARD */

.va2service-card {
    position: relative;
    min-width: 0;
    min-height: 285px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 27px;
    background: #142B3B;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 7px;
    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}

.va2service-card:hover {
    transform: translateY(-5px);
    border-color: rgba(242,140,40,0.65);
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

/* FEATURED CARD */

.va2service-featured {
    grid-row: span 2;
    padding: 0;
    min-height: 590px;
    background: #142B3B;
}

.va2service-card-image {
    height: 255px;
    position: relative;
    overflow: hidden;
    background: #203F53;
}

.va2service-card-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.65s ease;
}

.va2service-featured:hover .va2service-card-image img {
    transform: scale(1.05);
}

.va2service-card-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(12,27,38,0.1),
        rgba(12,27,38,0.45)
    );
    pointer-events: none;
}

.va2service-image-number {
    position: absolute;
    z-index: 1;
    top: 17px;
    right: 18px;
    color: rgba(255,255,255,0.9);
    font-size: 32px;
    font-weight: 800;
}

.va2service-image-tag {
    position: absolute;
    z-index: 1;
    bottom: 17px;
    left: 17px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: var(--v2s-orange);
    color: var(--v2s-navy);
    border-radius: 3px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}

.va2service-card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 26px;
}

.va2service-card-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 15px;
}

.va2service-category {
    display: block;
    margin-bottom: 9px;
    color: var(--v2s-orange);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.4px;
}

.va2service-card h3 {
    margin: 0;
    color: #FFFFFF;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.45;
}

.va2service-card-title h3 {
    font-size: 23px;
}

.va2service-icon {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(242,140,40,0.12);
    border: 1px solid rgba(242,140,40,0.25);
    border-radius: 6px;
    color: var(--v2s-orange);
    font-size: 19px;
    transition:
        color 0.3s ease,
        background 0.3s ease;
}

.va2service-card:hover .va2service-icon {
    background: var(--v2s-orange);
    color: var(--v2s-navy);
}

.va2service-card p {
    margin: 0;
    color: var(--v2s-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

.va2service-featured .va2service-card-link {
    margin-top: auto;
    padding-top: 23px;
}

/* CARD FOOTER LINK */

.va2service-card-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
}

.va2service-card-link > span {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--v2s-navy);
    background: var(--v2s-orange);
    border-radius: 4px;
    transition: transform 0.3s ease;
}

.va2service-card-link:hover > span {
    transform: translateX(4px);
}

/* STANDARD CARD DETAILS */

.va2service-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 25px;
}

.va2service-index {
    color: #8295A2;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.va2service-card-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 20px;
}

.va2service-card-bottom > span {
    color: #93A5B1;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
}

.va2service-card-bottom > a {
    width: 33px;
    height: 33px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.07);
    color: var(--v2s-orange);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 50%;
    font-size: 12px;
    text-decoration: none;
    transition:
        background 0.3s ease,
        color 0.3s ease;
}

.va2service-card-bottom > a:hover {
    background: var(--v2s-orange);
    color: var(--v2s-navy);
}

.va2service-card-accent {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 48px;
    height: 3px;
    background: var(--v2s-orange);
    transition: width 0.4s ease;
}

.va2service-card:hover .va2service-card-accent {
    width: 100%;
}

/* BOTTOM CTA */

.va2service-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 28px;
    padding: 27px 30px;
    background: #F28C28;
    border-radius: 6px;
}

.va2service-bottom-content {
    display: flex;
    align-items: center;
    gap: 17px;
    min-width: 0;
}

.va2service-bottom-icon {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #F28C28;
    background: #142B3B;
    border-radius: 5px;
    font-size: 19px;
}

.va2service-bottom-content h3 {
    margin: 0 0 7px;
    color: #142B3B;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
}

.va2service-bottom-content p {
    margin: 0;
    color: #263F50;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

.va2service-bottom-button {
    min-height: 48px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 0 17px;
    color: #FFFFFF;
    background: #142B3B;
    border: 1px solid #142B3B;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background 0.3s ease,
        color 0.3s ease;
}

.va2service-bottom-button:hover {
    color: #142B3B;
    background: #FFFFFF;
    border-color: #FFFFFF;
}

.va2service-bottom-button i {
    transition: transform 0.3s ease;
}

.va2service-bottom-button:hover i {
    transform: translateX(4px);
}

/* ==========================================
   TABLET - 1024px
========================================== */

@media (max-width: 1024px) {

    .va2service-section {
        padding: 85px 4%;
    }

    .va2service-header {
        gap: 30px;
    }

    .va2service-grid {
        gap: 15px;
    }

    .va2service-card {
        padding: 21px;
        min-height: 290px;
    }

    .va2service-featured {
        padding: 0;
        min-height: 590px;
    }

    .va2service-card-body {
        padding: 22px;
    }

    .va2service-card h3 {
        font-size: 16px;
    }

    .va2service-card-title h3 {
        font-size: 20px;
    }

    .va2service-card p {
        font-size: 15px;
    }

    .va2service-icon {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
}

/* ==========================================
   MOBILE / TABLET - 767px
========================================== */

@media (max-width: 767px) {

    .va2service-section {
        padding: 70px 22px;
    }

    .va2service-header {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-bottom: 32px;
    }

    .va2service-heading-wrap h2 {
        font-size: clamp(34px, 7vw, 46px);
        letter-spacing: -1px;
    }

    .va2service-header-side p {
        font-size: 15px;
    }

    .va2service-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .va2service-featured {
        grid-column: 1 / -1;
        grid-row: auto;
        min-height: 0;
    }

    .va2service-card-image {
        height: 300px;
    }

    .va2service-card-body {
        min-height: 245px;
    }

    .va2service-card {
        min-height: 275px;
        padding: 20px;
    }

    .va2service-featured {
        padding: 0;
    }

    .va2service-card h3 {
        font-size: 16px;
    }

    .va2service-card p {
        font-size: 15px;
    }

    .va2service-card-title h3 {
        font-size: 23px;
    }

    .va2service-card-top {
        align-items: flex-start;
        margin-bottom: 21px;
    }

    .va2service-card-top .va2service-icon {
        width: 37px;
        height: 37px;
        font-size: 15px;
    }

    .va2service-bottom {
        align-items: flex-start;
        flex-direction: column;
        padding: 24px;
    }
}

/* ==========================================
   SMALL MOBILE - 480px
========================================== */

@media (max-width: 480px) {

    .va2service-section {
        padding: 58px 18px;
    }

    .va2service-eyebrow {
        font-size: 10px;
        letter-spacing: 1.4px;
    }

    .va2service-heading-wrap h2 {
        font-size: 33px;
        line-height: 1.22;
    }

    .va2service-header-side p {
        font-size: 15px;
        line-height: 1.8;
    }

    .va2service-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .va2service-featured {
        grid-column: auto;
    }

    .va2service-card-image {
        height: 235px;
    }

    .va2service-card-body {
        min-height: 0;
        padding: 23px;
    }

    .va2service-card {
        min-height: 260px;
        padding: 23px;
    }

    .va2service-featured {
        padding: 0;
    }

    .va2service-card-title h3 {
        font-size: 22px;
    }

    .va2service-card h3 {
        font-size: 18px;
    }

    .va2service-card p {
        font-size: 15px;
    }

    .va2service-card-top {
        margin-bottom: 20px;
    }

    .va2service-bottom {
        padding: 20px;
        gap: 20px;
    }

    .va2service-bottom-content {
        align-items: flex-start;
        gap: 12px;
    }

    .va2service-bottom-icon {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .va2service-bottom-content h3 {
        font-size: 15px;
    }

    .va2service-bottom-content p {
        font-size: 13px;
    }

    .va2service-bottom-button {
        width: 100%;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .va2service-section *,
    .va2service-section *::before,
    .va2service-section *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}


/* =========================================
   VOLTCARE HOME 2 - BATTERY SECTION
========================================= */

.va2battery-section {
  position: relative;
  overflow: hidden;
  padding: 100px 24px;
  background: #f5f3ef;
  color: #142b3b;
  font-family: 'Montserrat', sans-serif;
}

.va2battery-section *,
.va2battery-section *::before,
.va2battery-section *::after {
  box-sizing: border-box;
}

.va2battery-container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
}

.va2battery-top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 45px;
  margin-bottom: 48px;
}

.va2battery-heading {
  max-width: 690px;
}

.va2battery-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 22px;
  color: #c66e1d;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
}

.va2battery-eyebrow-line {
  display: inline-block;
  width: 32px;
  height: 2px;
  background: #f28c28;
}

.va2battery-heading h2 {
  margin: 0;
  color: #142b3b;
  font-size: clamp(30px, 3.5vw, 45px);
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: -1.5px;
}

.va2battery-heading h2 span {
  color: #d77a24;
}

.va2battery-intro {
  max-width: 370px;
  margin: 0 0 5px;
  color: #687681;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.9;
}

.va2battery-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.94fr);
  gap: 70px;
  align-items: center;
}

/* BATTERY VISUAL */

.va2battery-visual {
  position: relative;
  display: flex;
  min-height: 500px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 5px;
  background: #142b3b;
  isolation: isolate;
}

.va2battery-visual-grid {
  position: absolute;
  z-index: -2;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: linear-gradient(to bottom, black, transparent 95%);
}

.va2battery-visual::before {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 330px;
  height: 330px;
  border-radius: 50%;
  background: rgba(242,140,40,.15);
  content: "";
  filter: blur(55px);
  transform: translate(-50%, -50%);
}

.va2battery-orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.va2battery-orbit-one {
  width: 340px;
  height: 340px;
}

.va2battery-orbit-two {
  width: 430px;
  height: 430px;
  border-style: dashed;
  border-color: rgba(242,140,40,.25);
}

.va2battery-visual-label {
  position: absolute;
  top: 27px;
  left: 27px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.va2battery-visual-label i {
  color: #f28c28;
  font-size: 16px;
}

.va2battery-battery-art {
  position: relative;
  width: 225px;
  margin-top: 5px;
  filter: drop-shadow(0 25px 30px rgba(0,0,0,.3));
  animation: va2battery-float 4s ease-in-out infinite;
}

.va2battery-terminal {
  position: absolute;
  top: -13px;
  z-index: 2;
  width: 34px;
  height: 20px;
  border: 4px solid #8c9aa4;
  border-radius: 4px 4px 0 0;
  background: #263c4a;
}

.va2battery-terminal-left {
  left: 30px;
}

.va2battery-terminal-right {
  right: 30px;
}

.va2battery-battery-body {
  position: relative;
  min-height: 275px;
  overflow: hidden;
  padding: 25px 22px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 12px 12px 8px 8px;
  background: linear-gradient(145deg, #405565 0%, #1b303e 45%, #0d1d29 100%);
  box-shadow:
    inset 5px 0 10px rgba(255,255,255,.06),
    inset -5px 0 12px rgba(0,0,0,.2);
}

.va2battery-battery-body::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 7px;
  background: #f28c28;
  content: "";
}

.va2battery-battery-brand {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 3px;
  text-align: center;
}

.va2battery-battery-icon {
  display: flex;
  width: 100px;
  height: 100px;
  align-items: center;
  justify-content: center;
  margin: 25px auto 17px;
  border: 1px solid rgba(242,140,40,.5);
  border-radius: 50%;
  background: rgba(242,140,40,.08);
  color: #f28c28;
  font-size: 45px;
  box-shadow: 0 0 35px rgba(242,140,40,.1);
}

.va2battery-battery-lines {
  display: flex;
  justify-content: center;
  gap: 5px;
}

.va2battery-battery-lines span {
  width: 28px;
  height: 3px;
  background: #f28c28;
}

.va2battery-battery-lines span:nth-child(2) {
  opacity: .55;
}

.va2battery-battery-lines span:nth-child(3) {
  opacity: .25;
}

.va2battery-battery-bottom {
  display: flex;
  justify-content: space-between;
  margin-top: 23px;
  color: #b9c5cc;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1px;
}

.va2battery-floating-chip {
  position: absolute;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 15px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 4px;
  background: rgba(19,41,56,.94);
  box-shadow: 0 12px 28px rgba(0,0,0,.2);
  backdrop-filter: blur(10px);
}

.va2battery-chip-top {
  top: 105px;
  right: 20px;
}

.va2battery-chip-bottom {
  bottom: 86px;
  left: 18px;
}

.va2battery-chip-icon {
  display: flex;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  align-items: center;
  justify-content: center;
  border-radius: 3px;
  background: rgba(242,140,40,.15);
  color: #f28c28;
  font-size: 14px;
}

.va2battery-floating-chip strong,
.va2battery-floating-chip small {
  display: block;
}

.va2battery-floating-chip strong {
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}

.va2battery-floating-chip small {
  margin-top: 5px;
  color: #bdc9d0;
  font-size: 10px;
  font-weight: 400;
}

.va2battery-visual-footer {
  position: absolute;
  right: 26px;
  bottom: 26px;
  left: 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.15);
  color: #c0cbd1;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.va2battery-visual-footer i {
  color: #f28c28;
  font-size: 14px;
}

/* RIGHT CONTENT */

.va2battery-content {
  padding: 10px 0;
}

.va2battery-content-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 26px;
}

.va2battery-number {
  color: #a0aab0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.va2battery-small-icon {
  display: flex;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  border: 1px solid #e3d8cc;
  border-radius: 50%;
  color: #d77a24;
  font-size: 19px;
}

.va2battery-content h3 {
  margin: 0 0 18px;
  color: #142b3b;
  font-size: clamp(25px, 2.7vw, 34px);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.8px;
}

.va2battery-description {
  margin: 0 0 27px;
  color: #687681;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.9;
}

.va2battery-check-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.va2battery-check-item {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  padding: 17px 0;
  border-bottom: 1px solid #e2dfd8;
}

.va2battery-check-icon {
  display: flex;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
  border-radius: 50%;
  background: #fce7d3;
  color: #b96012;
  font-size: 11px;
}

.va2battery-check-item h4 {
  margin: 0 0 6px;
  color: #142b3b;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}

.va2battery-check-item p {
  margin: 0;
  color: #687681;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7;
}

.va2battery-cta {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-top: 28px;
  padding: 7px 8px 7px 22px;
  border: 1px solid #f28c28;
  border-radius: 3px;
  background: #f28c28;
  color: #142b3b;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background .3s ease, color .3s ease, transform .3s ease;
}

.va2battery-cta span {
  display: flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border-radius: 2px;
  background: #142b3b;
  color: #fff;
  transition: transform .3s ease;
}

.va2battery-cta:hover {
  background: #142b3b;
  color: #fff;
  transform: translateY(-2px);
}

.va2battery-cta:hover span {
  transform: translateX(3px);
}

.va2battery-disclaimer {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 18px 0 0;
  color: #7b858b;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.7;
}

.va2battery-disclaimer i {
  margin-top: 3px;
  color: #d77a24;
}

/* BOTTOM PROCESS STRIP */

.va2battery-bottom-strip {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: 28px;
  margin-top: 55px;
  padding: 26px 30px;
  border: 1px solid #e4ded5;
  background: #fff;
}

.va2battery-strip-item {
  display: flex;
  align-items: center;
  gap: 15px;
}

.va2battery-strip-icon {
  display: flex;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #f8e8d8;
  color: #c66e1d;
  font-size: 17px;
}

.va2battery-strip-item strong,
.va2battery-strip-item div > span {
  display: block;
}

.va2battery-strip-item strong {
  margin-bottom: 6px;
  color: #142b3b;
  font-size: 13px;
  font-weight: 700;
}

.va2battery-strip-item div > span {
  color: #77838b;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.6;
}

.va2battery-strip-divider {
  width: 1px;
  height: 38px;
  background: #e3ded6;
}

@keyframes va2battery-float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-9px);
  }
}

/* TABLET */

@media (max-width: 1024px) {
  .va2battery-section {
    padding: 80px 24px;
  }

  .va2battery-top {
    gap: 28px;
  }

  .va2battery-main {
    gap: 35px;
  }

  .va2battery-visual {
    min-height: 460px;
  }

  .va2battery-battery-art {
    transform: scale(.88);
  }

  .va2battery-bottom-strip {
    gap: 17px;
    padding: 23px 20px;
  }

  .va2battery-strip-item {
    gap: 10px;
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .va2battery-section {
    padding: 65px 20px;
  }

  .va2battery-top {
    display: block;
    margin-bottom: 30px;
  }

  .va2battery-eyebrow {
    margin-bottom: 16px;
    font-size: 10px;
  }

  .va2battery-heading h2 {
    font-size: 32px;
    letter-spacing: -.8px;
  }

  .va2battery-intro {
    max-width: 100%;
    margin-top: 18px;
    font-size: 15px;
  }

  .va2battery-main {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .va2battery-visual {
    min-height: 450px;
  }

  .va2battery-chip-top {
    top: 82px;
    right: 10px;
  }

  .va2battery-chip-bottom {
    bottom: 77px;
    left: 10px;
  }

  .va2battery-floating-chip {
    gap: 8px;
    padding: 10px;
  }

  .va2battery-floating-chip strong {
    font-size: 10px;
  }

  .va2battery-floating-chip small {
    font-size: 9px;
  }

  .va2battery-battery-art {
    width: 200px;
  }

  .va2battery-battery-body {
    min-height: 255px;
  }

  .va2battery-content h3 {
    font-size: 29px;
  }

  .va2battery-bottom-strip {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 38px;
    padding: 23px 20px;
  }

  .va2battery-strip-divider {
    width: 100%;
    height: 1px;
  }
}

@media (max-width: 480px) {
  .va2battery-section {
    padding: 55px 15px;
  }

  .va2battery-heading h2 {
    font-size: 28px;
  }

  .va2battery-visual {
    min-height: 400px;
  }

  .va2battery-visual-label {
    top: 20px;
    left: 17px;
    font-size: 9px;
  }

  .va2battery-orbit-one {
    width: 280px;
    height: 280px;
  }

  .va2battery-orbit-two {
    width: 350px;
    height: 350px;
  }

  .va2battery-battery-art {
    width: 175px;
  }

  .va2battery-battery-body {
    min-height: 230px;
    padding: 23px 17px;
  }

  .va2battery-battery-icon {
    width: 75px;
    height: 75px;
    margin: 22px auto 14px;
    font-size: 35px;
  }

  .va2battery-chip-top {
    top: 70px;
    right: 8px;
  }

  .va2battery-chip-bottom {
    bottom: 69px;
    left: 8px;
  }

  .va2battery-chip-icon {
    width: 29px;
    height: 29px;
    flex-basis: 29px;
  }

  .va2battery-visual-footer {
    right: 17px;
    bottom: 18px;
    left: 17px;
    font-size: 8px;
  }

  .va2battery-content h3 {
    font-size: 26px;
  }

  .va2battery-cta {
    width: 100%;
    gap: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .va2battery-battery-art {
    animation: none;
  }

  .va2battery-cta,
  .va2battery-cta span {
    transition: none;
  }
}



/* =========================================
   VOLTCARE HOME 2 - SECTION 5
   OUR WORK STANDARDS
========================================= */

.va2standard-section {
  padding: 105px 24px 80px;
  overflow: hidden;
  background: #fff;
  color: #142b3b;
  font-family: 'Montserrat', sans-serif;
}

.va2standard-section *,
.va2standard-section *::before,
.va2standard-section *::after {
  box-sizing: border-box;
}

.va2standard-container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
}

.va2standard-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 40px;
  margin-bottom: 48px;
}

.va2standard-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
  color: #bf691c;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
}

.va2standard-tag span {
  width: 30px;
  height: 2px;
  background: #f28c28;
}

.va2standard-heading h2 {
  margin: 0;
  color: #142b3b;
  font-size: clamp(32px, 3.5vw, 45px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -1.4px;
}

.va2standard-heading h2 em {
  color: #d77a24;
  font-style: normal;
}

.va2standard-heading > p {
  max-width: 390px;
  margin: 0 0 5px;
  color: #687681;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.9;
}

/* MAIN LAYOUT */

.va2standard-layout {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  align-items: stretch;
  gap: 65px;
}

/* IMAGE */

.va2standard-image {
  position: relative;
  min-height: 590px;
  overflow: hidden;
  background: #142b3b;
}

.va2standard-image > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .7s ease;
}

.va2standard-image:hover > img {
  transform: scale(1.045);
}

.va2standard-image-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(9, 24, 35, .02) 25%,
    rgba(9, 24, 35, .82) 100%
  );
}

.va2standard-image-label {
  position: absolute;
  right: 25px;
  bottom: 68px;
  left: 25px;
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 20px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(20,43,59,.84);
  backdrop-filter: blur(12px);
}

.va2standard-label-icon {
  display: flex;
  width: 45px;
  height: 45px;
  flex: 0 0 45px;
  align-items: center;
  justify-content: center;
  background: #f28c28;
  color: #142b3b;
  font-size: 19px;
}

.va2standard-image-label strong,
.va2standard-image-label span:not(.va2standard-label-icon) {
  display: block;
}

.va2standard-image-label strong {
  margin-bottom: 7px;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.va2standard-image-label div > span {
  color: #d0d9df;
  font-size: 12px;
  font-weight: 400;
}

.va2standard-image-index {
  position: absolute;
  right: 25px;
  bottom: 23px;
  color: #f28c28;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
}

.va2standard-image-index span {
  color: #d0d9df;
  font-size: 9px;
  letter-spacing: 1.5px;
}

/* PROCESS */

.va2standard-process {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 8px 0;
}

.va2standard-process-intro {
  margin-bottom: 20px;
}

.va2standard-process-kicker {
  display: block;
  margin-bottom: 13px;
  color: #a1abb2;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
}

.va2standard-process-intro h3 {
  margin: 0;
  color: #142b3b;
  font-size: clamp(27px, 2.7vw, 34px);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.7px;
}

.va2standard-step {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 40px;
  align-items: start;
  gap: 15px;
  padding: 22px 0;
  border-bottom: 1px solid #e8e8e5;
  transition: padding .3s ease;
}

.va2standard-step:hover {
  padding-right: 5px;
  padding-left: 5px;
}

.va2standard-step-number {
  padding-top: 3px;
  color: #d77a24;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
}

.va2standard-step-content h4 {
  margin: 0 0 8px;
  color: #142b3b;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}

.va2standard-step-content p {
  margin: 0;
  color: #687681;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.8;
}

.va2standard-step-icon {
  display: flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border: 1px solid #eee2d5;
  color: #c66e1d;
  font-size: 15px;
  transition: background .3s ease, color .3s ease;
}

.va2standard-step:hover .va2standard-step-icon {
  border-color: #f28c28;
  background: #f28c28;
  color: #142b3b;
}

.va2standard-link {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 22px;
  margin-top: 27px;
  color: #142b3b;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.va2standard-link > span {
  display: flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  background: #f28c28;
  transition: background .3s ease, transform .3s ease;
}

.va2standard-link:hover > span {
  background: #e6a25e;
  transform: translateX(4px);
}

/* BOTTOM HIGHLIGHTS */

.va2standard-highlights {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 65px;
  padding: 26px 0;
  border-top: 1px solid #e8e8e5;
  border-bottom: 1px solid #e8e8e5;
}

.va2standard-highlight {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 5px 14px;
  border-right: 1px solid #e8e8e5;
}

.va2standard-highlight:last-child {
  border-right: 0;
}

.va2standard-highlight i {
  color: #d77a24;
  font-size: 17px;
}

.va2standard-highlight span {
  color: #344b5a;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.6;
}

/* TABLET */

@media (max-width: 1024px) {
  .va2standard-section {
    padding: 80px 24px 65px;
  }

  .va2standard-layout {
    gap: 35px;
  }

  .va2standard-image {
    min-height: 550px;
  }

  .va2standard-heading {
    gap: 25px;
  }

  .va2standard-heading > p {
    max-width: 330px;
  }

  .va2standard-step {
    grid-template-columns: 32px minmax(0, 1fr) 34px;
    gap: 10px;
  }

  .va2standard-step-icon {
    width: 34px;
    height: 34px;
  }

  .va2standard-highlight {
    gap: 8px;
    padding: 5px 8px;
  }

  .va2standard-highlight span {
    font-size: 11px;
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .va2standard-section {
    padding: 65px 20px 55px;
  }

  .va2standard-heading {
    display: block;
    margin-bottom: 30px;
  }

  .va2standard-heading h2 {
    font-size: 32px;
    letter-spacing: -.8px;
  }

  .va2standard-heading > p {
    max-width: 100%;
    margin-top: 18px;
  }

  .va2standard-layout {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .va2standard-image {
    min-height: 460px;
  }

  .va2standard-process-intro h3 {
    font-size: 29px;
  }

  .va2standard-step {
    grid-template-columns: 35px minmax(0, 1fr) 36px;
    gap: 12px;
    padding: 19px 0;
  }

  .va2standard-highlights {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin-top: 40px;
    padding: 10px 0;
  }

  .va2standard-highlight {
    justify-content: flex-start;
    min-height: 65px;
    padding: 12px 8px;
    border-right: 0;
  }

  .va2standard-highlight:nth-child(odd) {
    border-right: 1px solid #e8e8e5;
  }
}

@media (max-width: 480px) {
  .va2standard-section {
    padding: 55px 15px 45px;
  }

  .va2standard-heading h2 {
    font-size: 28px;
  }

  .va2standard-tag {
    font-size: 10px;
    letter-spacing: 1.5px;
  }

  .va2standard-image {
    min-height: 390px;
  }

  .va2standard-image-label {
    right: 14px;
    bottom: 58px;
    left: 14px;
    gap: 10px;
    padding: 14px;
  }

  .va2standard-label-icon {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
  }

  .va2standard-image-label strong {
    font-size: 13px;
  }

  .va2standard-image-label div > span {
    font-size: 11px;
  }

  .va2standard-image-index {
    right: 15px;
    bottom: 18px;
  }

  .va2standard-step {
    grid-template-columns: 28px minmax(0, 1fr) 30px;
    gap: 9px;
  }

  .va2standard-step-content h4 {
    font-size: 13px;
  }

  .va2standard-step-content p {
    font-size: 12px;
  }

  .va2standard-step-icon {
    width: 30px;
    height: 30px;
    font-size: 12px;
  }

  .va2standard-highlight {
    gap: 8px;
    padding: 10px 5px;
  }

  .va2standard-highlight i {
    font-size: 14px;
  }

  .va2standard-highlight span {
    font-size: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .va2standard-image > img,
  .va2standard-step,
  .va2standard-step-icon,
  .va2standard-link > span {
    transition: none;
  }
}



/* =========================================
   VOLTCARE HOME 2 - SECTION 6
   VEHICLE COMPATIBILITY SHOWCASE
========================================= */

.va2fleet-section {
  position: relative;
  overflow: hidden;
  padding: 100px 24px 85px;
  background: #142b3b;
  color: #fff;
  font-family: 'Montserrat', sans-serif;
}

.va2fleet-section *,
.va2fleet-section *::before,
.va2fleet-section *::after {
  box-sizing: border-box;
}

.va2fleet-container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
}

.va2fleet-topline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding-bottom: 23px;
  border-bottom: 1px solid rgba(255,255,255,.15);
}

.va2fleet-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #f6a452;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
}

.va2fleet-label-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #f28c28;
  box-shadow: 0 0 12px rgba(242,140,40,.6);
}

.va2fleet-topnote {
  color: #aab9c3;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.4px;
}

.va2fleet-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  margin: 43px 0 45px;
}

.va2fleet-heading h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(32px, 3.8vw, 47px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -1.4px;
}

.va2fleet-heading h2 span {
  color: #f28c28;
}

.va2fleet-heading > p {
  max-width: 365px;
  margin: 0 0 4px;
  color: #bdc9d1;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.9;
}

/* SHOWCASE LAYOUT */

.va2fleet-showcase {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: 20px;
  align-items: stretch;
}

/* LARGE VEHICLE IMAGE */

.va2fleet-feature {
  position: relative;
  display: flex;
  min-height: 540px;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  background: #203d50;
  isolation: isolate;
}

.va2fleet-feature > img {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .8s ease;
}

.va2fleet-feature:hover > img {
  transform: scale(1.045);
}

.va2fleet-feature-overlay {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(8,20,30,.25) 0%,
    rgba(8,20,30,.02) 30%,
    rgba(8,20,30,.9) 100%
  );
}

.va2fleet-feature-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 25px;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.va2fleet-feature-top i {
  display: flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 50%;
  font-size: 13px;
  transition: background .3s ease, color .3s ease;
}

.va2fleet-feature:hover .va2fleet-feature-top i {
  border-color: #f28c28;
  background: #f28c28;
  color: #142b3b;
}

.va2fleet-feature-copy {
  position: relative;
  z-index: 1;
  max-width: 460px;
  padding: 25px 30px 35px;
}

.va2fleet-feature-kicker {
  display: block;
  margin-bottom: 12px;
  color: #f6a452;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
}

.va2fleet-feature-copy h3 {
  margin: 0 0 12px;
  color: #fff;
  font-size: clamp(30px, 3vw, 40px);
  font-weight: 700;
  line-height: 1.2;
}

.va2fleet-feature-copy p {
  max-width: 380px;
  margin: 0;
  color: #e0e7eb;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
}

.va2fleet-feature-link {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  margin-top: 22px;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.va2fleet-feature-link i {
  color: #f28c28;
  transition: transform .3s ease;
}

.va2fleet-feature-link:hover i {
  transform: translateX(5px);
}

.va2fleet-feature-watermark {
  position: absolute;
  right: 18px;
  bottom: 65px;
  color: rgba(255,255,255,.07);
  font-size: 180px;
  font-weight: 700;
  line-height: 1;
  pointer-events: none;
}

/* CATEGORY ROWS */

.va2fleet-categories {
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  border-top: 1px solid rgba(255,255,255,.16);
}

.va2fleet-category {
  display: grid;
  grid-template-columns: 28px 48px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 14px;
  flex: 1;
  padding: 22px 15px;
  border-bottom: 1px solid rgba(255,255,255,.16);
  transition: background .3s ease, padding .3s ease;
}

.va2fleet-category:hover {
  padding-right: 20px;
  padding-left: 20px;
  background: rgba(255,255,255,.045);
}

.va2fleet-category-number {
  align-self: start;
  padding-top: 5px;
  color: #f28c28;
  font-size: 11px;
  font-weight: 700;
}

.va2fleet-category-icon {
  display: flex;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.2);
  color: #f6a452;
  font-size: 19px;
  transition: background .3s ease, color .3s ease;
}

.va2fleet-category:hover .va2fleet-category-icon {
  border-color: #f28c28;
  background: #f28c28;
  color: #142b3b;
}

.va2fleet-category-copy > span {
  display: block;
  margin-bottom: 7px;
  color: #aab9c3;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.2px;
}

.va2fleet-category-copy h3 {
  margin: 0 0 7px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
}

.va2fleet-category-copy p {
  margin: 0;
  color: #bdc9d1;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
}

.va2fleet-category > a {
  display: flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.23);
  border-radius: 50%;
  color: #f6a452;
  font-size: 12px;
  text-decoration: none;
  transition: background .3s ease, color .3s ease;
}

.va2fleet-category > a:hover {
  border-color: #f28c28;
  background: #f28c28;
  color: #142b3b;
}

/* BOTTOM INFORMATION BAND */

.va2fleet-bottom {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  margin-top: 35px;
  padding: 24px 26px;
  border: 1px solid rgba(255,255,255,.15);
  background: #102432;
}

.va2fleet-bottom-title {
  display: flex;
  align-items: center;
  gap: 11px;
  white-space: nowrap;
}

.va2fleet-bottom-title i {
  color: #f28c28;
  font-size: 18px;
}

.va2fleet-bottom-title span {
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

.va2fleet-bottom > p {
  margin: 0;
  color: #bdc9d1;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.8;
}

.va2fleet-bottom > a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #f6a452;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.va2fleet-bottom > a i {
  transition: transform .3s ease;
}

.va2fleet-bottom > a:hover i {
  transform: translateX(4px);
}

/* TABLET */

@media (max-width: 1024px) {
  .va2fleet-section {
    padding: 80px 24px 65px;
  }

  .va2fleet-heading {
    gap: 25px;
  }

  .va2fleet-showcase {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
  }

  .va2fleet-feature {
    min-height: 510px;
  }

  .va2fleet-category {
    grid-template-columns: 24px 40px minmax(0, 1fr) 30px;
    gap: 10px;
    padding: 18px 8px;
  }

  .va2fleet-category-icon {
    width: 40px;
    height: 40px;
    font-size: 16px;
  }

  .va2fleet-category-copy h3 {
    font-size: 14px;
  }

  .va2fleet-category-copy p {
    font-size: 11px;
  }

  .va2fleet-bottom {
    grid-template-columns: 1fr auto;
  }

  .va2fleet-bottom > p {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .va2fleet-section {
    padding: 65px 20px 55px;
  }

  .va2fleet-topline {
    align-items: flex-start;
    flex-direction: column;
    gap: 13px;
  }

  .va2fleet-heading {
    display: block;
    margin: 30px 0;
  }

  .va2fleet-heading h2 {
    font-size: 32px;
    letter-spacing: -.8px;
  }

  .va2fleet-heading > p {
    max-width: 100%;
    margin-top: 17px;
  }

  .va2fleet-showcase {
    grid-template-columns: 1fr;
    gap: 25px;
  }

  .va2fleet-feature {
    min-height: 470px;
  }

  .va2fleet-categories {
    border-top: 1px solid rgba(255,255,255,.16);
  }

  .va2fleet-category {
    grid-template-columns: 25px 44px minmax(0, 1fr) 32px;
    gap: 12px;
    padding: 20px 4px;
  }

  .va2fleet-category:hover {
    padding-right: 8px;
    padding-left: 8px;
  }

  .va2fleet-category-icon {
    width: 44px;
    height: 44px;
  }

  .va2fleet-category-copy h3 {
    font-size: 15px;
  }

  .va2fleet-category-copy p {
    font-size: 12px;
  }

  .va2fleet-bottom {
    grid-template-columns: 1fr;
    gap: 14px;
    margin-top: 28px;
    padding: 22px;
  }

  .va2fleet-bottom > p {
    grid-column: auto;
    grid-row: auto;
  }

  .va2fleet-bottom > a {
    justify-self: start;
    margin-top: 3px;
  }
}

@media (max-width: 480px) {
  .va2fleet-section {
    padding: 55px 15px 45px;
  }

  .va2fleet-heading h2 {
    font-size: 28px;
  }

  .va2fleet-topnote {
    font-size: 9px;
  }

  .va2fleet-feature {
    min-height: 410px;
  }

  .va2fleet-feature-top {
    padding: 17px;
    font-size: 9px;
  }

  .va2fleet-feature-copy {
    padding: 20px;
  }

  .va2fleet-feature-copy h3 {
    font-size: 30px;
  }

  .va2fleet-feature-copy p {
    font-size: 13px;
  }

  .va2fleet-feature-watermark {
    right: 10px;
    bottom: 60px;
    font-size: 130px;
  }

  .va2fleet-category {
    grid-template-columns: 22px 36px minmax(0, 1fr) 28px;
    gap: 8px;
    padding: 18px 0;
  }

  .va2fleet-category-icon {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }

  .va2fleet-category-copy > span {
    font-size: 8px;
    letter-spacing: .8px;
  }

  .va2fleet-category-copy h3 {
    font-size: 13px;
  }

  .va2fleet-category-copy p {
    font-size: 11px;
  }

  .va2fleet-category > a {
    width: 28px;
    height: 28px;
    font-size: 10px;
  }

  .va2fleet-bottom {
    padding: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .va2fleet-feature > img,
  .va2fleet-feature-top i,
  .va2fleet-feature-link i,
  .va2fleet-category,
  .va2fleet-category-icon,
  .va2fleet-category > a,
  .va2fleet-bottom > a i {
    transition: none;
  }
}



/* =========================================
   VOLTCARE HOME 2 - SECTION 7
   VEHICLE INSIGHTS / EDITORIAL DESIGN
========================================= */

.va2insight-section {
  padding: 100px 24px 85px;
  overflow: hidden;
  background: #f5f3ef;
  color: #142b3b;
  font-family: 'Montserrat', sans-serif;
}

.va2insight-section *,
.va2insight-section *::before,
.va2insight-section *::after {
  box-sizing: border-box;
}

.va2insight-container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
}

.va2insight-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #dedbd4;
}

.va2insight-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #bd691e;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
}

.va2insight-eyebrow > span {
  width: 28px;
  height: 2px;
  background: #f28c28;
}

.va2insight-edition {
  color: #89939a;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.va2insight-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .7fr);
  align-items: end;
  gap: 50px;
  padding: 42px 0 45px;
}

.va2insight-intro h2 {
  margin: 0;
  color: #142b3b;
  font-size: clamp(34px, 4vw, 49px);
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: -1.5px;
}

.va2insight-intro h2 span {
  color: #d77a24;
}

.va2insight-intro > p {
  max-width: 390px;
  margin: 0 0 5px;
  color: #687681;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.9;
}

/* FEATURE STORY */

.va2insight-feature {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  min-height: 365px;
  background: #142b3b;
}

.va2insight-feature-copy {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  padding: 42px;
}

.va2insight-feature-tag {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 24px;
  color: #f6a452;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.va2insight-feature-tag i {
  font-size: 15px;
}

.va2insight-feature-copy h3 {
  margin: 0 0 17px;
  color: #fff;
  font-size: clamp(25px, 2.6vw, 33px);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.7px;
}

.va2insight-feature-copy > p {
  margin: 0;
  color: #c1ccd3;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.9;
}

.va2insight-feature-link {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  margin-top: 27px;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.va2insight-feature-link > span {
  display: flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  background: #f28c28;
  color: #142b3b;
  transition: transform .3s ease;
}

.va2insight-feature-link:hover > span {
  transform: translate(3px, -3px);
}

/* FEATURE IMAGE */

.va2insight-feature-image {
  position: relative;
  min-height: 365px;
  overflow: hidden;
  background: #243e50;
}

.va2insight-feature-image > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s ease;
}

.va2insight-feature:hover .va2insight-feature-image > img {
  transform: scale(1.04);
}

.va2insight-image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(20,43,59,.35),
    rgba(20,43,59,.02) 65%,
    rgba(20,43,59,.18)
  );
}

.va2insight-image-caption {
  position: absolute;
  right: 22px;
  bottom: 22px;
  left: 22px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.7px;
}

.va2insight-caption-line {
  width: 38px;
  height: 2px;
  background: #f28c28;
}

.va2insight-image-mark {
  position: absolute;
  top: 22px;
  right: 22px;
  display: flex;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.6);
  color: #fff;
  font-size: 19px;
}

/* KNOWLEDGE LIST */

.va2insight-knowledge {
  margin-top: 55px;
}

.va2insight-knowledge-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 17px;
  border-bottom: 2px solid #142b3b;
}

.va2insight-knowledge-heading > span {
  color: #142b3b;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.8px;
}

.va2insight-knowledge-heading > p {
  margin: 0;
  color: #687681;
  font-size: 12px;
  font-weight: 400;
}

.va2insight-knowledge-item {
  display: grid;
  grid-template-columns: 45px 50px minmax(0, 1fr) 35px;
  align-items: center;
  gap: 20px;
  padding: 23px 10px;
  border-bottom: 1px solid #dedbd4;
  transition: background .3s ease, padding .3s ease;
}

.va2insight-knowledge-item:hover {
  padding-right: 17px;
  padding-left: 17px;
  background: rgba(255,255,255,.7);
}

.va2insight-knowledge-number {
  color: #c2b7a8;
  font-size: 13px;
  font-weight: 700;
}

.va2insight-knowledge-icon {
  display: flex;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  border: 1px solid #ded4c8;
  color: #c66e1d;
  font-size: 18px;
}

.va2insight-knowledge-copy h4 {
  margin: 0 0 7px;
  color: #142b3b;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
}

.va2insight-knowledge-copy p {
  max-width: 650px;
  margin: 0;
  color: #687681;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.8;
}

.va2insight-knowledge-arrow {
  display: flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid #d9d2c8;
  color: #c66e1d;
  font-size: 12px;
  transition: background .3s ease, color .3s ease;
}

.va2insight-knowledge-item:hover .va2insight-knowledge-arrow {
  border-color: #f28c28;
  background: #f28c28;
  color: #142b3b;
}

/* BOTTOM NOTE */

.va2insight-bottom-note {
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  margin-top: 32px;
  padding: 23px 25px;
  border: 1px solid #e1d9cf;
  background: #fff;
}

.va2insight-note-icon {
  display: flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  background: #fce7d3;
  color: #bd691e;
  font-size: 17px;
}

.va2insight-bottom-note > p {
  margin: 0;
  color: #687681;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.8;
}

.va2insight-bottom-note > p strong {
  color: #142b3b;
  font-weight: 700;
}

.va2insight-bottom-note > a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #142b3b;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.va2insight-bottom-note > a i {
  color: #d77a24;
  transition: transform .3s ease;
}

.va2insight-bottom-note > a:hover i {
  transform: translateX(4px);
}

/* TABLET */

@media (max-width: 1024px) {
  .va2insight-section {
    padding: 80px 24px 65px;
  }

  .va2insight-intro {
    gap: 30px;
  }

  .va2insight-feature-copy {
    padding: 30px;
  }

  .va2insight-knowledge-item {
    grid-template-columns: 30px 45px minmax(0, 1fr) 32px;
    gap: 14px;
  }

  .va2insight-bottom-note {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .va2insight-bottom-note > a {
    grid-column: 2;
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .va2insight-section {
    padding: 65px 20px 55px;
  }

  .va2insight-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 13px;
  }

  .va2insight-intro {
    grid-template-columns: 1fr;
    gap: 17px;
    padding: 32px 0;
  }

  .va2insight-intro h2 {
    font-size: 33px;
    letter-spacing: -.8px;
  }

  .va2insight-intro > p {
    max-width: 100%;
  }

  .va2insight-feature {
    grid-template-columns: 1fr;
  }

  .va2insight-feature-copy {
    padding: 30px 25px;
  }

  .va2insight-feature-copy h3 {
    font-size: 28px;
  }

  .va2insight-feature-image {
    min-height: 300px;
  }

  .va2insight-knowledge {
    margin-top: 40px;
  }

  .va2insight-knowledge-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .va2insight-knowledge-item {
    grid-template-columns: 26px 40px minmax(0, 1fr) 28px;
    gap: 10px;
    padding: 19px 3px;
  }

  .va2insight-knowledge-icon {
    width: 38px;
    height: 38px;
    font-size: 15px;
  }

  .va2insight-knowledge-copy h4 {
    font-size: 13px;
  }

  .va2insight-knowledge-copy p {
    font-size: 12px;
  }

  .va2insight-knowledge-arrow {
    width: 28px;
    height: 28px;
    font-size: 10px;
  }

  .va2insight-bottom-note {
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 13px;
    padding: 19px;
  }

  .va2insight-note-icon {
    width: 38px;
    height: 38px;
  }

  .va2insight-bottom-note > a {
    grid-column: 2;
  }
}

@media (max-width: 480px) {
  .va2insight-section {
    padding: 55px 15px 45px;
  }

  .va2insight-intro h2 {
    font-size: 28px;
  }

  .va2insight-eyebrow {
    font-size: 10px;
    letter-spacing: 1.3px;
  }

  .va2insight-edition {
    font-size: 9px;
  }

  .va2insight-feature-copy {
    padding: 25px 20px;
  }

  .va2insight-feature-copy h3 {
    font-size: 25px;
  }

  .va2insight-feature-image {
    min-height: 245px;
  }

  .va2insight-knowledge-item {
    grid-template-columns: 22px 34px minmax(0, 1fr);
    gap: 9px;
  }

  .va2insight-knowledge-icon {
    width: 33px;
    height: 33px;
    font-size: 13px;
  }

  .va2insight-knowledge-arrow {
    display: none;
  }

  .va2insight-knowledge-copy h4 {
    font-size: 12px;
  }

  .va2insight-knowledge-copy p {
    font-size: 11px;
  }

  .va2insight-bottom-note {
    padding: 15px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .va2insight-feature-image > img,
  .va2insight-feature-link > span,
  .va2insight-knowledge-item,
  .va2insight-knowledge-arrow,
  .va2insight-bottom-note > a i {
    transition: none;
  }
}



/* =========================================
   VOLTCARE HOME 2 - SECTION 8
   FINAL BOOKING CTA
========================================= */

.va2final-section {
  position: relative;
  min-height: 590px;
  overflow: hidden;
  background: #0c1b26;
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  isolation: isolate;
}

.va2final-section *,
.va2final-section *::before,
.va2final-section *::after {
  box-sizing: border-box;
}

.va2final-background {
  position: absolute;
  z-index: -3;
  inset: 0;
}

.va2final-background img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 55%;
  opacity: .68;
  transition: transform 1s ease;
}

.va2final-section:hover .va2final-background img {
  transform: scale(1.025);
}

.va2final-overlay {
  position: absolute;
  z-index: -2;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      rgba(8, 23, 33, .98) 0%,
      rgba(8, 23, 33, .91) 38%,
      rgba(8, 23, 33, .62) 72%,
      rgba(8, 23, 33, .45) 100%
    ),
    linear-gradient(
      0deg,
      rgba(8,23,33,.95) 0%,
      transparent 35%
    );
}

.va2final-container {
  display: flex;
  width: 100%;
  max-width: 1240px;
  min-height: 590px;
  flex-direction: column;
  justify-content: space-between;
  margin: 0 auto;
  padding: 30px 24px 25px;
}

/* TOP LINE */

.va2final-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(255,255,255,.2);
}

.va2final-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
}

.va2final-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #f28c28;
  box-shadow: 0 0 14px rgba(242,140,40,.65);
}

.va2final-index {
  color: #c0ccd3;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

/* MAIN CONTENT */

.va2final-content {
  width: 100%;
  max-width: 790px;
  padding: 75px 0 85px;
}

.va2final-mini-label {
  display: inline-block;
  margin-bottom: 20px;
  color: #f6a452;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
}

.va2final-content h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(42px, 5.2vw, 66px);
  font-weight: 700;
  line-height: 1.13;
  letter-spacing: -2px;
}

.va2final-content h2 span {
  color: #f28c28;
}

.va2final-content > p {
  max-width: 570px;
  margin: 23px 0 0;
  color: #d1dbe1;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.9;
}

/* CTA BUTTONS */

.va2final-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 25px;
  margin-top: 31px;
}

.va2final-primary-btn {
  display: inline-flex;
  min-height: 56px;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 8px 19px 8px 22px;
  background: #f28c28;
  color: #142b3b;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background .3s ease, transform .3s ease;
}



.va2final-primary-btn:hover {
  background: #ffad57;
  transform: translateY(-2px);
}

.va2final-primary-btn:hover > span {
  transform: translateX(3px);
}

.va2final-secondary-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: color .3s ease;
}

.va2final-secondary-btn > i {
  color: #f28c28;
  font-size: 13px;
}

.va2final-secondary-btn:hover {
  color: #f6a452;
}

/* BOTTOM BAR */

.va2final-bottom {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 30px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.2);
}

.va2final-bottom-brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.va2final-brand-icon {
  display: flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  background: #f28c28;
  color: #142b3b;
  font-size: 19px;
}

.va2final-bottom-brand strong,
.va2final-bottom-brand div > span {
  display: block;
}

.va2final-bottom-brand strong {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 2px;
}

.va2final-bottom-brand div > span {
  margin-top: 5px;
  color: #b9c6ce;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1px;
}

.va2final-bottom-note {
  display: flex;
  align-items: center;
  gap: 13px;
}

.va2final-note-line {
  width: 27px;
  height: 2px;
  flex: 0 0 27px;
  background: #f28c28;
}

.va2final-bottom-note p {
  margin: 0;
  color: #d0d9df;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.7;
}

.va2final-contact-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #f6a452;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.va2final-contact-link i {
  transition: transform .3s ease;
}

.va2final-contact-link:hover i {
  transform: translate(3px, -3px);
}

/* TABLET */

@media (max-width: 1024px) {
  .va2final-section,
  .va2final-container {
    min-height: 560px;
  }

  .va2final-content {
    max-width: 700px;
    padding: 65px 0 70px;
  }

  .va2final-content h2 {
    font-size: clamp(40px, 5.5vw, 58px);
  }

  .va2final-bottom {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 20px;
  }

  .va2final-contact-link {
    grid-column: 2;
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .va2final-section,
  .va2final-container {
    min-height: auto;
  }

  .va2final-container {
    padding: 24px 20px;
  }

  .va2final-overlay {
    background:
      linear-gradient(
        90deg,
        rgba(8,23,33,.94),
        rgba(8,23,33,.72)
      ),
      linear-gradient(
        0deg,
        rgba(8,23,33,.98),
        transparent 75%
      );
  }

  .va2final-content {
    max-width: 100%;
    padding: 75px 0 80px;
  }

  .va2final-content h2 {
    font-size: clamp(36px, 7vw, 48px);
    letter-spacing: -1.2px;
  }

  .va2final-content > p {
    font-size: 14px;
  }

  .va2final-actions {
    align-items: flex-start;
    flex-direction: column;
    gap: 20px;
  }

  .va2final-bottom {
    grid-template-columns: 1fr;
    gap: 20px;
    padding-top: 22px;
  }

  .va2final-contact-link {
    grid-column: auto;
  }
}

@media (max-width: 480px) {
  .va2final-container {
    padding: 20px 15px;
  }

  .va2final-eyebrow {
    font-size: 9px;
    letter-spacing: 1.2px;
  }

  .va2final-index {
    font-size: 9px;
  }

  .va2final-content {
    padding: 60px 0 65px;
  }

  .va2final-mini-label {
    font-size: 9px;
    letter-spacing: 1.2px;
  }

  .va2final-content h2 {
    font-size: 34px;
  }

  .va2final-content > p {
    font-size: 13px;
    line-height: 1.85;
  }

  .va2final-primary-btn {
    width: 100%;
    gap: 15px;
  }

  .va2final-bottom-brand strong {
    font-size: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .va2final-background img,
  .va2final-primary-btn,
  .va2final-primary-btn > span,
  .va2final-secondary-btn,
  .va2final-contact-link i {
    transition: none;
  }
}



/* VOLTCARE SERVICE PAGE BANNER */
.vservice-banner {
    position: relative;
    min-height: 390px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background-image: url("../images/pexels-renee-razumov-2155050841-33814736.jpg");
    background-size: cover;
    background-position: center 55%;
    font-family: 'Montserrat', sans-serif;
}

.vservice-banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(20, 43, 59, 0.96) 0%,
        rgba(20, 43, 59, 0.82) 55%,
        rgba(20, 43, 59, 0.45) 100%
    );
}

.vservice-banner-container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 75px 25px;
    color: #ffffff;
}

.vservice-banner-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: #F28C28;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vservice-banner h1 {
    margin: 0 0 18px;
    color: #ffffff;
    font-size: clamp(36px, 5vw, 58px);
    font-weight: 800;
    line-height: 1.15;
}

.vservice-banner h1 span {
    color: #F28C28;
}

.vservice-banner-container > p {
    max-width: 650px;
    margin: 0 0 25px;
    color: #e1e8ed;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vservice-breadcrumb {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 500;
}

.vservice-breadcrumb a {
    color: #ffffff;
    text-decoration: none;
    transition: color 0.3s ease;
}

.vservice-breadcrumb a:hover {
    color: #F28C28;
}

.vservice-breadcrumb i {
    color: #F28C28;
    font-size: 11px;
}

.vservice-breadcrumb span {
    color: #F28C28;
}

/* RESPONSIVE */
@media (max-width: 767px) {
    .vservice-banner {
        min-height: 340px;
        background-position: center;
    }

    .vservice-banner-container {
        padding: 65px 22px;
    }

    .vservice-banner h1 {
        font-size: 38px;
    }

    .vservice-banner-container > p {
        font-size: 14px;
        line-height: 1.8;
    }
}

@media (max-width: 480px) {
    .vservice-banner {
        min-height: 310px;
    }

    .vservice-banner-container {
        padding: 50px 18px;
    }

    .vservice-banner h1 {
        font-size: 32px;
    }

    .vservice-banner-tag {
        font-size: 10px;
        letter-spacing: 1.5px;
    }
}



/* =========================================================
   VOLTCARE SERVICES SECTION
   HTML classes: vcs-page
   Colors: #142B3B / #F28C28
========================================================= */

.vcs-page,
.vcs-page * {
    box-sizing: border-box;
}

.vcs-page {
    --vcs-navy: #142B3B;
    --vcs-orange: #F28C28;
    --vcs-text: #526471;
    --vcs-muted: #75838D;
    --vcs-border: #E2E8EC;
    --vcs-surface: #FFFFFF;
    --vcs-soft: #F5F7F8;

    position: relative;
    width: 100%;
    padding: 80px 0;
    overflow: hidden;
    background: var(--vcs-surface);
    color: var(--vcs-navy);
    font-family: "Montserrat", sans-serif;
}

.vcs-page img {
    display: block;
    max-width: 100%;
}

.vcs-page a {
    text-decoration: none;
}

.vcs-page h2,
.vcs-page h3,
.vcs-page p {
    overflow-wrap: break-word;
}

/* ================= HEADER ================= */

.vcs-page .vae-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto 40px;
}

.vcs-page .vae-header-left {
    flex: 1 1 55%;
    min-width: 0;
}

.vcs-page .vae-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 17px;
    color: var(--vcs-orange);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 1.7px;
}

.vcs-page .vae-eyebrow-line {
    display: inline-block;
    width: 30px;
    height: 2px;
    flex-shrink: 0;
    background: var(--vcs-orange);
}

.vcs-page .vae-header h2 {
    margin: 0;
    color: var(--vcs-navy);
    font-size: clamp(30px, 3.4vw, 43px);
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
}

.vcs-page .vae-header h2 span {
    color: var(--vcs-orange);
}

.vcs-page .vae-header-text {
    flex: 0 1 420px;
    margin: 0;
    color: var(--vcs-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* ================= FEATURED GRID ================= */

.vcs-page .vcs-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px;
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
}

.vcs-page .vcs-feature-card {
    min-width: 0;
    overflow: hidden;
    background: var(--vcs-surface);
    border: 1px solid var(--vcs-border);
    border-radius: 12px;
    box-shadow: 0 8px 28px rgba(20, 43, 59, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease,
        border-color 0.3s ease;
}

.vcs-page .vcs-feature-card:hover {
    transform: translateY(-5px);
    border-color: rgba(242, 140, 40, 0.55);
    box-shadow: 0 16px 36px rgba(20, 43, 59, 0.12);
}

/* ================= FEATURE IMAGE ================= */

.vcs-page .vcs-card-image {
    position: relative;
    height: 245px;
    overflow: hidden;
    background: #243947;
}

.vcs-page .vcs-card-image::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        180deg,
        rgba(10, 24, 34, 0.05) 15%,
        rgba(10, 24, 34, 0.68) 100%
    );
    content: "";
    pointer-events: none;
}

.vcs-page .vcs-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.55s ease;
}

.vcs-page .vcs-feature-card:hover .vcs-card-image img {
    transform: scale(1.045);
}

.vcs-page .vcs-number {
    position: absolute;
    z-index: 2;
    top: 18px;
    left: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    color: #FFFFFF;
    background: var(--vcs-orange);
    border-radius: 7px;
    font-size: 13px;
    font-weight: 800;
}

.vcs-page .vcs-image-label {
    position: absolute;
    z-index: 2;
    right: 20px;
    bottom: 19px;
    left: 20px;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 1.7px;
}

/* ================= FEATURE CONTENT ================= */

.vcs-page .vcs-card-content {
    position: relative;
    padding: 28px 28px 26px;
}

.vcs-page .vcs-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-top: -55px;
    margin-bottom: 21px;
    position: relative;
    z-index: 3;
    color: var(--vcs-orange);
    background: var(--vcs-surface);
    border: 1px solid var(--vcs-border);
    border-radius: 10px;
    font-size: 22px;
    box-shadow: 0 5px 15px rgba(20, 43, 59, 0.08);
    transition: color 0.25s ease, background 0.25s ease;
}

.vcs-page .vcs-feature-card:hover .vcs-icon {
    color: #FFFFFF;
    background: var(--vcs-orange);
    border-color: var(--vcs-orange);
}

.vcs-page .vcs-category {
    display: block;
    margin-bottom: 9px;
    color: var(--vcs-orange);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 1.4px;
}

.vcs-page .vcs-card-content h3 {
    margin: 0 0 12px;
    color: var(--vcs-navy);
    font-size: 20px;
    font-weight: 800;
    line-height: 1.45;
    transition: none;
}

.vcs-page .vcs-card-content p {
    margin: 0 0 20px;
    color: var(--vcs-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
    transition: none;
}

.vcs-page .vcs-feature-card:hover .vcs-card-content h3 {
    color: var(--vcs-navy);
}

.vcs-page .vcs-feature-card:hover .vcs-card-content p {
    color: var(--vcs-text);
}

/* ================= FEATURE LIST ================= */

.vcs-page .vcs-card-content ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px 16px;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}

.vcs-page .vcs-card-content ul li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    min-width: 0;
    color: var(--vcs-text);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.7;
}

.vcs-page .vcs-card-content ul li i {
    flex-shrink: 0;
    margin-top: 4px;
    color: var(--vcs-orange);
    font-size: 15px;
}

/* ================= FEATURE LINKS ================= */

.vcs-page .vcs-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 18px;
    color: var(--vcs-navy);
    border-top: 1px solid var(--vcs-border);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
    transition: color 0.25s ease;
}

.vcs-page .vcs-link span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    color: #FFFFFF;
    background: var(--vcs-orange);
    border-radius: 50%;
    transition: background 0.25s ease, transform 0.25s ease;
}

.vcs-page .vcs-link:hover,
.vcs-page .vcs-feature-card:hover .vcs-link {
    color: var(--vcs-orange);
}

.vcs-page .vcs-link:hover span {
    transform: translateX(3px);
    background: #D96F12;
}

/* ================= SECONDARY SERVICES ================= */

.vcs-page .vcs-secondary {
    width: min(1180px, calc(100% - 48px));
    margin: 88px auto 0;
}

.vcs-page .vcs-secondary-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 35px;
    margin-bottom: 32px;
}

.vcs-page .vcs-tag {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 15px;
    color: var(--vcs-orange);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 1.4px;
}

.vcs-page .vcs-tag i {
    font-size: 13px;
}

.vcs-page .vcs-secondary-heading h2 {
    margin: 0;
    color: var(--vcs-navy);
    font-size: clamp(28px, 3vw, 38px);
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.7px;
}

.vcs-page .vcs-secondary-heading h2 span {
    color: var(--vcs-orange);
}

.vcs-page .vcs-secondary-heading > p {
    max-width: 370px;
    margin: 0 0 4px;
    color: var(--vcs-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* ================= SMALL CARD GRID ================= */

.vcs-page .vcs-small-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.vcs-page .vcs-small-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 245px;
    padding: 26px;
    overflow: hidden;
    background: var(--vcs-soft);
    border: 1px solid var(--vcs-border);
    border-radius: 10px;
    transition: background 0.3s ease, transform 0.3s ease,
        border-color 0.3s ease, box-shadow 0.3s ease;
}

.vcs-page .vcs-small-card::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 3px;
    background: var(--vcs-orange);
    content: "";
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.vcs-page .vcs-small-card:hover {
    transform: translateY(-5px);
    background: var(--vcs-surface);
    border-color: rgba(242, 140, 40, 0.55);
    box-shadow: 0 14px 30px rgba(20, 43, 59, 0.08);
}

.vcs-page .vcs-small-card:hover::after {
    transform: scaleX(1);
}

.vcs-page .vcs-small-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 25px;
}

.vcs-page .vcs-small-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    color: var(--vcs-orange);
    background: var(--vcs-surface);
    border: 1px solid var(--vcs-border);
    border-radius: 9px;
    font-size: 19px;
    transition: color 0.25s ease, background 0.25s ease;
}

.vcs-page .vcs-small-card:hover .vcs-small-icon {
    color: #FFFFFF;
    background: var(--vcs-orange);
    border-color: var(--vcs-orange);
}

.vcs-page .vcs-small-count {
    color: var(--vcs-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
}

.vcs-page .vcs-small-card h3 {
    margin: 0 0 11px;
    color: var(--vcs-navy);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.5;
    transition: none;
}

.vcs-page .vcs-small-card p {
    margin: 0 0 20px;
    color: var(--vcs-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
    transition: none;
}

.vcs-page .vcs-small-card:hover h3 {
    color: var(--vcs-navy);
}

.vcs-page .vcs-small-card:hover p {
    color: var(--vcs-text);
}

.vcs-page .vcs-small-card > a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    max-width: 100%;
    margin-top: auto;
    color: var(--vcs-navy);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.7;
    transition: color 0.25s ease;
}

.vcs-page .vcs-small-card > a i {
    color: var(--vcs-orange);
    transition: transform 0.25s ease;
}

.vcs-page .vcs-small-card > a:hover,
.vcs-page .vcs-small-card:hover > a {
    color: var(--vcs-orange);
}

.vcs-page .vcs-small-card > a:hover i {
    transform: translateX(4px);
}

/* ================= CTA BANNER ================= */

.vcs-page .vcs-cta {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    gap: 24px;
    width: min(1180px, calc(100% - 48px));
    margin: 50px auto 0;
    padding: 32px 36px;
    overflow: hidden;
    background: var(--vcs-navy);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
}

.vcs-page .vcs-cta::before {
    position: absolute;
    z-index: -1;
    top: -115px;
    right: -50px;
    width: 290px;
    height: 290px;
    background: rgba(242, 140, 40, 0.11);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.vcs-page .vcs-cta-symbol {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    flex: 0 0 62px;
    color: #FFFFFF;
    background: var(--vcs-orange);
    border-radius: 10px;
    font-size: 24px;
}

/* CTA TEXT: HOVER COLOR FIX */

.vcs-page .vcs-cta .vcs-cta-text,
.vcs-page .vcs-cta:hover .vcs-cta-text,
.vcs-page .vcs-cta .vcs-cta-text:hover {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    min-width: 0;
    color: #FFFFFF;
    background: transparent;
    transition: none;
}

.vcs-page .vcs-cta .vcs-cta-text > span,
.vcs-page .vcs-cta:hover .vcs-cta-text > span {
    display: block;
    margin: 0 0 9px;
    color: #F28C28;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 1.7px;
    -webkit-text-fill-color: #F28C28;
    transition: none;
}

.vcs-page .vcs-cta .vcs-cta-text h2,
.vcs-page .vcs-cta:hover .vcs-cta-text h2,
.vcs-page .vcs-cta .vcs-cta-text h2:hover {
    margin: 0 0 9px;
    color: #FFFFFF;
    background: transparent;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.45;
    letter-spacing: 0;
    text-decoration: none;
    text-shadow: none;
    -webkit-text-fill-color: #FFFFFF;
    transition: none;
}

.vcs-page .vcs-cta .vcs-cta-text p,
.vcs-page .vcs-cta:hover .vcs-cta-text p,
.vcs-page .vcs-cta .vcs-cta-text p:hover {
    margin: 0;
    color: #D5E0E6;
    background: transparent;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.8;
    text-decoration: none;
    text-shadow: none;
    -webkit-text-fill-color: #D5E0E6;
    transition: none;
}

.vcs-page .vcs-cta:hover .vcs-cta-text *,
.vcs-page .vcs-cta .vcs-cta-text:hover * {
    text-decoration: none;
    text-shadow: none;
}

/* CTA BUTTON */

.vcs-page .vcs-cta-btn {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 48px;
    padding: 13px 20px;
    flex: 0 0 auto;
    color: #FFFFFF;
    background: var(--vcs-orange);
    border: 1px solid var(--vcs-orange);
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
    transition: background 0.25s ease, border-color 0.25s ease;
}

.vcs-page .vcs-cta-btn i {
    transition: transform 0.25s ease;
}

.vcs-page .vcs-cta-btn:hover {
    color: #FFFFFF;
    background: #D96F12;
    border-color: #D96F12;
}

.vcs-page .vcs-cta-btn:hover i {
    transform: translateX(4px);
}

/* ================= ENTRANCE ANIMATION ================= */

.vcs-page .vcs-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.65s ease, transform 0.65s ease;
}

.vcs-page .vcs-reveal.vcs-visible {
    opacity: 1;
    transform: translateY(0);
}

/* ================= TABLET: 1024px ================= */

@media (max-width: 1024px) {
    .vcs-page {
        padding: 68px 0;
    }

    .vcs-page .vae-header,
    .vcs-page .vcs-feature-grid,
    .vcs-page .vcs-secondary,
    .vcs-page .vcs-cta {
        width: calc(100% - 40px);
    }

    .vcs-page .vae-header {
        gap: 28px;
    }

    .vcs-page .vae-header-text {
        flex-basis: 350px;
    }

    .vcs-page .vcs-feature-grid {
        gap: 20px;
    }

    .vcs-page .vcs-card-image {
        height: 215px;
    }

    .vcs-page .vcs-card-content {
        padding: 25px 22px;
    }

    .vcs-page .vcs-card-content h3 {
        font-size: 18px;
    }

    .vcs-page .vcs-card-content ul {
        gap: 11px 10px;
    }

    .vcs-page .vcs-card-content ul li {
        font-size: 10px;
    }

    .vcs-page .vcs-secondary {
        margin-top: 70px;
    }

    .vcs-page .vcs-small-grid {
        gap: 16px;
    }

    .vcs-page .vcs-small-card {
        padding: 22px;
    }

    .vcs-page .vcs-cta {
        gap: 20px;
        padding: 28px;
    }

    .vcs-page .vcs-cta .vcs-cta-text h2 {
        font-size: 19px;
    }
}

/* ================= MOBILE / TABLET: 767px ================= */

@media (max-width: 767px) {
    .vcs-page {
        padding: 55px 0;
    }

    .vcs-page .vae-header,
    .vcs-page .vcs-feature-grid,
    .vcs-page .vcs-secondary,
    .vcs-page .vcs-cta {
        width: calc(100% - 32px);
    }

    .vcs-page .vae-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        margin-bottom: 28px;
    }

    .vcs-page .vae-header h2 {
        font-size: 32px;
    }

    .vcs-page .vae-header-text {
        flex: 1 1 auto;
        width: 100%;
        max-width: 570px;
    }

    .vcs-page .vcs-feature-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 22px;
    }

    .vcs-page .vcs-card-image {
        height: 250px;
    }

    .vcs-page .vcs-card-content {
        padding: 27px;
    }

    .vcs-page .vcs-card-content h3 {
        font-size: 20px;
    }

    .vcs-page .vcs-card-content ul li {
        font-size: 11px;
    }

    .vcs-page .vcs-secondary {
        margin-top: 60px;
    }

    .vcs-page .vcs-secondary-heading {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        margin-bottom: 25px;
    }

    .vcs-page .vcs-secondary-heading > p {
        max-width: 540px;
    }

    .vcs-page .vcs-small-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 15px;
    }

    .vcs-page .vcs-small-card {
        min-height: 230px;
        padding: 21px;
    }

    .vcs-page .vcs-small-card:last-child {
        grid-column: 1 / -1;
        min-height: 200px;
    }

    .vcs-page .vcs-cta {
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 18px;
        margin-top: 35px;
        padding: 25px;
    }

    .vcs-page .vcs-cta-symbol {
        width: 54px;
        height: 54px;
        flex-basis: 54px;
        font-size: 21px;
    }

    .vcs-page .vcs-cta .vcs-cta-text {
        flex: 1 1 calc(100% - 78px);
    }

    .vcs-page .vcs-cta .vcs-cta-text h2 {
        font-size: 19px;
    }

    .vcs-page .vcs-cta-btn {
        margin-left: 72px;
    }
}

/* ================= SMALL MOBILE: 480px ================= */

@media (max-width: 480px) {
    .vcs-page {
        padding: 45px 0;
    }

    .vcs-page .vae-header,
    .vcs-page .vcs-feature-grid,
    .vcs-page .vcs-secondary,
    .vcs-page .vcs-cta {
        width: calc(100% - 28px);
    }

    .vcs-page .vae-eyebrow {
        gap: 8px;
        font-size: 9px;
        letter-spacing: 1px;
    }

    .vcs-page .vae-eyebrow-line {
        width: 22px;
    }

    .vcs-page .vae-header h2 {
        font-size: 27px;
        letter-spacing: -0.5px;
    }

    .vcs-page .vae-header-text {
        font-size: 12px;
    }

    .vcs-page .vcs-card-image {
        height: 195px;
    }

    .vcs-page .vcs-card-content {
        padding: 22px 19px;
    }

    .vcs-page .vcs-card-content h3 {
        font-size: 18px;
    }

    .vcs-page .vcs-card-content p {
        font-size: 12px;
    }

    .vcs-page .vcs-card-content ul {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .vcs-page .vcs-card-content ul li {
        font-size: 11px;
    }

    .vcs-page .vcs-secondary {
        margin-top: 48px;
    }

    .vcs-page .vcs-tag {
        font-size: 9px;
        letter-spacing: 1px;
    }

    .vcs-page .vcs-secondary-heading h2 {
        font-size: 28px;
    }

    .vcs-page .vcs-small-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 13px;
    }

    .vcs-page .vcs-small-card,
    .vcs-page .vcs-small-card:last-child {
        grid-column: auto;
        min-height: 0;
        padding: 22px;
    }

    .vcs-page .vcs-small-top {
        margin-bottom: 18px;
    }

    .vcs-page .vcs-small-card h3 {
        font-size: 17px;
    }

    .vcs-page .vcs-small-card p {
        font-size: 12px;
    }

    .vcs-page .vcs-cta {
        display: grid;
        grid-template-columns: 46px minmax(0, 1fr);
        gap: 15px;
        padding: 21px 17px;
    }

    .vcs-page .vcs-cta-symbol {
        width: 46px;
        height: 46px;
        font-size: 19px;
    }

    .vcs-page .vcs-cta .vcs-cta-text {
        width: 100%;
        min-width: 0;
    }

    .vcs-page .vcs-cta .vcs-cta-text > span {
        font-size: 9px;
        letter-spacing: 1px;
    }

    .vcs-page .vcs-cta .vcs-cta-text h2 {
        font-size: 17px;
        line-height: 1.5;
    }

    .vcs-page .vcs-cta .vcs-cta-text p {
        font-size: 12px;
        line-height: 1.8;
    }

    .vcs-page .vcs-cta-btn {
        grid-column: 1 / -1;
        justify-self: start;
        margin-left: 0;
        white-space: normal;
    }
}

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

@media (prefers-reduced-motion: reduce) {
    .vcs-page .vcs-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vcs-page *,
    .vcs-page *::before,
    .vcs-page *::after {
        animation: none !important;
        transition: none !important;
    }
}





/* =========================================
   VOLTCARE - WIRING ISSUES SECTION
========================================= */

.vwi-section {
    --vwi-navy: #142B3B;
    --vwi-orange: #F28C28;
    --vwi-white: #FFFFFF;
    --vwi-muted: #667783;
    --vwi-border: #E3E8EC;

    width: 100%;
    padding: 100px 24px;
    background: #F5F7F9;
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
    box-sizing: border-box;
}

.vwi-section *,
.vwi-section *::before,
.vwi-section *::after {
    box-sizing: border-box;
}

.vwi-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* HEADER */

.vwi-header {
    display: grid;
    grid-template-columns: 1.1fr 0.8fr;
    align-items: end;
    gap: 50px;
    margin-bottom: 48px;
}

.vwi-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    color: var(--vwi-orange);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vwi-dot {
    width: 9px;
    height: 9px;
    flex-shrink: 0;
    background: var(--vwi-orange);
    border-radius: 50%;
    box-shadow: 0 0 0 5px rgba(242, 140, 40, 0.13);
}

.vwi-header h2 {
    margin: 0;
    color: var(--vwi-navy);
    font-size: clamp(34px, 3.7vw, 48px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1.3px;
}

.vwi-header h2 span {
    display: block;
    color: var(--vwi-orange);
}

.vwi-header > p {
    max-width: 480px;
    margin: 0 0 5px auto;
    color: var(--vwi-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* MAIN GRID */

.vwi-main {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    align-items: stretch;
    gap: 60px;
}

/* IMAGE PANEL */

.vwi-visual {
    position: relative;
    min-height: 570px;
    overflow: hidden;
    background: var(--vwi-navy);
    border-radius: 5px;
    isolation: isolate;
}

.vwi-visual > img {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.8s ease;
}

.vwi-visual:hover > img {
    transform: scale(1.05);
}

.vwi-image-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
        180deg,
        rgba(10, 27, 40, 0.65) 0%,
        rgba(10, 27, 40, 0.08) 40%,
        rgba(10, 27, 40, 0.93) 100%
    );
}

.vwi-image-label {
    position: absolute;
    top: 28px;
    left: 28px;
    right: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vwi-status-dot {
    width: 9px;
    height: 9px;
    flex-shrink: 0;
    background: var(--vwi-orange);
    border-radius: 50%;
    box-shadow: 0 0 12px rgba(242, 140, 40, 0.7);
}

.vwi-image-content {
    position: absolute;
    right: 28px;
    bottom: 32px;
    left: 28px;
    display: flex;
    align-items: center;
    gap: 18px;
}

.vwi-image-icon {
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    flex-shrink: 0;
    color: var(--vwi-orange);
    background: rgba(242, 140, 40, 0.15);
    border: 1px solid rgba(242, 140, 40, 0.65);
    font-size: 24px;
}

.vwi-image-content > div:last-child > span {
    display: block;
    margin-bottom: 8px;
    color: var(--vwi-orange);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vwi-image-content h3 {
    margin: 0;
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 700;
    line-height: 1.35;
}

/* DETAILS */

.vwi-details {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 5px 0;
}

.vwi-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    color: var(--vwi-orange);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vwi-details > h3 {
    margin: 0 0 16px;
    color: var(--vwi-navy);
    font-size: clamp(25px, 2.4vw, 32px);
    font-weight: 800;
    line-height: 1.35;
}

.vwi-details > h3 span {
    color: var(--vwi-orange);
}

.vwi-description {
    margin: 0 0 22px;
    color: var(--vwi-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

/* ISSUE CARDS */

.vwi-issue {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 16px;
    padding: 16px;
    margin-bottom: 11px;
    background: #FFFFFF;
    border: 1px solid var(--vwi-border);
    transition:
        border-color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.vwi-issue:hover {
    transform: translateX(5px);
    border-color: var(--vwi-orange);
    box-shadow: 0 8px 25px rgba(20, 43, 59, 0.07);
}

.vwi-issue-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    color: var(--vwi-orange);
    background: #FFF3E7;
    font-size: 19px;
    transition: color 0.3s ease, background 0.3s ease;
}

.vwi-issue:hover .vwi-issue-icon {
    color: #FFFFFF;
    background: var(--vwi-orange);
}

.vwi-issue-info {
    min-width: 0;
}

.vwi-issue-info h4 {
    margin: 0 0 6px;
    color: var(--vwi-navy);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
}

.vwi-issue-info p {
    margin: 0;
    color: var(--vwi-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.65;
}

.vwi-number {
    margin-left: auto;
    color: #A8B4BC;
    font-size: 15px;
    font-weight: 700;
    flex-shrink: 0;
}

/* BUTTON */

.vwi-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 56px;
    padding: 8px 8px 8px 22px;
    margin-top: 15px;
    color: #FFFFFF !important;
    background: var(--vwi-navy);
    border: 1px solid var(--vwi-navy);
    text-decoration: none !important;
    font-size: 15px;
    font-weight: 700;
    transition: background 0.3s ease, border-color 0.3s ease;
}

.vwi-button > span {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    color: var(--vwi-navy);
    background: var(--vwi-orange);
    transition: transform 0.3s ease;
}

.vwi-button:hover {
    color: #FFFFFF !important;
    background: var(--vwi-orange);
    border-color: var(--vwi-orange);
}

.vwi-button:hover > span {
    transform: translateX(3px);
}

/* PROCESS BAR */

.vwi-process {
    display: grid;
    grid-template-columns: 1.25fr 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: 22px;
    padding: 30px;
    margin-top: 70px;
    background: var(--vwi-navy);
    border-left: 4px solid var(--vwi-orange);
}

.vwi-process-heading > span {
    display: block;
    margin-bottom: 10px;
    color: var(--vwi-orange);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.vwi-process-heading h3 {
    margin: 0;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
}

.vwi-step {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.vwi-step-number {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    color: var(--vwi-orange);
    border: 1px solid rgba(242, 140, 40, 0.6);
    font-size: 15px;
    font-weight: 700;
}

.vwi-step h4 {
    margin: 2px 0 7px;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
}

.vwi-step p {
    margin: 0;
    color: #C0CBD2;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
}

.vwi-process-arrow {
    color: var(--vwi-orange);
    font-size: 16px;
}

/* ENTRANCE ANIMATION */

.vwi-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.vwi-reveal.vwi-visible {
    opacity: 1;
    transform: translateY(0);
}

/* TABLET */

@media (max-width: 1024px) {
    .vwi-section {
        padding: 80px 22px;
    }

    .vwi-header {
        gap: 30px;
    }

    .vwi-main {
        gap: 30px;
    }

    .vwi-visual {
        min-height: 600px;
    }

    .vwi-issue {
        gap: 11px;
        padding: 13px 11px;
    }

    .vwi-issue-icon {
        width: 42px;
        height: 42px;
    }

    .vwi-process {
        grid-template-columns: 1fr 1fr auto 1fr auto 1fr;
        gap: 12px;
        padding: 24px 18px;
    }

    .vwi-process-heading h3 {
        font-size: 16px;
    }
}

/* MOBILE AND SMALL TABLET */

@media (max-width: 767px) {
    .vwi-section {
        padding: 65px 18px;
    }

    .vwi-header {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-bottom: 32px;
    }

    .vwi-header h2 {
        font-size: 36px;
        letter-spacing: -0.7px;
    }

    .vwi-header > p {
        max-width: 100%;
        margin: 0;
    }

    .vwi-main {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .vwi-visual {
        min-height: 430px;
    }

    .vwi-details {
        padding: 0;
    }

    .vwi-details > h3 {
        font-size: 29px;
    }

    .vwi-process {
        grid-template-columns: 1fr;
        gap: 22px;
        padding: 28px 23px;
        margin-top: 45px;
    }

    .vwi-process-heading {
        padding-bottom: 18px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }

    .vwi-process-arrow {
        display: none;
    }
}

/* SMALL MOBILE */

@media (max-width: 480px) {
    .vwi-section {
        padding: 52px 15px;
    }

    .vwi-eyebrow,
    .vwi-label {
        font-size: 13px;
        letter-spacing: 0.8px;
    }

    .vwi-header h2 {
        font-size: 30px;
    }

    .vwi-visual {
        min-height: 360px;
    }

    .vwi-image-label {
        top: 22px;
        left: 18px;
        right: 12px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .vwi-image-content {
        right: 18px;
        bottom: 24px;
        left: 18px;
        gap: 12px;
    }

    .vwi-image-icon {
        width: 46px;
        height: 46px;
        font-size: 19px;
    }

    .vwi-image-content h3 {
        font-size: 20px;
    }

    .vwi-details > h3 {
        font-size: 25px;
    }

    .vwi-issue {
        gap: 10px;
        padding: 12px 9px;
    }

    .vwi-issue-icon {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }

    .vwi-issue-info h4,
    .vwi-issue-info p,
    .vwi-number {
        font-size: 13px;
    }

    .vwi-button {
        width: 100%;
        gap: 10px;
        padding-left: 13px;
        font-size: 13px;
    }

    .vwi-process-heading h3 {
        font-size: 17px;
    }
}

/* ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {
    .vwi-section *,
    .vwi-section *::before,
    .vwi-section *::after {
        animation: none !important;
        transition-duration: 0.01ms !important;
    }

    .vwi-reveal {
        opacity: 1;
        transform: none;
    }
}


/* ==========================================
   VOLTCARE BATTERY DIAGNOSTICS
   NEW PREMIUM DESIGN - LIGHT MODE
========================================== */

.vbd-section {
    --vbd-navy: #142B3B;
    --vbd-orange: #F28C28;
    --vbd-muted: #667783;
    --vbd-border: #DCE4E9;

    padding: 100px 24px;
    background: #F5F7F9;
    color: var(--vbd-navy);
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
    box-sizing: border-box;
}

.vbd-section *,
.vbd-section *::before,
.vbd-section *::after {
    box-sizing: border-box;
}

.vbd-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* HEADER */

.vbd-header {
    display: grid;
    grid-template-columns: 1fr 0.7fr;
    align-items: end;
    gap: 60px;
    margin-bottom: 42px;
}

.vbd-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    color: var(--vbd-orange);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.vbd-eyebrow-line {
    display: inline-block;
    width: 32px;
    height: 2px;
    background: var(--vbd-orange);
}

.vbd-heading h2 {
    margin: 0;
    color: var(--vbd-navy);
    font-size: clamp(40px, 5vw, 62px);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -2px;
}

.vbd-heading h2 span {
    display: block;
    color: var(--vbd-orange);
}

.vbd-header-right {
    padding-bottom: 5px;
}

.vbd-header-right p {
    margin: 0 0 20px;
    color: var(--vbd-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vbd-text-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--vbd-navy) !important;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none !important;
    transition: color 0.3s ease;
}

.vbd-text-link i {
    color: var(--vbd-orange);
    transition: transform 0.3s ease;
}

.vbd-text-link:hover {
    color: var(--vbd-orange) !important;
}

.vbd-text-link:hover i {
    transform: translate(3px, -3px);
}

/* FEATURED PANEL */

.vbd-featured {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 460px;
    background: var(--vbd-navy);
    overflow: hidden;
}

.vbd-featured-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 55px 45px;
}

.vbd-panel-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 23px;
    color: var(--vbd-orange);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vbd-featured-content h3 {
    margin: 0 0 18px;
    color: #FFFFFF;
    font-size: clamp(27px, 3vw, 39px);
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: -0.7px;
}

.vbd-featured-content h3 span {
    display: block;
    color: var(--vbd-orange);
}

.vbd-featured-content > p {
    max-width: 480px;
    margin: 0 0 24px;
    color: #D1DBE2;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

.vbd-highlight-list {
    display: grid;
    gap: 14px;
    margin-bottom: 28px;
}

.vbd-highlight-list > div {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
}

.vbd-highlight-list i {
    margin-top: 4px;
    color: var(--vbd-orange);
    font-size: 14px;
}

/* FEATURED BUTTON */

.vbd-primary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    min-height: 53px;
    padding: 7px 7px 7px 20px;
    color: var(--vbd-navy) !important;
    background: var(--vbd-orange);
    border: 1px solid var(--vbd-orange);
    text-decoration: none !important;
    font-size: 15px;
    font-weight: 700;
    transition: background 0.3s ease, color 0.3s ease;
}

.vbd-primary-btn span {
    display: grid;
    place-items: center;
    width: 37px;
    height: 37px;
    color: #FFFFFF;
    background: var(--vbd-navy);
    transition: transform 0.3s ease;
}

.vbd-primary-btn:hover {
    color: #FFFFFF !important;
    background: #D97716;
    border-color: #D97716;
}

.vbd-primary-btn:hover span {
    transform: translateX(3px);
}

/* FEATURED IMAGE */

.vbd-featured-visual {
    position: relative;
    min-height: 460px;
    overflow: hidden;
    background: #233C4D;
    isolation: isolate;
}

.vbd-featured-visual > img {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.8s ease;
}

.vbd-featured:hover .vbd-featured-visual > img {
    transform: scale(1.04);
}

.vbd-visual-shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
        180deg,
        rgba(10, 25, 36, 0.15) 25%,
        rgba(10, 25, 36, 0.85) 100%
    );
}

.vbd-image-caption {
    position: absolute;
    right: 28px;
    bottom: 28px;
    left: 28px;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 18px;
    background: rgba(20, 43, 59, 0.94);
    border-left: 3px solid var(--vbd-orange);
}

.vbd-caption-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    color: var(--vbd-orange);
    border: 1px solid var(--vbd-orange);
    font-size: 21px;
}

.vbd-image-caption strong {
    display: block;
    margin-bottom: 6px;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.vbd-image-caption > div span {
    color: #D5E0E7;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5;
}

.vbd-vertical-label {
    position: absolute;
    top: 25px;
    right: 22px;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    writing-mode: vertical-rl;
}

.vbd-index-mark {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 3;
    color: rgba(255, 255, 255, 0.16);
    font-size: 54px;
    font-weight: 800;
    pointer-events: none;
}

/* SERVICE GRID HEADER */

.vbd-services-header {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 30px;
    margin: 75px 0 28px;
}

.vbd-small-tag {
    display: block;
    margin-bottom: 12px;
    color: var(--vbd-orange);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.vbd-services-header h3 {
    margin: 0;
    color: var(--vbd-navy);
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 800;
    line-height: 1.3;
}

.vbd-services-header h3 span {
    color: var(--vbd-orange);
}

.vbd-services-header > p {
    max-width: 360px;
    margin: 0 0 4px;
    color: var(--vbd-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

/* SERVICE CARDS */

.vbd-services-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--vbd-border);
    border-bottom: 1px solid var(--vbd-border);
}

.vbd-service-card {
    position: relative;
    min-width: 0;
    padding: 27px 23px 30px;
    background: #FFFFFF;
    border-right: 1px solid var(--vbd-border);
    transition: background 0.3s ease, transform 0.3s ease;
}

.vbd-service-card:last-child {
    border-right: 0;
}

.vbd-service-card:hover {
    z-index: 1;
    background: #FFF7EF;
    transform: translateY(-5px);
}

.vbd-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 27px;
}

.vbd-card-icon {
    display: grid;
    place-items: center;
    width: 49px;
    height: 49px;
    color: var(--vbd-orange);
    background: #FFF0E1;
    font-size: 20px;
}

.vbd-card-number {
    color: #91A0AA;
    font-size: 15px;
    font-weight: 700;
}

.vbd-service-card h4 {
    margin: 0 0 12px;
    color: var(--vbd-navy);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.45;
}

.vbd-service-card p {
    min-height: 80px;
    margin: 0;
    color: var(--vbd-muted);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

.vbd-card-line {
    display: block;
    width: 38px;
    height: 3px;
    margin-top: 22px;
    background: var(--vbd-orange);
    transition: width 0.3s ease;
}

.vbd-service-card:hover .vbd-card-line {
    width: 70px;
}

/* BOTTOM CTA */

.vbd-bottom-cta {
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 28px 30px;
    margin-top: 45px;
    background: #EAF0F4;
    border-left: 4px solid var(--vbd-orange);
}

.vbd-cta-symbol {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    flex-shrink: 0;
    color: var(--vbd-orange);
    background: var(--vbd-navy);
    font-size: 24px;
}

.vbd-cta-copy {
    flex: 1;
    min-width: 0;
}

.vbd-cta-copy > span {
    display: block;
    margin-bottom: 7px;
    color: var(--vbd-orange);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vbd-cta-copy h3 {
    margin: 0;
    color: var(--vbd-navy);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.4;
}

.vbd-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    flex-shrink: 0;
    padding: 17px 21px;
    color: #FFFFFF !important;
    background: var(--vbd-navy);
    text-decoration: none !important;
    font-size: 15px;
    font-weight: 700;
    transition: background 0.3s ease;
}

.vbd-cta-button:hover {
    color: #FFFFFF !important;
    background: var(--vbd-orange);
}

.vbd-cta-button i {
    color: var(--vbd-orange);
    transition: transform 0.3s ease;
}

.vbd-cta-button:hover i {
    color: #FFFFFF;
    transform: translateX(4px);
}

/* ENTRANCE ANIMATION */

.vbd-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.vbd-reveal.vbd-visible {
    opacity: 1;
    transform: translateY(0);
}

/* TABLET */

@media (max-width: 1024px) {
    .vbd-section {
        padding: 80px 22px;
    }

    .vbd-header {
        gap: 35px;
    }

    .vbd-featured-content {
        padding: 38px 28px;
    }

    .vbd-featured-content h3 {
        font-size: 30px;
    }

    .vbd-services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vbd-service-card:nth-child(2) {
        border-right: 0;
    }

    .vbd-service-card:nth-child(1),
    .vbd-service-card:nth-child(2) {
        border-bottom: 1px solid var(--vbd-border);
    }

    .vbd-service-card p {
        min-height: 55px;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .vbd-section {
        padding: 65px 18px;
    }

    .vbd-header {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-bottom: 32px;
    }

    .vbd-heading h2 {
        font-size: 43px;
    }

    .vbd-featured {
        grid-template-columns: 1fr;
    }

    .vbd-featured-content {
        padding: 35px 24px;
    }

    .vbd-featured-visual {
        min-height: 340px;
    }

    .vbd-services-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        margin-top: 55px;
    }

    .vbd-bottom-cta {
        flex-wrap: wrap;
        padding: 24px 20px;
    }

    .vbd-cta-copy {
        flex-basis: calc(100% - 85px);
    }

    .vbd-cta-button {
        width: 100%;
    }
}

/* SMALL MOBILE */

@media (max-width: 480px) {
    .vbd-section {
        padding: 50px 15px;
    }

    .vbd-heading h2 {
        font-size: 36px;
        letter-spacing: -1px;
    }

    .vbd-eyebrow {
        font-size: 13px;
    }

    .vbd-featured-content {
        padding: 30px 19px;
    }

    .vbd-featured-content h3 {
        font-size: 27px;
    }

    .vbd-featured-visual {
        min-height: 290px;
    }

    .vbd-image-caption {
        right: 13px;
        bottom: 13px;
        left: 13px;
        gap: 11px;
        padding: 12px;
    }

    .vbd-caption-icon {
        width: 40px;
        height: 40px;
        font-size: 17px;
    }

    .vbd-image-caption strong,
    .vbd-image-caption > div span {
        font-size: 12px;
    }

    .vbd-vertical-label {
        right: 12px;
        font-size: 10px;
    }

    .vbd-services-header h3 {
        font-size: 26px;
    }

    .vbd-services-grid {
        grid-template-columns: 1fr;
    }

    .vbd-service-card {
        padding: 22px 19px;
        border-right: 0;
        border-bottom: 1px solid var(--vbd-border);
    }

    .vbd-service-card:last-child {
        border-bottom: 0;
    }

    .vbd-service-card h4 {
        font-size: 17px;
    }

    .vbd-service-card p {
        min-height: auto;
    }

    .vbd-card-top {
        margin-bottom: 18px;
    }

    .vbd-bottom-cta {
        gap: 15px;
        margin-top: 32px;
    }

    .vbd-cta-symbol {
        width: 46px;
        height: 46px;
        font-size: 20px;
    }

    .vbd-cta-copy {
        flex-basis: calc(100% - 65px);
    }

    .vbd-cta-copy h3 {
        font-size: 19px;
    }

    .vbd-cta-copy > span {
        font-size: 12px;
    }

    .vbd-cta-button {
        padding: 15px;
        font-size: 13px;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .vbd-section *,
    .vbd-section *::before,
    .vbd-section *::after {
        animation: none !important;
        transition-duration: 0.01ms !important;
    }

    .vbd-reveal {
        opacity: 1;
        transform: none;
    }
}


/* =====================================
   VOLTCARE WIRING REPAIRS
===================================== */

.vwr-section {
    --vwr-navy: #142B3B;
    --vwr-orange: #F28C28;
    --vwr-text: #53616B;
    --vwr-border: #E6E9EB;
    background: #F7F8F8;
    color: var(--vwr-navy);
    padding: 100px 0;
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.vwr-section *,
.vwr-section *::before,
.vwr-section *::after {
    box-sizing: border-box;
}

.vwr-container {
    width: min(1200px, calc(100% - 60px));
    margin: 0 auto;
}

.vwr-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 45px;
    margin-bottom: 55px;
}

.vwr-eyebrow {
    display: inline-block;
    color: var(--vwr-orange);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 18px;
}

.vwr-heading h2 {
    font-size: clamp(32px, 4vw, 49px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1.8px;
    margin: 0;
}

.vwr-heading h2 span {
    color: var(--vwr-orange);
}

.vwr-heading-text {
    max-width: 390px;
    color: var(--vwr-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
    margin: 0 0 5px;
}

/* MAIN LAYOUT */

.vwr-main-layout {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    align-items: stretch;
    gap: 65px;
}

/* IMAGE SIDE */

.vwr-image-side {
    min-width: 0;
}

.vwr-main-image {
    position: relative;
    height: 510px;
    overflow: hidden;
    background: #DCE1E4;
}

.vwr-main-image::after {
    content: "";
    position: absolute;
    inset: 40% 0 0;
    background: linear-gradient(transparent, rgba(10, 23, 32, 0.72));
    pointer-events: none;
}

.vwr-main-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.vwr-main-image:hover img {
    transform: scale(1.045);
}

.vwr-image-label {
    position: absolute;
    z-index: 2;
    left: 20px;
    bottom: 22px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.2px;
}

.vwr-label-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--vwr-orange);
    box-shadow: 0 0 0 5px rgba(242, 140, 40, 0.18);
}

.vwr-image-bottom {
    background: var(--vwr-navy);
    padding: 25px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.vwr-small-label {
    color: var(--vwr-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.vwr-image-bottom h3 {
    color: #fff;
    font-size: 25px;
    font-weight: 700;
    line-height: 1.4;
    margin: 9px 0 0;
}

.vwr-round-link {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(255,255,255,0.35);
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    text-decoration: none;
    transition: background 0.3s ease, color 0.3s ease;
}

.vwr-round-link:hover {
    background: var(--vwr-orange);
    border-color: var(--vwr-orange);
    color: #fff;
}

/* CONTENT SIDE */

.vwr-content-side {
    padding: 8px 0 0;
    min-width: 0;
}

.vwr-number {
    color: var(--vwr-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.vwr-content-side > h3 {
    font-size: clamp(25px, 3vw, 34px);
    line-height: 1.35;
    letter-spacing: -0.8px;
    font-weight: 800;
    margin: 20px 0 16px;
}

.vwr-description {
    font-size: 15px;
    line-height: 1.9;
    font-weight: 400;
    color: var(--vwr-text);
    margin: 0 0 25px;
}

/* IMAGE-BASED ROWS */

.vwr-service-list {
    border-top: 1px solid var(--vwr-border);
}

.vwr-service-row {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr) 30px;
    gap: 18px;
    align-items: center;
    padding: 18px 0;
    border-bottom: 1px solid var(--vwr-border);
    transition: padding 0.3s ease;
}

.vwr-service-row:hover {
    padding-left: 6px;
    padding-right: 6px;
}

.vwr-service-image {
    height: 78px;
    overflow: hidden;
    background: #DDE1E3;
}

.vwr-service-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.vwr-service-row:hover .vwr-service-image img {
    transform: scale(1.08);
}

.vwr-service-info {
    min-width: 0;
}

.vwr-service-info > span {
    display: block;
    color: var(--vwr-orange);
    font-size: 10px;
    font-weight: 700;
    margin-bottom: 6px;
}

.vwr-service-info h4 {
    color: var(--vwr-navy);
    font-size: 15px;
    line-height: 1.5;
    font-weight: 700;
    margin: 0 0 5px;
}

.vwr-service-info p {
    color: var(--vwr-text);
    font-size: 14px;
    line-height: 1.7;
    font-weight: 400;
    margin: 0;
}

.vwr-service-arrow {
    color: var(--vwr-navy);
    font-size: 14px;
    transition: transform 0.3s ease, color 0.3s ease;
}

.vwr-service-row:hover .vwr-service-arrow {
    color: var(--vwr-orange);
    transform: translateX(4px);
}

/* CTA */

.vwr-cta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-top: 28px;
    padding: 16px 19px;
    background: var(--vwr-orange);
    color: #142B3B;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    transition: background 0.3s ease, color 0.3s ease;
}

.vwr-cta span {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(20,43,59,0.3);
    border-radius: 50%;
    transition: transform 0.3s ease;
}

.vwr-cta:hover {
    background: var(--vwr-navy);
    color: #fff;
}

.vwr-cta:hover span {
    transform: translateX(4px);
    border-color: rgba(255,255,255,0.5);
}

/* BOTTOM STRIP */

.vwr-bottom-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 45px;
    padding-top: 25px;
    border-top: 1px solid var(--vwr-border);
}

.vwr-bottom-strip > p {
    color: var(--vwr-navy);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
    margin: 0;
}

.vwr-bottom-item {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--vwr-text);
    font-size: 12px;
    font-weight: 600;
}

.vwr-bottom-item span {
    color: var(--vwr-orange);
    font-size: 11px;
    font-weight: 800;
}

/* ENTRANCE ANIMATION */

.vwr-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.vwr-reveal.vwr-visible {
    opacity: 1;
    transform: translateY(0);
}

/* TABLET */

@media (max-width: 1024px) {
    .vwr-section {
        padding: 75px 0;
    }

    .vwr-container {
        width: calc(100% - 40px);
    }

    .vwr-heading {
        gap: 25px;
        margin-bottom: 40px;
    }

    .vwr-main-layout {
        gap: 35px;
        grid-template-columns: 0.9fr 1.1fr;
    }

    .vwr-main-image {
        height: 430px;
    }

    .vwr-service-row {
        grid-template-columns: 72px minmax(0, 1fr) 20px;
        gap: 12px;
    }

    .vwr-service-image {
        height: 70px;
    }

    .vwr-image-bottom {
        padding: 22px;
    }

    .vwr-bottom-strip {
        flex-wrap: wrap;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .vwr-section {
        padding: 60px 0;
    }

    .vwr-container {
        width: calc(100% - 32px);
    }

    .vwr-heading {
        display: block;
        margin-bottom: 32px;
    }

    .vwr-heading h2 {
        font-size: 34px;
        letter-spacing: -1px;
    }

    .vwr-heading-text {
        margin-top: 18px;
        font-size: 14px;
    }

    .vwr-main-layout {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .vwr-main-image {
        height: 360px;
    }

    .vwr-image-bottom h3 {
        font-size: 23px;
    }

    .vwr-content-side {
        padding-top: 0;
    }

    .vwr-content-side > h3 {
        font-size: 28px;
    }

    .vwr-service-row {
        grid-template-columns: 82px minmax(0, 1fr) 22px;
        gap: 13px;
    }

    .vwr-service-image {
        height: 76px;
    }

    .vwr-service-info h4 {
        font-size: 13px;
    }

    .vwr-service-info p {
        font-size: 11px;
    }

    .vwr-bottom-strip {
        display: grid;
        grid-template-columns: 1fr;
        gap: 17px;
        margin-top: 30px;
    }
}

@media (max-width: 480px) {
    .vwr-container {
        width: calc(100% - 28px);
    }

    .vwr-heading h2 {
        font-size: 29px;
    }

    .vwr-main-image {
        height: 300px;
    }

    .vwr-image-bottom {
        padding: 20px;
    }

    .vwr-image-bottom h3 {
        font-size: 21px;
    }

    .vwr-service-row {
        grid-template-columns: 70px minmax(0, 1fr) 16px;
        gap: 10px;
        padding: 15px 0;
    }

    .vwr-service-image {
        height: 68px;
    }

    .vwr-service-info h4 {
        font-size: 12px;
    }

    .vwr-service-info p {
        font-size: 10px;
    }

    .vwr-cta {
        font-size: 12px;
        padding: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vwr-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vwr-section *,
    .vwr-section *::before,
    .vwr-section *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}


/* ==========================================
   VOLTCARE - VEHICLE CARE IMAGE SECTION
========================================== */

.vbr-section {
    --vbr-navy: #142B3B;
    --vbr-orange: #F28C28;
    --vbr-text: #5D6972;

    padding: 100px 0;
    background: #FFFFFF;
    color: var(--vbr-navy);
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.vbr-section *,
.vbr-section *::before,
.vbr-section *::after {
    box-sizing: border-box;
}

.vbr-container {
    width: min(1200px, calc(100% - 60px));
    margin: 0 auto;
}

/* CENTERED HEADING */

.vbr-heading {
    max-width: 960px;
    margin: 0 auto 48px;
    text-align: center;
}

.vbr-tag {
    display: inline-block;
    color: var(--vbr-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 17px;
}

.vbr-heading h2 {
    margin: 0;
    color: var(--vbr-navy);
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1.5px;
}

.vbr-heading h2 span {
    color: var(--vbr-orange);
}

.vbr-heading > p {
    max-width: 640px;
    margin: 20px auto 0;
    color: var(--vbr-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* LARGE IMAGE BANNER */

.vbr-hero-image {
    position: relative;
    min-height: 490px;
    overflow: hidden;
    background: #233744;
}

.vbr-hero-image > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 55%;
    transition: transform 0.8s ease;
}

.vbr-hero-image:hover > img {
    transform: scale(1.035);
}

.vbr-image-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(12, 29, 41, 0.94) 0%,
            rgba(12, 29, 41, 0.76) 38%,
            rgba(12, 29, 41, 0.18) 100%
        );
}

.vbr-image-content {
    position: relative;
    z-index: 2;
    max-width: 530px;
    padding: 75px 65px 90px;
}

.vbr-image-content > span {
    display: block;
    color: var(--vbr-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
    margin-bottom: 17px;
}

.vbr-image-content h3 {
    color: #FFFFFF;
    font-size: clamp(30px, 3.5vw, 43px);
    line-height: 1.2;
    letter-spacing: -1px;
    font-weight: 800;
    margin: 0;
}

.vbr-image-content > p {
    color: #E0E6EB;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
    margin: 18px 0 25px;
}

.vbr-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 15px 20px;
    background: var(--vbr-orange);
    color: var(--vbr-navy);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.3s ease, color 0.3s ease;
}

.vbr-button i {
    transition: transform 0.3s ease;
}

.vbr-button:hover {
    background: #FFFFFF;
    color: var(--vbr-navy);
}

.vbr-button:hover i {
    transform: translateX(4px);
}

/* IMAGE CAPTION */

.vbr-image-caption {
    position: absolute;
    z-index: 2;
    right: 28px;
    bottom: 25px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #FFFFFF;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.4px;
}

.vbr-caption-line {
    width: 25px;
    height: 2px;
    background: var(--vbr-orange);
}

/* SERVICE IMAGE ROWS */

.vbr-services {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
    margin-top: 35px;
}

.vbr-service {
    min-width: 0;
    background: #FFFFFF;
    border-bottom: 2px solid #E7EAEC;
    transition: border-color 0.3s ease, transform 0.3s ease;
}

.vbr-service:hover {
    border-color: var(--vbr-orange);
    transform: translateY(-5px);
}

.vbr-service-image {
    position: relative;
    height: 220px;
    overflow: hidden;
    background: #E2E5E7;
}

.vbr-service-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.vbr-service:hover .vbr-service-image img {
    transform: scale(1.05);
}

.vbr-service-number {
    position: absolute;
    left: 16px;
    bottom: 0;
    min-width: 43px;
    padding: 12px 10px;
    background: var(--vbr-orange);
    color: var(--vbr-navy);
    text-align: center;
    font-size: 12px;
    font-weight: 800;
}

.vbr-service-content {
    padding: 22px 20px 25px;
}

.vbr-service-content h4 {
    color: var(--vbr-navy);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    margin: 0 0 10px;
}

.vbr-service-content p {
    color: var(--vbr-text);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.8;
    margin: 0;
}

/* BOTTOM CTA STRIP */

.vbr-bottom-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 45px;
    padding: 30px 35px;
    background: #F4F6F7;
}

.vbr-bottom-cta > div > span {
    display: block;
    color: var(--vbr-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    margin-bottom: 9px;
}

.vbr-bottom-cta h3 {
    color: var(--vbr-navy);
    font-size: 21px;
    line-height: 1.5;
    font-weight: 700;
    margin: 0;
}

.vbr-bottom-button {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 15px;
    padding: 15px 19px;
    background: var(--vbr-navy);
    color: #FFFFFF;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    transition: background 0.3s ease;
}

.vbr-bottom-button:hover {
    background: var(--vbr-orange);
    color: var(--vbr-navy);
}

.vbr-bottom-button i {
    transition: transform 0.3s ease;
}

.vbr-bottom-button:hover i {
    transform: translateX(4px);
}

/* REVEAL ANIMATION */

.vbr-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.vbr-reveal.vbr-visible {
    opacity: 1;
    transform: translateY(0);
}

/* TABLET */

@media (max-width: 1024px) {
    .vbr-section {
        padding: 80px 0;
    }

    .vbr-container {
        width: calc(100% - 40px);
    }

    .vbr-hero-image {
        min-height: 440px;
    }

    .vbr-image-content {
        padding: 65px 45px 85px;
    }

    .vbr-services {
        gap: 18px;
    }

    .vbr-service-image {
        height: 180px;
    }

    .vbr-service-content {
        padding: 19px 16px 22px;
    }

    .vbr-bottom-cta {
        padding: 25px;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .vbr-section {
        padding: 60px 0;
    }

    .vbr-container {
        width: calc(100% - 32px);
    }

    .vbr-heading {
        margin-bottom: 32px;
    }

    .vbr-heading h2 {
        font-size: 33px;
        letter-spacing: -0.8px;
    }

    .vbr-heading > p {
        font-size: 14px;
        margin-top: 15px;
    }

    .vbr-hero-image {
        min-height: 460px;
    }

    .vbr-image-overlay {
        background: linear-gradient(
            90deg,
            rgba(12, 29, 41, 0.91),
            rgba(12, 29, 41, 0.52)
        );
    }

    .vbr-image-content {
        max-width: 100%;
        padding: 60px 25px 95px;
    }

    .vbr-image-content h3 {
        font-size: 34px;
    }

    .vbr-image-caption {
        right: 17px;
        bottom: 20px;
        font-size: 8px;
    }

    .vbr-services {
        grid-template-columns: 1fr;
        gap: 25px;
        margin-top: 28px;
    }

    .vbr-service-image {
        height: 240px;
    }

    .vbr-service-content {
        padding: 20px 18px 23px;
    }

    .vbr-service-content h4 {
        font-size: 16px;
    }

    .vbr-bottom-cta {
        align-items: flex-start;
        flex-direction: column;
        gap: 20px;
        padding: 25px 20px;
        margin-top: 30px;
    }

    .vbr-bottom-cta h3 {
        font-size: 19px;
    }
}

@media (max-width: 480px) {
    .vbr-container {
        width: calc(100% - 28px);
    }

    .vbr-heading h2 {
        font-size: 29px;
    }

    .vbr-tag {
        font-size: 10px;
    }

    .vbr-hero-image {
        min-height: 430px;
    }

    .vbr-image-content {
        padding: 52px 20px 90px;
    }

    .vbr-image-content h3 {
        font-size: 30px;
    }

    .vbr-image-content > p {
        font-size: 13px;
    }

    .vbr-service-image {
        height: 205px;
    }

    .vbr-bottom-button {
        width: 100%;
        justify-content: space-between;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vbr-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vbr-section *,
    .vbr-section *::before,
    .vbr-section *::after {
        transition-duration: 0.01ms !important;
    }
}



/* VOLTCARE PRICING GUIDE BANNER */
.vprice-hero {
    position: relative;
    min-height: 390px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background-image: url("../images/pexels-renee-razumov-2155050841-33814734.jpg");
    background-size: cover;
    background-position: center 55%;
    font-family: 'Montserrat', sans-serif;
}

.vprice-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(20, 43, 59, 0.96) 0%,
        rgba(20, 43, 59, 0.82) 55%,
        rgba(20, 43, 59, 0.45) 100%
    );
}

.vprice-hero-container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 75px 25px;
    color: #ffffff;
}

.vprice-hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: #F28C28;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vprice-hero h1 {
    margin: 0 0 18px;
    color: #ffffff;
    font-size: clamp(36px, 5vw, 58px);
    font-weight: 800;
    line-height: 1.15;
}

.vprice-hero h1 span {
    color: #F28C28;
}

.vprice-hero-container > p {
    max-width: 650px;
    margin: 0 0 25px;
    color: #e1e8ed;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vprice-breadcrumb {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 500;
}

.vprice-breadcrumb a {
    color: #ffffff;
    text-decoration: none;
    transition: color 0.3s ease;
}

.vprice-breadcrumb a:hover {
    color: #F28C28;
}

.vprice-breadcrumb i {
    color: #F28C28;
    font-size: 11px;
}

.vprice-breadcrumb span {
    color: #F28C28;
}

/* RESPONSIVE */
@media (max-width: 767px) {
    .vprice-hero {
        min-height: 340px;
        background-position: center;
    }

    .vprice-hero-container {
        padding: 65px 22px;
    }

    .vprice-hero h1 {
        font-size: 38px;
    }

    .vprice-hero-container > p {
        font-size: 14px;
        line-height: 1.8;
    }
}

@media (max-width: 480px) {
    .vprice-hero {
        min-height: 310px;
    }

    .vprice-hero-container {
        padding: 50px 18px;
    }

    .vprice-hero h1 {
        font-size: 32px;
    }

    .vprice-hero-tag {
        font-size: 10px;
        letter-spacing: 1.5px;
    }
}


/* ======================================
   VOLTCARE PRICING GUIDE SECTION
====================================== */

.vpg-pricing {
    --vpg-navy: #142B3B;
    --vpg-orange: #F28C28;
    --vpg-text: #65717A;

    padding: 100px 0;
    background: #F6F7F8;
    color: var(--vpg-navy);
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.vpg-pricing *,
.vpg-pricing *::before,
.vpg-pricing *::after {
    box-sizing: border-box;
}

.vpg-container {
    width: min(1200px, calc(100% - 60px));
    margin: 0 auto;
}

/* HEADING */

.vpg-heading {
    max-width: 760px;
    margin: 0 auto 50px;
    text-align: center;
}

.vpg-tag {
    display: inline-block;
    margin-bottom: 16px;
    color: var(--vpg-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vpg-heading h2 {
    margin: 0;
    color: var(--vpg-navy);
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.25;
    font-weight: 800;
    letter-spacing: -1px;
}

.vpg-heading h2 span {
    color: var(--vpg-orange);
}

.vpg-heading > p {
    max-width: 650px;
    margin: 18px auto 0;
    color: var(--vpg-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* PRICING GRID */

.vpg-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    align-items: stretch;
}

.vpg-card {
    min-width: 0;
    background: #FFFFFF;
    border: 1px solid #E7EAEC;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.vpg-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 18px 45px rgba(20, 43, 59, 0.10);
}

.vpg-card-featured {
    border-top: 3px solid var(--vpg-orange);
}

/* CARD IMAGE */

.vpg-image {
    position: relative;
    height: 225px;
    overflow: hidden;
    background: #DDE2E5;
}

.vpg-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.vpg-card:hover .vpg-image img {
    transform: scale(1.06);
}

.vpg-image-number {
    position: absolute;
    bottom: 0;
    left: 20px;
    min-width: 42px;
    padding: 12px 10px;
    background: var(--vpg-orange);
    color: var(--vpg-navy);
    font-size: 12px;
    font-weight: 800;
    text-align: center;
}

.vpg-popular {
    position: absolute;
    top: 15px;
    right: 15px;
    padding: 9px 11px;
    background: var(--vpg-orange);
    color: var(--vpg-navy);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}

/* CARD CONTENT */

.vpg-card-content {
    padding: 27px 23px 25px;
}

.vpg-category {
    color: var(--vpg-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.vpg-card-content h3 {
    margin: 12px 0 10px;
    color: var(--vpg-navy);
    font-size: 21px;
    font-weight: 800;
    line-height: 1.4;
}

.vpg-card-content > p {
    min-height: 78px;
    margin: 0;
    color: var(--vpg-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

/* PRICE */

.vpg-price {
    display: flex;
    flex-direction: column;
    gap: 5px;
   
    padding: 17px 0;
    border-top: 1px solid #E7EAEC;
    border-bottom: 1px solid #E7EAEC;
}

.vpg-price span {
    color: var(--vpg-text);
    font-size: 11px;
    font-weight: 500;
}

.vpg-price strong {
    color: var(--vpg-navy);
    font-size: 27px;
    font-weight: 800;
}

/* SERVICE LIST */

.vpg-list {
    display: flex;
    flex-direction: column;
    gap: 13px;
    margin: 22px 0;
    padding: 0;
    list-style: none;
}

.vpg-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: var(--vpg-text);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
}

.vpg-list li i {
    margin-top: 3px;
    color: var(--vpg-orange);
    font-size: 12px;
}

/* CARD LINK */

.vpg-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding-top: 17px;
    border-top: 1px solid #E7EAEC;
    color: var(--vpg-navy);
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
}

.vpg-link i {
    color: var(--vpg-orange);
    transition: transform 0.3s ease;
}

.vpg-link:hover {
    color: var(--vpg-orange);
}

.vpg-link:hover i {
    transform: translateX(5px);
}

/* BOTTOM ESTIMATE STRIP */

.vpg-note {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr) auto;
    align-items: center;
    gap: 28px;
    margin-top: 45px;
    padding: 25px;
    background: var(--vpg-navy);
}

.vpg-note-image {
    height: 130px;
    overflow: hidden;
    background: #354A58;
}

.vpg-note-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.vpg-note-content > span {
    display: block;
    margin-bottom: 9px;
    color: var(--vpg-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vpg-note-content h3 {
    margin: 0 0 9px;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.45;
}

.vpg-note-content p {
    max-width: 560px;
    margin: 0;
    color: #D3DDE3;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

.vpg-note-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 15px 18px;
    background: var(--vpg-orange);
    color: var(--vpg-navy);
    text-decoration: none;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 700;
    transition: background 0.3s ease;
}

.vpg-note-button:hover {
    background: #FFFFFF;
}

.vpg-note-button i {
    transition: transform 0.3s ease;
}

.vpg-note-button:hover i {
    transform: translateX(4px);
}

/* REVEAL ANIMATION */

.vpg-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.vpg-reveal.vpg-visible {
    opacity: 1;
    transform: translateY(0);
}

/* TABLET */

@media (max-width: 1024px) {
    .vpg-pricing {
        padding: 80px 0;
    }

    .vpg-container {
        width: calc(100% - 40px);
    }

    .vpg-grid {
        gap: 16px;
    }

    .vpg-image {
        height: 180px;
    }

    .vpg-card-content {
        padding: 22px 17px;
    }

    .vpg-card-content h3 {
        font-size: 18px;
    }

    .vpg-note {
        grid-template-columns: 120px minmax(0, 1fr);
    }

    .vpg-note-button {
        grid-column: 2;
        justify-self: start;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .vpg-pricing {
        padding: 60px 0;
    }

    .vpg-container {
        width: calc(100% - 32px);
    }

    .vpg-heading {
        margin-bottom: 32px;
    }

    .vpg-heading h2 {
        font-size: 31px;
    }

    .vpg-heading > p {
        font-size: 14px;
    }

    .vpg-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .vpg-image {
        height: 240px;
    }

    .vpg-card-content {
        padding: 24px 21px;
    }

    .vpg-card-content h3 {
        font-size: 21px;
    }

    .vpg-card-content > p {
        min-height: 0;
    }

    .vpg-note {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 20px;
        margin-top: 30px;
    }

    .vpg-note-image {
        height: 190px;
    }

    .vpg-note-button {
        grid-column: auto;
        justify-self: stretch;
    }
}

@media (max-width: 480px) {
    .vpg-container {
        width: calc(100% - 28px);
    }

    .vpg-heading h2 {
        font-size: 27px;
    }

    .vpg-image {
        height: 210px;
    }

    .vpg-note-content h3 {
        font-size: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vpg-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vpg-pricing *,
    .vpg-pricing *::before,
    .vpg-pricing *::after {
        transition-duration: 0.01ms !important;
    }
}




/* =========================================
   VOLTCARE PRICING PROCESS
   Premium Editorial Layout
========================================= */

.vpp-section {
    --vpp-navy: #142B3B;
    --vpp-orange: #F28C28;
    --vpp-text: #65717A;
    --vpp-border: #E2E6E9;

    padding: 100px 0;
    background: #FFFFFF;
    color: var(--vpp-navy);
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.vpp-section *,
.vpp-section *::before,
.vpp-section *::after {
    box-sizing: border-box;
}

.vpp-container {
    width: min(1200px, calc(100% - 60px));
    margin: 0 auto;
}

/* INTRO */

.vpp-intro {
    display: grid;
    grid-template-columns: 1fr 0.8fr;
    align-items: end;
    gap: 70px;
    margin-bottom: 45px;
}

.vpp-eyebrow {
    display: inline-block;
    margin-bottom: 17px;
    color: var(--vpp-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.vpp-intro h2 {
    margin: 0;
    color: var(--vpp-navy);
    font-size: clamp(32px, 4vw, 46px);
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: -1.2px;
}

.vpp-intro h2 span {
    color: var(--vpp-orange);
}

.vpp-intro-right {
    padding-bottom: 5px;
}

.vpp-intro-right p {
    margin: 0;
    color: var(--vpp-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* ASYMMETRIC FEATURE */

.vpp-feature {
    display: grid;
    grid-template-columns: 1.35fr 0.85fr;
    gap: 22px;
    align-items: stretch;
}

.vpp-feature-main {
    position: relative;
    min-height: 480px;
    overflow: hidden;
    background: #D9DEE1;
}

.vpp-feature-main > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.vpp-feature-main:hover > img {
    transform: scale(1.04);
}

.vpp-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        0deg,
        rgba(13, 29, 40, 0.93) 0%,
        rgba(13, 29, 40, 0.3) 48%,
        rgba(13, 29, 40, 0.02) 100%
    );
}

.vpp-feature-caption {
    position: absolute;
    right: 30px;
    bottom: 32px;
    left: 30px;
}

.vpp-feature-caption > span {
    display: block;
    margin-bottom: 13px;
    color: var(--vpp-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vpp-feature-caption h3 {
    max-width: 460px;
    margin: 0;
    color: #FFFFFF;
    font-size: clamp(24px, 3vw, 34px);
    font-weight: 700;
    line-height: 1.35;
}

/* SIDE CONTENT */

.vpp-feature-side {
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #F5F7F8;
}

.vpp-side-image {
    height: 215px;
    overflow: hidden;
    background: #D9DEE1;
}

.vpp-side-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.vpp-feature-side:hover .vpp-side-image img {
    transform: scale(1.04);
}

.vpp-side-content {
    flex: 1;
    padding: 30px;
}

.vpp-side-label {
    color: var(--vpp-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vpp-side-content h3 {
    margin: 14px 0 12px;
    color: var(--vpp-navy);
    font-size: 24px;
    font-weight: 800;
    line-height: 1.4;
}

.vpp-side-content p {
    margin: 0;
    color: var(--vpp-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

.vpp-text-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: 23px;
    padding-bottom: 7px;
    border-bottom: 1px solid var(--vpp-orange);
    color: var(--vpp-navy);
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
}

.vpp-text-link i {
    color: var(--vpp-orange);
    transition: transform 0.3s ease;
}

.vpp-text-link:hover i {
    transform: translate(3px, -3px);
}

/* TIMELINE */

.vpp-process {
    margin-top: 85px;
}

.vpp-process-heading {
    margin-bottom: 32px;
}

.vpp-process-heading h3 {
    margin: 0;
    color: var(--vpp-navy);
    font-size: 28px;
    font-weight: 800;
    line-height: 1.4;
}

.vpp-timeline {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--vpp-border);
    border-bottom: 1px solid var(--vpp-border);
}

.vpp-step {
    position: relative;
    padding: 28px 22px 30px 0;
    min-width: 0;
}

.vpp-step + .vpp-step {
    padding-left: 22px;
    border-left: 1px solid var(--vpp-border);
}

.vpp-step-number {
    display: inline-block;
    margin-bottom: 22px;
    color: var(--vpp-orange);
    font-size: 27px;
    font-weight: 800;
    letter-spacing: -1px;
}

.vpp-step-content h4 {
    margin: 0 0 10px;
    color: var(--vpp-navy);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
}

.vpp-step-content p {
    margin: 0;
    color: var(--vpp-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

/* FOOTER STRIP */

.vpp-footer {
    display: grid;
    grid-template-columns: 60px minmax(0, 1fr) auto;
    align-items: center;
    gap: 25px;
    margin-top: 35px;
    padding: 24px 28px;
    background: var(--vpp-navy);
}

.vpp-footer-mark {
    display: grid;
    place-items: center;
    width: 55px;
    height: 55px;
    background: var(--vpp-orange);
    color: var(--vpp-navy);
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -1px;
}

.vpp-footer > p {
    margin: 0;
    color: #E1E8ED;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}

.vpp-footer-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.vpp-footer-link i {
    color: var(--vpp-orange);
    transition: transform 0.3s ease;
}

.vpp-footer-link:hover i {
    transform: translateX(5px);
}

/* REVEAL ANIMATION */

.vpp-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.vpp-reveal.vpp-visible {
    opacity: 1;
    transform: translateY(0);
}

/* TABLET */

@media (max-width: 1024px) {
    .vpp-section {
        padding: 80px 0;
    }

    .vpp-container {
        width: calc(100% - 40px);
    }

    .vpp-intro {
        gap: 35px;
    }

    .vpp-feature {
        grid-template-columns: 1.1fr 0.9fr;
        gap: 16px;
    }

    .vpp-feature-main {
        min-height: 440px;
    }

    .vpp-side-image {
        height: 180px;
    }

    .vpp-side-content {
        padding: 23px;
    }

    .vpp-side-content h3 {
        font-size: 21px;
    }

    .vpp-step {
        padding-right: 14px;
    }

    .vpp-step + .vpp-step {
        padding-left: 14px;
    }

    .vpp-step-content h4 {
        font-size: 15px;
    }

    .vpp-footer {
        gap: 18px;
        padding: 22px;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .vpp-section {
        padding: 60px 0;
    }

    .vpp-container {
        width: calc(100% - 32px);
    }

    .vpp-intro {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-bottom: 30px;
    }

    .vpp-intro h2 {
        font-size: 32px;
    }

    .vpp-intro-right p {
        font-size: 15px;
    }

    .vpp-feature {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .vpp-feature-main {
        min-height: 380px;
    }

    .vpp-feature-caption {
        right: 22px;
        bottom: 24px;
        left: 22px;
    }

    .vpp-feature-caption h3 {
        font-size: 27px;
    }

    .vpp-side-image {
        height: 220px;
    }

    .vpp-side-content {
        padding: 25px;
    }

    .vpp-side-content h3 {
        font-size: 23px;
    }

    .vpp-process {
        margin-top: 55px;
    }

    .vpp-process-heading h3 {
        font-size: 25px;
    }

    .vpp-timeline {
        grid-template-columns: 1fr 1fr;
    }

    .vpp-step {
        padding: 24px 15px 24px 0;
    }

    .vpp-step + .vpp-step {
        padding-left: 15px;
    }

    .vpp-step:nth-child(3) {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid var(--vpp-border);
    }

    .vpp-step:nth-child(4) {
        border-top: 1px solid var(--vpp-border);
    }

    .vpp-step-number {
        margin-bottom: 14px;
    }

    .vpp-step-content h4 {
        font-size: 16px;
    }

    .vpp-footer {
        grid-template-columns: 55px minmax(0, 1fr);
        gap: 17px;
        padding: 20px;
    }

    .vpp-footer-mark {
        width: 50px;
        height: 50px;
    }

    .vpp-footer > p {
        font-size: 15px;
    }

    .vpp-footer-link {
        grid-column: 2;
        justify-self: start;
    }
}

/* SMALL MOBILE */

@media (max-width: 480px) {
    .vpp-container {
        width: calc(100% - 28px);
    }

    .vpp-intro h2 {
        font-size: 28px;
    }

    .vpp-feature-main {
        min-height: 330px;
    }

    .vpp-feature-caption h3 {
        font-size: 24px;
    }

    .vpp-timeline {
        grid-template-columns: 1fr;
    }

    .vpp-step,
    .vpp-step + .vpp-step,
    .vpp-step:nth-child(3),
    .vpp-step:nth-child(4) {
        padding: 22px 0;
        border-left: none;
        border-top: 1px solid var(--vpp-border);
    }

    .vpp-step:first-child {
        border-top: none;
    }

    .vpp-step-number {
        margin-bottom: 10px;
    }

    .vpp-footer {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .vpp-footer-link {
        grid-column: auto;
    }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
    .vpp-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vpp-section *,
    .vpp-section *::before,
    .vpp-section *::after {
        transition-duration: 0.01ms !important;
    }
}


/* ================= CUSTOMER REVIEWS ================= */

.vcr-section {
    --vcr-navy: #142B3B;
    --vcr-orange: #F28C28;
    --vcr-text: #4D5B65;
    --vcr-border: #E6E9EB;

    position: relative;
    width: 100%;
    padding: 100px 24px;
    background: #FFFFFF;
    color: var(--vcr-navy);
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.vcr-section *,
.vcr-section *::before,
.vcr-section *::after {
    box-sizing: border-box;
}

.vcr-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Heading */

.vcr-heading {
    display: grid;
    grid-template-columns: 1.1fr 0.75fr;
    gap: 65px;
    align-items: end;
    margin-bottom: 48px;
}

.vcr-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 19px;
    color: var(--vcr-orange);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.vcr-tag-line {
    width: 30px;
    height: 2px;
    background: var(--vcr-orange);
}

.vcr-heading h2 {
    margin: 0;
    color: var(--vcr-navy);
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.5px;
}

.vcr-heading h2 span {
    color: var(--vcr-orange);
}

.vcr-heading-right > p {
    margin: 0 0 25px;
    color: var(--vcr-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vcr-rating {
    display: flex;
    align-items: center;
    gap: 17px;
    padding-top: 19px;
    border-top: 1px solid var(--vcr-border);
}

.vcr-stars {
    color: var(--vcr-orange);
    font-size: 18px;
    letter-spacing: 3px;
    white-space: nowrap;
}

.vcr-rating strong,
.vcr-rating span {
    display: block;
}

.vcr-rating strong {
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 700;
}

.vcr-rating span {
    color: var(--vcr-text);
    font-size: 12px;
    font-weight: 400;
}

/* Featured testimonial */

.vcr-feature {
    display: grid;
    grid-template-columns: 1fr 0.92fr;
    min-height: 440px;
    background: #F5F6F7;
}

.vcr-feature-image {
    position: relative;
    min-height: 440px;
    overflow: hidden;
}

.vcr-feature-image img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 440px;
    position: absolute;
    inset: 0;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.vcr-feature:hover .vcr-feature-image img {
    transform: scale(1.045);
}

.vcr-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        transparent 40%,
        rgba(20, 43, 59, 0.78) 100%
    );
}

.vcr-image-label {
    position: absolute;
    left: 30px;
    bottom: 30px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vcr-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--vcr-orange);
    box-shadow: 0 0 0 5px rgba(242, 140, 40, 0.2);
}

.vcr-feature-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 48px 48px 42px;
    overflow: hidden;
}

.vcr-quote-mark {
    position: absolute;
    top: 12px;
    right: 28px;
    color: rgba(242, 140, 40, 0.14);
    font-family: Georgia, serif;
    font-size: 160px;
    line-height: 1;
    pointer-events: none;
}

.vcr-feature-content .vcr-stars {
    margin-bottom: 21px;
}

.vcr-feature-content blockquote {
    position: relative;
    z-index: 1;
    margin: 0 0 22px;
    color: var(--vcr-navy);
    font-size: clamp(20px, 2.1vw, 27px);
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: -0.5px;
}

.vcr-review-note {
    margin: 0 0 30px;
    color: var(--vcr-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
}

.vcr-reviewer {
    display: flex;
    align-items: center;
    gap: 13px;
    width: 100%;
    padding-top: 22px;
    border-top: 1px solid #DDE1E4;
}

.vcr-reviewer-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--vcr-navy);
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 700;
}

.vcr-reviewer-info {
    flex: 1;
    min-width: 0;
}

.vcr-reviewer-info strong,
.vcr-reviewer-info span {
    display: block;
}

.vcr-reviewer-info strong {
    margin-bottom: 5px;
    color: var(--vcr-navy);
    font-size: 13px;
    font-weight: 700;
}

.vcr-reviewer-info span {
    color: var(--vcr-text);
    font-size: 12px;
    font-weight: 400;
}

.vcr-verified {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--vcr-orange);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.5px;
}

.vcr-verified i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border: 1px solid var(--vcr-orange);
    border-radius: 50%;
    font-size: 11px;
}

/* Highlights */

.vcr-highlights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 30px;
    border-top: 1px solid var(--vcr-border);
    border-bottom: 1px solid var(--vcr-border);
}

.vcr-highlight {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding: 27px 24px;
    border-right: 1px solid var(--vcr-border);
}

.vcr-highlight:first-child {
    padding-left: 0;
}

.vcr-highlight:last-child {
    border-right: 0;
}

.vcr-highlight-number {
    color: var(--vcr-orange);
    font-size: 13px;
    font-weight: 700;
}

.vcr-highlight h3 {
    margin: 0 0 8px;
    color: var(--vcr-navy);
    font-size: 15px;
    font-weight: 700;
}

.vcr-highlight p {
    margin: 0;
    color: var(--vcr-text);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

/* CTA */

.vcr-bottom-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 35px;
    padding: 28px 32px;
    background: var(--vcr-navy);
}

.vcr-bottom-cta > div > span {
    display: block;
    margin-bottom: 9px;
    color: var(--vcr-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vcr-bottom-cta h3 {
    margin: 0;
    color: #FFFFFF;
    font-size: clamp(19px, 2.3vw, 25px);
    font-weight: 700;
    line-height: 1.4;
}

.vcr-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    flex-shrink: 0;
    min-height: 49px;
    padding: 0 23px;
    background: var(--vcr-orange);
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.3s ease, transform 0.3s ease;
}

.vcr-cta-button:hover {
    background: #DB7416;
    color: #FFFFFF;
    transform: translateY(-3px);
}

.vcr-cta-button i {
    transition: transform 0.3s ease;
}

.vcr-cta-button:hover i {
    transform: translateX(4px);
}

/* Entrance animation */

.vcr-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.vcr-reveal.vcr-visible {
    opacity: 1;
    transform: translateY(0);
}

/* ================= RESPONSIVE ================= */

@media (max-width: 1024px) {
    .vcr-section {
        padding: 80px 22px;
    }

    .vcr-heading {
        gap: 35px;
    }

    .vcr-feature-content {
        padding: 35px 30px;
    }

    .vcr-feature,
    .vcr-feature-image,
    .vcr-feature-image img {
        min-height: 400px;
    }

    .vcr-highlight {
        padding: 23px 16px;
        gap: 12px;
    }
}

@media (max-width: 767px) {
    .vcr-section {
        padding: 65px 20px;
    }

    .vcr-heading {
        grid-template-columns: 1fr;
        gap: 23px;
        margin-bottom: 32px;
    }

    .vcr-heading h2 {
        font-size: 34px;
        letter-spacing: -1px;
    }

    .vcr-heading-right > p {
        margin-bottom: 20px;
    }

    .vcr-feature {
        grid-template-columns: 1fr;
    }

    .vcr-feature-image,
    .vcr-feature-image img {
        position: relative;
        min-height: 320px;
        height: 320px;
    }

    .vcr-feature-image img {
        position: absolute;
    }

    .vcr-feature-content {
        padding: 34px 25px;
    }

    .vcr-feature-content blockquote {
        font-size: 23px;
    }

    .vcr-highlights {
        grid-template-columns: 1fr;
        margin-top: 25px;
    }

    .vcr-highlight,
    .vcr-highlight:first-child {
        padding: 21px 0;
        border-right: 0;
        border-bottom: 1px solid var(--vcr-border);
    }

    .vcr-highlight:last-child {
        border-bottom: 0;
    }

    .vcr-bottom-cta {
        align-items: flex-start;
        flex-direction: column;
        padding: 27px 23px;
    }
}

@media (max-width: 480px) {
    .vcr-section {
        padding: 52px 16px;
    }

    .vcr-heading h2 {
        font-size: 29px;
    }

    .vcr-tag {
        font-size: 10px;
        letter-spacing: 1.3px;
    }

    .vcr-feature-image,
    .vcr-feature-image img {
        min-height: 260px;
        height: 260px;
    }

    .vcr-image-label {
        left: 20px;
        bottom: 22px;
        font-size: 9px;
    }

    .vcr-feature-content {
        padding: 29px 20px;
    }

    .vcr-feature-content blockquote {
        font-size: 21px;
    }

    .vcr-reviewer {
        flex-wrap: wrap;
    }

    .vcr-verified {
        margin-left: auto;
    }

    .vcr-bottom-cta {
        padding: 24px 20px;
    }

    .vcr-cta-button {
        width: 100%;
    }
}

/* Reduced motion accessibility */

@media (prefers-reduced-motion: reduce) {
    .vcr-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vcr-feature-image img,
    .vcr-cta-button,
    .vcr-cta-button i {
        transition: none;
    }
}

/* ==========================================
   VOLTCARE - REPAIR COST FACTORS
   ========================================== */

.vrcf-section {
    --vrcf-navy: #142B3B;
    --vrcf-orange: #F28C28;
    --vrcf-text: #53616B;
    --vrcf-border: #DCE2E6;

    position: relative;
    width: 100%;
    padding: 100px 24px;
    background: #F5F6F7;
    color: var(--vrcf-navy);
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.vrcf-section *,
.vrcf-section *::before,
.vrcf-section *::after {
    box-sizing: border-box;
}

.vrcf-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* TOP INTRO */

.vrcf-top {
    display: grid;
    grid-template-columns: 1.1fr 0.65fr;
    gap: 70px;
    align-items: end;
    margin-bottom: 55px;
}

.vrcf-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 21px;
    color: var(--vrcf-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.vrcf-eyebrow-mark {
    display: inline-block;
    width: 28px;
    height: 2px;
    background: var(--vrcf-orange);
}

.vrcf-title-area h2 {
    margin: 0;
    color: var(--vrcf-navy);
    font-size: clamp(32px, 4.2vw, 49px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.7px;
}

.vrcf-title-area h2 span {
    color: var(--vrcf-orange);
}

.vrcf-intro {
    padding-left: 25px;
    border-left: 2px solid var(--vrcf-orange);
}

.vrcf-intro-number {
    display: block;
    margin-bottom: 15px;
    color: var(--vrcf-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vrcf-intro p {
    margin: 0 0 20px;
    color: var(--vrcf-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vrcf-text-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--vrcf-navy);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.vrcf-text-link i {
    color: var(--vrcf-orange);
    transition: transform 0.3s ease;
}

.vrcf-text-link:hover {
    color: var(--vrcf-orange);
}

.vrcf-text-link:hover i {
    transform: translate(3px, -3px);
}

/* MAIN LAYOUT */

.vrcf-main {
    display: grid;
    grid-template-columns: 0.88fr 1.12fr;
    min-height: 570px;
    background: #FFFFFF;
}

/* IMAGE PANEL */

.vrcf-visual {
    position: relative;
    min-height: 570px;
    overflow: hidden;
    background: var(--vrcf-navy);
}

.vrcf-visual > img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.vrcf-visual:hover > img {
    transform: scale(1.045);
}

.vrcf-visual-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(20, 43, 59, 0.45) 0%,
        rgba(20, 43, 59, 0.08) 38%,
        rgba(20, 43, 59, 0.9) 100%
    );
}

.vrcf-visual-top {
    position: absolute;
    top: 27px;
    left: 27px;
    right: 27px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vrcf-visual-top i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 39px;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 50%;
    color: var(--vrcf-orange);
    font-size: 14px;
}

.vrcf-visual-caption {
    position: absolute;
    right: 30px;
    bottom: 55px;
    left: 30px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.vrcf-caption-line {
    flex: 0 0 3px;
    min-height: 54px;
    background: var(--vrcf-orange);
}

.vrcf-visual-caption p {
    max-width: 320px;
    margin: 0;
    color: #FFFFFF;
    font-size: clamp(19px, 2.1vw, 25px);
    font-weight: 600;
    line-height: 1.55;
}

.vrcf-image-index {
    position: absolute;
    right: 26px;
    bottom: 22px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* FACTOR LIST */

.vrcf-factors {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 15px 35px;
}

.vrcf-factor {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 42px;
    align-items: start;
    gap: 16px;
    padding: 25px 0;
    border-bottom: 1px solid var(--vrcf-border);
    transition: padding-left 0.3s ease;
}

.vrcf-factor:last-child {
    border-bottom: 0;
}

.vrcf-factor:hover {
    padding-left: 5px;
}

.vrcf-factor-index {
    padding-top: 2px;
    color: var(--vrcf-orange);
    font-size: 12px;
    font-weight: 700;
}

.vrcf-factor-content {
    min-width: 0;
}

.vrcf-factor-label {
    display: block;
    margin-bottom: 8px;
    color: #7A858D;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.4px;
}

.vrcf-factor-content h3 {
    margin: 0 0 9px;
    color: var(--vrcf-navy);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
}

.vrcf-factor-content p {
    margin: 0;
    color: var(--vrcf-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.75;
}

.vrcf-factor-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-top: 5px;
    border: 1px solid var(--vrcf-border);
    border-radius: 50%;
    color: var(--vrcf-orange);
    font-size: 15px;
    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease;
}

.vrcf-factor:hover .vrcf-factor-icon {
    background: var(--vrcf-orange);
    border-color: var(--vrcf-orange);
    color: #FFFFFF;
}

/* BOTTOM NOTE */

.vrcf-note {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr) auto;
    align-items: center;
    gap: 20px;
    margin-top: 28px;
    padding: 25px 28px;
    background: var(--vrcf-navy);
}

.vrcf-note-symbol {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    border: 1px solid rgba(242, 140, 40, 0.65);
    border-radius: 50%;
    color: var(--vrcf-orange);
    font-size: 17px;
}

.vrcf-note-content strong {
    display: block;
    margin-bottom: 7px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 700;
}

.vrcf-note-content p {
    margin: 0;
    color: #C7D0D6;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

.vrcf-note-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 47px;
    padding: 0 20px;
    background: var(--vrcf-orange);
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

.vrcf-note-button:hover {
    background: #DB7416;
    color: #FFFFFF;
    transform: translateY(-2px);
}

.vrcf-note-button i {
    transition: transform 0.3s ease;
}

.vrcf-note-button:hover i {
    transform: translateX(4px);
}

/* ENTRANCE ANIMATION */

.vrcf-reveal {
    opacity: 0;
    transform: translateY(25px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.vrcf-reveal.vrcf-visible {
    opacity: 1;
    transform: translateY(0);
}

/* ==========================================
   RESPONSIVE - TABLET
   ========================================== */

@media (max-width: 1024px) {

    .vrcf-section {
        padding: 80px 22px;
    }

    .vrcf-top {
        grid-template-columns: 1fr 0.8fr;
        gap: 35px;
        margin-bottom: 40px;
    }

    .vrcf-main {
        grid-template-columns: 0.8fr 1.2fr;
    }

    .vrcf-visual {
        min-height: 600px;
    }

    .vrcf-factors {
        padding: 12px 23px;
    }

    .vrcf-factor {
        grid-template-columns: 25px minmax(0, 1fr) 35px;
        gap: 11px;
        padding: 22px 0;
    }

    .vrcf-factor-icon {
        width: 35px;
        height: 35px;
        font-size: 13px;
    }

    .vrcf-factor-content h3 {
        font-size: 15px;
    }

    .vrcf-note {
        gap: 14px;
        padding: 22px;
    }

    .vrcf-note-button {
        padding: 0 14px;
    }
}

/* ==========================================
   RESPONSIVE - MOBILE
   ========================================== */

@media (max-width: 767px) {

    .vrcf-section {
        padding: 65px 20px;
    }

    .vrcf-top {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-bottom: 32px;
    }

    .vrcf-title-area h2 {
        font-size: 35px;
        letter-spacing: -1px;
    }

    .vrcf-intro {
        padding-left: 18px;
    }

    .vrcf-main {
        grid-template-columns: 1fr;
    }

    .vrcf-visual {
        min-height: 360px;
    }

    .vrcf-factors {
        padding: 10px 24px;
    }

    .vrcf-factor {
        grid-template-columns: 28px minmax(0, 1fr) 38px;
        gap: 13px;
        padding: 24px 0;
    }

    .vrcf-factor-icon {
        width: 38px;
        height: 38px;
    }

    .vrcf-factor-content h3 {
        font-size: 16px;
    }

    .vrcf-note {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 14px;
        padding: 23px;
    }

    .vrcf-note-button {
        grid-column: 1 / -1;
        width: 100%;
        margin-top: 5px;
    }
}

/* ==========================================
   RESPONSIVE - SMALL MOBILE
   ========================================== */

@media (max-width: 480px) {

    .vrcf-section {
        padding: 52px 16px;
    }

    .vrcf-eyebrow {
        font-size: 9px;
        letter-spacing: 1.1px;
    }

    .vrcf-title-area h2 {
        font-size: 29px;
    }

    .vrcf-intro p {
        font-size: 15px;
    }

    .vrcf-visual {
        min-height: 300px;
    }

    .vrcf-visual-top {
        top: 20px;
        left: 20px;
        right: 20px;
    }

    .vrcf-visual-caption {
        right: 20px;
        bottom: 45px;
        left: 20px;
    }

    .vrcf-visual-caption p {
        font-size: 19px;
    }

    .vrcf-factors {
        padding: 5px 17px;
    }

    .vrcf-factor {
        grid-template-columns: 23px minmax(0, 1fr) 32px;
        gap: 9px;
        padding: 21px 0;
    }

    .vrcf-factor-icon {
        width: 32px;
        height: 32px;
        font-size: 12px;
    }

    .vrcf-factor-content h3 {
        font-size: 14px;
    }

    .vrcf-factor-content p {
        font-size: 15px;
    }

    .vrcf-note {
        grid-template-columns: 1fr;
        padding: 21px;
    }

    .vrcf-note-content strong {
        font-size: 13px;
    }

    .vrcf-note-button {
        grid-column: auto;
    }
}

/* ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {
    .vrcf-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vrcf-visual > img,
    .vrcf-factor,
    .vrcf-factor-icon,
    .vrcf-text-link,
    .vrcf-note-button {
        transition: none;
    }
}


/* VOLTCARE CONTACT PAGE BANNER */

.vcontact-banner {
    position: relative;
    min-height: 390px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background-image: url("../images/pexels-helen1-10446282.jpg");
    background-size: cover;
    background-position: center 55%;
    font-family: 'Montserrat', sans-serif;
}

.vcontact-banner *,
.vcontact-banner *::before,
.vcontact-banner *::after {
    box-sizing: border-box;
}

.vcontact-banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(20, 43, 59, 0.95) 0%,
        rgba(20, 43, 59, 0.78) 55%,
        rgba(20, 43, 59, 0.55) 100%
    );
}

.vcontact-banner-container {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 65px 24px;
}

.vcontact-banner-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: #F28C28;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vcontact-banner-tag i {
    font-size: 14px;
}

.vcontact-banner-container h1 {
    margin: 0 0 18px;
    color: #FFFFFF;
    font-size: clamp(36px, 5vw, 54px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1px;
}

.vcontact-banner-container h1 span {
    color: #F28C28;
}

.vcontact-banner-container > p {
    max-width: 650px;
    margin: 0;
    color: #F0F3F5;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vcontact-banner-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 500;
}

.vcontact-banner-breadcrumb a {
    color: #FFFFFF;
    text-decoration: none;
    transition: color 0.3s ease;
}

.vcontact-banner-breadcrumb a:hover {
    color: #F28C28;
}

.vcontact-banner-breadcrumb i {
    color: #F28C28;
    font-size: 11px;
}

.vcontact-banner-breadcrumb span {
    color: #F28C28;
    font-weight: 600;
}

/* TABLET */

@media (max-width: 1024px) {
    .vcontact-banner {
        min-height: 360px;
    }

    .vcontact-banner-container {
        padding: 55px 30px;
    }
}

/* MOBILE */

@media (max-width: 767px) {
    .vcontact-banner {
        min-height: 330px;
        background-position: center;
    }

    .vcontact-banner-container {
        padding: 48px 22px;
    }

    .vcontact-banner-container h1 {
        font-size: 38px;
    }

    .vcontact-banner-container > p {
        font-size: 15px;
        line-height: 1.8;
    }
}

/* SMALL MOBILE */

@media (max-width: 480px) {
    .vcontact-banner {
        min-height: 310px;
    }

    .vcontact-banner-container {
        padding: 40px 18px;
    }

    .vcontact-banner-tag {
        font-size: 10px;
        letter-spacing: 1.2px;
    }

    .vcontact-banner-container h1 {
        font-size: 32px;
    }

    .vcontact-banner-breadcrumb {
        gap: 9px;
        font-size: 11px;
    }
}



/* ==========================================
   VOLTCARE PREMIUM BOOKING FORM
========================================== */

.vcbook-section {
    --vcbook-navy: #142B3B;
    --vcbook-orange: #F28C28;
    --vcbook-text: #5D6972;
    --vcbook-border: #E1E6E9;

    width: 100%;
    padding: 100px 24px;
    background: #F5F6F7;
    color: var(--vcbook-navy);
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.vcbook-section *,
.vcbook-section *::before,
.vcbook-section *::after {
    box-sizing: border-box;
}

.vcbook-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* INTRO */

.vcbook-intro {
    max-width: 780px;
    margin: 0 auto 48px;
    text-align: center;
}

.vcbook-eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 18px;
    color: var(--vcbook-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.vcbook-eyebrow-line {
    width: 28px;
    height: 2px;
    background: var(--vcbook-orange);
}

.vcbook-intro h2 {
    margin: 0 0 18px;
    color: var(--vcbook-navy);
    font-size: clamp(31px, 4vw, 46px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.4px;
}

.vcbook-intro h2 span {
    color: var(--vcbook-orange);
}

.vcbook-intro > p {
    max-width: 640px;
    margin: 0 auto;
    color: var(--vcbook-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* MAIN LAYOUT */

.vcbook-layout {
    display: grid;
    grid-template-columns: 0.78fr 1.22fr;
    align-items: stretch;
    background: #FFFFFF;
    border: 1px solid #E5E9EC;
    box-shadow: 0 22px 65px rgba(20, 43, 59, 0.08);
}

/* IMAGE PANEL */

.vcbook-visual {
    position: relative;
    min-height: 750px;
    overflow: hidden;
    background: var(--vcbook-navy);
}

.vcbook-visual > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.vcbook-visual:hover > img {
    transform: scale(1.04);
}

.vcbook-visual-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(20, 43, 59, 0.18) 0%,
        rgba(20, 43, 59, 0.52) 45%,
        rgba(10, 25, 36, 0.96) 100%
    );
}

.vcbook-visual-content {
    position: absolute;
    right: 35px;
    bottom: 58px;
    left: 35px;
    z-index: 1;
}

.vcbook-visual-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 23px;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.4px;
}

.vcbook-visual-tag > span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--vcbook-orange);
    box-shadow: 0 0 0 5px rgba(242, 140, 40, 0.2);
}

.vcbook-visual-content h3 {
    margin: 0 0 17px;
    color: #FFFFFF;
    font-size: clamp(26px, 2.8vw, 35px);
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -0.8px;
}

.vcbook-visual-content > p {
    margin: 0;
    color: #D7E0E5;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

.vcbook-visual-bottom {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 32px;
    padding-top: 23px;
    border-top: 1px solid rgba(255, 255, 255, 0.22);
}

.vcbook-visual-symbol {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 47px;
    height: 47px;
    border: 1px solid rgba(242, 140, 40, 0.65);
    color: var(--vcbook-orange);
    font-size: 19px;
}

.vcbook-visual-bottom strong,
.vcbook-visual-bottom span {
    display: block;
}

.vcbook-visual-bottom strong {
    margin-bottom: 6px;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 700;
}

.vcbook-visual-bottom span {
    color: #C8D2D9;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.6;
}

.vcbook-image-number {
    position: absolute;
    top: 25px;
    right: 25px;
    color: rgba(255, 255, 255, 0.85);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* FORM PANEL */

.vcbook-form-panel {
    min-width: 0;
    padding: 42px 42px 30px;
}

.vcbook-form-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.vcbook-form-step {
    display: block;
    margin-bottom: 10px;
    color: var(--vcbook-orange);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.vcbook-form-heading h3 {
    margin: 0;
    color: var(--vcbook-navy);
    font-size: clamp(20px, 2.3vw, 27px);
    font-weight: 700;
    line-height: 1.4;
}

.vcbook-form-heading-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    background: #FFF3E7;
    color: var(--vcbook-orange);
    font-size: 19px;
}

.vcbook-form-description {
    margin: 15px 0 27px;
    color: var(--vcbook-text);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.8;
}

/* FORM FIELDS */

.vcbook-form {
    display: flex;
    flex-direction: column;
    gap: 19px;
}

.vcbook-field-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 17px;
}

.vcbook-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 9px;
}

.vcbook-field > label {
    color: var(--vcbook-navy);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
}

.vcbook-input-wrap {
    display: flex;
    align-items: center;
    gap: 11px;
    width: 100%;
    min-width: 0;
    min-height: 49px;
    padding: 0 13px;
    border: 1px solid #DDE3E7;
    background: #FFFFFF;
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.vcbook-input-wrap:focus-within {
    border-color: var(--vcbook-orange);
    box-shadow: 0 0 0 3px rgba(242, 140, 40, 0.11);
}

.vcbook-input-wrap > i {
    flex-shrink: 0;
    color: #8A969F;
    font-size: 13px;
}

.vcbook-input-wrap input,
.vcbook-input-wrap select {
    width: 100%;
    min-width: 0;
    min-height: 45px;
    padding: 8px 0;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--vcbook-navy);
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    font-weight: 400;
}

.vcbook-input-wrap input::placeholder {
    color: #929CA4;
    opacity: 1;
}

.vcbook-input-wrap select {
    cursor: pointer;
}

.vcbook-input-wrap select:invalid {
    color: #929CA4;
}

.vcbook-field textarea {
    width: 100%;
    min-height: 100px;
    padding: 14px;
    border: 1px solid #DDE3E7;
    outline: none;
    background: #FFFFFF;
    color: var(--vcbook-navy);
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
    resize: vertical;
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.vcbook-field textarea:focus {
    border-color: var(--vcbook-orange);
    box-shadow: 0 0 0 3px rgba(242, 140, 40, 0.11);
}

.vcbook-field textarea::placeholder {
    color: #929CA4;
    opacity: 1;
}

/* CONSENT */

.vcbook-consent {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: var(--vcbook-text);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.7;
    cursor: pointer;
}

.vcbook-consent input {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    margin: 2px 0 0;
    accent-color: var(--vcbook-orange);
    cursor: pointer;
}

/* SUBMIT */

.vcbook-submit {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    width: 100%;
    min-height: 54px;
    padding: 0 21px;
    border: 0;
    background: var(--vcbook-navy);
    color: #FFFFFF;
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

.vcbook-submit > i {
    color: var(--vcbook-orange);
    transition: transform 0.3s ease;
}

.vcbook-submit:hover {
    background: #203E53;
    transform: translateY(-2px);
}

.vcbook-submit:hover > i {
    transform: translateX(5px);
}

.vcbook-form-footnote {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: -5px 0 0;
    color: #7A8790;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

.vcbook-form-footnote i {
    margin-top: 2px;
    color: var(--vcbook-orange);
}

.vcbook-form-status {
    display: none;
    padding: 13px 15px;
    border-left: 3px solid var(--vcbook-orange);
    background: #FFF3E7;
    color: var(--vcbook-navy);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.7;
}

.vcbook-form-status.vcbook-status-visible {
    display: block;
}

/* BOTTOM NOTE */

.vcbook-bottom {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 25px;
    padding: 18px 21px;
    border: 1px solid #E1E6E9;
    background: #FFFFFF;
}

.vcbook-bottom-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    color: var(--vcbook-orange);
    font-size: 17px;
}

.vcbook-bottom p {
    margin: 0;
    color: var(--vcbook-text);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.8;
}

.vcbook-bottom p strong {
    color: var(--vcbook-navy);
    font-weight: 700;
}

/* ENTRANCE ANIMATION */

.vcbook-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

.vcbook-reveal.vcbook-visible {
    opacity: 1;
    transform: translateY(0);
}

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

@media (max-width: 1024px) {

    .vcbook-section {
        padding: 80px 22px;
    }

    .vcbook-layout {
        grid-template-columns: 0.72fr 1.28fr;
    }

    .vcbook-visual {
        min-height: 780px;
    }

    .vcbook-visual-content {
        right: 24px;
        left: 24px;
        bottom: 35px;
    }

    .vcbook-form-panel {
        padding: 32px 27px 26px;
    }

    .vcbook-field-row {
        gap: 13px;
    }

    .vcbook-input-wrap {
        padding: 0 10px;
    }

    .vcbook-input-wrap input,
    .vcbook-input-wrap select {
        font-size: 11px;
    }
}

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

@media (max-width: 767px) {

    .vcbook-section {
        padding: 65px 20px;
    }

    .vcbook-intro {
        margin-bottom: 32px;
        text-align: left;
    }

    .vcbook-intro h2 {
        font-size: 34px;
        letter-spacing: -0.8px;
    }

    .vcbook-intro > p {
        margin-left: 0;
    }

    .vcbook-layout {
        grid-template-columns: 1fr;
    }

    .vcbook-visual {
        min-height: 360px;
    }

    .vcbook-visual-content {
        right: 25px;
        bottom: 32px;
        left: 25px;
    }

    .vcbook-visual-content h3 {
        font-size: 28px;
    }

    .vcbook-form-panel {
        padding: 30px 24px;
    }

    .vcbook-field-row {
        grid-template-columns: 1fr;
        gap: 19px;
    }

    .vcbook-input-wrap input,
    .vcbook-input-wrap select {
        font-size: 13px;
    }

    .vcbook-bottom {
        align-items: flex-start;
        padding: 16px;
    }
}

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

@media (max-width: 480px) {

    .vcbook-section {
        padding: 52px 16px;
    }

    .vcbook-intro h2 {
        font-size: 29px;
    }

    .vcbook-eyebrow {
        font-size: 10px;
        letter-spacing: 1.2px;
    }

    .vcbook-visual {
        min-height: 330px;
    }

    .vcbook-visual-content {
        right: 19px;
        bottom: 26px;
        left: 19px;
    }

    .vcbook-visual-content h3 {
        font-size: 24px;
    }

    .vcbook-visual-content > p {
        font-size: 15px;
    }

    .vcbook-form-panel {
        padding: 25px 17px;
    }

    .vcbook-form-heading {
        align-items: flex-start;
        gap: 10px;
    }

    .vcbook-form-heading h3 {
        font-size: 20px;
    }

    .vcbook-form-heading-icon {
        width: 39px;
        height: 39px;
        font-size: 16px;
    }

    .vcbook-form-description {
        margin-bottom: 22px;
    }

    .vcbook-bottom {
        gap: 9px;
    }

    .vcbook-bottom p {
        font-size: 11px;
    }
}

/* REDUCED MOTION */

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

    .vcbook-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .vcbook-visual > img,
    .vcbook-submit,
    .vcbook-submit > i {
        transition: none;
    }
}


/* ========================================
   VOLTCARE LOCATION & MAP SECTION
======================================== */

.vclocation-section,
.vclocation-section * {
    box-sizing: border-box;
}

.vclocation-section {
    position: relative;
    width: 100%;
    padding: 100px 24px;
    background: #f5f7f9;
    color: #142b3b;
    font-family: "Montserrat", sans-serif;
    overflow: hidden;
}

.vclocation-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Heading */

.vclocation-heading {
    max-width: 690px;
    margin: 0 auto 52px;
    text-align: center;
}

.vclocation-tag {
    display: inline-block;
    margin-bottom: 17px;
    color: #f28c28;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.vclocation-heading h2 {
    margin: 0 0 17px;
    color: #142b3b;
    font-size: clamp(30px, 4vw, 45px);
    font-weight: 700;
    line-height: 1.2;
}

.vclocation-heading h2 span {
    color: #f28c28;
}

.vclocation-heading > p {
    max-width: 580px;
    margin: 0 auto;
    color: #65717b;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* Main Grid */

.vclocation-grid {
    display: grid;
    grid-template-columns: 0.82fr 1.18fr;
    gap: 26px;
    align-items: stretch;
}

/* Information Card */

.vclocation-info {
    display: flex;
    flex-direction: column;
    padding: 38px 32px;
    background: #142b3b;
    border-radius: 14px;
    color: #ffffff;
    box-shadow: 0 20px 45px rgba(20, 43, 59, 0.12);
}

.vclocation-info-top {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 34px;
}

.vclocation-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 54px;
    height: 54px;
    border-radius: 12px;
    background: #f28c28;
    color: #142b3b;
    font-size: 21px;
}

.vclocation-small-title {
    display: block;
    margin-bottom: 7px;
    color: #f28c28;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.vclocation-info-top h3 {
    margin: 0;
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
}

/* Details */

.vclocation-detail {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 23px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.13);
}

.vclocation-detail-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(242, 140, 40, 0.35);
    border-radius: 10px;
    color: #f28c28;
    font-size: 15px;
}

.vclocation-detail h4 {
    margin: 2px 0 8px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
}

.vclocation-detail p {
    margin: 0 0 5px;
    color: #c3cdd4;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.8;
    overflow-wrap: anywhere;
}

/* Directions Button */

.vclocation-directions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    min-height: 50px;
    margin-top: auto;
    padding: 14px 18px;
    border-radius: 7px;
    background: #f28c28;
    color: #142b3b;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    transition: background 0.3s ease, transform 0.3s ease;
}

.vclocation-directions:hover {
    background: #ffffff;
    color: #142b3b;
    transform: translateY(-3px);
}

/* Map */

.vclocation-map {
    position: relative;
    min-width: 0;
    min-height: 540px;
    overflow: hidden;
    border: 1px solid #e2e7eb;
    border-radius: 14px;
    background: #e9eef1;
    box-shadow: 0 20px 45px rgba(20, 43, 59, 0.08);
}

.vclocation-map iframe {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Map Overlay Label */

.vclocation-map-label {
    position: absolute;
    right: 20px;
    bottom: 20px;
    left: 20px;
    display: flex;
    align-items: center;
    gap: 13px;
    max-width: 390px;
    padding: 17px 20px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 30px rgba(20, 43, 59, 0.13);
}

.vclocation-map-dot {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #f28c28;
    box-shadow: 0 0 0 5px rgba(242, 140, 40, 0.15);
}

.vclocation-map-label strong {
    display: block;
    margin-bottom: 5px;
    color: #142b3b;
    font-size: 13px;
    font-weight: 700;
}

.vclocation-map-label p {
    margin: 0;
    color: #65717b;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.6;
}

/* ========================================
   RESPONSIVE
======================================== */

@media (max-width: 1024px) {
    .vclocation-section {
        padding: 80px 22px;
    }

    .vclocation-grid {
        grid-template-columns: 0.9fr 1.1fr;
        gap: 20px;
    }

    .vclocation-info {
        padding: 30px 24px;
    }

    .vclocation-map {
        min-height: 540px;
    }
}

@media (max-width: 767px) {
    .vclocation-section {
        padding: 65px 18px;
    }

    .vclocation-heading {
        margin-bottom: 35px;
    }

    .vclocation-heading h2 {
        font-size: 31px;
    }

    .vclocation-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .vclocation-info {
        padding: 30px 24px;
    }

    .vclocation-info-top {
        margin-bottom: 22px;
    }

    .vclocation-detail {
        padding: 20px 0;
    }

    .vclocation-directions {
        margin-top: 20px;
    }

    .vclocation-map {
        min-height: 390px;
    }

    .vclocation-map-label {
        right: 12px;
        bottom: 12px;
        left: 12px;
        padding: 14px;
    }
}

@media (max-width: 480px) {
    .vclocation-section {
        padding: 50px 15px;
    }

    .vclocation-heading h2 {
        font-size: 27px;
    }

    .vclocation-heading > p {
        font-size: 13px;
    }

    .vclocation-info {
        padding: 25px 19px;
    }

    .vclocation-info-top h3 {
        font-size: 18px;
    }

    .vclocation-map {
        min-height: 330px;
    }
}



/* ========================================
   VOLTCARE EMERGENCY CTA
======================================== */

.vcemergency-section,
.vcemergency-section * {
    box-sizing: border-box;
}

.vcemergency-section {
    width: 100%;
    padding: 90px 24px;
    background: #ffffff;
    color: #142B3B;
    font-family: "Montserrat", sans-serif;
    overflow: hidden;
}

.vcemergency-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.vcemergency-card {
    position: relative;
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    align-items: center;
    gap: 45px;
    min-height: 460px;
    padding: 65px 60px;
    border-radius: 18px;
    background: #142B3B;
    overflow: hidden;
    isolation: isolate;
}

/* Background Effects */

.vcemergency-glow {
    position: absolute;
    top: -180px;
    left: 35%;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: rgba(242, 140, 40, 0.09);
    filter: blur(65px);
    pointer-events: none;
    z-index: -1;
}

.vcemergency-circle {
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
}

.vcemergency-circle-one {
    top: -150px;
    right: 12%;
    width: 350px;
    height: 350px;
}

.vcemergency-circle-two {
    right: -100px;
    bottom: -220px;
    width: 420px;
    height: 420px;
}

/* Content */

.vcemergency-content {
    position: relative;
    z-index: 2;
    animation: vcEmergencyTextIn 0.8s ease both;
}

.vcemergency-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
    color: #F28C28;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.vcemergency-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #F28C28;
    box-shadow: 0 0 0 5px rgba(242, 140, 40, 0.13);
    animation: vcEmergencyPulse 1.8s infinite;
}

.vcemergency-content h2 {
    max-width: 550px;
    margin: 0 0 22px;
    color: #ffffff;
    font-size: clamp(30px, 3.5vw, 44px);
    font-weight: 700;
    line-height: 1.22;
    letter-spacing: -1.2px;
}

.vcemergency-content h2 span {
    display: block;
    color: #F28C28;
}

.vcemergency-content > p {
    max-width: 490px;
    margin: 0 0 30px;
    color: #C1CCD4;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;
}

/* Buttons */

.vcemergency-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px;
}

.vcemergency-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 50px;
    padding: 14px 20px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.vcemergency-btn-primary {
    background: #F28C28;
    color: #142B3B;
}

.vcemergency-btn-primary:hover {
    background: #ffffff;
    color: #142B3B;
    transform: translateY(-3px);
}

.vcemergency-arrow {
    margin-left: 3px;
    transition: transform 0.3s ease;
}

.vcemergency-btn-primary:hover .vcemergency-arrow {
    transform: translateX(4px);
}

.vcemergency-btn-secondary {
    border-color: rgba(255, 255, 255, 0.3);
    background: transparent;
    color: #ffffff;
}

.vcemergency-btn-secondary:hover {
    border-color: #F28C28;
    background: rgba(242, 140, 40, 0.1);
    color: #F28C28;
    transform: translateY(-3px);
}

/* Trust Note */

.vcemergency-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 28px;
    color: #C1CCD4;
    font-size: 14px;
    font-weight: 400;
}

.vcemergency-note i {
    color: #F28C28;
    font-size: 15px;
}

/* Image */

.vcemergency-visual {
    position: relative;
    min-width: 0;
    padding: 10px 8px 20px 0;
    animation: vcEmergencyImageIn 0.9s ease both;
}

.vcemergency-image-wrap {
    position: relative;
    height: 330px;
    border-radius: 12px;
    overflow: hidden;
    transform: rotate(1deg);
}

.vcemergency-image-wrap img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.vcemergency-card:hover .vcemergency-image-wrap img {
    transform: scale(1.05);
}

.vcemergency-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(20, 43, 59, 0.02) 35%,
        rgba(20, 43, 59, 0.52) 100%
    );
    pointer-events: none;
}

/* Floating Card */

.vcemergency-floating-card {
    position: absolute;
    right: -10px;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 13px;
    max-width: calc(100% - 20px);
    padding: 17px 20px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.18);
    animation: vcEmergencyFloat 4s ease-in-out infinite;
}

.vcemergency-floating-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    border-radius: 8px;
    background: #FFF0DF;
    color: #F28C28;
    font-size: 20px;
}

.vcemergency-floating-card strong {
    display: block;
    margin-bottom: 6px;
    color: #142B3B;
    font-size: 12px;
    font-weight: 700;
}

.vcemergency-floating-card span {
    display: block;
    color: #65717B;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
}

.vcemergency-orange-line {
    position: absolute;
    top: 0;
    right: -3px;
    width: 70px;
    height: 5px;
    border-radius: 5px;
    background: #F28C28;
}

/* Animations */

@keyframes vcEmergencyTextIn {
    from {
        opacity: 0;
        transform: translateY(25px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes vcEmergencyImageIn {
    from {
        opacity: 0;
        transform: translateX(25px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes vcEmergencyPulse {
    0%, 100% {
        box-shadow: 0 0 0 5px rgba(242, 140, 40, 0.13);
    }
    50% {
        box-shadow: 0 0 0 9px rgba(242, 140, 40, 0.04);
    }
}

@keyframes vcEmergencyFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-6px);
    }
}

/* Responsive */

@media (max-width: 1024px) {
    .vcemergency-section {
        padding: 75px 22px;
    }

    .vcemergency-card {
        grid-template-columns: 1fr 0.85fr;
        gap: 30px;
        padding: 48px 35px;
    }

    .vcemergency-content h2 {
        font-size: 34px;
    }

    .vcemergency-image-wrap {
        height: 300px;
    }

    .vcemergency-actions {
        align-items: stretch;
    }
}

@media (max-width: 767px) {
    .vcemergency-section {
        padding: 60px 18px;
    }

    .vcemergency-card {
        grid-template-columns: 1fr;
        gap: 35px;
        padding: 38px 25px 32px;
    }

    .vcemergency-content h2 {
        font-size: 32px;
        letter-spacing: -0.6px;
    }

    .vcemergency-content > p {
        font-size: 13px;
    }

    .vcemergency-visual {
        padding-right: 5px;
    }

    .vcemergency-image-wrap {
        height: 300px;
    }

    .vcemergency-floating-card {
        right: -2px;
    }
}

@media (max-width: 480px) {
    .vcemergency-section {
        padding: 45px 14px;
    }

    .vcemergency-card {
        gap: 28px;
        padding: 30px 19px 25px;
        border-radius: 12px;
    }

    .vcemergency-tag {
        font-size: 9px;
        letter-spacing: 1.2px;
    }

    .vcemergency-content h2 {
        font-size: 28px;
    }

    .vcemergency-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .vcemergency-btn {
        width: 100%;
        min-height: 48px;
    }

    .vcemergency-image-wrap {
        height: 235px;
    }

    .vcemergency-floating-card {
        right: 0;
        padding: 12px;
    }

    .vcemergency-floating-icon {
        width: 38px;
        height: 38px;
        font-size: 17px;
    }

    .vcemergency-floating-card span {
        font-size: 9px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vcemergency-section *,
    .vcemergency-section *::before,
    .vcemergency-section *::after {
        animation: none !important;
        transition: none !important;
    }
}





.auto-logo-image {
    width: 160px;
    height: 75px;
    object-fit: contain;
    display: block;
}

.auto-logo-image-dark {
    display: none;
}

@media (max-width: 390px) {
    .auto-logo-image {
        width: 140px;
        height: 66px;
    }
}