@charset "utf-8";
/* CSS Document */

::selection {
  color: var(--bs-white);
  background: var(--bs-primary);
}

.aligncenter,.gallery-item a{display: block}
.alignleft{float: left; margin-right: 15px; margin-bottom: 10px}
.alignright{float: right; margin-left: 15px; margin-bottom: 10px}
.aligncenter{margin-left: auto; margin-right: auto}
.wp-caption{max-width: 100%;padding: 4px}
.entry-caption, .gallery-caption, .wp-caption .wp-caption-text{font-style: italic; font-size: 12px; font-size: .857142857rem; line-height: 2;}
.full-img { position: relative;}
.full-img img{ width: 100%; height: auto; position: relative; z-index: 2;}
/*----
Custom Site Style ----*/
.content-gap > * { margin-bottom: 0;}
.banner{ padding: 137px 0 170px; background-position: center center; background-repeat: no-repeat; background-size: cover; position: relative; color: #fff;}
.banner::before{background: linear-gradient(270deg, rgba(65, 110, 241, 0.9) 0%, rgba(107, 86, 216, 0.9) 50%, rgba(126, 25, 192, 0.8) 100%); position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; content: '';}
.banner .item { line-height: 1.2; text-transform: capitalize; font-size: 14px;}
.banner .item .user{ width: 150px; margin-right: 16px;}
.banner .item h3{ margin-bottom: 0;}
.banner::after{ background-image: url(../images/hero-shape-1.svg); background-position: center center; height: 170px; position: absolute; bottom: 0; left: 0; right: 0; z-index: 4; content: '';}
.banner .shape-top{ position: absolute; top: 0; left: 0; width: 10.520833333333%; z-index: 3;} 
.banner .shape-bottom{ position: absolute; bottom: 0; right: 0; width: 10.416666666667%; z-index: 4;} 

.header{ position: absolute; top: 0; right: 0; left: 0; z-index: 1000;}
.header .container{ height: 130px; display: flex; align-items: center;}
.section-1{ padding: 60px 0; background: #F6F4FE;}
.block-item-1{ background-color: #fff; padding: 24px; box-shadow: 0px 16px 32px 0px #0000000D; border-radius: 16px; display: flex; flex-direction: column; align-items: center; gap: 24px; font-size: 14px; text-align: center;}
.block-item-1 .icon{background: linear-gradient(360deg, #A091E7 0%, #F6F5FE 100%); box-shadow: 0px 15px 30px 0px #00000033; padding: 10px; border-radius: 50%; width: 100px; height: 100px;}
.block-item-1 .icon .icon-inner{background: linear-gradient(360deg, #D8CFFD 0%, #F9F7FF 100%); box-shadow: 0px 0px 10px 0px #00000040; height: 80px; width: 80px; padding: 10px; display: flex; align-items: center; justify-content: center; border-radius: 50%;}
.block-item-1 h3{ font-weight: 700;}
.cta-1{background: linear-gradient(90deg, #7E19C0 0%, #0071E9 100%); color: #fff;}

.footer{ text-align: center; padding: 16px 0; color: #fff; background: #323232;}
.footer a{ color: #fff;}

.banner-2{ padding: 148px 0 0; background-position: center center; background-repeat: no-repeat; background-size: cover; position: relative; color: #fff;}
.banner-2::before{background: linear-gradient(90deg, rgba(103, 48, 227, 0.855) 18.48%, rgba(150, 41, 230, 0.855) 65.78%, rgba(191, 0, 220, 0.855) 118.48%); position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; content: '';}
.banner-2 .item { line-height: 1.2; text-transform: capitalize; font-size: 14px;}
.banner-2 .item .user{ width: 150px; margin-right: 16px;}
.banner-2 .item h3{ margin-bottom: 0;}
.banner-2::after{ background-image: url(../images/hero-shape-2.svg); background-position: center center; height: 265px; position: absolute; bottom: -1px; left: 0; right: 0; z-index: 4; content: '';}
.header-2{ position: absolute; top: 48px; left: 0; right: 0; z-index: 1000;}
.header-2 .container{ display: flex; align-items: center;}

.section-2{ padding: 60px 0; background: url(../images/shape-3.svg) no-repeat left top, url(../images/shape-4.svg) no-repeat bottom right, #F6F5FE; background-size: 7.8125%;}
.block-item-2{ padding: 32px; color: #fff; border-radius: 16px; background: linear-gradient(90deg, #004288 0%, #0071E9 100%);}
.block-item-2 h3{ gap: 16px;}
.block-item-2 .icon{ background-color: #fff; height: 80px; width: 80px; border-radius: 50%; padding: 10px; display: flex; align-items: center; justify-content: center;}
.cta-2{background: #004288;  color: #fff;}

/*----
Custom Site Style ----*/


@media (min-width: 320px) {
h1{ font-size: calc(2.1875rem + ((1vw - 3.2px) * 0.8125));}
h2{font-size: calc(1.875rem + ((1vw - 3.2px) * 0.625));}
h3{font-size: calc(1.5rem + ((1vw - 3.2px) * 0.5));}
h4{font-size: calc(1.1875rem + ((1vw - 3.2px) * 0.3125));}
h5{font-size: calc(1.0625rem + ((1vw - 3.2px) * 0.1875));}
.font-18{font-size: calc(1rem + ((1vw - 3.2px) * 0.125));}
.font-20{font-size: calc(1rem + ((1vw - 3.2px) * 0.25));}
.font-24{font-size: calc(1rem + ((1vw - 3.2px) * 0.5));}
.banner h1, .banner-2 h1{font-size: clamp(2.125rem, 1.75rem + 1.875vw, 4rem);}
}

@media (min-width: 1400px) {
h1{font-size: 48px;}
h2{font-size: 40px;}
h3{font-size: 32px;}
h4{font-size: 24px;}
h5{font-size: 20px;}
.font-18{font-size: 18px;}
.font-20{ font-size: 20px;}
.font-24{ font-size: 24px;}
.banner h1, .banner-2 h1{font-size: 4rem;}
}

@media (min-width: 576px) {
.block-item-1{ flex-direction: row; text-align: left;}
}

@media (min-width: 768px) {

}

@media (min-width: 992px) {
}

/* #Media Queries
================================================== */
@media (min-width:1400px) and (max-width:1499px) {
} 

/* END__ */

@media (min-width:1200px) and (max-width:1399px) {
} 
/* END__ */

@media (min-width:992px) and (max-width:1199px) {

} 
/* END__ */

@media (min-width:768px) and (max-width:991px) {
.header .container, .header-2 .container{ padding-top: 24px; padding-bottom: 24px; height: auto; gap: 16px;}
.header .container .logo img, .header-2 .container .logo img{ width: 100%; max-width: 200px;}
.header .container .d-flex img, .header-2 .container .d-flex img{ width: 100%; max-width: 120px;}
.header-2{ top: 0;}
.banner::after, .banner-2::after{ background: none;}
.banner-2, .banner{ padding-bottom: 48px;}
} 
/* END__ */

@media only screen and (max-width:767px) {
.header .container, .header-2 .container{ padding-top: 24px; padding-bottom: 24px; height: auto; gap: 16px;}
.header .container .logo img.header .container .logo img, .header-2 .container .logo img{ width: 100%; max-width: 150px;}
.header .container .d-flex img.header .container .d-flex img, .header-2 .container .d-flex img{ width: 100%; max-width: 100px;}
.banner, .banner-2{ padding-top: 90px;}
.banner-2, .banner{ padding-bottom: 48px;}
.section-1, .section-2{ padding: 40px 0;}
.header-2{ top: 0;}
.block-item-2{ padding: 24px; text-align: center;}
.banner::after, .banner-2::after{ background: none;}
} 
/* END__ */

@media only screen and (max-width:374px) {
} 
/* END__ */