/* ========================================================= */
/* CSS RESET */
/* ========================================================= */

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


/* ========================================================= */
/* HTML & BODY */
/* ========================================================= */

html{
    scroll-behavior: smooth;
}

body{

    font-family: var(--body-font);

    font-size: 16px;

    font-weight: var(--fw-regular);

    color: var(--text-color);

    background: var(--white-color);

    line-height: 1.7;

    overflow-x: hidden;

}


/* ========================================================= */
/* TYPOGRAPHY */
/* ========================================================= */

h1,
h2,
h3,
h4,
h5,
h6{

    font-family: var(--heading-font);

    color: var(--dark-color);

    font-weight: var(--fw-bold);

    line-height: 1.3;

    margin-bottom: 15px;

}

p{

    margin-bottom: 15px;

}

a{

    text-decoration: none;

    color: inherit;

    transition: var(--transition);

}


/* ========================================================= */
/* IMAGES */
/* ========================================================= */

img{

    max-width: 100%;

    height: auto;

    display: block;

}


/* ========================================================= */
/* LIST */
/* ========================================================= */

ul,
ol{

    list-style: none;

    margin: 0;

    padding: 0;

}


/* ========================================================= */
/* SECTION */
/* ========================================================= */

section{

    padding: 80px 0;

}


/* ========================================================= */
/* CUSTOM CONTAINER */
/* ========================================================= */

.container{

    max-width: var(--container-width);

}


/* ========================================================= */
/* COMMON UTILITIES */
/* ========================================================= */

.text-primary{

    color: var(--primary-color) !important;

}

.bg-primary{

    background: var(--primary-color) !important;

}

.text-center{

    text-align: center;

}

/* ========================================================= */
/* TOP HEADER */
/* ========================================================= */

.top-header{

    background:var(--primary-color);

    color:var(--white-color);

    font-size:14px;

    padding:10px 0;

}


.vca-menu{

    display:flex;

    gap:30px;

}

/* ========================================================= */
/* VCA NAVBAR */
/* ========================================================= */

.vca-navbar{

    background-color: var(--white-color);

    padding: 22px 0;

    box-shadow: 0 5px 20px rgba(0,0,0,.06);

}

/* ========================================================= */
/* HERO DECORATION */
/* ========================================================= */

.vca-hero{

    position:relative;

}

.vca-hero-decoration{

    position:absolute;

    border-radius:50%;

    pointer-events:none;

}

.hero-circle-one{

    width:220px;

    height:220px;

    top:-80px;

    left:-70px;

    background:rgba(10,88,202,.05);

}

.hero-circle-two{

    width:300px;

    height:300px;

    right:-120px;

    bottom:-120px;

    background:rgba(255,107,0,.05);

}