.sticky-nav .header-button a {
    display: inline-block;
    color: #fff;
    padding: 10px 28px;
    border: 1px solid#fff;
    text-transform: capitalize;
    transition: 0.5s;
    font-size: 15px;
    position: relative;
    z-index: 1;
    border-radius: 3px;
    overflow: hidden;
    margin-top: 5px;
    font-weight: 400;
}
.sticky-nav.nav-menu .header_tbn {
    position: relative;
    top: 4px;
    left: 60px;
}
/*<!-- ============================================================== -->
<!-- Start header-top Css -->
<!-- ============================================================== -->*/
.header-top {
    background: #2871FF;
    padding: 9px 0;
}
.header-left-text p {
    font-size: 14px;
    font-weight: 400;
    font-family: 'Cabin';
    margin: 0;
    color: #fff;
}
.header-icon-list {
    text-align: right;
}
.header-icon-list ul li {
    display: inline-block;
    list-style: none;
    margin-right: 10px;
    color: #fff;
}
.header-icon-list ul li a {
    font-size: 14px;
    display: inline-block;
    color: #fff;
    line-height: 26px;
}
/*<!-- ============================================================== -->
<!-- Start  main-header Css -->
<!-- ============================================================== -->*/
.main-header {
    position: relative;
    z-index: 99;
    padding: 0  50px 15px;
}
.nav-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.header-logo a {
    display: inline-block;
}
.header-logo img {
    max-height: 124px;
    width: auto;
}
.footer-logo img {
    max-height: 104px;
    width: auto;
}
.heder-menu ul li {
    display: inline-block;
    margin-right: 5px;
}
.heder-menu {
    display: inline-block;
    position: relative;
    right: -95px;
}
.heder-menu ul {
    display: block;
}
.heder-menu ul li a {
    display: inline-block;
    text-transform: capitalize;
    padding: 30px 20px 18px;
    transition: .5s;
    position: relative;
    font-size: 16px;
    line-height: 40px;
    color: #333F4F;
    font-weight: 500;
    font-family: "Cabin";
}
.heder-menu ul li a:hover {
    color: #2871FE;
}
.heder-menu ul li a:hover .icon::before {
    color: #2871FE;
}
.heder-menu ul li.icon {
    position: relative;
}
.heder-menu ul li.icon::before {
    content: "\f107";
    font-family: FontAwesome;
    font-size: 15px;
    opacity: 1;
    top: 37px;
    right: 5px;
    left: inherit;
    position: absolute;
    color: #8E9BAE;
}
.sticky-nav .heder-menu ul li.icon::before {
    color: #2871FE;
}
.header-button {
    margin-top: 15px;
    margin-left: 20px;
}
.header-button a {
    display: inline-block;
    color: #fff;
    font-weight: 400;
    padding: 10px 28px;
    text-transform: capitalize;
    transition: 0.5s;
    font-size: 16px;
    position: relative;
    z-index: 1;
    border-radius: 3px;
    overflow: hidden;
    margin-top: 5px;
    background: #2871FE;
}
.header-button a:hover {
    color: #fff;
    background: linear-gradient(to left, #533efe, #740fd6);
}
.header_tbn {
    position: relative;
    top: 4px;
    left: 15px;
}
.header_tbn a {
    display: inline-block;
    font-size: 16px;
    line-height: 40px;
    color: #010e22;
    font-weight: 400;
    font-family: "Cabin";
    text-transform: capitalize;
}
.header_tbn a i {
    display: inline-block;
    font-size: 16px;
    color: #2771FF;
    font-weight: 800;
    margin-right: 5px;
}
/* sub-menu */
.heder-menu ul .sub-menu {
    top: 120px;
    height: auto;
    width: 200px;
    background: #fff;
    transition: .5s;
    visibility: hidden;
    display: block;
    padding: 15px 0px 12px;
    border-radius: 5px;
    position: absolute;
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 20%);
    opacity: 0;
}
.sub-menu ul {
    overflow: hidden;
    display: inherit;
}
.sub-menu ul li {
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: inherit;
    border-top: 1px solid #DEE1E6;
}
.heder-menu ul .sub-menu ul li a {
    display: inline-block;
    font-size: 15px;
    font-weight: 600;
    color: #616161!important;
    padding: 5px 7px 5px 25px;
    transition: .5s;
}
.heder-menu ul .sub-menu ul li:hover {
    background: #2771FF;
}
.heder-menu ul .sub-menu ul li:hover a {
    color: #fff!important;
}
.heder-menu ul li:hover .sub-menu {
    top:75px;
    visibility: visible !important;
    opacity: 1;
}
/*<!-- ============================================================== -->
<!-- Start  slider-area Css -->
<!-- ============================================================== -->*/
.slider-area {
    background: url(assets/images/hero-bg_3.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 800px;
    position: relative;
} 
.slider-content {
    padding: 0 0 40px;
    text-align: center;
}
.slider-title h1 {
    font-size: 60px;
    line-height: 75px;
    color: #010e22;
    font-weight: 700;
    font-family: "Cabin";
}
.slider-discription p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 300;
    font-family: "Inter";
    width: 55%;
    text-align: center;
    margin: 0 auto 0;
}
.slider-button {
    margin-top: 53px;
    display: inline-block;
}
.slider-button a {
    font-size: 16px;
    color: #fff;
    padding: 22px 63px 22px 41px;
    background: #2871ff;
    border-radius: 5px;
    text-align: center;
    transition: .5s;
}
.slider-button a:hover {
    color: #fff;
    background: linear-gradient(to left, #533efe, #740fd6);
}
.slider-button a span {
    opacity: 0.302;
    font-size: 17px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    font-family: "Cabin";
    position: relative;
    left: 30px;
    transition: .5s;
}
.slider-button a span::before {
    position: absolute;
    content: "";
    top: 10px;
    left: -25px;
    height: 2px;
    width: 17px;
    background: #ffffff;
    opacity: 1;
    transition: .5s;
}
.slider-area .hape-img {
    position: absolute;
    left: 5%;
    bottom: -52%;
}
.slider-area .hape-img-two {
    position: absolute;
    right: 11%;
    top: 106%;
}
/*<!-- ============================================================== -->
<!-- Start  section-title  Css -->
<!-- ============================================================== -->*/
.section-title {
    text-align: center;
    margin-bottom: 50px;
}
.main-title h1 {
    font-size: 42px;
    line-height: 56px;
    color: #010e22;
    font-weight: 700;
    font-family: "Cabin";
    text-align: center;
    margin: 0;
}
 .sub-title h5 {
    font-size: 18px;
    line-height: 26px;
    color: #2871ff;
    font-weight: 400;
    font-family: "Cabin";
}
.sub-title p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    margin: 20px 0 0;
}
/*<!-- ============================================================== -->
<!-- Start  breadcumb-area   Css -->
<!-- ============================================================== -->*/
.breadcumb-area {
    background: url(assets/images/hero-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 125px 0 110px;
}
.breacumb-content {
    text-align: center;
}
.breadcumb-title h1 {
    font-size: 56px;
    line-height: 75px;
    color: #010e22;
    font-weight: 700;
    font-family: "Cabin";
    text-align: center;
    text-transform: capitalize;
    margin-bottom: -10px;
}
.breadcumb-content-text a {
    display: inline-block;
    font-size: 16px;
    line-height: 75px;
    color: #2871ff;
    font-weight: 400;
    font-family: "Cabin";
    text-transform: capitalize;
    margin-left: -30px;
}
.breadcumb-content-text a span {
    font-size: 16px;
    line-height: 75px;
    color: #616161;
    font-weight: 400;
    font-family: "Cabin";
    position: relative;
    left: 35px;
}
.breadcumb-content-text a span::before {
    position: absolute;
    content: "";
    top: 11px;
    left: -28px;
    height: 1px;
    width: 17px;
    background: #2F71FF;
}
/*<!-- ============================================================== -->
<!-- Start  .service-area  Css -->
<!-- ============================================================== -->*/
.service-area {
    padding: 100px 0 100px;
}
.service-area .section-title {
    text-align: center;
    margin-bottom: 55px;
}
.service-area .single-service-box {
    padding: 50px 30px 45px;
    box-shadow: 0px 0px 40px 0px rgb(0 0 0 / 20%);
    border-radius: 5px;
    margin-bottom: 30px;
    transition: 0.5s;
    background: #fff;
}
.service-area .single-service-box:hover {
    margin-top: -10px;
}
.service-area .service-icon-img {
    text-align: center;
}
.service-area .service-title h3 {
    font-size: 22px;
    line-height: 50px;
    color: #010e22;
    font-weight: 600;
    font-family: "Cabin";
    text-align: center;
    margin: 27px 0 10px;
}
.service-area .service-discription p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    text-align: center;
    margin: 0;
}
 .service-area.style-two {
    background: #f7faff;
}
.service-area.style-two .single-service-box {
    padding: 40px 30px 35px;
}
.service-area.style-two .service-title h3 {
    font-size: 20px;
    margin-bottom: 5px;
}
.service-area.style-two .service-discription p {
    font-size: 15px;
    line-height: 25px;
}

.service-area.style_one .row.marg {
    margin-top: 50px;
}
.service-area.style_one .single-service-box.upper {
    position: relative;
    top: -50px;
}
.service-area.style_one .single-service-box {
    box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 15%);
    transition: .5s;
}
.service-area.style_one .single-service-box:hover {
    box-shadow: 0px 0px 40px 0px rgb(0 0 0 / 20%);
}
/*<!-- ============================================================== -->
<!-- Start  our-cards-section  Css -->
<!-- ============================================================== -->*/
.our-cards-section {
    padding: 100px 0 100px;
}
.our-cards-section .sub-title h5 {
    font-size: 18px;
    line-height: 26px;
    color: #2871ff;
    font-weight: 400;
    font-family: "Cabin";
    text-align: left;
}
.our-cards-section .row.bor-top {
    margin-top: 50px;
}
.single_cards .section-title {
    margin-bottom: 20px;
}
.our-cards-section .single_cards .main-title h1 {
    text-align: left;
}
.our-cards-section .cards-discription p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    margin: 0;
}
.our-cards-section .card-button {
    margin-top: 35px;
}
.our-cards-section .card-button a {
    display: inline-block;
    font-size: 17px;
    line-height: 28px;
    color: #010e22;
    font-weight: 500;
    font-family: "Cabin";
    text-transform: capitalize;
    border: 1px solid #010E22;
    padding: 14px 35px;
    border-radius: 5px;
    transition: 0.5s;
}
.our-cards-section .card-button a:hover {
    color: #fff;
    border: 1px solid #2771FF;
    background: #2771FF;
}
.our-cards-section .card-button a i {
    display: inline-block;
    margin-left: 5px;
}
.our-cards-section .single_cards .cards-thumb {
    position: relative;
    left: 115px;
}
.our-cards-section .single_cards .card-animation {
    position: absolute;
    bottom: 0;
    left: 45px;
}
.our-cards-section .single_cards .card-left-img {
    position: absolute;
    bottom: 100px;
    right: -23px;
}
.our-cards-section .single_cards .card-right-img {
    position: absolute;
    top: 90px;
    left: 50px;
}
/*<!-- ============================================================== -->
<!-- Start  .counter-area  Css -->
<!-- ============================================================== -->*/
.transaction-report {
    padding: 0px 0 100px;
}
.single-transaction .section-title {
    text-align: left;
    margin-bottom: 20px;
}
.single-transaction .main-title h1 {
    text-align: left;
}
.single-transaction .transaction-tmb {
    margin-left: -60px;
}
.single-transaction .transaction-tmb img {
    width: 100%;
}
.transaction-report .transaction-button {
    margin-top: 35px;
}
.transaction-report .transaction-button a {
    display: inline-block;
    font-size: 17px;
    line-height: 28px;
    color: #010e22;
    font-weight: 500;
    font-family: "Cabin";
    text-transform: capitalize;
    border: 1px solid #010E22;
    padding: 14px 35px;
    border-radius: 5px;
    transition: 0.5s;
}
.transaction-report .transaction-button a:hover {
    color: #fff;
    border: 1px solid #2771FF;
    background: #2771FF;
}
.transaction-report .transaction-button a i {
    display: inline-block;
    margin-left: 5px;
}
/*<!-- ============================================================== -->
<!-- Start  fintech-location-area  Css -->
<!-- ============================================================== -->*/
.fintech-location-area {
    padding: 100px 0 100px;
    background: url(assets/images/location-bg.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 750px;
    overflow: hidden;
}
.fintech-location-area .main-title h1 {
    margin: 0 0 17px;
}
.fintech-location-area .sub-title p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    margin: 0 auto 0;
    text-align: center;
    width: 50%;
}
.fintech-location-area .single-location {
    position: relative;
    z-index: 1;
}
.fintech-location-area .location-thumb {
    position: relative;
    height: 64px;
    width: 64px;
    border-radius: 100%;
    margin: auto;
    transition: .3s;
    right: 0;
    text-align: center;
}
.fintech-location-area .location-thumb-1 {
    position: absolute;
    top: 150px;
    right: 75px;
}
.fintech-location-area .location-thumb-2 {
    position: absolute;
    top: 150px;
    left: 75px;
}
.fintech-location-area .icon-box {
    text-align: left;
}
.fintech-location-area .location-thumb-3 {
    position: absolute;
    top: 300px;
    left: 19px;
    right: 0;
    text-align: center;
}
.fintech-location-area .contact-title h2 {
    font-size: 20px;
    margin: 0 0 20px;
    font-family: 'Cabin', sans-serif;
    line-height: 1.2;
    color: #1d2124;
    position: relative;
    z-index: 1;
    text-align: left;
}
.fintech-location-area .contact-title h2::before {
    position: absolute;
    content: "";
    height: 35px;
    width: 35px;
    line-height: 36px;
    top: -50px;
    left: 0;
    background: #fff;
    transform: rotate(45deg);
    z-index: -1;
}
.fintech-location-area .contact-icon {
    float: left;
    margin-right: 5px;
}
.fintech-location-area .contact-icon i {
    color: #6425E8;
    font-size: 24px;
    display: inline-block;
    font-weight: 600;
    margin-right: 13px;
    position: relative;
    top: 9px;
}
.fintech-location-area .icon-title h2 {
    font-size: 16px;
    font-weight: 400;
    color: #646464;
    display: inline-block;
    margin: 0 0 16px;
    line-height: 27px;
    text-align: left;
}
.fintech-location-area .contacts-boxs {
    padding: 34px 16px 18px 31px;
    box-shadow: 0 20px 50px rgb(229 229 229 / 80%);
    border-radius: 5px;
    background: #fff;
    position: absolute;
    top: 60px;
    visibility: hidden;
    width: 320px;
    transition: .3s;
    z-index: 1;
    opacity: 0;
    border-radius: 7px;
}
.fintech-location-area .location-thumb:hover .contacts-boxs {
    top: 50px;
    opacity: 1;
    visibility: visible;
}
.fintech-location-area .location-thumb-1:hover .contacts-boxs {
    top: 50px;
    opacity: 1;
    visibility: visible;
}
.fintech-location-area .location-thumb-2:hover .contacts-boxs {
    top: 50px;
    opacity: 1;
    visibility: visible;
}
.fintech-location-area .location-thumb-3:hover .contacts-boxs {
    top: 50px;
    opacity: 1;
    visibility: visible;
}
/*<!-- ============================================================== -->
<!-- Start  .counter-area  Css -->
<!-- ============================================================== -->*/
.counter-area {
    padding: 95px 0 95px;
}
.single-counter-box {
    padding: 55px 0px 30px 35px;
    transition: 0.5s;
}
.single-counter-box:hover {
    box-shadow: 0 2px 30px #0003;
}
.counter-title h1 {
    font-size: 28px;
    line-height: 0;
    color: #010e22;
    font-weight: 700;
    font-family: "Cabin";
    margin: 0 0 27px;
}
.counter-title h4 {
    font-size: 16px;
    line-height: 26px;
    color: #616161;
    font-weight: 300;
    font-family: 'Inter';
}
.connter-thumb {
    float: left;
    margin: -11px 15px 0 0;
}
/*<!-- ============================================================== -->
<!-- Start  fintech-about-section  Css -->
<!-- ============================================================== -->*/
.fintech-about-section {
    padding: 100px 0 100px;
}
.fintech-about-section .about_thumb {
    position: relative;
}
.fintech-about-section .about_tmb {
    position: absolute;
    top: 50px;
    left: 87px;
}
.fintech-about-section .about_thumb img {
    width: 100%;
}
.fintech-about-section .section-title {
    text-align: left;
    margin-bottom: 20px;
}
.fintech-about-section .main-title h1 {
    text-align: left;
}
.fintech-about-section .about-discription p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 300;
    font-family: "Inter";
    text-align: left;
    margin: 0;
}
.fintech-about-section .about-buttin {
    margin-top: 30px;
}
.fintech-about-section .about-buttin a {
    display: inline-block;
    font-size: 17px;
    line-height: 28px;
    color: #010e22;
    font-weight: 500;
    font-family: "Cabin";
    text-transform: capitalize;
    border: 1px solid #010E22;
    padding: 14px 35px;
    border-radius: 5px;
    transition: 0.5s;
}
.fintech-about-section .about-buttin a:hover {
    color: #fff;
    border: 1px solid #2771FF;
    background: #2771FF;
}
.fintech-about-section .about-buttin a i {
    display: inline-block;
    margin-left: 5px;
}
/*<!-- ============================================================== -->
<!-- Start  fintech-brand-section  Css -->
<!-- ============================================================== -->*/
.fintech-brand-section {
    background: #F7FAFF;
    padding: 100px 0 40px;
}
.fintech-brand-section .main-title h1 {
    font-size: 24px;
    line-height: 50px;
    color: #010e22;
    font-weight: 600;
    font-family: "Cabin";
    text-align: center;
    margin: 0;
}
.fintech-brand-section .single-brand {
    margin-bottom: 60px;
}









/*<!-- ============================================================== -->
<!-- Start  team-area  Css -->
<!-- ============================================================== -->*/
.team-area {
    padding: 100px 0 70px;
    border-bottom: 1px solid #ECECEC;
}
.single-team {
    transition: .5s;
    margin-bottom: 30px;
}
.team-area .team-content {
    text-align: center;
    padding: 28px 0 0;
    border: 1px solid #ECECEC;
    transition: .5s;
}.team-area .team-content {
    text-align: center;
    padding: 28px 0 0;
    border: 1px solid #ECECEC;
    transition: .5s;
}
.team-area .team-thumb img {
    width: 100%;
}
.team-area .team-title h3 {
    font-size: 20px;
    color: #010e22;
    font-weight: 600;
    margin: 0 0 5px;
    line-height: 25px;
}
.team-area .team-text p {
    font-size: 15px;
    color: #616161;
    font-weight: 400;
    margin: 0;
    transition: .5s;
}
.team-icon ul {
    
}
.team-icon ul li {
    list-style: none;
    display: inline-block;
    margin-right: 5px;
}
.team-icon ul li a {
    display: inline-block;
    font-size: 15px;
    color: #818489;
    opacity: 0;
    transition: .5s;
    position: relative;
    top: -10px;
}
.single-team:hover .team-content{
    border: 1px solid #fff;
}
.single-team:hover .team-text p{
    opacity: 0;
}
.single-team:hover .team-icon ul li a{
    opacity: 1;
    top: -25px;
}
/*<!-- ============================================================== -->
<!-- Start  ceo-quote  Css -->
<!-- ============================================================== -->*/
.ceo-quote {
    padding: 100px 0 100px;
}
.row.back {
    background: url(assets/images/quote-bg.png);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 10px;
    padding: 55px 0 55px;
    text-align: center;
}
.quote-content {
    text-align: center;
}
.quote-text p {
    font-size: 22px;
    line-height: 34px;
    color: #ffffff;
    font-weight: 500;
    font-family: "Cabin";
    text-align: center;
    width: 80%;
    margin: 0 auto 35px;
}
.quote-thumb {
    display: inline-block;
    position: relative;
    right: 15px;
    top: -15px;
}
.quote-title {
    display: inline-block;
    text-align: left;
}
.quote-title h3 {
    font-size: 20px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 600;
    font-family: "Cabin";
    margin: 0;
}
.quote-title span {
    font-size: 15px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 400;
    font-family: "Inter";
}
/*<!-- ============================================================== -->
<!-- Start  team-intro  Css -->
<!-- ============================================================== -->*/
.team-intro-area {
    padding: 90px 0 90px;
}
.team-intro-area .section-title {
    margin-bottom: 20px;
}
.team-intro-area .team-intro-thumb img {
    width: 100%;
}
.team-intro-area .main-title h1 {
    text-align: left;
}
.team-intro-area .sub-title p {
    text-align: left;
}
.intro-icon ul li {
    list-style: none;
    display: block;
    font-size: 16px;
    line-height: 26px;
    color: #616161;
    font-weight: 300;
    font-family: "Inter";
}
.intro-icon ul li i {
    display: inline-block;
    font-size: 30px;
    color: #3779FF;
    position: relative;
    top: 6px;
}
/*<!-- ============================================================== -->
<!-- Start  .brand-area  Css -->
<!-- ============================================================== -->*/
.brand-area {
    padding: 100px 0 100px;
    background: #f7faff;
}
.brand-area .main-title h1 {
    font-size: 24px;
    font-weight: 600;
}
.brand-thumb {
    text-align: center;
}
.brand-area.style-two {
    padding: 75px 0 100px;
    background: none;
}
/*<!-- ============================================================== -->
<!-- Start  about-area  Css -->
<!-- ============================================================== -->*/
.about-area {
    padding: 120px 0 0;
}
.about-area .row.bottom {
    border-bottom: 1px solid #E9EBEC;
    padding-bottom: 16px;
}
.about-area .section-title {
    text-align: left;
    margin-bottom: 25px;
}
.about-area .main-title h1 {
    text-align: left;
}
.about-thumb {
    position: relative;
    top: -30px;
}
.about-title h3 {
    font-size: 18px;
    line-height: 45px;
    color: #010e22;
    font-weight: 500;
    font-family: "Cabin";
    margin: 0;
}
.about-icon {
    display: inline-block;
    margin: 0 6px 0 0px;
    position: relative;
    top: 7px;
}
.about-icon i {
    display: inline-block;
    color: #2D75FF;
    font-size: 30px;
    font-weight: 600;
}
.about-title {
    display: inline-block;
}
.about-discription p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    margin: 0 0 10px 37px;
}
/*<!-- ============================================================== -->
<!-- Start  mission-area  Css -->
<!-- ============================================================== -->*/
.mission-area {
    padding: 90px 0 90px;
}
.mission-area .section-title {
    text-align: left;
    margin-bottom: 26px;
}
.mission-area .main-title h1 {
    text-align: left;
}
.mission-icon {
    float: left;
    margin: 8px 20px 0 0;
}
.mission-icon i {
    display: inline-block;
    font-size: 18px;
    height: 20px;
    width: 20px;
    line-height: 21px;
    text-align: center;
    background: #2871FE;
    color: #fff;
    border-radius: 50%;
}
.mission-discription p {
    opacity: 0.800;
    font-size: 16px;
    line-height: 26px;
    color: #010e22;
    font-weight: 400;
    font-family: "Cabin";
    overflow: hidden;
    width: 70%;
}
.mission-button {
    position: relative;
    top: 35px;
}
.mission-button a {
    font-size: 17px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 500;
    font-family: "Cabin";
    background: #2892FF;
    padding: 19px 41px;
    border-radius: 5px;
    transition: .5s;
}
.mission-button a:hover {
    color: #fff;
    background: linear-gradient(to left, #533efe, #740fd6);
}
.mission-button a i {
    display: inline-block;
    margin-left: 5px;
    transition: .5s;
}
.missions-content .mission-icon {
    float: left;
    margin: 0px 20px 0 0;
}
.missions-content .mission-icon i {
    display: inline-block;
    font-size: 27px;
    background: none;
    color: #2871FE;
}
.missions-content .mission-discription p {
    font-size: 16px;
    line-height: 24px;
    color: #010e22;
    opacity: 1;
}
.missions-persent {
    margin: 40px 25px 0 0;
    padding: 40px 0 0;
    border-top: 1px solid #E6E6E8;
}
.mission-bottom {
    display: inline-block;
}
.mission-number h2 {
    font-size: 42px;
    line-height: 28px;
    color: #010e22;
    font-weight: 700;
    font-family: "Cabin";
}
.mission-bottom.upper {
    display: inline-block;
    margin-right: 50px;
}
.mission-bottom .mission-text p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    margin: 0;
}
.mission-area.style-two .mission-thumb {
    position: relative;
    left: -40px;
}
.mission-area.style-two .mission-thumb img {
    width: 100%;
}
.mission-area.style-two .mission-discrip {
    margin-top: 28px;
    padding: 25px 0 0;
    border-top: 1px solid #E9EBEC;
}
.mission-area.style-two .mission-discrip p {
    font-size: 15px;
    line-height: 24px;
    color: #010e22;
    font-weight: 400;
    font-family: "Inter";
}
/*<!-- ============================================================== -->
<!-- Start  pricing-area  Css -->
<!-- ============================================================== -->*/
.pricing-area {
    padding: 100px 0 80px;
}
.single-tab {
    text-align: center;
}
.pricing-area .tab-title {
    display: inline-block;
    margin: 0 0 0 15px;
}
.pricing-area .tab-title h4 {
    font-size: 16px;
    line-height: 28px;
    color: #2871ff;
    font-weight: 400;
    font-family: "Cabin";
    text-align: center;
    margin: 0;
    padding: 7px 30px;
    border: 1px solid #E5E8ED;
    border-radius: 5px;
    transition: .5s;
}
.pricing-area .tab-title h3 {
    font-size: 16px;
    line-height: 28px;
    color: #010e22;
    font-weight: 400;
    font-family: "Cabin";
    text-align: center;
    margin: 0;
    padding: 7px 30px;
    border: 1px solid #E5E8ED;
    border-radius: 5px;
    transition: .5s;
}
.pricing-area .tab-title h4:hover {
    background: #58B0FF;
    color: #fff;
}
.pricing-area .tab-title h3:hover {
    background: #58B0FF;
    color: #fff;
}
.pricing-area .row.come {
    margin-top: 70px;
}
.pricing-area .single-pricing {
    padding: 30px 30px 35px 40px;
    box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 15%);
    background: #fff;
    transition: .5s;
    margin-bottom: 30px;
}
.pricing-area .pricing-title h3 {
    font-size: 24px;
    line-height: 28px;
    color: #010e22;
    font-weight: 600;
    font-family: "Cabin";
    margin-bottom: 15px;
}
.pricing-area .pricing-title h3 span {
    font-size: 13px;
    line-height: 28px;
    color: #2871ff;
    font-weight: 400;
    background: #EFF6FF;
    padding: 5px 10px;
    border-radius: 3px;
    opacity: 0;
    margin-left: 10px;
    transition: .5s;
}
.pricing-area .pricing-text p {
    font-size: 16px;
    line-height: 24px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    margin: 0 0 25px;
}
.pricing-area .pricing-dolar p {
    font-size: 18px;
    line-height: 28px;
    color: #010e22;
    font-weight: 700;
    font-family: "Cabin";
    margin: 30px 0 20px;
}
.pricing-area .pricing-dolar p span {
    font-size: 36px;
    line-height: 28px;
    color: #010e22;
    font-weight: 700;
    font-family: "Cabin";
    transition: .5s;
}
.pricing-area .pricing-icon-list ul li {
    list-style: none;
    display: block;
    margin-bottom: 10px;
    font-size: 16px;
}
.pricing-area .pricing-icon-list ul li i {
    display: inline-block;
    height: 20px;
    width: 20px;
    line-height: 20px;
    color: #fff;
    border-radius: 50%;
    background: #2A6FFE;
    text-align: center;
    margin-right: 10px;
}
.pricing-area .pricing-button {
    text-align: center;
    margin-top: 35px;
}
.pricing-area .pricing-button a {
    display: inline-block;
    background: #333;
    color: #fff;
    padding: 13px 85px;
    border-radius: 5px;
    transition: .5s;
    font-size: 16px;
}
.pricing-area .pricing-button a:hover {
    background: #2871FE;
    color: #fff;
}
.pricing-area .pricing-button.upper a {
    background: #2871FE;
    color: #fff;
}
.single-pricing.style-two {
    position: relative;
    top: -30px;
}
.pricing-area .single-pricing.style-two .pricing-title h3 span {
    opacity: 1;
}
.pricing-area .single-pricing:hover .pricing-title h3 span {
    opacity: 1;
}
/*<!-- ============================================================== -->
<!-- Start portfolio-area  Css -->
<!-- ============================================================== -->*/
.portfolio-area {
    padding: 90px 0 90px;
    background: #f7f7f7;
}
.single-portfolio {
    margin-bottom: 30px;
    transition: .5s;
}
.portfolio-thumb img {
    width: 100%;
}
.portfolio-content {
    position: absolute;
    bottom: 0px;
    background: #fff;
    padding: 17px 100px 17px 30px;
    opacity: 0;
    transition: .5s;
    left: 78px;
}
.single-portfolio:hover .portfolio-content {
    opacity: 1;
}
.portfolio-thumb {
    position: relative;
}
.portfolio-content .wrapper h3 {
    font-size: 18px;
    color: #010E22;
    text-transform: capitalize;
}
.portfolio-content .wrapper h6 {
    font-size: 16px;
    color: #010E22;
    text-transform: capitalize;
    margin: 0;
}


/*<!-- ============================================================== -->
<!-- Start map-area   Css -->
<!-- ============================================================== -->*/
.row.name {
    overflow: hidden;
}
/*<!-- ============================================================== -->
<!-- Start  company-info-section   Css -->
<!-- ============================================================== -->*/
.company-info-section {
    padding: 90px 0 90px;
}
.company-icon-box {
    background: url(assets/images/contact-bg.png);
    padding: 57px 0px 30px 65px;
    background-size: cover;
    background-repeat: no-repeat;
}
.company-icon-box .company-content {
    margin-top: 40px;
}
.company-icon-box .company-title {
    padding: 13px 0;
}
.company-icon-box .company-titles p {
    font-size: 16px;
    line-height: 24px;
    color: #ffffff;
    font-weight: 400;
    font-family: "Inter";
}
.company-icon-box .company-titles h3 {
    font-size: 28px;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    color: #FFFFFF;
}
.company-icons i {
    font-size: 25px;
    color: #fff;
    text-align: center;
    display: inline-block;
    float: left;
    margin: 15px 22px 0 0;
    height: 50px;
    width: 50px;
    line-height: 50px;
    background: #548DFF;
    border-radius: 5px;
}
.company-title h2 {
    color: #FFFFFF;
    margin: 0px 0px 5px 0px;
    font-weight: 600;
    font-size: 20px;
    font-family: 'Inter', sans-serif;
}
.company-title p {
    font-size: 15px;
    color: #FFFFFF;
    margin: 0;
    font-weight: 400;
    font-family: 'Inter', sans-serif;
    overflow: hidden;
}
.company-text p {
    font-size: 15px;
    font-weight: 400;
    text-align: left;
    font-family: 'Inter', sans-serif;
    color: #FFFFFF;
    line-height: 1.5;
}
.company-info-section .main-titles h3 {
    font-size: 36px;
    line-height: 48px;
    color: #010e22;
    font-weight: 700;
    font-family: "Cabin";
}
.company-info-section .main-titles p {
    font-size: 15px;
    font-weight: 400;
    color: #6e7673;
    text-align: left;
    font-family: 'Inter', sans-serif;
    margin: 0 0 35px;
}
.company-info-section .form_box {
    margin-bottom: 15px;
}
.company-info-section .form_box input {
    width: 100%;
    height: 54px;
    padding-left: 20px;
    background: #F1F7F1;
    border-radius: 3px;
    transition: .5s;
    border: 1px solid #F6F4EC;
}
.company-info-section .form_box textarea {
    width: 100%;
    padding-left: 20px;
    padding-top: 15px;
    border: 1px solid #F6F4EC;
    height: 120px;
    outline: 0;
    transition: .5s;
    background: #F1F7F1;
}
.company-info-section .form_box input:focus{
    box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
    border-color: #80bdff;
    outline: 0;
}
.company-info-section .form_box textarea:focus{
    box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
    border-color: #80bdff;
}
.company-info-section input::placeholder {
    color: #94A9A8;
}
.company-info-section textarea#massage::placeholder {
    color: #94A9A8;
}
.company-info-section .form-button {
    text-align: left;
    margin-top: 25px;
}
.company-info-section .form-button button {
    padding: 13px 35px;
    display: inline-block;
    background: #2871FE;
    color: #fff;
    text-transform: capitalize;
    border-radius: 3px;
    transition: .5s;
    border: navajowhite;
}
.company-info-section .form-button button:hover {
    background: #5A49F8;
    color: #fff;
}
.company-icon-list {
    margin-top: 100px;
}
.company-icon-list ul li {
    list-style: none;
    display: inline-block;
    margin-right: 10px;
}
.company-icon-list ul li.follow-text {
    font-size: 16px;
    line-height: 25px;
    color: #ffffff;
    font-weight: 500;
    font-family: "Cabin";
    text-transform: uppercase;
    margin-right: 15px;
}
.company-icon-list ul li a i {
    display: inline-block;
    font-size: 15px;
    color: #fff;
}
.company-logo {
    position: relative;
    top: -10px;
    left: -30px;
}

/*<!-- ============================================================== -->
<!-- Start  archive-area  Css -->
<!-- ============================================================== -->*/
.archive-area {
    background: #f7faff;
    padding: 90px 0 90px;
}
.single-archive {
    margin-bottom: 30px;
}
.archive-thumb {
    float: left;
    margin: 25px 20px 10px 0;
}
.archive-title h3 {
    font-size: 22px;
    line-height: 56px;
    color: #010e22;
    font-weight: 600;
    font-family: "Cabin";
    margin: 0;
}
.archive-title p {
    font-size: 15px;
    line-height: 26px;
    color: #616161;
    font-weight: 300;
    font-family: "Inter";
    margin: 0;
    overflow: hidden;
}
/*<!-- ============================================================== -->
<!-- Start  process-area  Css -->
<!-- ============================================================== -->*/
.process-area {
    padding: 70px 0 70px;
    border-bottom: 1px solid #E9EBEC;
}
.single-process {
    margin-bottom: 30px;
    position: relative;
}
.single-process::before {
    position: absolute;
    content: "";
    top: 30px;
    left: 165px;
    height: 1px;
    width: 80%;
    border: 1px dashed #A9C7FD;
}
.single-process.upper::before {
    border: inherit;
}
.process-thumb {
    text-align: center;
}
.process-title h3 {
    font-size: 20px;
    line-height: 28px;
    color: #010e22;
    font-weight: 600;
    font-family: "Cabin";
    text-align: center;
    margin: 30px 0 18px;
}
.process-title p {
    font-size: 15px;
    line-height: 26px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    text-align: center;
    margin: 0;
}
/*<!-- ============================================================== -->
<!-- Start  managing-area  Css -->
<!-- ============================================================== -->*/
.managing-area {
    padding: 70px 0 90px;
}
.managing-thumb {
    position: relative;
    left: -30px;
}
.managing-thumb img {
    width: 100%;
}
.managing-discription p {
    font-size: 18px;
    line-height: 34px;
    color: #010e22;
    font-weight: 400;
    font-family: "Inter";
}
.company-logo {
    text-align: right;
}
.managing-director {
    position: relative;
    top: 45px;
}
.managing-director h3 {
    font-size: 18px;
    margin: 0 0 5px;
    line-height: 25px;
}
/*<!-- ============================================================== -->
<!-- Start  call-do-action-area  Css -->
<!-- ============================================================== -->*/
.call-do-action {
    padding: 70px 0 113px;
}
.call-do-button {
    text-align: center;
}
.call-do-action .sub-title p {
    font-size: 16px;
    line-height: 28px;
    margin: 20px auto 0;
    text-align: center;
    width: 50%;
}
.call-do-button a {
    font-size: 17px;
    color: #010e22;
    font-weight: 500;
    padding: 18px 38px;
    border: 1px solid #333;
    border-radius: 5px;
    transition: .5s;
}
.call-do-button a:hover {
    border: 1px solid #2871FE;
    background: #2871FE ;
    color: #fff;
}
.call-do-button a i {
    display: inline-block;
    margin-left: 5px;
}

/*<!-- ============================================================== -->
<!-- Start  faq-area  Css -->
<!-- ============================================================== -->*/
.faq-area {
    padding: 85px 0px 80px 0px;
    background: #f7faff;
}
.faq-area .section-title {
    text-align: center;
    margin-bottom: 20px;
}
.single-faq-box .sub-title p {
    margin: 15px 0 0;
}
.faq-area .section-title h5 {
    margin-left: 60px;
}
.faq-area .accordion {
    max-width: 100%;
    margin: 33px 0 auto 0px;
    border-top: 1px solid #d9e5e8;
    list-style: none;
}
.faq-area .accordion li {
    background: #FFFFFF;
    position: relative;
    margin-bottom: 15px;
}
.faq-area .accordion a {
    width: 100%;
    border: none;
    outline: 0;
    position: relative;
    cursor: pointer;
    text-decoration: none;
    font-weight: 600;
    line-height: 3;
    font-size: 18px;
    text-indent: 40px;
    user-select: none;
    color: #1d2124;
    font-family: 'Cabin';
    box-shadow: 0px 10px 60px 0px rgb(0 0 0 / 10%);
    margin-bottom: 20px;
    padding: 8px 0;
    display: inline-block;
}
.faq-area .accordion a:hover {
    text-decoration: underline;
    color: #2871FE;
}
.faq-area .accordion li a.active {
    background: #fff;
    color: #1d2124;
    padding: 6px 0;
    border-radius: 5px;
    font-size: 18px;
    transition: .5s;
    text-decoration: none;
}
.faq-area .accordion li a.active:hover{
    color: #5a49f8;
}
.faq-area .accordion a.active::before{
    display: none;
}
.faq-area .accordion p {
    display: none;
    padding: 10px 25px 30px;
    color: #646464;
    font-size: 15px;
}
.accordion li a::after {
    content: "\f067";
    font-family: "Font Awesome 5 Free";
    position: absolute;
    right: 20px;
    top: 7px;
}
.accordion  li a.active::after {
    content: "\f068";
}
.faq-button a {
    padding: 13px 35px;
    background: linear-gradient(to right,#533dfd,#730fd5);
    color: #fff;
    transition: .5s;
    font-weight: 600;
    text-transform: capitalize;
    border-radius: 8px;
    display: inline-block;
    margin: 0 10px;
    font-size: 18px;
}
.faq-button a:hover {
    background: linear-gradient(to right,#730fd5,#533dfd);
}



/*<!-- ============================================================== -->
<!-- Start  feature-area  Css -->
<!-- ============================================================== -->*/
.feature-area {
    padding: 100px 0 100px;
    background: #f7faff;
}
.feature-area .main-title h1 {
    text-align: left;
}
.feature-area .section-title {
    margin-bottom: 35px;
}
.feature-area .sub-title {
    text-align: left;
}
.feature-button a {
    font-size: 17px;
    line-height: 28px;
    color: #333;
    font-weight: 500;
    font-family: "Cabin";
    padding: 19px 41px;
    border-radius: 5px;
    transition: .5s;
    border: 1px solid #333;
    display: inline-block;
    text-transform: capitalize;
}
.feature-button a:hover{
    color: #fff;
    border: 1px solid #2871FE;
    background: #2871FE ;
}
.feature-button a i {
    display: inline-block;
    margin-left: 5px;
}
.feature-thumb {
    left: 50px;
    position: relative;
}












/*<!-- ============================================================== -->
<!-- Start  about-area  Css -->
<!-- ============================================================== -->*/
.why-choose-us {
    padding: 130px 0 0px;
}
.why-choose-us .section-title {
    text-align: left;
    margin-bottom: 25px;
}
.why-choose-us .main-title h1 {
    text-align: left;
}
.choose-us-thumb {
    position: relative;
    top: -64px;
}
.choose-us-title h3 {
    font-size: 18px;
    line-height: 45px;
    color: #010e22;
    font-weight: 500;
    font-family: "Cabin";
    margin: 0;
}
.choose-us-icon {
    display: inline-block;
    margin: 0 6px 0 0px;
    position: relative;
    top: 7px;
}
.choose-us-icon i {
    display: inline-block;
    color: #2D75FF;
    font-size: 30px;
    font-weight: 600;
}
.choose-us-title {
    display: inline-block;
}
.choose-us-discription p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    margin: 0 0 10px 37px;
}
/*<!-- ============================================================== -->
<!-- Start  testimonial-area  Css -->
<!-- ============================================================== -->*/
.testimonial-area {
    padding: 100px 0 90px;
    background: #f7faff;
}
.testimonial-area .main-title h1 {
    text-align: left;
}
.testimonial-area .single-testimonial {
    background: #fff;
    padding: 37px 20px 37px;
    position: relative;
    border-radius: 5px;
}
.testimonial-area .testi-discription p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    font-style: italic;
    margin: 0 0 33px;
}
.testimonial-area .testi-thumb {
    float: left;
    margin-right: 15px;
}
.testimonial-area .client-name h3 {
    font-size: 18px;
    line-height: 28px;
    color: #010e22;
    font-weight: 600;
    font-family: "Cabin";
    margin: 0;
}
.testimonial-area .shape-img {
    position: absolute;
    bottom: 50px;
    right: 40px;
}
.testimonial-area .client-name span {
    font-size: 15px;
    line-height: 24px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
}
.testimonial-area .owl-nav {
    position: absolute;
    top: -90px;
    right: 20px;
}
.testimonial-area .owl-nav .owl-prev {
    font-size: 20px;
    margin-left: -70px;
    height: 50px;
    width: 50px;
    line-height: 50px;
    border: 1px solid #E5E9EC;
    border-radius: 50%;
    text-align: center;
    transition: .5s;
}
.testimonial-area .owl-nav .owl-next {
    margin-top: -51px;
    font-size: 20px;
    height: 50px;
    width: 50px;
    line-height: 50px;
    border: 1px solid #E5E9EC;
    border-radius: 50%;
    text-align: center;
    transition: .5s;
}
.testimonial-area .owl-nav .owl-prev:hover {
    border: 1px solid #2772FF;
    color: #fff;
    background:#2772FF ;
}
.testimonial-area .owl-nav .owl-next:hover {
    border: 1px solid #2772FF;
    color: #fff;
    background:#2772FF ;
}
/*<!-- ============================================================== -->
<!-- Start  subscribe-areaa  Css -->
<!-- ============================================================== -->*/
.subscribe-area {
    padding: 100px 0 30px;
}
.subscribe-area .row.bottoms {
    border-bottom: 1px solid #E9EBEC;
    padding-bottom: 100px;
}
.subscribe-area .sub-title p {
    width: 55%;
    text-align: center;
    margin: 20px auto 0; 
}
.subscribe-area .form_box {
    text-align: center;
    position: relative;
}
.subscribe-area .form_box input {
    width: 55%;
    height: 54px;
    padding-left: 20px;
    border-radius: 3px;
    transition: .5s;
    border: 1px solid #E9EBEC;
}
.subscribe-area input::placeholder {
    color: #7D7D7D;
}
.subscribe-area .form_box input:focus {
    border-color: #DEE1E6;
    outline: 0;
}
.subscribe-area .form-button button {
    padding: 13px 35px;
    display: inline-block;
    background: #2871FE;
    color: #fff;
    text-transform: capitalize;
    border-radius: 3px;
    transition: .5s;
    border: navajowhite;
}
.subscribe-area .form-button button:hover {
    color: #fff;
    background: linear-gradient(to left, #533efe, #740fd6);
}
.subscribe-area .form-button {
    position: absolute;
    top: -25px;
    right: 20%;
}
.subscribe-area.upper {
    padding: 90px 0 0px;
}
.subscribe-area.upper .row.bg {
    padding: 70px 0 65px;
    background: url(assets/images/bg1.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 10px;
}
.subscribe-area.upper .row.bg .main-title h1 {
    color: #fff;
}
 .subscribe-area.upper .row.bg .form_box input {
    width: 50%;
    height: 70px;
    padding-left: 20px;
    border-radius: 3px;
    transition: .5s;
    border: 1px solid #E9EBEC;
}
 .subscribe-area.upper .row.bg .form-button button {
    padding: 12px 30px;
    display: inline-block;
    background: #2871FE;
    color: #fff;
    text-transform: capitalize;
    border-radius: 3px;
    transition: .5s;
    border: navajowhite;
}
.subscribe-area.upper .row.bg .form-button {
    position: absolute;
    top: -16px;
    right: 27%;
}
/*<!-- ============================================================== -->
<!-- Start  blog-area  Css -->
<!-- ============================================================== -->*/
.login-section {
    padding: 50px 0 90px;
}
.login-title h1 {
    font-size: 42px;
    font-weight: 500;
    line-height: 60px;
    color: #010e22;
    text-transform: capitalize;
    font-family: 'Cabin';
    margin: 0 0 15px;
    text-align: left;
}
.login-disaription p {
    font-size: 20px;
    line-height: 28px;
    color: #616161;
    font-weight: 400;
    font-family: "Inter";
    margin: 0;
}
.single_login {
    box-shadow: 0px 0px 40px 0px rgb(0 0 0 / 20%);
    padding: 40px 47px 0px;
}
.login-title h3 {
    font-size: 30px;
    color: #010E22;
    font-weight: 500;
}
.login-text {
    margin-bottom: 50px;
}
.login-section .form_box input {
    width: 100%;
    height: 54px;
    padding-left: 40px;
    background: #fff;
    border-radius: 3px;
    transition: .5s;
    border: 1px solid #A8A8A8;
}
.login-section .form_box span {
    position: relative;
    top: -40px;
    left: 15px;
}
.login-section .form_box span i {
    display: inline-block;
    color: #2771FF;
    font-size: 20px;
}
.login-section .form_box {
    margin-bottom: 0;
}
.login-section .form_box p {
    position: absolute;
    top: 7px;
    right: 20px;
}
.login-section .form-button {
    text-align: center;
    margin-top: 0;
}
.login-section .form-button button {
    padding: 14px 190px;
    margin-bottom: 50px;
}
.bottom-text {
    border-top: 1px solid #A8A8A8;
    padding: 15px 0;
}
.login_bottom .bottom-text h5{
    font-size: 16px;
    font-weight: 500;
}
.login_bottom .bottom-text h5 a {
    display: inline-block;
    font-size: 15px;
    color: #2771FF;
}
.login-section.upper .form-button button {
    padding: 14px 150px;
    margin-bottom: 20px;
}
.login-section.upper .bottom-text {
    border-top: none;
    padding: 0 0 10px;
    text-align: center;
}
.login-section.upper .login-title {
    text-align: center;
}
.login-section.upper .login-text p {
    font-size: 16px;
    text-align: center;
    margin: 0;
}
.login-section .login-text p {
    font-size: 16px;
    margin: 0;
}



/*<!-- ============================================================== -->
<!-- Start  blog-area  Css -->
<!-- ============================================================== -->*/
.blog-area {
    padding: 50px 0 70px;
}
.blog-area .section-title {
    text-align: left;
    margin-bottom: 15px;
}
.blog-area .main-title h1 {
    text-align: left;
}
.blog-button a {
    display: inline-block;
    color: #010e22;
    font-size: 16px;
    font-weight: 500;
    font-family: 'Cabin';
}
.blog-button a i {
    display: inline-block;
    color: #4887FF;
    font-size: 16px;
    font-weight: 800;
    margin-left: 5px;
}
.single-blog {
    padding: 0 0 25px;
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 20%);
    transition: .5s;
    margin-bottom: 30px;
}
.single-blog:hover {
    box-shadow: 0px 0px 40px 0px rgb(0 0 0 / 20%);
}
.blog-thumb img {
    width: 100%;
}
.blog-title h2 a{
    display: inline-block;
    font-size: 20px;
    line-height: 30px;
    color: #010e22;
    font-weight: 500;
    font-family: "Cabin";
    margin: 23px 34px 0;
    transition: .5s;
}
.blog-title h2 a:hover{
    color: #5739FA;
}
.blog-area .row.details {
    margin-top: 20px;
}
/*<!-- ============================================================== -->
<!-- Start  footer-area  Css -->
<!-- ============================================================== -->*/
.footer-area {
    padding: 110px 0 0px;
}
.footer-discription p {
    color: #010E22;
    font-size: 15px;
    line-height: 30px;
    font-weight: 300;
    margin: 34px 0 0;
    font-family: 'Inter', sans-serif;
}
.footer-title h3 {
    font-size: 24px;
    line-height: 26px;
    color: #1d2124;
    margin-bottom: 35px;
}
.footer-content ul li {
    list-style: none;
    display: block;
    margin: 0 0 12px;
}
.footer-content ul li a {
    display: inline-block;
    font-size: 16px;
    color: #010E22;
    transition: .5s;
    font-family: "Cabin", Sans-serif;
}
.footer-content ul li a:hover{
    color: #2972FF;
}
.copy-right-area {
    padding: 20px 0 12px;
    background: #2871FF;
    margin-top: 70px;
}
.copyright-title h3 {
    font-size: 16px;
    line-height: 26px;
    color: #fff;
    font-weight: 400;
    font-family: 'Inter';
}
.copyright-title h3 span {
    color: #1B51BD;
}

/*<!-- ============================================================== -->
<!-- Start bg-bar  Css -->
<!-- ============================================================== -->*/
.sideber-search-box {
    margin-bottom: 40px;
    padding: 2px 30px 8px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e6e6e6;
    box-shadow: 0 0 5px rgb(0 0 0 / 10%);
}
.sideber-box {
    margin-bottom: 40px;
    padding: 35px 30px 35px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e6e6e6;
    box-shadow: 0 0 5px rgb(0 0 0 / 10%);
}
.bg-bar {
    position: relative;
    z-index: 1;
}
.bg-bar::before {
    position: absolute;
    left: 0;
    bottom: 20px;
    width: 88px;
    height: 3px;
    background: #aec6ef;
    content: "";
}
.bg-bar::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 18px;
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background: #5a49f8;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: MOVE-BG;
    animation-name: MOVE-BG;
}
@-webkit-keyframes MOVE-BG {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(88px);
            transform: translateX(88px);
  }
}
.resent-post-single-box {
    border-bottom: 1px solid #E8E8E8;
    padding-bottom: 50px;
    margin-bottom: 16px;
}
.blog-thub img {
    width: 100%;
}
.resent-thunb img {
    border-radius: 5px;
    width: 28%;
    float: left;
    margin-right: 12px;
    height: 70px;
}
.resent-title {
    position: relative;
    top: 14px;
}
.resent-title a h3 {
    color: #1d2124;
    font-size: 16px;
    line-height: 22px;
    font-weight: 600;
    margin-bottom: 0;
}
.resent-title a span {
    color: #616161;
}
.resent-post-single-box.two {
    border: none;
    margin: 0;
    padding: 0 0 20px;
}
.catagories-body ul li{
    list-style: none;
    margin-bottom: 10px;
    border-bottom: 1px solid #E8E8E8;
    transition: .5s;
    padding-bottom: 10px;
}
.catagories-body ul li a {
    color: #616161;
    font-size: 16px;
    font-family: 'Poppins', sans-serif;
    transition: .5s;
}
.catagories-body ul li a:hover {
    color: #5A49F8;
}
.sidebar-search {
    margin-bottom: 30px;
}


.tag-body ul {
    list-style: none;
}
.tag-body ul li {
    display: inline-block;
    margin: 0 10px 9px 0;
}
.tag-body ul li a {
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    color: #616161;
    text-transform: capitalize;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
    padding: 5px 14px;
    background: #fff;
    transition: .5s;
}
.tag-body ul li a:hover {
    color: #fff;
    background: #2771FF;
}
.form-control {
    top: 31px;
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    padding: 28px 10px;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #949494;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    position: relative;
}
.sideber-search-box button a {
    position: absolute;
    right: 60px;
    top: 50px;
    display: inline-block;
    color: #616161;
    font-size: 18px;
}
.paginationss-title {
    padding-top: 40px;
    text-align: left;
    border-top: 1px solid #e6e6e6;
    margin-top: 0;
    width: 90%;
    position: relative;
    left: 31px;
    margin-bottom: 30px;
}
.paginationss-title ul {
    display: inline-block;
}
.paginationss-title ul li {
    list-style: none;
    display: inline-block;
    margin-right: 10px;
}
.paginationss-title ul li a i {
    border: 1px solid #e6e6e6;
    color: #565872;
    display: inline-block;
    font-size: 15px;
    height: 40px;
    line-height: 41px;
    margin: 0 0 0 0;
    text-align: center;
    width: 40px;
    border-radius: 5px;
}
.paginationss-title ul li a i:hover {
    background: #5F4FF8;
    border-color: #5F4FF8;
    color: #fff;
}
.contact-title h3 {
    font-size: 24px;
    font-weight: 600;
    text-transform: capitalize;
    margin-bottom: 35px;
    color: #1d2124;
    font-family: 'Poppins', sans-serif;
    position: relative;
}
.sideber-title h3 {
    color: #232323;
    display: block;
    font-size: 21px;
    margin-bottom: 28px;
    padding-bottom: 0;
    position: relative;
    text-transform: capitalize;
}
 .form_box {
    margin-bottom: 15px;
}
.form_box input {
    width: 100%;
    height: 54px;
    padding-left: 20px;
    background: #fff;
    border-radius: 3px;
    transition: .5s;
    border: 1px solid #EEECFE;
}
.form_box textarea {
    width: 100%;
    padding-left: 20px;
    padding-top: 15px;
    border: 1px solid #EEECFE;
    height: 150px;
    outline: 0;
    transition: .5s;
    background: #fff;
    margin-top: 7px;
}
 .form_box input:focus{
    box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
    border-color: #80bdff;
    outline: 0;
}
 .form_box textarea:focus{
    box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
    border-color: #80bdff;
}
 input::placeholder {
    color: #94A9A8;
}
 textarea#massage::placeholder {
    color: #94A9A8;
}
.form-button {
    text-align: left;
    margin-top: 20px;
}
.form-button button {
    display: inline-block;
    color: #fff;
    font-weight: 400;
    padding: 14px 35px;
    text-transform: capitalize;
    transition: 0.5s;
    font-size: 18px;
    position: relative;
    z-index: 1;
    border-radius: 5px;
    overflow: hidden;
    margin-top: 5px;
    background: #2771FF;
    border: none;
}
.form-button button:hover {
    color: #fff;
    background: linear-gradient(to left, #533efe, #740fd6);
}

.blog-area.style-one .blog-title span {
    font-size: 15px;
    color: #2871ff;
    line-height: 24px;
    font-weight: 400;
    font-family: 'Cabin';
    background: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    position: relative;
    top: -15px;
    left: 30px;
}
.blog-area.style-one .blog-title p {
    font-size: 15px;
    position: relative;
    left: 33px;
    color: #616161;
    transition: .5s;
}
.blog-area.style-one .single-blog:hover .blog-title p{
    color: #2B72FF;
}
.blog-area.style-one .single-blog:hover .blog-title h2 a{
    color: #2B72FF;
}
.blog-area.style-one .blog-title h2 a {
    font-size: 26px;
}
.blog-number ul {
    position: relative;
    left: 10px;
}
.blog-number ul li {
    display: inline-block;
    list-style: none;
    margin-right: 5px;
}
.blog-number ul li a {
    display: inline-block;
    border: 1px solid #DEE1E6;
    height: 50px;
    width: 50px;
    line-height: 50px;
    text-align: center;
    border-radius: 50%;
    transition: .5s;
    color: #000F22;
    font-weight: 600;
}
.blog-number ul li a:hover {
    border: 1px solid #2771FF;
    background: #2771FF;
    color: #fff;
}
.blog-number ul li a i{
    display: inline-block;
    color: #000F22;
    font-weight: 600;
}
.blog-number ul li a i:hover{
    color: #fff;
}
.blog-area.style-two .blog-title p {
    position: relative;
    top: 30px;
    color: #2871ff;
}
.blog-area.style-two .blog-title p span {
    color: #27293C;
    margin-left: 20px;
    position: relative;
}
.blog-area.style-two .blog-title p span::before {
    position: absolute;
    content: "";
    top: 8px;
    left: -16px;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background: #D4D4D4;
}
.blog-area.style-two .blog-title h2 a {
    display: inline-block;
    font-size: 30px;
    line-height: 32px;
    font-weight: 500;
    font-family: "Cabin";
    margin: 30px 0 0;
    transition: .5s;
    color: #010e22;
    text-align: left;
}
.blog-area.style-two .single-blog {
    padding: 0 0 25px;
    box-shadow: inherit;
    transition: .5s;
    margin-bottom: 30px;
}
.blog-area.style-two .blog-discription p {
    font-size: 16px;
    line-height: 28px;
    color: #616161;
    font-family: 'Inter';
    font-weight: 400;
    margin: 30px  0;
}
.blog-area.style-two .blog-discription p span {
    color: #4A87FF;
}
.blog-area.style-two .blog-text {
    position: relative;
    margin-left: 35px;
}
.blog-area.style-two .blog-text::before {
    position: absolute;
    top: 0;
    left: -30px;
    content: "";
    height: 100%;
    width: 3px;
    background: #2871FE;
}
.blog-area.style-two .blog-text p {
    font-size: 18px;
    line-height: 30px;
    color: #010e22;
    font-weight: 400;
    font-style: italic;
    font-family: "Cabin";
    margin: 0;
}
.blog-area.style-two .blog-text span {
    font-size: 15px;
    color: #2672FF;
}
.blog-area.style-two .blogs-titles {
    margin-top: 15px;
}
.blog-area.style-two .blogs-titles h2  {
    display: inline-block;
    font-size: 36px;
    line-height: 45px;
    font-weight: 700;
    font-family: "Cabin";
    margin: 30px 0 0;
    transition: .5s;
    color: #010e22;
    text-align: left;
}
.blog-area.style-two .blog-icon-list ul li {
    display: block;
    list-style: none;
    font-size: 16px;
    color: #616161;
    margin: 5px 0 0;
}
.blog-area.style-two .blog-icon-list ul li i {
    display: inline-block;
    margin-right: 10px;
    font-size: 20px;
    line-height: 28px;
    color: #296CF1;
    font-weight: 800;
}
.blog-area.style-two .blog-tab ul {
    margin-top: 35px;
    padding-bottom: 40px;
    border-bottom: 1px solid #DEE1E6;
}
.blog-area.style-two .blog-tab ul li {
    display: inline-block;
    list-style: none;
    margin-right: 10px;
}
.blog-area.style-two .blog-tab ul li a{
    display: inline-block;
    list-style: none;
    margin-right: 10px;
    padding: 5px 15px;
    border: 1px solid #DEE1E6;
    border-radius: 5px;
    transition: .5s;
}
.blog-area.style-two .blog-tab ul li a:hover {
    border: 1px solid #2771FF;
    color: #fff;
    background: #2771FF;
}


/* bounce-animate */
.bounce-animate {
  animation-name: float-bob;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob;
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob;
  -ms-animation-duration: 2s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob;
  -o-animation-duration: 2s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear; }
.bounce-animate2 {
  animation-name: float-bob2;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob2;
  -moz-animation-duration: 3s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob2;
  -ms-animation-duration: 3s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob2;
  -o-animation-duration: 3s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear; }
.bounce-animate3 {
  animation-name: float-bob3;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob3;
  -moz-animation-duration: 4s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob3;
  -ms-animation-duration: 4s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob3;
  -o-animation-duration: 4s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear; }
.bounce-animate4 {
  animation-name: float-bob4;
  animation-duration: 5s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob4;
  -moz-animation-duration: 5s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob4;
  -ms-animation-duration: 5s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob4;
  -o-animation-duration: 5s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear; }
 .bounce-animate5 {
  animation-name: float-bob5;
  animation-duration: 6s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob5;
  -moz-animation-duration: 6s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob5;
  -ms-animation-duration: 6s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob5;
  -o-animation-duration: 6s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear; }
@-webkit-keyframes float-bob {
  0% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px); }
  50% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px); }
  100% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px); } }
@-webkit-keyframes float-bob2 {
  0% {
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px); }
  50% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px); }
  100% {
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px); } }
@-webkit-keyframes float-bob3 {
  0% {
    -webkit-transform: translateY(-40px);
    transform: translateY(-40px); }
  50% {
    -webkit-transform: translateY(-25px);
    transform: translateY(-25px); }
  100% {
    -webkit-transform: translateY(-40px);
    transform: translateY(-40px); } }
@-webkit-keyframes float-bob4 {
  0% {
    -webkit-transform: translateY(-70px);
    transform: translateY(-70px); }
  50% {
    -webkit-transform: translateY(-35px);
    transform: translateY(-35px); }
  100% {
    -webkit-transform: translateY(-70px);
    transform: translateY(-70px); } }
@-webkit-keyframes float-bob5 {
  0% {
    -webkit-transform: translateY(-75px);
    transform: translateY(-75px); }
  50% {
    -webkit-transform: translateY(-35px);
    transform: translateY(-35px); }
  100% {
    -webkit-transform: translateY(-75px);
    transform: translateY(-75px); } }
@-webkit-keyframes movebounce {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
/* bounce-animate */    
@-webkit-keyframes movebounce {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}

@keyframes movebounce {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}

@-webkit-keyframes moveleftbounce {
  0% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
  50% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
  }
  100% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
}

@keyframes moveleftbounce {
  0% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
  50% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
  }
  100% {
    -webkit-transform: translateX(0px);
            transform: translateX(0px);
  }
}
/* rotateme*/
.rotateme {
  -webkit-animation-name: rotateme;
          animation-name: rotateme;
  -webkit-animation-duration: 20s;
          animation-duration: 20s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}

@keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@-webkit-keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}

@-webkit-keyframes rotate3d {
  0% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}

/*** 
====================================================================
  Search Popup
====================================================================
***/

.search-popup{
  position: fixed;
  left: 0;
  top: 0;
  height: 100vh;
  width: 100%;
  z-index: 99999;
  margin-top: -540px;
  transform: translateY(-100%);
  background-color: rgba(0,0,0,0.90);
    -webkit-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition: all 1500ms cubic-bezier(0.860, 0.000, 0.070, 1.000); /* easeInOutQuint */
    -webkit-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000); /* easeInOutQuint */
}

.search-popup{
  width: 100%;
}
.search-active .search-popup{
  transform: translateY(0%);
  margin-top: 0;
}
.search-box-btn.search-box-outer {
    display: inline-block;
    position: absolute;
    right: -20px;
    top: 35px;
}
.search-box-btn.search-box-outer i {
    display: inline-block;
    text-align: center;
    font-size: 18px;
    cursor: pointer;
    color: #fff;
    margin-top: 0px;
}
.sticky-nav .search-box-btn.search-box-outer i {
    color: #fff;
    position: relative;
    left: 40px;
}
.search-popup .close-search {
    position: absolute;
    left: 0;
    right: 0;
    top: 75%;
    margin: 0 auto;
    margin-top: -200px;
    border-radius: 50%;
    text-align: center;
    background-color: #5A49F8;
    width: 70px;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
    border-bottom: 3px solid #ffffff;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    opacity: 0;
    visibility: hidden;
    height: 70px;
    line-height: 70px;
    text-align: center;
}

.search-popup .close-search i {
    position: relative;
    height: 70px;
    width: 70px;
    font-size: 30px;
    line-height: 70px;
    color: #fff;
    display: inline;
    text-align: center;
}

.search-active .search-popup .close-search{
  visibility: visible;
  opacity: 1;
  top: 50%;
  -webkit-transition-delay: 1500ms;
  -moz-transition-delay: 1500ms;
  -ms-transition-delay: 1500ms;
  -o-transition-delay: 1500ms;
  transition-delay: 1500ms;
}

.search-popup form{
  position: absolute;
  max-width: 700px;
  top: 50%;
  left: 15px;
  right: 15px;
  margin:-35px auto 0;
  transform: scaleX(0);
  transform-origin: center;
  background-color: #111111;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -ms-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease;
}

.search-active .search-popup form{
  transform: scaleX(1);
  -webkit-transition-delay: 1200ms;
  -moz-transition-delay: 1200ms;
  -ms-transition-delay: 1200ms;
  -o-transition-delay: 1200ms;
  transition-delay: 1200ms;
}

.search-popup .form-group{
  position:relative;
  margin:0px; 
  overflow: hidden;
}
.search-popup .close-search.style-two{
  position: absolute;
  right: 25px;
  left: auto;
  color:#ffffff;
  width:auto;
  height:auto;
  top:25px;
  margin:0px;
  border:none;
  background:none !important;
  box-shadow:none !important;
  -webkit-transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
  transition:all 500ms ease;
}

.search-popup .close-search.style-two i {
    font-size: 20px;
    color: #fff;
}
.search-popup .form-group input[type="text"],
.search-popup .form-group input[type="search"]{
  position:relative;
  display:block;
  font-size:18px;
  line-height: 50px;
  color:#000000;
  height:70px;
  width:100%;
  padding: 10px 30px;
  background-color: #ffffff;
  -webkit-transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
  transition:all 500ms ease;
  font-weight:500;
  text-transform:capitalize;
}
.search-popup .form-group input[type="submit"], .search-popup .form-group button {
    position: absolute;
    right: 30px;
    top: 0px;
    height: 70px;
    line-height: 70px;
    background: transparent;
    text-align: center;
    font-size: 24px;
    color: #000000;
    padding: 0;
    cursor: pointer;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    border: none;
}

.search-popup .form-group input[type="submit"]:hover,
.search-popup .form-group button:hover{
  color: #000000;
}

.search-popup input::placeholder,
.search-popup textarea::placeholder{
  color:#000000;
}

/*===========================scroll strat===========================  
 ===========================************===========================  */ 
.scroll-area {
  position: relative;
  z-index: 999;
}
.scroll-area .go-top {
  position: fixed;
  cursor: pointer;
  top: 0;
  right: 30px;
  color: #ffffff;
  background-image: -moz-linear-gradient(0deg, #d1651a 0%, #c1282a 100%);
  background-image: -webkit-linear-gradient(0deg, #d1651a 0%, #c1282a 100%);
  background-image: -ms-linear-gradient(0deg, #d1651a 0%, #c1282a 100%);
  z-index: 9999;
  width: 45px;
  text-align: center;
  height: 45px;
  line-height: 42px;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.9s ease-out 0s;
  -moz-transition: all 0.9s ease-out 0s;
  -ms-transition: all 0.9s ease-out 0s;
  -o-transition: all 0.9s ease-out 0s;
  transition: all 0.9s ease-out 0s;
  border-radius: 10px;
}
.scroll-area .go-top i {
  position: absolute;
  top: 50%;
  left: -4px;
  right: 0;
  margin: 0 auto;
  font-size: 15px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}
.scroll-area .go-top i:last-child {
  opacity: 0;
  visibility: hidden;
  top: 60%;
}
.scroll-area .go-top::before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    animation: zoomBig 3.25s linear infinite;
    -webkit-animation-delay: 0.75s;
    animation-delay: 0.75s;
}
.scroll-area .go-top:focus, .scroll-area .go-top:hover {
  color: #fff;
}
.scroll-area .go-top:focus::before, .scroll-area .go-top:hover::before {
  opacity: 1;
  visibility: visible;
}
.scroll-area .go-top:focus i:first-child, .scroll-area .go-top:hover i:first-child {
  opacity: 0;
  top: 0;
  visibility: hidden;
}
.scroll-area .go-top:focus i:last-child, .scroll-area .go-top:hover i:last-child {
  opacity: 1;
  visibility: visible;
  top: 50%;
}
.scroll-area .go-top.active {
  top: 95%;
  -webkit-transform: translateY(-98%);
  -moz-transform: translateY(-98%);
  -ms-transform: translateY(-98%);
  -o-transform: translateY(-98%);
  transform: translateY(-98%);
  opacity: 1;
  visibility: visible;
  border-radius: 0;
  right: 50px;
  border-radius: 100%;
}
.top-wrap {
  position: relative;
}
.top-wrap .go-top-button {
    display: inline-block;
    width: 60px;
    height: 59px;
    line-height: 60px;
    text-align: center;
    color: #fff;
    top: 3px;
    z-index: 1;
    background-image: -moz-linear-gradient(0deg, #d1651a 0%, #c1282a 100%);
    background: #2771FF;
    background-image: -ms-linear-gradient(0deg, #d1651a 0%, #c1282a 100%);
}
.top-wrap .go-top-button i {
  font-size: 20px;
  font-weight: 700;
  padding-left: 4px;
  color: #fff;
}
.top-wrap .go-top-button::after {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    animation: zoomBig 3.25s linear infinite;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
}
@keyframes zoomBig {
  0% {
    transform: translate(-50%, -50%) scale(0.5);
    opacity: 1;
    border-width: 3px;
  }
  40% {
    opacity: 0.5;
    border-width: 2px;
  }
  65% {
    border-width: 1px;
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0;
    border-width: 1px;
  }
}
/*<!-- ============================================================== -->
<!-- Start  sticky-nav  Css -->
<!-- ============================================================== -->*/
.sticky-nav {
    left: 0;
    margin: auto;
    top: 0;
    width: 100%;
    position: fixed !important;
    box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
    -webkit-animation: 300ms running fadeInDown;
    animation: 500ms running fadeInUp;
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    transition: 0.5s !important;
    background: #fff!important;
    z-index: 9999 !important;
    animation-name: slideInDown;
    padding: 0 40px 7px;
}
.sticky-nav li.icon {
    color: #fff;
}
.sticky-nav.nav-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.sticky-nav .heder-menu {
    display: inline-block;
    position: relative;
    left: 10%;
}
a.main_sticky {
    display: none;
}

.sticky-nav .header-menu ul li a{
    color: #fff!important;
}
.sticky-nav a.main_sticky {
    display: inline-block !important;
}
.sticky-nav .header-logo a {
    display: none;
}
.sticky-nav ul.sub-menu li a {
    display: inline-block;
    margin: 6px 0px 6px 21px;
    color: #6e7673 !important;
    transition: .5s;
}
.sticky-nav .header-con i {
    color: #fff;
}
.header-menu ul .sub-menu li {
    display: block;
    margin-right: 0;
    transition: .5s;
}
 ul.sub-menu li:hover{
    background: #87C03D;
}
 ul.sub-menu li a:hover{
    color: #fff !important;
}
.sticky-nav ul.sub-menu li:hover{
    background: #87C03D;
}
.sticky-nav ul.sub-menu li a:hover{
    color: #fff !important;
}



/*Loader*/

.loader-wrapper {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    transition: 0.8s 1s ease;
    z-index: 666;
}
.loader {
  position: relative;
  display: block;
  z-index: 201;
  top: 50%;
  left: 50%;
  width: 100px;
  height: 100px;
  margin: -50px 0 0 -50px;
  border-radius: 50%;
  transition: all 1s 1s ease;
  border: 3px solid transparent;
  border-top-color: #F2CD00;
  -webkit-animation: spin 1.5s linear infinite;
  -moz-animation: spin 1.5s linear infinite;
  -o-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}
.loader:before {
  position: absolute;
  content: '';
  top: 6px;
  left: 6px;
  right: 6px;
  bottom: 6px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-left-color: #010E22;
  -webkit-animation: spin 2s linear infinite;
  -moz-animation: spin 2s linear infinite;
  -o-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
.loader:after {
  position: absolute;
  content: '';
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-right-color: #fff;
  -webkit-animation: spin 2.5s linear infinite;
  -moz-animation: spin 2.5s linear infinite;
  -o-animation: spin 2.5s linear infinite;
  animation: spin 2.5s linear infinite;
}
/* Here comes the Magic */

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-moz-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.loader-wrapper .loder-section {
    position: fixed;
    top: 0;
    width: 52%;
    height: 100%;
    background: #2771FF;
    z-index: 2;
}
.loader-wrapper .loder-section.left-section {
  left: 0;
  transition: 1s 1.4s ease;
}
.loader-wrapper .loder-section.right-section {
  right: 0;
  transition: 1s 1.4s ease;
}

/* When page loaded */
.loaded .loder-section.left-section {
  left: -100%;
}
.loaded .loder-section.right-section {
  right: -100%;
}
.loaded .loader-wrapper {
  visibility: hidden;
}
.loaded .loader {
  top: -100%;
  opacity: 0;
}

/* ================= VISIOpaie Hero — Moteur de paie + Agents IA ================= */
.vp-hero{
	position:relative;
	background:#ffffff;
	padding:70px 0 60px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-hero .container-fluid{
	position:relative;
	z-index:1;
	max-width:1560px;
	padding:0 50px;
	margin:0 auto;
}
.vp-hero-grid{
	display:grid;
	grid-template-columns:1.35fr 2.3fr 1fr;
	gap:24px;
	align-items:center;
}

/* ---- Left column ---- */
.vp-hero-left{
	align-self:flex-start;
	margin-top:-24px;
	padding-left:14px;
	padding-right:18px;
}
.vp-badge{
	display:inline-flex;
	align-items:center;
	gap:8px;
	background:linear-gradient(180deg,#ffffff 0%,#f6f9ff 100%);
	color:#2871FE;
	padding:9px 18px;
	border-radius:999px;
	font-size:12.5px;
	font-weight:700;
	letter-spacing:.5px;
	text-transform:uppercase;
	border:1px solid rgba(40,113,254,.25);
	box-shadow:0 8px 20px -12px rgba(40,113,254,.4), inset 0 1px 0 rgba(255,255,255,.8);
	margin-bottom:54px;
}
.vp-hero-title{
	font-family:"Cabin";
	font-size:34px;
	line-height:1.22;
	font-weight:800;
	color:#0a1224;
	margin:0 0 18px;
}
.vp-hero-title .vp-blue{ color:#2871FE; }
.vp-hero-rule{
	display:block;
	width:44px;
	height:3px;
	background:#2871FE;
	border-radius:2px;
	margin-bottom:20px;
}
.vp-hero-lead{
	color:#5b6579;
	font-size:15.5px;
	line-height:1.75;
	max-width:430px;
	margin:0 0 30px;
}
.vp-hero-lead strong{ color:#2871FE; font-weight:700; }
.vp-hero-buttons{
	display:flex;
	flex-wrap:wrap;
	gap:14px;
	margin-bottom:38px;
}
.vp-btn-primary,
.vp-btn-outline{
	display:inline-flex;
	align-items:center;
	gap:9px;
	padding:15px 24px;
	border-radius:10px;
	font-size:14.5px;
	font-weight:700;
	white-space:nowrap;
	transition:.3s cubic-bezier(.4,0,.2,1);
}
.vp-btn-primary{
	background:linear-gradient(135deg,#3b82ff 0%,#2871FE 55%,#1c5ce0 100%);
	color:#fff;
	box-shadow:0 16px 30px -12px rgba(40,113,254,.6), inset 0 1px 0 rgba(255,255,255,.25);
}
.vp-btn-primary:hover{
	background:linear-gradient(135deg,#4b8cff 0%,#2871FE 55%,#164cc2 100%);
	color:#fff;
	transform:translateY(-2px);
	box-shadow:0 20px 36px -12px rgba(40,113,254,.7), inset 0 1px 0 rgba(255,255,255,.3);
}
.vp-btn-primary img{ width:14px; height:14px; }
.vp-btn-outline{
	background:#fff;
	color:#2871FE;
	border:2px solid #2871FE;
	padding:13px 22px;
}
.vp-btn-outline:hover{
	background:#2871FE;
	color:#fff;
	transform:translateY(-2px);
	box-shadow:0 16px 28px -14px rgba(40,113,254,.5);
}
.vp-btn-outline:hover img{ filter:brightness(0) invert(1); }
.vp-btn-outline img{ width:14px; height:14px; transition:filter .25s ease; }
.vp-hero-trust{
	display:flex;
	flex-wrap:wrap;
	gap:26px;
}
.vp-trust-item{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:10px;
}
.vp-trust-item span.vp-trust-icon{
	width:38px;
	height:38px;
	border-radius:11px;
	background:linear-gradient(180deg,#f3f7ff 0%,#e9f0ff 100%);
	border:1px solid rgba(40,113,254,.15);
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-trust-item img{ width:19px; height:19px; }
.vp-trust-item span{
	font-size:13px;
	font-weight:700;
	line-height:1.35;
	color:#0a1224;
}

/* ---- Center diagram ---- */
.vp-hero-diagram{
	position:relative;
	width:100%;
	max-width:640px;
	aspect-ratio:660/850;
	margin:-30px auto 0;
}
.vp-hero-core{
	position:absolute;
	left:50%;
	top:49%;
	width:88%;
	transform:translate(-50%,-50%);
	pointer-events:none;
	user-select:none;
}
.vp-agent{
	position:absolute;
	transform:translate(-50%,-50%);
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
	width:110px;
	transition:transform .3s cubic-bezier(.4,0,.2,1);
	cursor:default;
}
.vp-agent:hover{ transform:translate(-50%,-50%) translateY(-4px); }
.vp-agent-photo{
	position:relative;
	width:78px;
	height:78px;
	border-radius:50%;
	overflow:visible;
	background:#fff;
	box-shadow:0 12px 24px -10px rgba(10,18,36,.4), 0 0 0 6px rgba(255,255,255,.9), 0 0 0 7px rgba(10,18,36,.04);
	transition:box-shadow .3s ease;
}
.vp-agent:hover .vp-agent-photo{
	box-shadow:0 16px 30px -8px rgba(10,18,36,.45), 0 0 0 6px rgba(255,255,255,.95), 0 0 22px -2px var(--vp-ring,#2871FE);
}
.vp-agent-photo img.vp-photo{
	width:100%;
	height:100%;
	border-radius:50%;
	object-fit:cover;
	display:block;
	border:3px solid var(--vp-ring,#2871FE);
	box-sizing:border-box;
}
.vp-agent-icon{
	position:absolute;
	right:-4px;
	bottom:-4px;
	width:30px;
	height:30px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	background:var(--vp-ring,#2871FE);
	border:2.5px solid #fff;
	box-shadow:0 4px 10px -2px rgba(10,18,36,.35);
}
.vp-agent-icon img{ width:15px; height:15px; }
.vp-agent-name{
	margin-top:10px;
	font-size:13.5px;
	font-weight:800;
	letter-spacing:.3px;
	color:var(--vp-ring,#0a1224);
}
.vp-agent-role{
	font-size:12px;
	color:#5b6579;
	margin-top:1px;
}

/* Agent positions (percent of diagram box) + accent colors */
.vp-agent-emma      { left:50%; top:11.5%; --vp-ring:#8b5cf6; }
.vp-agent-thomas     { left:18.5%; top:23.5%; --vp-ring:#17a35c; }
.vp-agent-lucas      { left:82%; top:23.5%; --vp-ring:#f5a623; }
.vp-agent-chloe      { left:8.5%;  top:47%;   --vp-ring:#8b5cf6; }
.vp-agent-pierre     { left:90.5%; top:47%;   --vp-ring:#17a35c; }
.vp-agent-elisabeth  { left:18.5%; top:70.5%; --vp-ring:#17a35c; }
.vp-agent-michel     { left:79.5%; top:70.5%; --vp-ring:#2871FE; }
.vp-agent-sophie     { left:37%;   top:84%;   --vp-ring:#ec4899; }
.vp-agent-marc       { left:64.5%; top:84%;   --vp-ring:#f5a623; }

/* ---- Right column (benefits) ---- */
.vp-hero-benefits{
	display:flex;
	flex-direction:column;
	gap:26px;
	align-self:flex-start;
	margin-top:110px;
}
.vp-benefit{
	display:flex;
	align-items:flex-start;
	gap:14px;
	padding-bottom:26px;
	border-bottom:1px solid #e6e9f2;
	transition:transform .3s ease;
}
.vp-benefit:hover{ transform:translateX(3px); }
.vp-benefit:last-child{
	padding-bottom:0;
	border-bottom:none;
}
.vp-benefit-icon{
	flex:0 0 auto;
	width:52px;
	height:52px;
	border-radius:50%;
	background:linear-gradient(160deg,#ffffff 0%,#f0f5ff 100%);
	border:1.5px solid rgba(40,113,254,.22);
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 10px 20px -12px rgba(40,113,254,.45), inset 0 1px 0 rgba(255,255,255,.9);
	transition:box-shadow .3s ease, transform .3s ease;
}
.vp-benefit:hover .vp-benefit-icon{
	box-shadow:0 12px 24px -10px rgba(40,113,254,.55), inset 0 1px 0 rgba(255,255,255,.9);
	transform:scale(1.06);
}
.vp-benefit-icon img{ width:22px; height:22px; }
.vp-benefit h4{
	font-size:15.5px;
	font-weight:800;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-benefit p{
	font-size:13px;
	line-height:1.55;
	color:#5b6579;
	margin:0;
	max-width:210px;
}

/* ---- Bottom banner ---- */
.vp-hero-banner{
	margin-top:52px;
	background:linear-gradient(180deg,#ffffff 0%,#f8fafe 100%);
	border:1px solid #e6e9f2;
	border-radius:14px;
	padding:18px 30px;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	text-align:center;
	box-shadow:0 18px 36px -22px rgba(10,18,36,.3), inset 0 1px 0 rgba(255,255,255,.9);
}
.vp-hero-banner .vp-spark{ color:#2871FE; font-size:16px; }
.vp-hero-banner p{
	margin:0;
	font-size:15px;
	color:#333f4f;
}
.vp-hero-banner strong{ color:#2871FE; font-weight:700; }

@media (max-width:1400px){
	.vp-hero-title{ font-size:34px; }
	.vp-agent{ width:96px; }
	.vp-agent-photo{ width:66px; height:66px; }
}
@media (max-width:1199px){
	.vp-hero-grid{ grid-template-columns:1fr; }
	.vp-hero-benefits{
		flex-direction:row;
		flex-wrap:wrap;
		justify-content:center;
		margin-top:40px;
	}
	.vp-hero-benefits .vp-benefit{ width:46%; }
	.vp-hero-diagram{ margin:40px auto; }
	.vp-hero-left{ text-align:center; }
	.vp-hero-title, .vp-hero-lead{ margin-left:auto; margin-right:auto; }
	.vp-hero-buttons, .vp-hero-trust{ justify-content:center; }
}
@media (max-width:767px){
	.vp-hero .container-fluid{ padding:0 20px; }
	.vp-hero-title{ font-size:28px; }
	.vp-hero-diagram{ max-width:420px; }
	.vp-agent{ width:76px; }
	.vp-agent-photo{ width:50px; height:50px; }
	.vp-agent-icon{ width:22px; height:22px; }
	.vp-agent-icon img{ width:11px; height:11px; }
	.vp-agent-name{ font-size:11px; }
	.vp-agent-role{ font-size:10px; }
	.vp-hero-benefits .vp-benefit{ width:100%; }
	.vp-hero-banner{ flex-direction:column; padding:18px 20px; }
}
@media (max-width:575px){
	.vp-hero{ padding:50px 0 40px; }
	.vp-hero-title{ font-size:24px; }
	.vp-hero-lead{ font-size:14px; }
	.vp-hero-diagram{ max-width:100%; }
	.vp-hero-benefits .vp-benefit{ width:100%; }
	.vp-hero-buttons{ flex-direction:column; }
	.vp-hero-buttons .vp-btn-primary,
	.vp-hero-buttons .vp-btn-outline{ width:100%; justify-content:center; }
	.vp-hero-trust{ gap:16px; }
	.vp-trust-item{ flex-direction:row; gap:8px; }
}

/* ================= VISIOpaie About Hero — Plateforme ================= */
.vp-about-hero{
	position:relative;
	background:#ffffff;
	padding:30px 0 60px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-about-hero .container-fluid{
	max-width:1560px;
	padding:0 50px;
	margin:0 auto;
}
.vp-about-hero-grid{
	display:grid;
	grid-template-columns:0.92fr 1.4fr;
	gap:20px;
	align-items:center;
}
.vp-about-badge{
	display:inline-flex;
	align-items:center;
	gap:9px;
	background:#ffffff;
	color:#2871FE;
	padding:8px 18px 8px 8px;
	border-radius:999px;
	font-size:12px;
	font-weight:700;
	letter-spacing:.4px;
	text-transform:uppercase;
	border:1px solid rgba(40,113,254,.2);
	box-shadow:0 8px 20px -14px rgba(40,113,254,.5);
	margin-bottom:26px;
}
.vp-about-badge-icon{
	width:24px;
	height:24px;
	border-radius:50%;
	background:#e7f0ff;
	color:#2871FE;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:13px;
}
.vp-about-hero-title{
	font-family:"Cabin";
	font-size:44px;
	line-height:1.2;
	font-weight:800;
	color:#0a1224;
	margin:0 0 20px;
}
.vp-about-hero-title .vp-blue{ color:#2871FE; }
.vp-about-hero-lead{
	color:#000000;
	font-size:14px;
	line-height:1.75;
	max-width:440px;
	margin:0 0 34px;
}
.vp-about-features{
	display:flex;
	flex-direction:column;
	gap:24px;
	margin-bottom:36px;
}
.vp-about-feature{
	display:flex;
	align-items:flex-start;
	gap:16px;
}
.vp-about-feature-icon{
	flex:0 0 48px;
	width:48px;
	height:48px;
	border-radius:14px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:linear-gradient(135deg,#2871FE,#1a56d6) !important;
	box-shadow:0 10px 20px -10px rgba(40,113,254,.5);
}
.vp-about-feature-icon i{ font-size:20px; color:#ffffff !important; }
.vp-about-feature h4{
	font-family:"Cabin";
	font-size:16px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-about-feature p{
	color:#5b6579;
	font-size:14px;
	line-height:1.6;
	margin:0;
	max-width:400px;
}
.vp-icon-blue{ background:linear-gradient(180deg,#eaf2ff 0%,#dfeaff 100%); }
.vp-icon-green{ background:linear-gradient(180deg,#e7faf0 0%,#dcf5e9 100%); }
.vp-icon-purple{ background:linear-gradient(180deg,#f1eafd 0%,#e8def9 100%); }
.vp-icon-orange{ background:linear-gradient(180deg,#fdf1e6 0%,#fce4cf 100%); }
.vp-icon-red{ background:linear-gradient(180deg,#fdeceb 0%,#fbdcd9 100%); }
.vp-icon-dark{ background:linear-gradient(180deg,#e9ebf2 0%,#dde1ea 100%); }
.vp-icon-pink{ background:linear-gradient(180deg,#fde8f1 0%,#fbd7e8 100%); }
.vp-icon-blue i{ color:#2871FE; }
.vp-icon-green i{ color:#22C55E; }
.vp-icon-purple i{ color:#8b5cf6; }
.vp-icon-orange i{ color:#f5851a; }
.vp-icon-red i{ color:#e5484d; }
.vp-icon-dark i{ color:#0a1224; }
.vp-icon-pink i{ color:#ec4899; }
.vp-about-hero-cta .vp-btn-primary{ padding:17px 30px; }
.vp-about-hero-right{
	position:relative;
}
.vp-about-hero-mockup{
	width:118%;
	max-width:none;
	height:auto;
	display:block;
	margin-left:-20%;
}
.vp-about-strip{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:0;
	margin-top:80px;
	padding:36px 44px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	box-shadow:0 20px 40px -28px rgba(10,18,36,.18);
}
.vp-about-strip-item{
	display:flex;
	align-items:center;
	gap:16px;
	flex:1;
	padding:0 20px;
}
.vp-about-strip-icon{
	flex:0 0 46px;
	width:46px;
	height:46px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	background:none !important;
}
.vp-about-strip-icon i{ font-size:32px; }
.vp-about-strip-item h4{
	font-family:"Cabin";
	font-size:15px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-about-strip-item p{
	color:#5b6579;
	font-size:13px;
	line-height:1.55;
	margin:0;
}
.vp-about-strip-divider{
	width:1px;
	align-self:stretch;
	background:#e3e8f0;
	flex:0 0 1px;
}

/* ---- Premium entrance + hover motion ---- */
@keyframes vpFadeUp{
	from{ opacity:0; transform:translateY(26px); }
	to{ opacity:1; transform:translateY(0); }
}
@keyframes vpFadeIn{
	from{ opacity:0; transform:translateY(18px) scale(.97); }
	to{ opacity:1; transform:translateY(0) scale(1); }
}
@keyframes vpFloat{
	0%,100%{ transform:translateY(0); }
	50%{ transform:translateY(-12px); }
}
.vp-about-badge{ animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-about-hero-title{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .1s both; }
.vp-about-hero-lead{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .22s both; }
.vp-about-feature{ opacity:0; animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; transition:transform .3s ease; }
.vp-about-feature:nth-child(1){ animation-delay:.34s; }
.vp-about-feature:nth-child(2){ animation-delay:.44s; }
.vp-about-feature:nth-child(3){ animation-delay:.54s; }
.vp-about-feature:hover{ transform:translateX(4px); }
.vp-about-feature:hover .vp-about-feature-icon{ transform:scale(1.1); }
.vp-about-feature-icon{ transition:transform .35s cubic-bezier(.16,1,.3,1); }
.vp-about-hero-cta{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .64s both; }
.vp-about-hero-right{ animation:vpFadeIn 1s cubic-bezier(.16,1,.3,1) .3s both; }
.vp-about-strip{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .5s both; }
.vp-about-strip-item{ transition:transform .35s cubic-bezier(.16,1,.3,1); }
.vp-about-strip-item:hover{ transform:translateY(-5px); }
.vp-about-strip-icon i{ transition:transform .35s cubic-bezier(.16,1,.3,1); }
.vp-about-strip-item:hover .vp-about-strip-icon i{ transform:scale(1.18); }
@media(prefers-reduced-motion:reduce){
	.vp-about-badge,.vp-about-hero-title,.vp-about-hero-lead,.vp-about-feature,.vp-about-hero-cta,.vp-about-hero-right,.vp-about-strip{ animation:none !important; opacity:1 !important; transform:none !important; }
	.vp-about-hero-mockup{ animation:none !important; }
}
@media(max-width:1199px){
	.vp-about-hero-title{ font-size:36px; }
	.vp-about-strip{ flex-wrap:wrap; gap:28px; }
	.vp-about-strip-item{ flex:1 1 40%; }
	.vp-about-strip-divider{ display:none; }
}
@media(max-width:991px){
	.vp-about-hero-grid{ grid-template-columns:1fr; }
	.vp-about-hero-right{ order:-1; max-width:560px; margin:0 auto 40px; }
	.vp-about-hero-mockup{ width:100%; margin-left:0; }
	.vp-about-hero-left{ text-align:left; }
}
@media(max-width:575px){
	.vp-about-hero{ padding:60px 0 44px; }
	.vp-about-hero .container-fluid{ padding:0 20px; }
	.vp-about-hero-title{ font-size:28px; }
	.vp-about-strip{ padding:28px 22px; }
	.vp-about-strip-item{ flex:1 1 100%; }
}

/* ================= VISIOpaie Ecosystem — Plateforme connectée ================= */
.vp-eco-section{
	position:relative;
	background:#ffffff;
	padding:110px 0 70px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-eco-section::before,
.vp-eco-section::after{
	content:'';
	position:absolute;
	border-radius:50%;
	pointer-events:none;
	z-index:0;
}
.vp-eco-section::before{
	top:-140px;
	right:-180px;
	width:560px;
	height:560px;
	background:radial-gradient(circle,rgba(40,113,254,.10) 0%,rgba(40,113,254,0) 68%);
}
.vp-eco-section::after{
	bottom:-180px;
	left:-200px;
	width:520px;
	height:520px;
	background:radial-gradient(circle,rgba(139,92,246,.08) 0%,rgba(139,92,246,0) 68%);
}
.vp-eco-section .container-fluid{
	position:relative;
	z-index:1;
	max-width:1560px;
	padding:0 50px;
	margin:0 auto;
}
.vp-eco-section .vp-about-badge{ box-shadow:0 10px 26px -14px rgba(40,113,254,.5); }
.vp-eco-grid{
	display:grid;
	grid-template-columns:0.86fr 1.3fr;
	gap:30px;
	align-items:center;
}
.vp-eco-title{
	font-family:"Cabin";
	font-size:38px;
	line-height:1.24;
	font-weight:800;
	color:#0a1224;
	margin:0 0 18px;
}
.vp-eco-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-eco-lead{
	color:#5b6579;
	font-size:14px;
	line-height:1.75;
	max-width:430px;
	margin:0 0 16px;
}
.vp-eco-link{
	display:inline-flex;
	align-items:center;
	gap:8px;
	color:#2871FE;
	font-weight:700;
	font-size:14px;
	margin-bottom:34px;
	transition:gap .25s ease;
}
.vp-eco-link i{ font-size:13px; transition:transform .25s ease; }
.vp-eco-link:hover{ color:#1a56d6; gap:12px; }
.vp-eco-features{
	display:flex;
	flex-direction:column;
	gap:22px;
}
.vp-eco-feature{
	display:flex;
	align-items:flex-start;
	gap:16px;
	transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.vp-eco-feature:hover{ transform:translateX(5px); }
.vp-eco-feature:hover .vp-eco-feature-icon{ transform:scale(1.08); }
.vp-eco-feature-icon{
	flex:0 0 44px;
	width:44px;
	height:44px;
	border-radius:12px;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 10px 20px -12px rgba(40,113,254,.5);
	transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.vp-eco-feature-icon i{ font-size:19px; }
.vp-eco-feature h4{
	font-family:"Cabin";
	font-size:15px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 3px;
}
.vp-eco-feature p{
	color:#5b6579;
	font-size:13.5px;
	line-height:1.55;
	margin:0;
	max-width:360px;
}

/* --- diagram --- */
.vp-eco-right{ position:relative; }
.vp-eco-diagram{
	position:relative;
	width:100%;
	max-width:640px;
	aspect-ratio:1/1;
	margin:0 auto;
}
.vp-eco-lines{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	z-index:1;
}
.vp-eco-lines line{
	stroke:#2871FE;
	stroke-opacity:.32;
	stroke-width:.5;
	stroke-dasharray:2.2 2.2;
	animation:vpEcoFlow 14s linear infinite;
}
@keyframes vpEcoFlow{ to{ stroke-dashoffset:-44; } }
.vp-eco-sync{
	position:absolute;
	transform:translate(-50%,-50%);
	width:26px;
	height:26px;
	border-radius:50%;
	background:#ffffff;
	border:1px solid #e3e8f0;
	box-shadow:0 8px 16px -6px rgba(10,18,36,.2);
	display:flex;
	align-items:center;
	justify-content:center;
	z-index:4;
	animation:vpEcoPulse 2.8s ease-in-out infinite;
}
.vp-eco-sync:nth-of-type(1){ animation-delay:0s; }
.vp-eco-sync:nth-of-type(2){ animation-delay:.4s; }
.vp-eco-sync:nth-of-type(3){ animation-delay:.8s; }
.vp-eco-sync:nth-of-type(4){ animation-delay:1.2s; }
.vp-eco-sync:nth-of-type(5){ animation-delay:1.6s; }
.vp-eco-sync:nth-of-type(6){ animation-delay:2s; }
@keyframes vpEcoPulse{
	0%,100%{ box-shadow:0 8px 16px -6px rgba(10,18,36,.2),0 0 0 0 rgba(40,113,254,.28); }
	50%{ box-shadow:0 8px 16px -6px rgba(10,18,36,.2),0 0 0 5px rgba(40,113,254,0); }
}
.vp-eco-sync i{ font-size:11px; color:#2871FE; }
.vp-eco-hub{
	position:absolute;
	left:50%;
	top:50%;
	width:39%;
	height:39%;
	transform:translate(-50%,-50%);
	z-index:1;
	background-image:url("img/img2/pl.png");
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	pointer-events:none;
	user-select:none;
}
.vp-eco-hub::before{
	content:'';
	position:absolute;
	inset:-16%;
	z-index:-1;
	border-radius:50%;
	background:radial-gradient(circle,rgba(40,113,254,.2) 0%,rgba(40,113,254,0) 70%);
}
.vp-eco-card{
	position:absolute;
	width:34%;
	height:168px;
	transform:translate(-50%,-50%);
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:16px;
	padding:13px 14px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 34px -22px rgba(10,18,36,.22);
	z-index:3;
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
	overflow:hidden;
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,border-color .35s ease;
}
.vp-eco-card:hover{
	transform:translate(-50%,-50%) translateY(-6px);
	border-color:rgba(var(--vp-eco-accent-rgb,40,113,254),.28);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 26px 46px -20px rgba(10,18,36,.3),0 14px 30px -16px rgba(var(--vp-eco-accent-rgb,40,113,254),.35);
}
.vp-eco-card-sirh{ left:26%; top:8%; --vp-eco-accent:#f5851a; --vp-eco-accent-rgb:245,133,26; }
.vp-eco-card-compta{ left:72%; top:8%; --vp-eco-accent:#14a37e; --vp-eco-accent-rgb:20,163,126; }
.vp-eco-card-ged{ left:6%; top:50%; --vp-eco-accent:#8b5cf6; --vp-eco-accent-rgb:139,92,246; }
.vp-eco-card-organismes{ left:94%; top:50%; --vp-eco-accent:#17a35c; --vp-eco-accent-rgb:23,163,92; }
.vp-eco-card-paiements{ left:26%; top:92%; --vp-eco-accent:#2871FE; --vp-eco-accent-rgb:40,113,254; }
.vp-eco-card-api{ left:72%; top:92%; --vp-eco-accent:#ec4899; --vp-eco-accent-rgb:236,72,153; }
.vp-eco-card-icon{
	width:32px;
	height:32px;
	border-radius:9px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0 auto 8px;
}
.vp-eco-card-icon i{ font-size:14px; }
.vp-eco-icon-orange{ background:linear-gradient(180deg,#fdf1e6 0%,#fce4cf 100%); box-shadow:0 8px 16px -10px rgba(245,133,26,.55); }
.vp-eco-icon-orange i{ color:#f5851a; }
.vp-eco-icon-teal{ background:linear-gradient(180deg,#e3f6ee 0%,#d5f0e4 100%); box-shadow:0 8px 16px -10px rgba(20,163,126,.55); }
.vp-eco-icon-teal i{ color:#14a37e; }
.vp-eco-icon-green{ background:linear-gradient(180deg,#e7faf0 0%,#dcf5e9 100%); box-shadow:0 8px 16px -10px rgba(23,163,92,.55); }
.vp-eco-icon-green i{ color:#17a35c; }
.vp-eco-icon-pink{ background:linear-gradient(180deg,#fdeaf3 0%,#fbdfee 100%); box-shadow:0 8px 16px -10px rgba(236,72,153,.55); }
.vp-eco-icon-pink i{ color:#ec4899; }
.vp-eco-icon-purple{ background:linear-gradient(180deg,#f1eafd 0%,#e8def9 100%); box-shadow:0 8px 16px -10px rgba(139,92,246,.55); }
.vp-eco-icon-purple i{ color:#8b5cf6; }
.vp-eco-card-icon.vp-icon-blue{ box-shadow:0 8px 16px -10px rgba(40,113,254,.55); }
.vp-eco-card-icon{ transition:transform .35s cubic-bezier(.16,1,.3,1); }
.vp-eco-card:hover .vp-eco-card-icon{ transform:scale(1.08); }
.vp-eco-card h4{
	font-family:"Cabin";
	font-size:13px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 3px;
	line-height:1.25;
}
.vp-eco-card p{
	color:#5b6579;
	font-size:10.5px;
	line-height:1.4;
	margin:0 0 10px;
}
.vp-eco-tags{
	display:flex;
	flex-wrap:nowrap;
	justify-content:center;
	gap:5px;
}
.vp-eco-tags span{
	background:#f4f6fa;
	color:#5b6579;
	font-size:9.5px;
	font-weight:600;
	padding:4px 8px;
	border-radius:999px;
	white-space:nowrap;
	flex:0 0 auto;
}

/* --- bottom strip --- */
.vp-eco-strip{
	position:relative;
	display:flex;
	align-items:center;
	gap:24px;
	margin-top:70px;
	padding:30px 40px;
	background:linear-gradient(135deg,#ffffff 0%,#f7faff 100%);
	border:1px solid #edf1f7;
	border-radius:18px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 24px 48px -28px rgba(10,18,36,.22);
	overflow:hidden;
}
.vp-eco-strip::before{
	content:'';
	position:absolute;
	top:0; left:0; right:0;
	height:3px;
	background:linear-gradient(90deg,#2871FE,#8b5cf6,#ec4899);
	opacity:.7;
}
.vp-eco-strip-icon{
	flex:0 0 52px;
	width:52px;
	height:52px;
	border-radius:50%;
	background:linear-gradient(180deg,#eaf2ff 0%,#dfeaff 100%);
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 0 0 6px rgba(40,113,254,.07),0 10px 22px -10px rgba(40,113,254,.5);
}
.vp-eco-strip-icon i{ font-size:24px; color:#2871FE; }
.vp-eco-strip-text{ flex:1; }
.vp-eco-strip-text p{
	color:#5b6579;
	font-size:14px;
	line-height:1.6;
	margin:0;
}
.vp-eco-strip-text strong{ color:#0a1224; font-weight:700; }
.vp-eco-strip-divider{
	width:1px;
	align-self:stretch;
	background:#e3e8f0;
	flex:0 0 1px;
}
.vp-eco-strip-btn{
	flex:0 0 auto;
	display:inline-flex;
	align-items:center;
	gap:10px;
	background:linear-gradient(135deg,#2871FE 0%,#1a56d6 100%);
	color:#ffffff !important;
	font-weight:700;
	font-size:14px;
	padding:15px 26px;
	border-radius:10px;
	white-space:nowrap;
	box-shadow:0 14px 28px -14px rgba(40,113,254,.55);
	transition:box-shadow .3s ease,transform .3s ease;
}
.vp-eco-strip-btn i{ font-size:13px; transition:transform .3s ease; }
.vp-eco-strip-btn:hover{ box-shadow:0 18px 36px -14px rgba(40,113,254,.65); transform:translateY(-2px); }
.vp-eco-strip-btn:hover i{ transform:translateX(3px); }

/* --- motion --- */
.vp-eco-section .vp-about-badge{ animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-eco-title{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .1s both; }
.vp-eco-lead{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .2s both; }
.vp-eco-link{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .28s both; }
.vp-eco-feature{ opacity:0; animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-eco-feature:nth-child(1){ animation-delay:.36s; }
.vp-eco-feature:nth-child(2){ animation-delay:.44s; }
.vp-eco-feature:nth-child(3){ animation-delay:.52s; }
.vp-eco-feature:nth-child(4){ animation-delay:.6s; }
.vp-eco-right{ animation:vpFadeIn 1s cubic-bezier(.16,1,.3,1) .3s both; }
.vp-eco-strip{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .5s both; }
@media(prefers-reduced-motion:reduce){
	.vp-eco-section .vp-about-badge,.vp-eco-title,.vp-eco-lead,.vp-eco-link,.vp-eco-feature,.vp-eco-right,.vp-eco-strip{ animation:none !important; opacity:1 !important; transform:none !important; }
	.vp-eco-lines line,.vp-eco-sync{ animation:none !important; }
}

@media(max-width:1400px){
	.vp-eco-card p{ display:none; }
	.vp-eco-card{ padding:14px 16px; }
}
@media(max-width:1199px){
	.vp-eco-title{ font-size:32px; }
	.vp-eco-grid{ grid-template-columns:1fr; gap:50px; }
	.vp-eco-diagram{ max-width:560px; }
}
@media(max-width:767px){
	.vp-eco-right{ animation:none; }
	.vp-eco-diagram{
		max-width:100%;
		aspect-ratio:auto;
		height:auto;
		display:grid;
		grid-template-columns:1fr 1fr;
		gap:14px;
	}
	.vp-eco-lines,.vp-eco-sync{ display:none; }
	.vp-eco-hub{
		position:static;
		grid-column:1 / -1;
		width:180px;
		height:180px;
		transform:none;
		margin:0 auto 6px;
	}
	.vp-eco-card,
	.vp-eco-card-ged,
	.vp-eco-card-organismes{
		position:static;
		width:auto;
		height:auto;
		transform:none;
	}
	.vp-eco-card p{ display:block; }
}
@media(max-width:480px){
	.vp-eco-diagram{ grid-template-columns:1fr; }
}
@media(max-width:575px){
	.vp-eco-section .container-fluid{ padding:0 20px; }
	.vp-eco-title{ font-size:26px; }
	.vp-eco-strip{ flex-direction:column; align-items:flex-start; padding:26px 22px; }
	.vp-eco-strip-divider{ display:none; }
	.vp-eco-strip-btn{ width:100%; justify-content:center; }
}

/* ================= VISIOpaie Process — Automatisez le processus ================= */
.vp-process-section{
	position:relative;
	background:#ffffff;
	padding:114px 0 90px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-process-section::before,
.vp-process-section::after{
	content:'';
	position:absolute;
	border-radius:50%;
	pointer-events:none;
	z-index:0;
}
.vp-process-section::before{
	top:-160px;
	left:-200px;
	width:520px;
	height:520px;
	background:radial-gradient(circle,rgba(40,113,254,.09) 0%,rgba(40,113,254,0) 68%);
}
.vp-process-section::after{
	bottom:-220px;
	right:-200px;
	width:560px;
	height:560px;
	background:radial-gradient(circle,rgba(139,92,246,.08) 0%,rgba(139,92,246,0) 68%);
}
.vp-process-section .container-fluid{
	position:relative;
	z-index:1;
	max-width:1560px;
	padding:0 50px;
	margin:0 auto;
}
.vp-process-header{
	text-align:center;
	max-width:820px;
	margin:0 auto 60px;
}
.vp-process-badge{ margin:0 auto 22px; }
.vp-process-title{
	font-family:"Cabin";
	font-size:40px;
	line-height:1.22;
	font-weight:800;
	color:#0a1224;
	margin:0 0 18px;
	letter-spacing:-.3px;
}
.vp-process-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-process-lead{
	color:#5b6579;
	font-size:15px;
	line-height:1.7;
	margin:0;
}

/* --- steps row --- */
.vp-process-steps{
	display:flex;
	align-items:stretch;
	gap:0;
	margin-bottom:44px;
}
.vp-process-step{
	flex:1;
	min-width:0;
	background:linear-gradient(180deg,#ffffff 0%,#fbfcff 100%);
	border:1px solid #eef1f7;
	border-radius:20px;
	padding:30px 15px 26px;
	position:relative;
	text-align:center;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 38px -30px rgba(10,18,36,.16);
	transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s ease,border-color .4s ease;
}
.vp-process-step:nth-of-type(1){ --vp-step-rgb:40,113,254; }
.vp-process-step:nth-of-type(2){ --vp-step-rgb:23,163,92; }
.vp-process-step:nth-of-type(3){ --vp-step-rgb:139,92,246; }
.vp-process-step:nth-of-type(4){ --vp-step-rgb:40,113,254; }
.vp-process-step:nth-of-type(5){ --vp-step-rgb:23,163,92; }
.vp-process-step:nth-of-type(6){ --vp-step-rgb:139,92,246; }
.vp-process-step:hover{
	transform:translateY(-8px);
	border-color:rgba(var(--vp-step-rgb,40,113,254),.28);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 30px 54px -26px rgba(10,18,36,.2),0 16px 32px -18px rgba(var(--vp-step-rgb,40,113,254),.32);
}
.vp-process-step-num{
	position:absolute;
	top:16px;
	left:16px;
	width:24px;
	height:24px;
	border-radius:50%;
	background:#0a1224;
	color:#ffffff;
	font-size:10px;
	font-weight:700;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 6px 14px -8px rgba(10,18,36,.45);
}
.vp-process-step-icon{
	width:62px;
	height:62px;
	border-radius:20px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin:6px auto 18px;
	transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.vp-process-step-icon i{ font-size:25px; }
.vp-process-step:hover .vp-process-step-icon{ transform:scale(1.08) rotate(-3deg); }
.vp-process-step-icon.vp-icon-blue{
	background:linear-gradient(145deg,#eaf2ff 0%,#dbe9ff 100%);
	box-shadow:0 0 0 6px rgba(40,113,254,.06),0 14px 26px -14px rgba(40,113,254,.55);
}
.vp-process-step-icon.vp-icon-green{
	background:linear-gradient(145deg,#e7faf0 0%,#d7f3e6 100%);
	box-shadow:0 0 0 6px rgba(23,163,92,.06),0 14px 26px -14px rgba(23,163,92,.5);
}
.vp-process-step-icon.vp-icon-purple{
	background:linear-gradient(145deg,#f1eafd 0%,#e6ddfd 100%);
	box-shadow:0 0 0 6px rgba(139,92,246,.06),0 14px 26px -14px rgba(139,92,246,.5);
}
.vp-process-step h4{
	font-family:"Cabin";
	font-size:16px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 8px;
}
.vp-process-step p{
	color:#5b6579;
	font-size:12.5px;
	line-height:1.55;
	margin:0 0 16px;
	min-height:58px;
}
.vp-process-step-tags{
	display:flex;
	flex-wrap:nowrap;
	align-items:center;
	justify-content:center;
	gap:5px;
}
.vp-tag-plain,
.vp-tag-accent{
	font-size:10px;
	font-weight:600;
	padding:4px 8px;
	border-radius:999px;
	white-space:nowrap;
}
.vp-tag-plain{
	background:#f4f6fa;
	color:#5b6579;
	border:1px solid #edf0f5;
}
.vp-tag-accent{
	background:linear-gradient(135deg,#eaf2ff 0%,#dfeaff 100%);
	color:#1a56d6;
	box-shadow:0 4px 10px -6px rgba(40,113,254,.4);
}
.vp-process-arrow{
	flex:0 0 auto;
	display:flex;
	align-items:center;
	justify-content:center;
	width:26px;
	z-index:1;
}
.vp-process-arrow i{
	width:30px;
	height:30px;
	border-radius:50%;
	background:#ffffff;
	border:1px solid #d9e4fc;
	color:#2871FE;
	font-size:11px;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 8px 16px -10px rgba(40,113,254,.4);
}

/* --- moteur / agents / vous panels --- */
.vp-process-panels{
	position:relative;
	display:flex;
	align-items:stretch;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:22px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 26px 50px -30px rgba(10,18,36,.18);
	margin-bottom:44px;
	overflow:hidden;
}
.vp-process-panel{
	flex:1;
	min-width:0;
	display:flex;
	align-items:flex-start;
	gap:18px;
	padding:36px 36px 34px;
	transition:background .35s ease;
}
.vp-process-panel:hover{ background:rgba(10,18,36,.014); }
.vp-process-panel + .vp-process-panel{ border-left:1px solid #edf1f7; }
.vp-process-panel-icon{
	flex:0 0 60px;
	width:60px;
	height:60px;
	border-radius:18px;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.vp-process-panel-icon i{ font-size:24px; }
.vp-process-panel:hover .vp-process-panel-icon{ transform:scale(1.07) rotate(-3deg); }
.vp-panel-icon-green{ background:linear-gradient(145deg,#e7faf0 0%,#d7f3e6 100%); box-shadow:0 0 0 6px rgba(23,163,92,.07),0 14px 26px -14px rgba(23,163,92,.5); }
.vp-panel-icon-green i{ color:#17a35c; }
.vp-panel-icon-purple{ background:linear-gradient(145deg,#f1eafd 0%,#e6ddfd 100%); box-shadow:0 0 0 6px rgba(139,92,246,.07),0 14px 26px -14px rgba(139,92,246,.5); }
.vp-panel-icon-purple i{ color:#8b5cf6; }
.vp-panel-icon-blue{ background:linear-gradient(145deg,#eaf2ff 0%,#dbe9ff 100%); box-shadow:0 0 0 6px rgba(40,113,254,.07),0 14px 26px -14px rgba(40,113,254,.5); }
.vp-panel-icon-blue i{ color:#2871FE; }
.vp-process-panel h4{
	font-family:"Cabin";
	font-size:17px;
	font-weight:800;
	color:#0a1224;
	margin:0 0 2px;
}
.vp-process-panel-sub{
	display:block;
	color:#8892a3;
	font-size:12.5px;
	font-weight:600;
	margin:0 0 12px;
}
.vp-process-panel ul{
	list-style:none;
	margin:0;
	padding:0;
}
.vp-process-panel ul li{
	position:relative;
	color:#5b6579;
	font-size:13px;
	line-height:1.7;
	padding-left:16px;
}
.vp-process-panel ul li::before{
	content:'';
	position:absolute;
	left:0;
	top:9px;
	width:5px;
	height:5px;
	border-radius:50%;
	background:#c3cbdb;
}
.vp-process-panel:nth-of-type(1) ul li::before{ background:#17a35c; }
.vp-process-panel:nth-of-type(2) ul li::before{ background:#8b5cf6; }
.vp-process-panel:nth-of-type(3) ul li::before{ background:#2871FE; }
.vp-process-plus{
	position:absolute;
	top:50%;
	transform:translate(-50%,-50%);
	width:32px;
	height:32px;
	border-radius:50%;
	background:#ffffff;
	border:1px solid #e3e8f0;
	box-shadow:0 8px 16px -6px rgba(10,18,36,.2);
	display:flex;
	align-items:center;
	justify-content:center;
	color:#2871FE;
	font-size:16px;
	font-weight:900;
	-webkit-text-stroke:1.3px currentColor;
	z-index:2;
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease;
}
.vp-process-plus:hover{
	transform:translate(-50%,-50%) scale(1.12);
	box-shadow:0 10px 22px -8px rgba(40,113,254,.4);
}

/* --- result strip --- */
.vp-process-result{
	position:relative;
	display:flex;
	align-items:center;
	gap:28px;
	padding:30px 42px;
	background:linear-gradient(135deg,#ffffff 0%,#f7faff 100%);
	border:1px solid #edf1f7;
	border-radius:22px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 26px 50px -30px rgba(10,18,36,.18);
	overflow:hidden;
}
.vp-process-result-main{
	flex:0 0 auto;
	display:flex;
	align-items:center;
	gap:16px;
	max-width:320px;
}
.vp-process-result-icon{
	flex:0 0 48px;
	width:48px;
	height:48px;
	border-radius:16px;
	background:linear-gradient(135deg,#2871FE,#1a56d6);
	color:#ffffff;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 0 0 6px rgba(40,113,254,.1),0 16px 28px -14px rgba(40,113,254,.6);
}
.vp-process-result-icon i{ font-size:20px; }
.vp-process-result-main p{
	color:#0a1224;
	font-size:14.5px;
	line-height:1.5;
	margin:0;
}
.vp-process-result-main strong{ font-weight:700; }
.vp-process-result-divider{
	width:1px;
	align-self:stretch;
	background:linear-gradient(180deg,transparent,#e3e8f0,transparent);
	flex:0 0 1px;
}
.vp-process-result-stats{
	flex:1;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:20px;
}
.vp-process-stat{
	display:flex;
	align-items:center;
	gap:12px;
}
.vp-process-stat i{
	width:38px;
	height:38px;
	border-radius:12px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:linear-gradient(145deg,#eaf2ff 0%,#dbe9ff 100%);
	box-shadow:0 8px 16px -10px rgba(40,113,254,.4);
	color:#2871FE;
	font-size:16px;
	flex:0 0 auto;
	transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.vp-process-stat:hover i{ transform:scale(1.1); }
.vp-process-stat span{
	color:#5b6579;
	font-size:12.5px;
	line-height:1.45;
}

/* --- motion --- */
.vp-process-badge{ animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-process-title{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .1s both; }
.vp-process-lead{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .2s both; }
.vp-process-step{ opacity:0; animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-process-step:nth-of-type(1){ animation-delay:.3s; }
.vp-process-step:nth-of-type(2){ animation-delay:.36s; }
.vp-process-step:nth-of-type(3){ animation-delay:.42s; }
.vp-process-step:nth-of-type(4){ animation-delay:.48s; }
.vp-process-step:nth-of-type(5){ animation-delay:.54s; }
.vp-process-step:nth-of-type(6){ animation-delay:.6s; }
.vp-process-panels{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .5s both; }
.vp-process-result{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .6s both; }
@media(prefers-reduced-motion:reduce){
	.vp-process-badge,.vp-process-title,.vp-process-lead,.vp-process-step,.vp-process-panels,.vp-process-result{ animation:none !important; opacity:1 !important; transform:none !important; }
}

@media(max-width:1400px){
	.vp-process-step p{ min-height:auto; }
}
@media(max-width:1199px){
	.vp-process-title{ font-size:32px; }
	.vp-process-steps{ flex-wrap:wrap; gap:16px; }
	.vp-process-step{ flex:1 1 calc(33.333% - 11px); }
	.vp-process-arrow{ display:none; }
	.vp-process-result-stats{ flex-wrap:wrap; }
}
@media(max-width:991px){
	.vp-process-panels{ flex-direction:column; }
	.vp-process-panel + .vp-process-panel{ border-left:none; border-top:1px solid #edf1f7; }
	.vp-process-plus{ display:none; }
	.vp-process-result{ flex-direction:column; align-items:flex-start; }
	.vp-process-result-divider{ display:none; width:100%; height:1px; }
	.vp-process-result-stats{ width:100%; justify-content:flex-start; }
}
@media(max-width:767px){
	.vp-process-step{ flex:1 1 calc(50% - 8px); }
}
@media(max-width:575px){
	.vp-process-section .container-fluid{ padding:0 20px; }
	.vp-process-title{ font-size:26px; }
	.vp-process-step{ flex:1 1 100%; }
	.vp-process-result-stats{ flex-direction:column; align-items:flex-start; gap:14px; }
}

/* ================= VISIOpaie Team — 9 agents IA ================= */
.vp-team{
	background:#ffffff;
	padding:70px 0 64px;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-team .container-fluid{
	max-width:1560px;
	padding:0 50px;
	margin:0 auto;
}
.vp-team-head{
	text-align:center;
	max-width:820px;
	margin:0 auto 40px;
}
.vp-team-head .vp-badge{ margin-bottom:22px; }
.vp-team-title{
	font-family:"Cabin";
	font-size:32px;
	font-weight:800;
	color:#0a1224;
	line-height:1.25;
	margin:0 0 16px;
}
.vp-team-title .vp-blue{ color:#2871FE; }
.vp-team-sub{
	color:#5b6579;
	font-size:15px;
	line-height:1.65;
	margin:0 0 16px;
}
.vp-team-rule{
	display:inline-block;
	width:44px;
	height:3px;
	background:#2871FE;
	border-radius:2px;
}
.vp-team-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:22px;
	margin-bottom:36px;
}
.vp-team-card{
	position:relative;
	display:flex;
	align-items:stretch;
	background:#fff;
	border:1px solid #edf0f6;
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 14px 30px -24px rgba(10,18,36,.25);
	transition:transform .35s cubic-bezier(.4,0,.2,1), box-shadow .35s ease, border-color .35s ease;
}
.vp-team-card::before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	height:3px;
	background:var(--vp-accent,#2871FE);
	transform:scaleX(0);
	transform-origin:left;
	transition:transform .35s cubic-bezier(.4,0,.2,1);
	z-index:2;
}
.vp-team-card:hover{
	transform:translateY(-6px);
	box-shadow:0 26px 46px -20px rgba(10,18,36,.28);
	border-color:transparent;
}
.vp-team-card:hover::before{ transform:scaleX(1); }
.vp-team-photo{
	flex:0 0 118px;
	overflow:hidden;
}
.vp-team-photo img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform .5s cubic-bezier(.4,0,.2,1);
}
.vp-team-card:hover .vp-team-photo img{ transform:scale(1.08); }
.vp-team-info{
	flex:1;
	min-width:0;
	padding:16px 28px;
	display:flex;
	flex-direction:column;
}
.vp-team-header{
	display:flex;
	align-items:center;
	gap:12px;
	margin-bottom:10px;
}
.vp-team-titles{
	display:flex;
	flex-direction:column;
}
.vp-team-icon{
	flex:0 0 auto;
	width:44px;
	height:44px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	background:var(--vp-tint,#eef1f8);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
	transition:transform .35s cubic-bezier(.4,0,.2,1);
}
.vp-team-card:hover .vp-team-icon{ transform:scale(1.08); }
.vp-team-icon img{ width:20px; height:20px; }
.vp-team-name{
	font-size:16.5px;
	font-weight:800;
	color:var(--vp-accent,#0a1224);
	margin:0;
	line-height:1.2;
}
.vp-team-role{
	display:block;
	font-size:13px;
	font-weight:700;
	color:#0a1224;
}
.vp-team-desc{
	font-size:12.5px;
	color:#5b6579;
	line-height:1.5;
	margin:0;
}

/* Team accent colors (icon background tint + name color) */
.vp-team-emma      { --vp-tint:#f0eafc; --vp-accent:#8b5cf6; }
.vp-team-thomas    { --vp-tint:#e6f6ee; --vp-accent:#17a35c; }
.vp-team-lucas     { --vp-tint:#fce9e2; --vp-accent:#e8491d; }
.vp-team-chloe     { --vp-tint:#f0eafc; --vp-accent:#8b5cf6; }
.vp-team-pierre    { --vp-tint:#e6f6ee; --vp-accent:#17a35c; }
.vp-team-elisabeth { --vp-tint:#e4f6f1; --vp-accent:#14a37e; }
.vp-team-michel    { --vp-tint:#e7f0ff; --vp-accent:#2871FE; }
.vp-team-sophie    { --vp-tint:#fce8f1; --vp-accent:#ec4899; }
.vp-team-marc      { --vp-tint:#fdf1e0; --vp-accent:#f5a623; }

.vp-team-banner{ margin-top:0; }
.vp-team-banner p{ font-size:15px; }

@media (max-width:1199px){
	.vp-team-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:767px){
	.vp-team-grid{ grid-template-columns:1fr; }
	.vp-team-title{ font-size:26px; }
	.vp-team-card{ flex-direction:column; }
	.vp-team-photo{ flex:0 0 160px; }
}
@media (max-width:575px){
	.vp-team{ padding:50px 0 44px; }
	.vp-team .container-fluid{ padding:0 20px; }
	.vp-team-title{ font-size:22px; }
	.vp-team-grid{ gap:16px; }
	.vp-team-info{ padding:14px 18px; }
	.vp-team-name{ font-size:14.5px; }
}

/* ================= VISIOpaie Pricing Hero — Tarifs ================= */
.vp-pricing-hero{
	position:relative;
	background:linear-gradient(180deg,#f7f9fd 0%,#ffffff 420px);
	padding:70px 0 90px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-pricing-hero::before{
	content:'';
	position:absolute;
	top:-120px;
	left:50%;
	transform:translateX(-50%);
	width:1100px;
	height:420px;
	background-image:radial-gradient(circle,rgba(40,113,254,.09) 1.6px,transparent 1.7px);
	background-size:22px 22px;
	-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 30%,#000 0%,transparent 72%);
	mask-image:radial-gradient(ellipse 50% 50% at 50% 30%,#000 0%,transparent 72%);
	pointer-events:none;
	z-index:0;
}
.vp-pricing-hero .container-fluid{
	position:relative;
	max-width:1560px;
	padding:0 50px;
	margin:0 auto;
}

/* --- right floating benefits card --- */
.vp-pricing-float{
	position:absolute;
	top:0;
	right:50px;
	width:270px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:16px;
	padding:18px 20px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 24px 46px -26px rgba(10,18,36,.22);
	display:flex;
	flex-direction:column;
	gap:12px;
	z-index:1;
}
.vp-pricing-float-item{
	display:flex;
	align-items:center;
	gap:10px;
}
.vp-pricing-float-item i{ font-size:19px; color:#2871FE; flex:0 0 auto; }
.vp-pricing-float-item span{
	color:#334;
	font-size:12px;
	font-weight:600;
	line-height:1.35;
}

/* --- header --- */
.vp-pricing-header{
	position:relative;
	z-index:1;
	text-align:center;
	max-width:720px;
	margin:0 auto 54px;
}
.vp-pricing-eyebrow{
	display:inline-block;
	background:#ffffff;
	color:#2871FE;
	font-size:11px;
	font-weight:700;
	letter-spacing:.5px;
	padding:8px 20px;
	border-radius:999px;
	border:1px solid rgba(40,113,254,.2);
	box-shadow:0 8px 20px -14px rgba(40,113,254,.5);
	margin-bottom:20px;
}
.vp-pricing-back-row{
	position:relative;
	z-index:1;
	text-align:left;
	margin-bottom:24px;
}
.vp-pricing-back-btn{
	display:inline-flex;
	align-items:center;
	gap:10px;
	background:linear-gradient(180deg,#ffffff 0%,#fbfcff 100%);
	color:#0a1224;
	font-size:12.5px;
	font-weight:700;
	letter-spacing:.1px;
	padding:7px 20px 7px 7px;
	border-radius:999px;
	border:1px solid #e3e8f0;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 10px 22px -14px rgba(10,18,36,.22),0 0 0 1px rgba(40,113,254,.05);
	transition:border-color .3s ease,box-shadow .3s ease,transform .3s cubic-bezier(.16,1,.3,1),background .3s ease;
}
.vp-pricing-back-btn-icon{
	display:flex;
	align-items:center;
	justify-content:center;
	width:26px;
	height:26px;
	border-radius:50%;
	background:linear-gradient(145deg,#eaf2ff 0%,#dbe9ff 100%);
	box-shadow:0 0 0 4px rgba(40,113,254,.06);
	color:#2871FE;
	flex:0 0 auto;
	transition:background .3s ease,color .3s ease,transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease;
}
.vp-pricing-back-btn-icon i{ font-size:13px; transition:transform .3s cubic-bezier(.16,1,.3,1); }
.vp-pricing-back-btn:hover{
	border-color:rgba(40,113,254,.35);
	background:linear-gradient(180deg,#ffffff 0%,#f4f8ff 100%);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 34px -16px rgba(40,113,254,.4),0 0 0 1px rgba(40,113,254,.12);
	transform:translateY(-2px);
}
.vp-pricing-back-btn:hover .vp-pricing-back-btn-icon{
	background:linear-gradient(135deg,#2871FE,#1a56d6);
	box-shadow:0 0 0 4px rgba(40,113,254,.14),0 10px 18px -10px rgba(40,113,254,.6);
	color:#ffffff;
	transform:scale(1.08);
}
.vp-pricing-back-btn:hover .vp-pricing-back-btn-icon i{ transform:translateX(-2px); }
.vp-pricing-title{
	font-family:"Cabin";
	font-size:38px;
	line-height:1.24;
	font-weight:800;
	color:#0a1224;
	margin:0 0 14px;
}
.vp-pricing-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-pricing-lead{
	color:#5b6579;
	font-size:15px;
	line-height:1.7;
	margin:0;
}

/* --- plan cards --- */
.vp-pricing-grid{
	position:relative;
	z-index:1;
	display:grid;
	grid-template-columns:1fr 1.08fr 1fr;
	gap:24px;
	align-items:stretch;
	margin-bottom:54px;
}
.vp-plan{
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:22px;
	padding:34px 30px 30px;
	position:relative;
	display:flex;
	flex-direction:column;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -30px rgba(10,18,36,.16);
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease;
}
.vp-plan:hover{ transform:translateY(-4px); }
.vp-plan-featured{
	border-color:rgba(139,92,246,.35);
	margin-top:-18px;
	padding-bottom:34px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 30px 56px -26px rgba(139,92,246,.28);
	z-index:2;
}
.vp-plan-featured::before{
	content:'';
	position:absolute;
	top:-60px;
	left:50%;
	transform:translateX(-50%);
	width:420px;
	height:420px;
	background:radial-gradient(circle,rgba(139,92,246,.16) 0%,rgba(139,92,246,0) 68%);
	pointer-events:none;
	z-index:-1;
}
.vp-plan-featured:hover{ transform:translateY(-4px); }
.vp-plan-ribbon{
	position:absolute;
	top:-16px;
	left:50%;
	transform:translateX(-50%);
	background:linear-gradient(135deg,#8b5cf6,#7440e0);
	color:#ffffff;
	font-size:10.5px;
	font-weight:700;
	letter-spacing:.4px;
	padding:9px 20px;
	border-radius:999px;
	white-space:nowrap;
	box-shadow:0 10px 22px -10px rgba(139,92,246,.6);
}
.vp-plan-level{
	display:inline-block;
	align-self:flex-start;
	font-size:10.5px;
	font-weight:700;
	letter-spacing:.3px;
	text-transform:uppercase;
	padding:5px 12px;
	border-radius:999px;
	margin-bottom:18px;
}
.vp-plan-blue .vp-plan-level{ background:#f4f6fa; color:#5b6579; border:1px solid #edf0f5; }
.vp-plan-purple .vp-plan-level{ background:#f1eafd; color:#8b5cf6; }
.vp-plan-green .vp-plan-level{ background:#e7faf0; color:#17a35c; }
.vp-plan-icon{
	width:58px;
	height:58px;
	border-radius:18px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:16px;
}
.vp-plan-icon i{ font-size:26px; }
.vp-plan-blue .vp-plan-icon{ background:linear-gradient(145deg,#eaf2ff 0%,#dbe9ff 100%); box-shadow:0 0 0 6px rgba(40,113,254,.06),0 14px 26px -14px rgba(40,113,254,.5); }
.vp-plan-blue .vp-plan-icon i{ color:#2871FE; }
.vp-plan-purple .vp-plan-icon{ background:linear-gradient(145deg,#f1eafd 0%,#e6ddfd 100%); box-shadow:0 0 0 6px rgba(139,92,246,.06),0 14px 26px -14px rgba(139,92,246,.5); }
.vp-plan-purple .vp-plan-icon i{ color:#8b5cf6; }
.vp-plan-green .vp-plan-icon{ background:linear-gradient(145deg,#e7faf0 0%,#d7f3e6 100%); box-shadow:0 0 0 6px rgba(23,163,92,.06),0 14px 26px -14px rgba(23,163,92,.5); }
.vp-plan-green .vp-plan-icon i{ color:#17a35c; }
.vp-plan-brand{
	display:block;
	color:#8892a3;
	font-size:12px;
	font-weight:600;
	margin-bottom:2px;
}
.vp-plan-name{
	font-family:"Cabin";
	font-size:25px;
	font-weight:800;
	margin:0;
	letter-spacing:.2px;
}
.vp-plan-blue .vp-plan-name{ color:#0a1224; }
.vp-plan-purple .vp-plan-name{ color:#8b5cf6; }
.vp-plan-green .vp-plan-name{ color:#17a35c; }
.vp-pb-hero .vp-plan-blue .vp-plan-name{ color:#2871FE; }
.vp-plan-tagline{
	font-size:14.5px;
	font-weight:700;
	margin:4px 0 0;
}
.vp-plan-blue .vp-plan-tagline{ color:#2871FE; }
.vp-plan-purple .vp-plan-tagline{ color:#8b5cf6; }
.vp-plan-green .vp-plan-tagline{ color:#17a35c; }
.vp-plan-desc{
	color:#5b6579;
	font-size:13px;
	line-height:1.6;
	margin:14px 0 22px;
}
.vp-plan-divider{
	display:block;
	border-top:1px solid #edf1f7;
	margin:0 0 20px;
}
.vp-plan-price-label{
	display:block;
	color:#8892a3;
	font-size:11px;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:.3px;
	margin-bottom:6px;
}
.vp-plan-price-row{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:14px;
	margin-bottom:24px;
}
.vp-plan-price{
	font-family:"Cabin";
	font-size:32px;
	font-weight:800;
	white-space:nowrap;
}
.vp-plan-blue .vp-plan-price{ color:#0a1224; }
.vp-plan-purple .vp-plan-price{ color:#8b5cf6; }
.vp-pb-hero .vp-plan-blue .vp-plan-price{ color:#2871FE; }
.vp-plan-price small{
	display:inline-block;
	font-size:12.5px;
	font-weight:600;
	color:#8892a3;
	margin-left:6px;
}
.vp-plan-addon{
	flex:1 1 auto;
	background:#f4eefe;
	color:#7440e0;
	font-size:11.5px;
	font-weight:600;
	line-height:1.4;
	padding:10px 14px;
	border-radius:12px;
}
.vp-plan-features{
	list-style:none;
	margin:0 0 24px;
	padding:0;
	display:flex;
	flex-direction:column;
	gap:12px;
}
.vp-plan-features li{
	display:flex;
	align-items:flex-start;
	gap:10px;
	color:#3a4256;
	font-size:12.5px;
	line-height:1.55;
}
.vp-plan-check{
	flex:0 0 18px;
	width:18px;
	height:18px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-top:1px;
}
.vp-plan-check i{ font-size:10px; }
.vp-plan-blue .vp-plan-check{ background:#e7f0ff; color:#2871FE; }
.vp-plan-purple .vp-plan-check{ background:#f1eafd; color:#8b5cf6; }
.vp-plan-green .vp-plan-check{ background:#e7faf0; color:#17a35c; }
.vp-plan-highlight{
	margin-top:auto;
	display:flex;
	align-items:center;
	gap:12px;
	border-radius:14px;
	padding:14px 16px;
	font-size:12px;
	line-height:1.5;
}
.vp-plan-highlight i{ font-size:21px; flex:0 0 auto; }
.vp-plan-blue .vp-plan-highlight{ background:#eef4ff; color:#1a3a7a; }
.vp-plan-purple .vp-plan-highlight{ background:#f4eefe; color:#5b2fa8; }
.vp-plan-green .vp-plan-highlight{ background:#eaf9f1; color:#0f6b3d; }

/* --- degressive pricing table (Délégué) --- */
.vp-plan-table{
	width:100%;
	border-collapse:collapse;
	font-size:12px;
	margin-bottom:22px;
	border:1px solid #e2f3e9;
	border-radius:12px;
	overflow:hidden;
}
.vp-plan-table thead th{
	background:#e7f9ef;
	color:#17a35c;
	font-size:10px;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.3px;
	padding:9px 12px;
	text-align:left;
}
.vp-plan-table thead th:last-child{ text-align:right; }
.vp-plan-table tbody td{
	padding:8px 12px;
	color:#3a4256;
	border-top:1px solid #f0f3f0;
}
.vp-plan-table tbody tr:nth-child(odd){ background:#fafcfb; }
.vp-plan-table tbody td:last-child{ text-align:right; font-weight:700; color:#0a1224; }

/* --- Agents IA row (Autonome) --- */
.vp-plan-agents{
	margin-top:24px;
	padding-top:22px;
	border-top:1px solid #edf1f7;
	text-align:center;
}
.vp-plan-agents h5{
	font-family:"Cabin";
	font-size:12.5px;
	font-weight:700;
	color:#5b6579;
	margin:0 0 16px;
}
.vp-plan-agents-row{
	display:flex;
	justify-content:center;
	gap:12px;
	flex-wrap:wrap;
}
.vp-agent-mini{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:6px;
	width:56px;
}
.vp-agent-mini img{
	width:46px;
	height:46px;
	border-radius:50%;
	object-fit:cover;
	border:2px solid #ffffff;
	box-shadow:0 0 0 2px rgba(139,92,246,.55),0 8px 16px -8px rgba(139,92,246,.5);
}
.vp-agent-mini span{
	font-size:10.5px;
	font-weight:700;
	color:#0a1224;
	line-height:1.2;
}
.vp-agent-mini small{
	font-size:9px;
	color:#8892a3;
	line-height:1.2;
}
.vp-agent-mini-more .vp-agent-mini-dots{
	width:46px;
	height:46px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	background:#f4f6fa;
	border:2px dashed #d5dbe6;
	color:#8892a3;
	font-size:14px;
	font-weight:700;
	letter-spacing:1px;
}
.vp-agent-mini-more small{ text-align:center; }

/* --- bottom strip --- */
.vp-pricing-strip{
	position:relative;
	z-index:1;
	display:flex;
	align-items:center;
	justify-content:space-between;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	padding:32px 38px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -28px rgba(10,18,36,.16);
}
.vp-pricing-strip-item{
	display:flex;
	align-items:flex-start;
	gap:14px;
	flex:1;
	padding:0 16px;
	transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.vp-pricing-strip-item:hover{ transform:translateY(-4px); }
.vp-pricing-strip-icon{
	flex:0 0 42px;
	width:42px;
	height:42px;
	border-radius:13px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-pricing-strip-icon i{ font-size:18px; }
.vp-pricing-strip-icon.vp-icon-blue{ background:linear-gradient(145deg,#eaf2ff,#dbe9ff); }
.vp-pricing-strip-icon.vp-icon-blue i{ color:#2871FE; }
.vp-pricing-strip-icon.vp-icon-purple{ background:linear-gradient(145deg,#f1eafd,#e6ddfd); }
.vp-pricing-strip-icon.vp-icon-purple i{ color:#8b5cf6; }
.vp-pricing-strip-icon.vp-icon-dark{ background:linear-gradient(145deg,#e9ebf2,#dde1ea); }
.vp-pricing-strip-icon.vp-icon-dark i{ color:#0a1224; }
.vp-pricing-strip-icon.vp-icon-green{ background:linear-gradient(145deg,#e7faf0,#d7f3e6); }
.vp-pricing-strip-icon.vp-icon-green i{ color:#17a35c; }
.vp-pricing-strip-item h4{
	font-family:"Cabin";
	font-size:14px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-pricing-strip-item p{
	color:#5b6579;
	font-size:12px;
	line-height:1.5;
	margin:0;
}
.vp-pricing-strip-divider{
	width:1px;
	align-self:stretch;
	background:#e3e8f0;
	flex:0 0 1px;
}

/* --- motion --- */
@keyframes vpPlanPop{
	from{ opacity:0; transform:translateY(34px) scale(.96); }
	to{ opacity:1; transform:translateY(0) scale(1); }
}
@keyframes vpRibbonGlow{
	0%,100%{ box-shadow:0 10px 22px -10px rgba(139,92,246,.6); }
	50%{ box-shadow:0 12px 30px -6px rgba(139,92,246,.85); }
}
@keyframes vpAvatarIn{
	from{ opacity:0; transform:translateY(14px) scale(.8); }
	to{ opacity:1; transform:translateY(0) scale(1); }
}

.vp-pricing-float{ animation:vpFadeIn 1s cubic-bezier(.16,1,.3,1) .1s both,vpFloat 6.5s ease-in-out 1.2s infinite; }
.vp-pricing-float-item{ opacity:0; animation:vpFadeUp .5s cubic-bezier(.16,1,.3,1) both; }
.vp-pricing-float-item:nth-child(1){ animation-delay:.5s; }
.vp-pricing-float-item:nth-child(2){ animation-delay:.58s; }
.vp-pricing-float-item:nth-child(3){ animation-delay:.66s; }
.vp-pricing-float-item:nth-child(4){ animation-delay:.74s; }
.vp-pricing-float-item:nth-child(5){ animation-delay:.82s; }

.vp-pricing-eyebrow{ animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-pricing-back-btn{ animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-pricing-title{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .1s both; }
.vp-pricing-lead{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .2s both; }

.vp-plan{ opacity:0; animation:vpPlanPop .75s cubic-bezier(.16,1,.3,1) both; }
.vp-plan:nth-of-type(1){ animation-delay:.28s; }
.vp-plan:nth-of-type(2){ animation-delay:.36s; }
.vp-plan:nth-of-type(3){ animation-delay:.44s; }

.vp-plan-ribbon{ animation:vpRibbonGlow 2.6s ease-in-out 1s infinite; }

.vp-plan-features li{ opacity:0; animation:vpFadeUp .5s cubic-bezier(.16,1,.3,1) both; }
.vp-plan-features li:nth-child(1){ animation-delay:.5s; }
.vp-plan-features li:nth-child(2){ animation-delay:.56s; }
.vp-plan-features li:nth-child(3){ animation-delay:.62s; }
.vp-plan-features li:nth-child(4){ animation-delay:.68s; }
.vp-plan-features li:nth-child(5){ animation-delay:.74s; }
.vp-plan-features li:nth-child(6){ animation-delay:.8s; }
.vp-plan-features li:nth-child(7){ animation-delay:.86s; }

.vp-agent-mini{ opacity:0; animation:vpAvatarIn .5s cubic-bezier(.16,1,.3,1) both; }
.vp-agent-mini:nth-child(1){ animation-delay:.92s; }
.vp-agent-mini:nth-child(2){ animation-delay:.98s; }
.vp-agent-mini:nth-child(3){ animation-delay:1.04s; }
.vp-agent-mini:nth-child(4){ animation-delay:1.1s; }
.vp-agent-mini:nth-child(5){ animation-delay:1.16s; }
.vp-agent-mini:nth-child(6){ animation-delay:1.22s; }

.vp-pricing-strip{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .55s both; }

/* --- hover interactions --- */
.vp-plan-blue{ --vp-plan-rgb:40,113,254; }
.vp-plan-purple{ --vp-plan-rgb:139,92,246; }
.vp-plan-green{ --vp-plan-rgb:23,163,92; }
.vp-plan:hover{
	transform:translateY(-8px);
	border-color:rgba(var(--vp-plan-rgb),.35);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 30px 54px -26px rgba(10,18,36,.2),0 16px 32px -18px rgba(var(--vp-plan-rgb),.3);
}
.vp-plan-featured:hover{
	transform:translateY(-22px);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 36px 64px -24px rgba(139,92,246,.36);
}
.vp-plan-icon{ transition:transform .45s cubic-bezier(.16,1,.3,1); }
.vp-plan:hover .vp-plan-icon{ transform:scale(1.1) rotate(-4deg); }

.vp-plan-features li{ transition:transform .25s ease; }
.vp-plan-features li:hover{ transform:translateX(3px); }
.vp-plan-check{ transition:transform .3s cubic-bezier(.16,1,.3,1); }
.vp-plan-features li:hover .vp-plan-check{ transform:scale(1.25); }

.vp-plan-highlight img{ transition:transform .4s cubic-bezier(.16,1,.3,1); }
.vp-plan:hover .vp-plan-highlight img{ transform:scale(1.12) rotate(-6deg); }

.vp-agent-mini{ transition:transform .35s cubic-bezier(.16,1,.3,1); }
.vp-agent-mini:hover{ transform:translateY(-5px); }
.vp-agent-mini img{ transition:box-shadow .35s ease; }
.vp-agent-mini:hover img{ box-shadow:0 0 0 3px rgba(139,92,246,.75),0 10px 20px -8px rgba(139,92,246,.55); }
.vp-agent-mini-more .vp-agent-mini-dots{ transition:transform .35s ease,color .35s ease,border-color .35s ease; }
.vp-agent-mini-more:hover .vp-agent-mini-dots{ transform:scale(1.1); color:#8b5cf6; border-color:#c9b8f7; }

.vp-plan-table tbody tr{ transition:background .25s ease; }
.vp-plan-table tbody tr:hover{ background:#eefaf3; }

.vp-pricing-strip-icon{ transition:transform .35s cubic-bezier(.16,1,.3,1); }
.vp-pricing-strip-item:hover .vp-pricing-strip-icon{ transform:scale(1.12) rotate(-4deg); }

@media(prefers-reduced-motion:reduce){
	.vp-pricing-float,.vp-pricing-float-item,.vp-pricing-eyebrow,.vp-pricing-back-btn,.vp-pricing-title,.vp-pricing-lead,.vp-plan,.vp-pricing-strip,.vp-plan-features li,.vp-agent-mini,.vp-plan-ribbon{ animation:none !important; opacity:1 !important; transform:none !important; }
}

@media(max-width:1439px){
	.vp-pricing-float{ display:none; }
}
@media(max-width:1199px){
	.vp-pricing-title{ font-size:32px; }
	.vp-pricing-grid{ grid-template-columns:1fr; max-width:520px; margin-left:auto; margin-right:auto; }
	.vp-plan-featured{ margin-top:0; order:-1; }
	.vp-pricing-strip{ flex-wrap:wrap; gap:24px; padding:28px 24px; }
	.vp-pricing-strip-item{ flex:1 1 40%; }
	.vp-pricing-strip-divider{ display:none; }
}
@media(max-width:575px){
	.vp-pricing-hero .container-fluid{ padding:0 20px; }
	.vp-pricing-title{ font-size:26px; }
	.vp-plan{ padding:28px 22px 26px; }
	.vp-plan-price-row{ flex-direction:column; align-items:flex-start; }
	.vp-pricing-strip-item{ flex:1 1 100%; }
	.vp-pricing-back-row{ text-align:center; }
}

/* ================= VISIOpaie Pricing Hero — Tarifs Entreprises ================= */
.vp-pb-hero{ padding-top:64px; }
.vp-pb-accent{
	background:linear-gradient(90deg,#17a35c 0%,#4fd08a 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-pb-eyebrow{ color:#17a35c; border-color:rgba(23,163,92,.22); box-shadow:0 8px 20px -14px rgba(23,163,92,.5); }

/* --- seal badge --- */
.vp-pb-seal{
	position:absolute;
	top:0;
	right:50px;
	width:132px;
	height:132px;
	border-radius:50%;
	background:radial-gradient(circle at 32% 28%,#1f6b4a 0%,#0a1f16 72%);
	box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 26px 46px -20px rgba(10,31,22,.55);
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-align:center;
	padding:16px;
	z-index:1;
}
.vp-pb-seal i{ font-size:16px; color:#ffd166; margin-bottom:6px; }
.vp-pb-seal span{
	font-family:"Cabin";
	font-size:8.5px;
	font-weight:800;
	letter-spacing:.3px;
	line-height:1.5;
	color:#ffffff;
}

/* --- layout: cards + sidebar --- */
.vp-pb-layout{
	position:relative;
	z-index:1;
	display:grid;
	grid-template-columns:1fr 280px;
	gap:28px;
	align-items:start;
	margin-bottom:44px;
}
.vp-pb-cards{
	display:grid;
	grid-template-columns:1fr 1.08fr 1fr;
	gap:24px;
	align-items:stretch;
}
.vp-pb-side{
	display:flex;
	flex-direction:column;
	gap:28px;
}
.vp-pb-float{
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:16px;
	padding:18px 20px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 24px 46px -26px rgba(10,18,36,.22);
	display:flex;
	flex-direction:column;
	gap:12px;
}
.vp-pb-values{
	display:flex;
	flex-direction:column;
	gap:22px;
}
.vp-pb-value-item{
	display:flex;
	align-items:flex-start;
	gap:12px;
}
.vp-pb-value-icon{
	flex:0 0 38px;
	width:38px;
	height:38px;
	border-radius:12px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:linear-gradient(145deg,#e7faf0 0%,#d7f3e6 100%);
	box-shadow:0 8px 16px -10px rgba(23,163,92,.45);
}
.vp-pb-value-icon i{ font-size:17px; color:#17a35c; }
.vp-pb-value-item h4{
	font-family:"Cabin";
	font-size:14px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-pb-value-item p{
	color:#5b6579;
	font-size:12px;
	line-height:1.55;
	margin:0;
}
.vp-pb-value-item p strong{ color:#17a35c; font-weight:700; }

/* --- comparison tables --- */
.vp-pb-tables{
	position:relative;
	z-index:1;
	display:grid;
	grid-template-columns:1.1fr 1fr;
	gap:22px;
	margin-bottom:44px;
}
.vp-pb-degressive,
.vp-pb-compare{
	min-width:0;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	padding:24px 26px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -30px rgba(10,18,36,.16);
}
.vp-pb-degressive h4,
.vp-pb-compare h4{
	display:flex;
	align-items:center;
	gap:9px;
	font-family:"Cabin";
	font-size:15px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 16px;
}
.vp-pb-degressive h4 i{ font-size:17px; color:#17a35c; }
.vp-pb-degressive h4 span{ font-size:12px; font-weight:600; color:#8892a3; }
.vp-pb-table-wrap{
	position:relative;
	overflow-x:auto;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:thin;
}
.vp-pb-degressive,
.vp-pb-compare{ position:relative; }
.vp-pb-degressive::after,
.vp-pb-compare::after{
	content:'';
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	width:28px;
	background:linear-gradient(90deg,rgba(255,255,255,0),#ffffff);
	pointer-events:none;
	opacity:0;
	transition:opacity .25s ease;
	border-radius:0 18px 18px 0;
}
.vp-pb-degressive.vp-pb-scrollable::after,
.vp-pb-compare.vp-pb-scrollable::after{ opacity:1; }
.vp-pb-degressive-table{
	width:100%;
	border-collapse:collapse;
	font-size:12.5px;
	white-space:nowrap;
}
.vp-pb-degressive-table thead th{
	color:#8892a3;
	font-size:10px;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.3px;
	text-align:right;
	padding:0 0 10px;
	border-bottom:1px solid #edf1f7;
}
.vp-pb-degressive-table thead th:first-child{ text-align:left; }
.vp-pb-degressive-table tbody td{
	padding:10px 12px 10px 0;
	text-align:right;
	color:#3a4256;
	border-bottom:1px solid #f4f6fa;
}
.vp-pb-degressive-table tbody td:first-child{ text-align:left; color:#0a1224; font-weight:600; }
.vp-pb-degressive-table tbody td:not(:first-child){ font-weight:700; color:#0a1224; }
.vp-pb-degressive-table tbody tr:last-child td{ border-bottom:none; }
.vp-pb-degressive-table th:first-child,
.vp-pb-degressive-table td:first-child{
	position:sticky;
	left:0;
	background:#ffffff;
	z-index:1;
}
.vp-pb-degressive-table tbody tr:nth-child(odd) td:first-child{ background:#fafcfb; }

.vp-pb-compare-table{
	width:100%;
	border-collapse:collapse;
	font-size:12px;
}
.vp-pb-compare-table th,
.vp-pb-compare-table td{
	padding:9px 8px;
	text-align:center;
	border-bottom:1px solid #f4f6fa;
}
.vp-pb-compare-table tbody td:first-child,
.vp-pb-compare-table thead th:first-child{ text-align:left; padding-left:0; }
.vp-pb-compare-table tbody td:first-child{ color:#0a1224; font-weight:600; white-space:nowrap; }
.vp-pb-compare-table tbody td{ color:#5b6579; }
.vp-pb-compare-table tbody tr:last-child td{ border-bottom:none; }
.vp-pb-compare-table th:first-child,
.vp-pb-compare-table td:first-child{
	position:sticky;
	left:0;
	background:#ffffff;
	z-index:1;
	padding-right:14px;
}
.vp-pb-compare-table thead th{
	font-family:"Cabin";
	font-size:11px;
	font-weight:800;
	letter-spacing:.3px;
	padding-top:0;
	padding-bottom:12px;
	border-bottom:2px solid #edf1f7;
}
.vp-pb-compare-table thead th small{
	display:block;
	font-size:9.5px;
	font-weight:600;
	text-transform:none;
	letter-spacing:0;
	margin-top:2px;
}
.vp-pb-col-icon{
	display:flex;
	align-items:center;
	justify-content:center;
	width:26px;
	height:26px;
	border-radius:50%;
	margin:0 auto 6px;
}
.vp-pb-col-icon i{ font-size:12px; }
.vp-pb-col-green .vp-pb-col-icon{ background:#e7faf0; } .vp-pb-col-green .vp-pb-col-icon i{ color:#17a35c; }
.vp-pb-col-blue .vp-pb-col-icon{ background:#eaf2ff; } .vp-pb-col-blue .vp-pb-col-icon i{ color:#2871FE; }
.vp-pb-col-purple .vp-pb-col-icon{ background:#f1eafd; } .vp-pb-col-purple .vp-pb-col-icon i{ color:#8b5cf6; }
.vp-pb-col-green{ color:#17a35c; } .vp-pb-col-green small{ color:#17a35c; opacity:.8; }
.vp-pb-col-blue{ color:#2871FE; } .vp-pb-col-blue small{ color:#2871FE; opacity:.8; }
.vp-pb-col-purple{ color:#8b5cf6; } .vp-pb-col-purple small{ color:#8b5cf6; opacity:.8; }
.vp-pb-compare-table tbody i{ font-size:14px; color:#17a35c; }

/* --- bottom strip caps --- */
.vp-pb-strip .vp-pricing-strip-item h4{
	text-transform:uppercase;
	font-size:12.5px;
	letter-spacing:.2px;
}

@media(max-width:1439px){
	.vp-pb-seal{ display:none; }
}
@media(max-width:1199px){
	.vp-pb-layout{ grid-template-columns:1fr; }
	.vp-pb-cards{ grid-template-columns:1fr; max-width:520px; margin:0 auto; }
	.vp-pb-cards .vp-plan-featured{ margin-top:0; order:-1; }
	.vp-pb-side{ flex-direction:row; flex-wrap:wrap; max-width:760px; margin:0 auto; }
	.vp-pb-float,.vp-pb-values{ flex:1 1 320px; }
	.vp-pb-tables{ grid-template-columns:1fr; }
}
@media(max-width:767px){
	.vp-pb-side{ flex-direction:column; }
}
@media(max-width:575px){
	.vp-pb-degressive,.vp-pb-compare{ padding:20px 18px; }
}

/* ================= VISIOpaie Approach — Moteur + Agents IA à chaque étape ================= */
.vp-approach{
	position:relative;
	background:#fbfcfe;
	padding:100px 0 90px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-approach .container-fluid{
	position:relative;
	max-width:1600px;
	padding:0 50px;
	margin:0 auto;
}

/* --- head --- */
.vp-approach-head{
	text-align:center;
	max-width:820px;
	margin:0 auto 56px;
}
.vp-approach-badge{
	display:inline-flex;
	align-items:center;
	gap:9px;
	background:linear-gradient(180deg,#ffffff 0%,#f6f9ff 100%);
	color:#2871FE;
	padding:8px 18px 8px 8px;
	border-radius:999px;
	font-size:12px;
	font-weight:700;
	letter-spacing:.4px;
	text-transform:uppercase;
	border:1px solid rgba(40,113,254,.2);
	box-shadow:0 8px 20px -14px rgba(40,113,254,.5);
	margin-bottom:22px;
}
.vp-approach-badge-icon{
	width:22px;
	height:22px;
	border-radius:50%;
	background:#e7f0ff;
	color:#2871FE;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:14px;
	font-weight:800;
}
.vp-approach-title{
	font-family:"Cabin";
	font-size:38px;
	line-height:1.28;
	font-weight:800;
	color:#0a1224;
	margin:0 0 18px;
}
.vp-approach-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-approach-sub{
	color:#5b6579;
	font-size:15px;
	line-height:1.7;
	margin:0;
}
.vp-approach-sub strong{ color:#0a1224; font-weight:700; }

/* --- flow row --- */
.vp-approach-flow{
	display:flex;
	align-items:center;
	gap:0;
	margin-bottom:64px;
}
.vp-approach-side{
	flex:0 0 190px;
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
}
.vp-approach-side-left{ align-items:flex-start; text-align:left; padding-right:20px; }
.vp-approach-side-title{
	font-family:"Cabin";
	font-size:16px;
	font-weight:700;
	color:#0a1224;
	line-height:1.35;
	margin:0 0 10px;
}
.vp-approach-side-text{
	color:#5b6579;
	font-size:12.5px;
	line-height:1.6;
	margin:0 0 26px;
}
.vp-approach-side-right{ padding-left:20px; }

/* orb */
.vp-approach-orb{
	position:relative;
	width:150px;
	height:150px;
	flex:0 0 auto;
}
.vp-approach-orb-ring{
	position:absolute;
	inset:0;
	border-radius:50%;
	border:1px solid;
}
.vp-approach-orb-ring-out{ inset:0; }
.vp-approach-orb-ring-in{ inset:14px; border-style:dashed; opacity:.55; }
.vp-approach-orb-purple .vp-approach-orb-ring{ border-color:rgba(139,92,246,.35); }
.vp-approach-orb-green .vp-approach-orb-ring{ border-color:rgba(23,163,92,.35); }
.vp-approach-orb-dot{
	position:absolute;
	width:6px;
	height:6px;
	border-radius:50%;
	transform:translate(-50%,-50%);
	box-shadow:0 0 0 4px rgba(139,92,246,.12);
}
.vp-approach-orb-purple .vp-approach-orb-dot{ background:#8b5cf6; box-shadow:0 0 0 4px rgba(139,92,246,.14); }
.vp-approach-orb-green .vp-approach-orb-dot{ background:#17a35c; box-shadow:0 0 0 4px rgba(23,163,92,.14); }
.vp-approach-orb-core{
	position:absolute;
	inset:32px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-approach-orb-core img{ width:26px; height:26px; }
.vp-approach-orb-purple .vp-approach-orb-core{ background:radial-gradient(circle,#8b5cf6 0%,#7440e0 100%); box-shadow:0 0 0 10px rgba(139,92,246,.1),0 16px 30px -14px rgba(139,92,246,.6); }
.vp-approach-orb-green .vp-approach-orb-core{ background:radial-gradient(circle,#17a35c 0%,#0f8a4a 100%); box-shadow:0 0 0 10px rgba(23,163,92,.1),0 16px 30px -14px rgba(23,163,92,.6); }

/* steps */
.vp-approach-step{ flex:0 0 auto; }
.vp-approach-step-card{
	flex-basis:216px;
	min-height:283px;
	box-sizing:border-box;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:20px;
	padding:22px 20px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -30px rgba(10,18,36,.16);
}
.vp-approach-step-card h4{
	font-family:"Cabin";
	font-size:14.5px;
	font-weight:800;
	color:#0a1224;
	margin:0 0 18px;
	line-height:1.3;
}
.vp-approach-step-data ul,
.vp-approach-step-results ul{
	list-style:none;
	margin:0;
	padding:0;
	display:flex;
	flex-direction:column;
	gap:14px;
}
.vp-approach-step-data li,
.vp-approach-step-results li{
	display:flex;
	align-items:center;
	gap:10px;
	font-size:12.5px;
	font-weight:600;
	color:#1c2434;
}
.vp-approach-step-icon{
	flex:0 0 30px;
	width:30px;
	height:30px;
	border-radius:10px;
	background:linear-gradient(145deg,#f1eafd 0%,#e6ddfd 100%);
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-approach-step-icon img{ width:14px; height:14px; }
.vp-approach-check{
	flex:0 0 22px;
	width:22px;
	height:22px;
	border-radius:50%;
	background:#e7faf0;
	color:#17a35c;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-approach-check i{ font-size:11px; }

.vp-approach-step-engine{
	flex-basis:170px;
	min-height:283px;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:space-between;
	text-align:center;
	padding:26px 18px;
	box-sizing:border-box;
	background:linear-gradient(150deg,#2871FE 0%,#1a56d6 100%);
	border-radius:20px;
	box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 24px 46px -22px rgba(20,60,180,.45);
}
.vp-approach-engine-title{
	font-family:"Cabin";
	font-size:15px;
	font-weight:800;
	color:#ffffff;
	margin:0;
}
.vp-approach-engine-badge{
	position:relative;
	width:118px;
	height:118px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-approach-engine-ring{
	position:absolute;
	inset:0;
	border-radius:50%;
	border:1px solid rgba(255,255,255,.55);
}
.vp-approach-engine-ring-out{ box-shadow:0 0 26px 4px rgba(255,255,255,.22); }
.vp-approach-engine-ring-in{ inset:16px; border-style:dashed; border-color:rgba(255,255,255,.35); }
.vp-approach-engine-badge i{
	position:relative;
	font-size:42px;
	color:#ffffff;
	filter:drop-shadow(0 0 14px rgba(255,255,255,.65));
}
.vp-approach-engine-text{
	color:rgba(255,255,255,.92);
	font-size:13px;
	line-height:1.65;
	margin:0;
}

.vp-approach-step-agents{ flex-basis:456px; text-align:center; }
.vp-approach-step-agents h4{ text-align:center; }
.vp-approach-agents-grid{
	display:grid;
	grid-template-columns:repeat(5,1fr);
	gap:16px 6px;
}
.vp-approach-mini-agent{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:5px;
}
.vp-approach-mini-agent img{
	width:52px;
	height:52px;
	border-radius:50%;
	object-fit:cover;
	border:2px solid #ffffff;
	box-shadow:0 0 0 2px rgba(40,113,254,.5),0 8px 16px -8px rgba(40,113,254,.5);
}
.vp-approach-mini-agent span{
	font-size:11px;
	font-weight:700;
	color:#0a1224;
	line-height:1.2;
}
.vp-approach-mini-agent small{
	font-size:9.5px;
	color:#8892a3;
	line-height:1.2;
	text-align:center;
}
.vp-approach-mini-agent-more .vp-approach-mini-dots{
	width:52px;
	height:52px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	background:#f4f6fa;
	border:2px dashed #d5dbe6;
	color:#8892a3;
	font-size:15px;
	font-weight:700;
}

.vp-approach-arrow{
	flex:0 0 auto;
	width:80px;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:0;
}
.vp-arrow-line{
	flex:1;
	height:2px;
	background:linear-gradient(90deg,#c7d2e0 0%,#2871FE 100%);
	border-radius:2px;
}
.vp-approach-arrow:last-of-type .vp-arrow-line{
	background:linear-gradient(90deg,#2871FE 0%,#c7d2e0 100%);
}
.vp-arrow-icon{
	flex:0 0 36px;
	width:36px;
	height:36px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:linear-gradient(135deg,#2871FE 0%,#1a4fd6 100%);
	color:#ffffff;
	font-size:14px;
	border-radius:50%;
	box-shadow:0 4px 14px rgba(40,113,254,.35);
	transition:all .3s ease;
}
.vp-arrow-icon:hover{
	transform:scale(1.12);
	box-shadow:0 6px 20px rgba(40,113,254,.45);
}

/* --- benefits strip --- */
.vp-approach-benefits{
	display:flex;
	align-items:stretch;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -28px rgba(10,18,36,.16);
	margin-bottom:34px;
	overflow:hidden;
}
.vp-approach-benefit{
	flex:1;
	display:flex;
	align-items:flex-start;
	gap:16px;
	padding:30px 28px;
}
.vp-approach-benefit + .vp-approach-benefit{ border-left:1px solid #edf1f7; }
.vp-approach-benefit-icon{
	flex:0 0 46px;
	width:46px;
	height:46px;
	border-radius:14px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-approach-benefit-icon img{ width:20px; height:20px; }
.vp-approach-benefit-icon.vp-icon-blue{ background:linear-gradient(145deg,#eaf2ff 0%,#dbe9ff 100%); }
.vp-approach-benefit-icon.vp-icon-green{ background:linear-gradient(145deg,#e7faf0 0%,#d7f3e6 100%); }
.vp-approach-benefit-icon.vp-icon-orange{ background:linear-gradient(145deg,#fdf1e6 0%,#fce4cf 100%); }
.vp-approach-benefit h4{
	font-family:"Cabin";
	font-size:15px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 5px;
}
.vp-approach-benefit h4.vp-approach-text-green{ color:#17a35c; }
.vp-approach-benefit h4.vp-approach-text-orange{ color:#f5851a; }
.vp-approach-benefit p{
	color:#5b6579;
	font-size:12.5px;
	line-height:1.55;
	margin:0;
}

/* --- trust line --- */
.vp-approach-trust{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	text-align:center;
}
.vp-approach-trust img{ width:16px; height:16px; }
.vp-approach-trust span{
	color:#8892a3;
	font-size:13px;
	font-weight:600;
}

/* --- motion --- */
.vp-approach-badge{ animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-approach-title{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .1s both; }
.vp-approach-sub{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .2s both; }
.vp-approach-side-left,.vp-approach-side-right{ opacity:0; animation:vpFadeIn 1s cubic-bezier(.16,1,.3,1) .3s both; }
.vp-approach-step{ opacity:0; animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-approach-step-data{ animation-delay:.32s; }
.vp-approach-step-engine{ animation-delay:.4s; }
.vp-approach-step-agents{ animation-delay:.48s; }
.vp-approach-step-results{ animation-delay:.56s; }
.vp-approach-benefits{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .64s both; }
.vp-approach-trust{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .72s both; }
.vp-approach-step-card{ transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease; }
.vp-approach-step-card:hover{ transform:translateY(-5px); box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 26px 46px -26px rgba(10,18,36,.22); }
.vp-approach-mini-agent{ transition:transform .3s ease; }
.vp-approach-mini-agent:hover{ transform:translateY(-4px); }
.vp-approach-benefit-icon{ transition:transform .35s cubic-bezier(.16,1,.3,1); }
.vp-approach-benefit:hover .vp-approach-benefit-icon{ transform:scale(1.1) rotate(-4deg); }
@media(prefers-reduced-motion:reduce){
	.vp-approach-badge,.vp-approach-title,.vp-approach-sub,.vp-approach-side-left,.vp-approach-side-right,.vp-approach-step,.vp-approach-benefits,.vp-approach-trust{ animation:none !important; opacity:1 !important; transform:none !important; }
}

@media(max-width:1560px){
	.vp-approach-flow{ flex-wrap:wrap; justify-content:center; gap:20px; }
	.vp-approach-side{ display:none; }
}
@media(max-width:991px){
	.vp-approach-title{ font-size:30px; }
	.vp-approach-step-card,
	.vp-approach-step-agents{ flex-basis:100%; max-width:460px; }
	.vp-approach-arrow{
		width:100%;
		height:80px;
		flex-direction:column;
	}
	.vp-arrow-line{
		width:2px;
		height:auto;
		flex:1;
		background:#d5dbe6;
	}
	.vp-approach-arrow .vp-arrow-icon{
		transform:rotate(90deg);
	}
	.vp-approach-agents-grid{ grid-template-columns:repeat(5,1fr); max-width:360px; margin:0 auto; }
	.vp-approach-benefits{ flex-wrap:wrap; }
	.vp-approach-benefit{ flex:1 1 50%; }
	.vp-approach-benefit:nth-child(3){ border-left:1px solid #edf1f7; }
	.vp-approach-benefit:nth-child(2n+1){ border-left:none !important; }
}
@media(max-width:575px){
	.vp-approach .container-fluid{ padding:0 20px; }
	.vp-approach{ padding:60px 0 50px; }
	.vp-approach-title{ font-size:25px; }
	.vp-approach-agents-grid{ grid-template-columns:repeat(3,1fr); max-width:220px; }
	.vp-approach-benefit{ flex:1 1 100%; padding:22px 20px; }
	.vp-approach-benefit + .vp-approach-benefit{ border-left:none !important; border-top:1px solid #edf1f7; }
	.vp-approach-trust{ flex-wrap:wrap; }
	.vp-approach-trust span{ font-size:12px; }
	.vp-approach-step-card{ min-height:auto; padding:18px 16px; }
	.vp-approach-step-engine{ min-height:auto; }
	.vp-approach-arrow{ height:60px; }
}

/* ================= VISIOpaie Tarifs Router — Cabinet vs Entreprise ================= */
.vp-tarifs-hero{
	position:relative;
	background:linear-gradient(180deg,#f7f9fd 0%,#ffffff 460px);
	padding:46px 0 70px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-tarifs-hero .container-fluid{
	position:relative;
	max-width:1600px;
	padding:0 50px;
	margin:0 auto;
}
.vp-tarifs-head{
	text-align:center;
	max-width:760px;
	margin:0 auto 40px;
}
.vp-tarifs-title{
	font-family:"Cabin";
	font-size:42px;
	line-height:1.22;
	font-weight:800;
	color:#0a1224;
	margin:0 0 14px;
}
.vp-tarifs-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-tarifs-sub{
	color:#5b6579;
	font-size:15px;
	line-height:1.7;
	margin:0;
}

/* --- circular agent diagram --- */
.vp-tarifs-connect{ position:relative; }
.vp-tarifs-connect-svg{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	z-index:1;
	pointer-events:none;
	overflow:visible;
}
.vp-tarifs-connect-path{
	fill:none;
	stroke-width:2.5;
	stroke-dasharray:7 7;
	animation:vpTarifsFlow 2.2s linear infinite;
}
.vp-tarifs-connect-path-blue{ stroke:#2871FE; }
.vp-tarifs-connect-path-green{ stroke:#17a35c; }
@keyframes vpTarifsFlow{ to{ stroke-dashoffset:-28; } }
.vp-tarifs-diagram{
	position:relative;
	z-index:2;
	width:100%;
	max-width:880px;
	height:440px;
	margin:20px auto 30px;
}
.vp-tarifs-ring{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	border-radius:50%;
	pointer-events:none;
}
.vp-tarifs-ring-out{ width:80%; height:80%; border:1px solid rgba(40,113,254,.25); }
.vp-tarifs-ring-in{ width:57%; height:57%; border:1px dashed rgba(40,113,254,.3); }
.vp-tarifs-dot{
	position:absolute;
	width:6px;
	height:6px;
	border-radius:50%;
	background:#2871FE;
	transform:translate(-50%,-50%);
	box-shadow:0 0 0 4px rgba(40,113,254,.12);
}
.vp-tarifs-hub{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	width:264px;
	height:264px;
	border-radius:50%;
	background:#ffffff;
	box-shadow:0 30px 60px -20px rgba(10,18,36,.22),0 0 0 10px rgba(255,255,255,.65),0 0 0 11px rgba(40,113,254,.08);
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-align:center;
	padding:20px;
	z-index:2;
}
.vp-tarifs-hub-logo{ height:30px; width:auto; margin-bottom:10px; }
.vp-tarifs-hub-label{
	font-family:"Cabin";
	font-size:15px;
	font-weight:800;
	letter-spacing:.5px;
	color:#0a1224;
	margin-bottom:9px;
}
.vp-tarifs-hub-meta{
	font-size:11px;
	font-weight:600;
	color:#8892a3;
	margin-bottom:18px;
}
.vp-tarifs-hub-btn{
	display:inline-block;
	background:linear-gradient(135deg,#2871FE,#1a56d6);
	color:#ffffff;
	font-size:10.5px;
	font-weight:700;
	letter-spacing:.3px;
	text-transform:uppercase;
	padding:11px 18px;
	border-radius:999px;
	box-shadow:0 12px 22px -10px rgba(40,113,254,.6);
}
.vp-tarifs-agent{
	position:absolute;
	transform:translate(-50%,-50%);
	display:flex;
	align-items:center;
	gap:9px;
	background:rgba(255,255,255,.75);
	-webkit-backdrop-filter:blur(14px) saturate(160%);
	backdrop-filter:blur(14px) saturate(160%);
	border:1px solid rgba(255,255,255,.6);
	border-radius:999px;
	padding:6px 16px 6px 6px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 14px 28px -16px rgba(10,18,36,.28),0 0 0 1px color-mix(in srgb, var(--vp-ring,#2871FE) 10%, transparent);
	white-space:nowrap;
	z-index:3;
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,background .35s ease;
	cursor:default;
}
.vp-tarifs-agent:hover{
	transform:translate(-50%,-50%) translateY(-5px);
	background:#ffffff;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 36px -16px rgba(10,18,36,.32),0 0 0 1.5px var(--vp-ring,#2871FE);
}
.vp-tarifs-agent-photo{
	position:relative;
	flex:0 0 auto;
	width:58px;
	height:58px;
	border-radius:50%;
	background:#ffffff;
}
.vp-tarifs-agent-photo img{
	width:100%;
	height:100%;
	border-radius:50%;
	object-fit:cover;
	display:block;
	border:2.5px solid var(--vp-ring,#2871FE);
	box-sizing:border-box;
}
.vp-tarifs-agent-icon{
	position:absolute;
	right:-3px;
	bottom:-3px;
	width:18px;
	height:18px;
	border-radius:50%;
	background:var(--vp-ring,#2871FE);
	border:2px solid #fff;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 3px 8px -2px rgba(10,18,36,.4);
	transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.vp-tarifs-agent:hover .vp-tarifs-agent-icon{ transform:scale(1.15) rotate(-8deg); }
.vp-tarifs-agent-icon img{ width:9px; height:9px; }
.vp-tarifs-agent-text{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	line-height:1.25;
}
.vp-tarifs-agent-name{
	font-size:12px;
	font-weight:800;
	color:#0a1224;
}
.vp-tarifs-agent-role{
	font-size:10px;
	font-weight:600;
	color:var(--vp-ring,#2871FE);
}

/* --- routing cards --- */
.vp-tarifs-routes{
	display:grid;
	grid-template-columns:1fr 210px 1fr;
	align-items:center;
	gap:0;
	margin-bottom:44px;
}
.vp-tarifs-route{
	position:relative;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:22px;
	padding:36px 34px;
	overflow:hidden;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 44px -30px rgba(10,18,36,.16);
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease;
}
.vp-tarifs-route:hover{ transform:translateY(-5px); }
.vp-tarifs-route::after{
	content:'';
	position:absolute;
	right:-14px;
	bottom:-14px;
	width:190px;
	height:150px;
	background-size:14px 14px;
	-webkit-mask-image:radial-gradient(circle at bottom right,#000 0%,transparent 70%);
	mask-image:radial-gradient(circle at bottom right,#000 0%,transparent 70%);
	opacity:.5;
	pointer-events:none;
}
.vp-tarifs-route-blue::after{ background-image:radial-gradient(circle,#2871FE 1.4px,transparent 1.5px); }
.vp-tarifs-route-green::after{ background-image:radial-gradient(circle,#17a35c 1.4px,transparent 1.5px); }
.vp-tarifs-route-head{
	position:relative;
	display:flex;
	align-items:center;
	gap:16px;
	margin-bottom:20px;
}
.vp-tarifs-route-icon{
	flex:0 0 56px;
	width:56px;
	height:56px;
	border-radius:16px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-tarifs-route-icon img{ width:24px; height:24px; }
.vp-tarifs-route-blue .vp-tarifs-route-icon{ background:linear-gradient(145deg,#eaf2ff 0%,#dbe9ff 100%); box-shadow:0 0 0 6px rgba(40,113,254,.06); }
.vp-tarifs-route-green .vp-tarifs-route-icon{ background:linear-gradient(145deg,#e7faf0 0%,#d7f3e6 100%); box-shadow:0 0 0 6px rgba(23,163,92,.06); }
.vp-tarifs-route h3{
	position:relative;
	font-family:"Cabin";
	font-size:19px;
	font-weight:800;
	line-height:1.32;
	letter-spacing:.2px;
	margin:0;
}
.vp-tarifs-route-blue h3{ color:#0a1224; }
.vp-tarifs-route-green h3{ color:#17a35c; }
.vp-tarifs-route-rule{
	position:relative;
	display:block;
	width:44px;
	height:3px;
	border-radius:2px;
	margin-bottom:18px;
}
.vp-tarifs-route-blue .vp-tarifs-route-rule{ background:#2871FE; }
.vp-tarifs-route-green .vp-tarifs-route-rule{ background:#17a35c; }
.vp-tarifs-route p{
	position:relative;
	color:#5b6579;
	font-size:14px;
	line-height:1.6;
	margin:0 0 28px;
	max-width:320px;
}
.vp-tarifs-route-btn{
	position:relative;
	display:inline-flex;
	align-items:center;
	gap:10px;
	color:#ffffff !important;
	font-weight:700;
	font-size:14px;
	padding:14px 22px;
	border-radius:12px;
	transition:transform .3s ease,box-shadow .3s ease;
}
.vp-tarifs-route-btn i{ font-size:15px; transition:transform .3s ease; }
.vp-tarifs-route-btn:hover{ transform:translateY(-2px); }
.vp-tarifs-route-btn:hover i{ transform:translateX(3px); }
.vp-tarifs-route-blue .vp-tarifs-route-btn{ background:linear-gradient(135deg,#2871FE,#1a56d6); box-shadow:0 14px 28px -14px rgba(40,113,254,.55); }
.vp-tarifs-route-green .vp-tarifs-route-btn{ background:linear-gradient(135deg,#17a35c,#0f8a4a); box-shadow:0 14px 28px -14px rgba(23,163,92,.55); }

.vp-tarifs-route-center{
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
	padding:0 12px;
}
.vp-tarifs-route-center-icon{
	width:54px;
	height:54px;
	border-radius:50%;
	background:#ffffff;
	border:1px solid #dbe9ff;
	box-shadow:0 12px 26px -12px rgba(40,113,254,.4);
	display:flex;
	align-items:center;
	justify-content:center;
	color:#2871FE;
	font-size:21px;
	margin-bottom:16px;
}
.vp-tarifs-route-center-title{
	font-family:"Cabin";
	font-size:13.5px;
	font-weight:800;
	color:#2871FE;
	line-height:1.4;
	margin:0 0 8px;
}
.vp-tarifs-route-center-sub{
	font-size:12px;
	font-weight:600;
	color:#8892a3;
	line-height:1.4;
	margin:0;
}
.vp-tarifs-route-arrow{
	position:absolute;
	top:14px;
	font-size:20px;
}
.vp-tarifs-route-arrow-left{ left:-14px; color:#2871FE; }
.vp-tarifs-route-arrow-right{ right:-14px; color:#17a35c; }

/* --- trust strip --- */
.vp-tarifs-trust{
	display:flex;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -28px rgba(10,18,36,.16);
	overflow:hidden;
}
.vp-tarifs-trust-item{
	flex:1;
	display:flex;
	align-items:flex-start;
	gap:13px;
	padding:26px 22px;
	transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.vp-tarifs-trust-item:hover{ transform:translateY(-4px); }
.vp-tarifs-trust-item + .vp-tarifs-trust-item{ border-left:1px solid #edf1f7; }
.vp-tarifs-trust-icon{
	flex:0 0 42px;
	width:42px;
	height:42px;
	border-radius:13px;
	background:linear-gradient(145deg,#eaf2ff 0%,#dbe9ff 100%);
	display:flex;
	align-items:center;
	justify-content:center;
	transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.vp-tarifs-trust-item:hover .vp-tarifs-trust-icon{ transform:scale(1.1) rotate(-4deg); }
.vp-tarifs-trust-icon img{ width:19px; height:19px; }
.vp-tarifs-trust-item h4{
	font-family:"Cabin";
	font-size:13px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-tarifs-trust-item p{
	color:#5b6579;
	font-size:11.5px;
	line-height:1.45;
	margin:0;
}

/* --- motion --- */
.vp-tarifs-head > *{ opacity:0; animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) both; }
.vp-tarifs-head .vp-pricing-eyebrow{ animation-delay:.05s; }
.vp-tarifs-title{ animation-delay:.12s; }
.vp-tarifs-sub{ animation-delay:.2s; }
.vp-tarifs-diagram{ opacity:0; animation:vpFadeIn 1s cubic-bezier(.16,1,.3,1) .28s both; }
@keyframes vpTarifsAgentIn{
	from{ opacity:0; transform:translate(-50%,-50%) translateY(14px); }
	to{ opacity:1; transform:translate(-50%,-50%) translateY(0); }
}
.vp-tarifs-agent{ opacity:0; animation:vpTarifsAgentIn .6s cubic-bezier(.16,1,.3,1) both; }
.vp-tarifs-agent:nth-of-type(1){ animation-delay:.4s; }
.vp-tarifs-agent:nth-of-type(2){ animation-delay:.46s; }
.vp-tarifs-agent:nth-of-type(3){ animation-delay:.52s; }
.vp-tarifs-agent:nth-of-type(4){ animation-delay:.58s; }
.vp-tarifs-agent:nth-of-type(5){ animation-delay:.64s; }
.vp-tarifs-agent:nth-of-type(6){ animation-delay:.7s; }
.vp-tarifs-agent:nth-of-type(7){ animation-delay:.76s; }
.vp-tarifs-agent:nth-of-type(8){ animation-delay:.82s; }
.vp-tarifs-routes{ opacity:0; animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .5s both; }
.vp-tarifs-trust{ opacity:0; animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .6s both; }
@media(prefers-reduced-motion:reduce){
	.vp-tarifs-head > *,.vp-tarifs-diagram,.vp-tarifs-routes,.vp-tarifs-trust,.vp-tarifs-connect-path{ animation:none !important; opacity:1 !important; transform:none !important; }
	.vp-tarifs-agent{ animation:none !important; opacity:1 !important; transform:translate(-50%,-50%) !important; }
}

@media(max-width:1199px){
	.vp-tarifs-title{ font-size:34px; }
	.vp-tarifs-diagram{ max-width:640px; height:360px; }
	.vp-tarifs-agent{ padding:5px 12px 5px 5px; gap:7px; }
	.vp-tarifs-agent-photo{ width:36px; height:36px; }
	.vp-tarifs-agent-name{ font-size:10.5px; }
	.vp-tarifs-agent-role{ font-size:9px; }
	.vp-tarifs-hub{ width:210px; height:210px; }
	.vp-tarifs-hub-logo{ height:24px; }
	.vp-tarifs-hub-label{ font-size:13px; }
}
@media(max-width:991px){
	.vp-tarifs-connect-svg{ display:none; }
	.vp-tarifs-routes{ grid-template-columns:1fr; gap:16px; }
	.vp-tarifs-route-center{ order:2; padding:6px 12px; }
	.vp-tarifs-trust{ flex-wrap:wrap; }
	.vp-tarifs-trust-item{ flex:1 1 33%; }
	.vp-tarifs-trust-item:nth-child(3n+1){ border-left:none; }
}
@media(max-width:767px){
	.vp-tarifs-diagram{ display:none; }
}
@media(max-width:575px){
	.vp-tarifs-hero .container-fluid{ padding:0 20px; }
	.vp-tarifs-title{ font-size:27px; }
	.vp-tarifs-route{ padding:28px 24px; }
	.vp-tarifs-trust-item{ flex:1 1 100%; }
	.vp-tarifs-trust-item + .vp-tarifs-trust-item{ border-left:none !important; border-top:1px solid #edf1f7; }
}










/* ================= VISIOpaie Ressources — Hero ================= */
.vp-res-hero{
	position:relative;
	background:#ffffff;
	padding:0;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-res-hero .container-fluid{
	position:relative;
	z-index:1;
	max-width:1600px;
	padding:0 50px;
	margin:0 auto;
}
.vp-res-hero-grid{
	display:grid;
	grid-template-columns:0.92fr 1.08fr;
	gap:40px;
	align-items:start;
}
.vp-res-eyebrow{
	display:inline-block;
	background:#2871FE;
	color:#ffffff;
	font-size:12px;
	font-weight:700;
	letter-spacing:.5px;
	padding:6px 18px;
	border-radius:999px;
	margin-bottom:22px;
}
.vp-res-title{
	font-family:"Cabin";
	font-size:40px;
	line-height:1.24;
	font-weight:800;
	color:#0a1224;
	margin:0 0 18px;
}
.vp-res-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-res-lead{
	color:#5b6579;
	font-size:15px;
	line-height:1.7;
	margin:0 0 32px;
	max-width:460px;
}
.vp-res-hero-features{
	display:flex;
	flex-wrap:wrap;
	gap:14px 28px;
}
.vp-res-hero-feature{
	display:flex;
	align-items:center;
	gap:11px;
}
.vp-res-hero-feature i{ font-size:21px; color:#2871FE; flex:0 0 auto; }
.vp-res-hero-feature span{
	font-size:12.5px;
	font-weight:600;
	color:#33394a;
	line-height:1.4;
	white-space:nowrap;
}

/* --- diagram --- */
.vp-res-hero-right{ position:relative; margin-top:-60px; }
.vp-res-diagram{
	position:relative;
	width:100%;
	max-width:560px;
	height:476px;
	margin:0 auto;
}
.vp-res-diagram-svg{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	z-index:0;
}
.vp-res-diagram-svg line{
	stroke:#2871FE;
	stroke-opacity:.3;
	stroke-width:.5;
	stroke-dasharray:2.2 2.2;
	animation:vpEcoFlow 14s linear infinite;
}
.vp-res-dot{
	position:absolute;
	width:7px;
	height:7px;
	border-radius:50%;
	background:#ffffff;
	border:1.5px solid #2871FE;
	transform:translate(-50%,-50%);
	z-index:1;
	box-shadow:0 2px 8px -2px rgba(40,113,254,.4);
}
.vp-res-hub{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	width:96px;
	height:96px;
	border-radius:24px;
	background:linear-gradient(150deg,#2871FE 0%,#1a56d6 100%);
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 22px 40px -18px rgba(20,60,180,.55);
	z-index:3;
	animation:vpHubPulse 3.2s cubic-bezier(.45,0,.55,1) infinite;
}
.vp-res-hub i{
	font-size:34px;
	color:#ffffff;
	filter:drop-shadow(0 0 10px rgba(255,255,255,.55));
}
.vp-res-hub-ring{
	position:absolute;
	border-radius:50%;
	border:1px solid rgba(40,113,254,.22);
	pointer-events:none;
}
.vp-res-hub-ring-out{ inset:-36px; }
.vp-res-hub-ring-in{ inset:-18px; border-style:dashed; opacity:.55; animation:vpRingSpin 40s linear infinite; }
@keyframes vpHubPulse{
	0%,100%{ box-shadow:0 22px 40px -18px rgba(20,60,180,.55),0 0 0 0 rgba(40,113,254,.28); }
	50%{ box-shadow:0 22px 40px -18px rgba(20,60,180,.55),0 0 0 10px rgba(40,113,254,0); }
}
@keyframes vpRingSpin{ to{ transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce){
	.vp-res-hub,.vp-res-hub-ring-in{ animation:none !important; }
}
.vp-res-card{
	position:absolute;
	transform:translate(-50%,-50%);
	width:190px;
	height:84px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:14px;
	padding:12px 14px;
	display:flex;
	align-items:center;
	gap:10px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 16px 32px -22px rgba(10,18,36,.2);
	z-index:2;
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease;
}
.vp-res-card > div{ flex:1; min-width:0; }
.vp-res-card:hover{
	transform:translate(-50%,-50%) translateY(-4px);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 22px 40px -18px rgba(10,18,36,.26);
}
.vp-res-card-left{ transform:translate(calc(-100% + 12px),-50%); }
.vp-res-card-left:hover{ transform:translate(calc(-100% + 12px),-50%) translateY(-4px); }
.vp-res-card-right{ transform:translate(-12px,-50%); }
.vp-res-card-right:hover{ transform:translate(-12px,-50%) translateY(-4px); }
.vp-res-card-icon{
	flex:0 0 44px;
	width:44px;
	height:44px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.vp-res-card-icon i{ font-size:22px; }
.vp-res-card:hover .vp-res-card-icon{ transform:scale(1.08) rotate(-4deg); }
.vp-res-card h4{
	font-family:"Cabin";
	font-size:12px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 3px;
	line-height:1.3;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.vp-res-card p{
	color:#5b6579;
	font-size:10.5px;
	line-height:1.4;
	margin:0;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden;
}

/* --- hero motion --- */
.vp-res-eyebrow{ animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-res-title{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .1s both; }
.vp-res-lead{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .2s both; }
.vp-res-hero-features{ opacity:0; animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .3s both; }
.vp-res-hero-right{ opacity:0; animation:vpFadeIn 1s cubic-bezier(.16,1,.3,1) .3s both; }
@media(prefers-reduced-motion:reduce){
	.vp-res-eyebrow,.vp-res-title,.vp-res-lead,.vp-res-hero-features,.vp-res-hero-right{ animation:none !important; opacity:1 !important; transform:none !important; }
	.vp-res-diagram-svg line{ animation:none !important; }
}

@media(max-width:1199px){
	.vp-res-hero-grid{ grid-template-columns:1fr; }
	.vp-res-hero-right{ order:-1; max-width:520px; margin:0 auto 30px; margin-top:0; }
	.vp-res-lead,.vp-res-hero-features{ max-width:none; }
}
@media(max-width:767px){
	.vp-res-hero-right{ display:none; }
	.vp-res-title{ font-size:30px; }
}
@media(max-width:575px){
	.vp-res-hero .container-fluid{ padding:0 20px; }
	.vp-res-title{ font-size:26px; }
	.vp-res-hero-features{ flex-direction:column; }
}

/* ================= VISIOpaie Ressources — Panels ================= */
.vp-res-panels{
	position:relative;
	background:#ffffff;
	padding:0 0 80px;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-res-panels .container-fluid{
	max-width:1600px;
	padding:0 50px;
	margin:0 auto;
}
.vp-res-panels-grid{
	display:grid;
	grid-template-columns:1.3fr 0.85fr 0.85fr 1fr;
	gap:22px;
	margin-bottom:22px;
}
.vp-res-panel{
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	padding:24px 22px;
	display:flex;
	flex-direction:column;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -30px rgba(10,18,36,.14);
}
.vp-res-panel-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	margin-bottom:16px;
	flex-wrap:wrap;
}
.vp-res-panel-title{
	font-family:"Cabin";
	font-size:12.5px;
	font-weight:800;
	letter-spacing:.4px;
	margin:0;
}
.vp-text-blue{ color:#2871FE; }
.vp-text-green{ color:#17a35c; }
.vp-text-purple{ color:#8b5cf6; }
.vp-text-orange{ color:#f5851a; }
.vp-res-panel-link{
	font-size:11px;
	font-weight:600;
	color:#8892a3;
	display:inline-flex;
	align-items:center;
	gap:4px;
	white-space:nowrap;
	transition:color .25s ease,gap .25s ease;
}
.vp-res-panel-link i{ font-size:10px; }
.vp-res-panel-link:hover{ color:#2871FE; gap:7px; }

/* tabs */
.vp-res-tabs{
	display:flex;
	flex-wrap:nowrap;
	gap:5px;
	margin-bottom:16px;
	overflow-x:auto;
}
.vp-res-tab{
	font-size:9.5px;
	font-weight:600;
	color:#5b6579;
	background:#f4f6fa;
	padding:4px 9px;
	border-radius:999px;
	white-space:nowrap;
	flex:0 0 auto;
}
.vp-res-tab-active{ background:#2871FE; color:#ffffff; }
.vp-res-tab-active.vp-res-tab-purple{ background:#8b5cf6; }

/* news */
.vp-res-news-list{
	display:flex;
	flex-direction:column;
	gap:14px;
	margin-bottom:16px;
}
.vp-res-news-item{
	display:flex;
	align-items:flex-start;
	gap:10px;
}
.vp-res-news-icon{
	flex:0 0 30px;
	width:30px;
	height:30px;
	border-radius:9px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-res-news-icon i{ font-size:14px; }
.vp-res-news-body{ flex:1; min-width:0; }
.vp-res-news-cat{
	display:block;
	font-size:9.5px;
	font-weight:700;
	letter-spacing:.3px;
	margin-bottom:2px;
}
.vp-res-news-body h4{
	font-family:"Cabin";
	font-size:12.5px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 2px;
	line-height:1.3;
}
.vp-res-news-body p{
	color:#5b6579;
	font-size:11px;
	line-height:1.4;
	margin:0;
}
.vp-res-news-badge{
	flex:0 0 auto;
	font-size:9px;
	font-weight:700;
	padding:4px 9px;
	border-radius:999px;
	white-space:nowrap;
	align-self:flex-start;
	margin-top:2px;
}
.vp-badge-blue{ background:#eaf2ff; color:#2871FE; }
.vp-badge-green{ background:#e7faf0; color:#17a35c; }
.vp-badge-gray{ background:#f4f6fa; color:#5b6579; }

.vp-res-panel-footer{
	margin-top:auto;
	padding-top:14px;
	border-top:1px solid #edf1f7;
	font-size:11.5px;
	font-weight:700;
	color:#2871FE;
	display:inline-flex;
	align-items:center;
	gap:6px;
	transition:gap .25s ease;
}
.vp-res-panel-footer i{ font-size:10px; }
.vp-res-panel-footer:hover{ gap:9px; }

/* guides */
.vp-res-guide-list{ display:flex; flex-direction:column; gap:12px; }
.vp-res-guide-item{
	display:flex;
	align-items:flex-start;
	gap:12px;
	border:1px solid #edf1f7;
	border-radius:14px;
	padding:12px;
	transition:border-color .25s ease,box-shadow .25s ease;
}
.vp-res-guide-item:hover{
	border-color:#dbe6fb;
	box-shadow:0 10px 24px -18px rgba(10,18,36,.2);
}
.vp-res-guide-icon{
	flex:0 0 38px;
	width:38px;
	height:38px;
	border-radius:11px;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.vp-res-guide-icon i{ font-size:17px; }
.vp-res-guide-item:hover .vp-res-guide-icon{ transform:scale(1.08); }
.vp-res-guide-body{ flex:1; min-width:0; }
.vp-res-guide-body h4{
	font-family:"Cabin";
	font-size:12.5px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 3px;
	line-height:1.35;
}
.vp-res-guide-body p{
	color:#5b6579;
	font-size:11px;
	line-height:1.4;
	margin:0 0 5px;
}
.vp-res-guide-meta{
	font-size:10px;
	color:#8892a3;
	font-weight:600;
}
.vp-res-download{
	flex:0 0 30px;
	width:30px;
	height:30px;
	border-radius:9px;
	background:#f4f6fa;
	color:#5b6579;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:background .25s ease,color .25s ease,transform .25s ease;
	margin-top:3px;
}
.vp-res-download i{ font-size:13px; }
.vp-res-download:hover{ background:#2871FE; color:#ffffff; transform:translateY(-2px); }

/* documents */
.vp-res-doc-list{ display:flex; flex-direction:column; gap:10px; }
.vp-res-doc-item{
	display:flex;
	align-items:center;
	gap:10px;
	border:1px solid #edf1f7;
	border-radius:12px;
	padding:9px 10px;
	transition:border-color .25s ease,box-shadow .25s ease;
}
.vp-res-doc-item:hover{
	border-color:#dbe6fb;
	box-shadow:0 10px 24px -18px rgba(10,18,36,.2);
}
.vp-res-doc-icon{
	flex:0 0 32px;
	width:32px;
	height:32px;
	border-radius:9px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-res-doc-icon i{ font-size:14px; }
.vp-res-doc-item h4{
	flex:1;
	min-width:0;
	font-family:"Cabin";
	font-size:12px;
	font-weight:700;
	color:#0a1224;
	margin:0;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.vp-res-doc-format{
	flex:0 0 auto;
	font-size:9px;
	font-weight:700;
	padding:3px 8px;
	border-radius:6px;
}
.vp-format-blue{ background:#eaf2ff; color:#2871FE; }
.vp-format-red{ background:#fdeceb; color:#e5484d; }
.vp-format-green{ background:#e7faf0; color:#17a35c; }

/* courses */
.vp-res-course-list{ display:flex; flex-direction:column; margin-bottom:16px; }
.vp-res-course-item{
	display:flex;
	align-items:flex-start;
	gap:10px;
	padding:14px 0;
	border-bottom:1px solid #edf1f7;
}
.vp-res-course-item:first-child{ padding-top:0; }
.vp-res-course-item:last-child{ border-bottom:none; padding-bottom:0; }
.vp-res-course-photo{
	flex:0 0 38px;
	width:38px;
	height:38px;
	border-radius:50%;
	overflow:hidden;
	box-shadow:0 0 0 2px #ffffff,0 0 0 3px #edf1f7;
}
.vp-res-course-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.vp-res-course-body{ flex:1; min-width:0; }
.vp-res-course-top{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:8px;
}
.vp-res-course-top h4{
	font-family:"Cabin";
	font-size:12.5px;
	font-weight:700;
	color:#0a1224;
	margin:0;
	line-height:1.3;
}
.vp-res-course-dur{ flex:0 0 auto; font-size:10px; font-weight:700; color:#8892a3; }
.vp-res-course-body p{
	color:#5b6579;
	font-size:11px;
	line-height:1.4;
	margin:3px 0 6px;
}
.vp-res-level{
	font-size:9px;
	font-weight:700;
	padding:3px 9px;
	border-radius:999px;
	display:inline-block;
}
.vp-level-green{ background:#e7faf0; color:#17a35c; }
.vp-level-blue{ background:#eaf2ff; color:#2871FE; }
.vp-level-purple{ background:#f1eafd; color:#8b5cf6; }

/* --- bottom grid: tools / faq / help --- */
.vp-res-bottom-grid{
	display:grid;
	grid-template-columns:1.3fr 1fr 0.82fr;
	gap:22px;
	margin-bottom:22px;
	align-items:stretch;
}
.vp-res-tools-panel,
.vp-res-faq-panel{
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	padding:24px 22px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -30px rgba(10,18,36,.14);
}
.vp-res-tools-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:18px 16px;
}
.vp-res-tool-icon{
	width:38px;
	height:38px;
	border-radius:11px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:10px;
	transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.vp-res-tool:hover .vp-res-tool-icon{ transform:scale(1.08) rotate(-4deg); }
.vp-res-tool-icon i{ font-size:17px; }
.vp-res-tool h4{
	font-family:"Cabin";
	font-size:12.5px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 4px;
	line-height:1.35;
}
.vp-res-tool p{
	color:#5b6579;
	font-size:11px;
	line-height:1.4;
	margin:0 0 8px;
}
.vp-res-tool a{
	font-size:11px;
	font-weight:700;
	color:#2871FE;
	display:inline-flex;
	align-items:center;
	gap:5px;
	transition:gap .25s ease;
}
.vp-res-tool a i{ font-size:9px; }
.vp-res-tool a:hover{ gap:8px; }

/* faq */
.vp-res-faq-list{ display:flex; flex-direction:column; }
.vp-res-faq-item{ border-bottom:1px solid #edf1f7; }
.vp-res-faq-item:last-child{ border-bottom:none; }
.vp-res-faq-q{
	width:100%;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	text-align:left;
	background:none;
	border:none;
	padding:13px 0;
	font-family:"Cabin";
	font-size:12.5px;
	font-weight:700;
	color:#0a1224;
	cursor:pointer;
}
.vp-res-faq-q i{
	font-size:13px;
	color:#8892a3;
	flex:0 0 auto;
	transition:transform .3s ease,color .3s ease;
}
.vp-res-faq-item.vp-active .vp-res-faq-q i{ transform:rotate(180deg); color:#2871FE; }
.vp-res-faq-a{
	max-height:0;
	overflow:hidden;
	transition:max-height .35s ease;
}
.vp-res-faq-item.vp-active .vp-res-faq-a{ max-height:220px; }
.vp-res-faq-a p{
	color:#5b6579;
	font-size:11.5px;
	line-height:1.6;
	margin:0 0 14px;
}

/* help card */
.vp-res-help-card{
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	padding:26px 22px;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -30px rgba(10,18,36,.14);
}
.vp-res-help-icon{
	width:46px;
	height:46px;
	border-radius:13px;
	background:linear-gradient(180deg,#f1eafd 0%,#e8def9 100%);
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:14px;
}
.vp-res-help-icon i{ font-size:20px; color:#8b5cf6; }
.vp-res-help-card h4{
	font-family:"Cabin";
	font-size:16px;
	font-weight:800;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-res-help-card > p{ font-size:12.5px; color:#5b6579; margin:0 0 18px; }
.vp-res-help-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	width:100%;
	background:linear-gradient(135deg,#2871FE 0%,#1a56d6 100%);
	color:#ffffff !important;
	font-weight:700;
	font-size:12.5px;
	padding:12px 18px;
	border-radius:10px;
	margin-bottom:18px;
	box-shadow:0 14px 26px -14px rgba(40,113,254,.55);
	transition:transform .25s ease,box-shadow .25s ease;
}
.vp-res-help-btn i{ font-size:11px; transition:transform .25s ease; }
.vp-res-help-btn:hover{ transform:translateY(-2px); box-shadow:0 18px 32px -14px rgba(40,113,254,.65); }
.vp-res-help-btn:hover i{ transform:translateX(3px); }
.vp-res-help-meta{
	display:flex;
	flex-direction:column;
	gap:9px;
	width:100%;
	padding-top:16px;
	border-top:1px solid #edf1f7;
}
.vp-res-help-meta span{
	display:flex;
	align-items:center;
	gap:8px;
	font-size:11.5px;
	color:#5b6579;
	font-weight:600;
}
.vp-res-help-meta i{ font-size:14px; color:#8b5cf6; }

/* bottom strip */
.vp-res-strip{
	display:flex;
	align-items:stretch;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -28px rgba(10,18,36,.16);
	overflow:hidden;
}
.vp-res-strip-item{
	flex:1;
	display:flex;
	align-items:flex-start;
	gap:13px;
	padding:26px 22px;
	transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.vp-res-strip-item:hover{ transform:translateY(-4px); }
.vp-res-strip-icon{
	flex:0 0 42px;
	width:42px;
	height:42px;
	border-radius:13px;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.vp-res-strip-item:hover .vp-res-strip-icon{ transform:scale(1.1) rotate(-4deg); }
.vp-res-strip-icon i{ font-size:18px; }
.vp-res-strip-item h4{
	font-family:"Cabin";
	font-size:13px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-res-strip-item p{
	color:#5b6579;
	font-size:11.5px;
	line-height:1.45;
	margin:0;
}
.vp-res-strip-divider{
	width:1px;
	align-self:stretch;
	background:#e3e8f0;
	flex:0 0 1px;
}

/* --- panels motion (scroll-triggered) --- */
.vp-res-panel,.vp-res-tools-panel,.vp-res-faq-panel,.vp-res-help-card,.vp-res-strip{
	opacity:0;
	transform:translateY(28px);
	transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);
}
.vp-res-panel.vp-res-inview,.vp-res-tools-panel.vp-res-inview,.vp-res-faq-panel.vp-res-inview,.vp-res-help-card.vp-res-inview,.vp-res-strip.vp-res-inview{
	opacity:1;
	transform:translateY(0);
}
.vp-res-panels-grid .vp-res-panel:nth-child(1){ transition-delay:.05s; }
.vp-res-panels-grid .vp-res-panel:nth-child(2){ transition-delay:.1s; }
.vp-res-panels-grid .vp-res-panel:nth-child(3){ transition-delay:.15s; }
.vp-res-panels-grid .vp-res-panel:nth-child(4){ transition-delay:.2s; }
.vp-res-tools-panel{ transition-delay:.05s; }
.vp-res-faq-panel{ transition-delay:.1s; }
.vp-res-help-card{ transition-delay:.15s; }
.vp-res-panel,.vp-res-tools-panel,.vp-res-faq-panel,.vp-res-help-card{
	transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,border-color .3s ease;
}
.vp-res-panel:hover,.vp-res-tools-panel:hover,.vp-res-faq-panel:hover,.vp-res-help-card:hover{
	border-color:#dbe6fb;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 26px 48px -26px rgba(10,18,36,.2);
}
@media(prefers-reduced-motion:reduce){
	.vp-res-panel,.vp-res-tools-panel,.vp-res-faq-panel,.vp-res-help-card,.vp-res-strip{ transition:none !important; opacity:1 !important; transform:none !important; }
}

/* --- responsive --- */
@media(max-width:1439px){
	.vp-res-panels-grid{ grid-template-columns:repeat(2,1fr); }
	.vp-res-bottom-grid{ grid-template-columns:1fr; }
	.vp-res-tools-grid{ grid-template-columns:repeat(4,1fr); }
}
@media(max-width:991px){
	.vp-res-tools-grid{ grid-template-columns:repeat(2,1fr); }
	.vp-res-strip{ flex-wrap:wrap; }
	.vp-res-strip-item{ flex:1 1 40%; }
	.vp-res-strip-divider{ display:none; }
}
@media(max-width:767px){
	.vp-res-panels-grid{ grid-template-columns:1fr; }
}
@media(max-width:575px){
	.vp-res-panels .container-fluid{ padding:0 20px; }
	.vp-res-tools-grid{ grid-template-columns:1fr; }
	.vp-res-strip-item{ flex:1 1 100%; }
}

/* ================= VISIOpaie Agents IA — Hero ================= */
.vp-ai-hero{
	position:relative;
	background:#f4f4fc;
	padding:64px 0 60px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-ai-hero .container-fluid{
	position:relative;
	z-index:1;
	max-width:1680px;
	padding:0 50px;
	margin:0 auto;
}
.vp-ai-hero-grid{
	display:grid;
	grid-template-columns:0.82fr 1.6fr 0.5fr;
	gap:20px;
	align-items:center;
}

/* --- left column --- */
.vp-ai-badge{
	display:inline-flex;
	align-items:center;
	gap:8px;
	background:#f1eafd;
	color:#8b5cf6;
	font-size:12px;
	font-weight:700;
	letter-spacing:.4px;
	padding:8px 16px;
	border-radius:999px;
	margin-bottom:24px;
}
.vp-ai-badge i{ font-size:16px; }
.vp-ai-title{
	font-family:"Cabin";
	font-size:38px;
	line-height:1.22;
	font-weight:800;
	color:#0a1224;
	margin:0 0 20px;
}
.vp-ai-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-ai-lead{
	color:#5b6579;
	font-size:14.5px;
	line-height:1.7;
	margin:0 0 30px;
	max-width:420px;
}
.vp-ai-features{ display:flex; flex-direction:column; gap:14px; max-width:350px; }
.vp-ai-feature{
	display:flex;
	align-items:flex-start;
	gap:14px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:16px;
	padding:16px 18px;
	width:100%;
	min-height:92px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 16px 32px -26px rgba(10,18,36,.16);
	transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease;
}
.vp-ai-feature:hover{
	transform:translateY(-3px);
	border-color:#dbe6fb;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 38px -22px rgba(10,18,36,.2);
}
.vp-ai-feature-icon{
	flex:0 0 44px;
	width:44px;
	height:44px;
	border-radius:13px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-ai-feature-icon i{ font-size:20px; }
.vp-ai-feature h4{
	font-family:"Cabin";
	font-size:14.5px;
	font-weight:700;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-ai-feature p{
	color:#5b6579;
	font-size:12.5px;
	line-height:1.5;
	margin:0;
}

/* --- center diagram --- */
.vp-ai-hero-center{ position:relative; display:flex; justify-content:center; }
.vp-ai-diagram{
	position:relative;
	width:100%;
	max-width:780px;
	height:660px;
	margin:0 auto;
}
.vp-ai-diagram-svg{ position:absolute; inset:0; width:100%; height:100%; z-index:0; }
.vp-ai-diagram-svg line{
	stroke-opacity:.4;
	stroke-width:.35;
	stroke-dasharray:1.6 1.8;
	animation:vpEcoFlow 16s linear infinite;
}
.vp-ai-dot{
	display:none;
	position:absolute;
	width:9px;
	height:9px;
	border-radius:50%;
	transform:translate(-50%,-50%);
	border:2px solid #ffffff;
	box-shadow:0 2px 6px -1px rgba(10,18,36,.25);
	z-index:1;
}
.vp-ai-hub{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	width:250px;
	height:250px;
	border-radius:50%;
	background:radial-gradient(circle at 32% 24%,#ffffff 0%,#f6f3ff 55%,#ede7fb 100%);
	border:1px solid #e6def9;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-align:center;
	padding:20px;
	box-shadow:0 30px 60px -30px rgba(90,60,180,.35),0 0 0 14px rgba(139,92,246,.05);
	z-index:3;
}
.vp-ai-hub i{ font-size:30px; color:#8b5cf6; margin-bottom:8px; }
.vp-ai-hub h3{
	font-family:"Cabin";
	font-size:19px;
	font-weight:800;
	color:#0a1224;
	line-height:1.2;
	margin:0 0 8px;
}
.vp-ai-hub-strong{ font-size:12.5px; font-weight:700; color:#0a1224; margin:0 0 2px; }
.vp-ai-hub-sub{ font-size:11px; color:#5b6579; margin:0; }

.vp-ai-agent{
	position:absolute;
	transform:translate(-50%,-50%);
	width:270px;
	height:100px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	padding:39px 16px 39px 12px;
	display:flex;
	align-items:center;
	gap:2px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 16px 32px -22px rgba(10,18,36,.2);
	z-index:2;
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease;
}
.vp-ai-agent:hover{
	transform:translate(-50%,-50%) translateY(-4px);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 22px 40px -18px rgba(10,18,36,.26);
}
.vp-ai-agent-photo{
	flex:0 0 130px;
	width:130px;
	height:130px;
	margin-left:-10px;
}
.vp-ai-agent-photo img{ width:100%; height:100%; object-fit:contain; display:block; }
.vp-ai-agent-badge{
	position:absolute;
	right:-6px;
	bottom:6px;
	width:28px;
	height:28px;
	border-radius:50%;
	background:#ffffff;
	box-shadow:0 3px 8px -1px rgba(10,18,36,.28);
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-ai-agent-badge i{ font-size:12.5px; }
.vp-ai-agent > div{ min-width:0; }
.vp-ai-agent h4{
	font-family:"Cabin";
	font-size:15.5px;
	font-weight:800;
	color:#2871FE;
	margin:0 0 2px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.vp-ai-agent p{
	color:#5b6579;
	font-size:11.5px;
	font-weight:700;
	margin:0;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

/* --- right column: testimonial --- */
.vp-ai-hero-right{ display:flex; }
.vp-ai-quote{
	background:linear-gradient(165deg,#f4effe 0%,#ede4fc 100%);
	border:1px solid #e6def9;
	border-radius:20px;
	padding:28px 24px;
	display:flex;
	flex-direction:column;
	width:100%;
	min-height:440px;
	box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 24px 48px -30px rgba(90,60,180,.28);
}
.vp-ai-quote > i:first-child{ font-size:30px; color:#8b5cf6; opacity:.55; margin-bottom:14px; }
.vp-ai-quote p{
	font-style:italic;
	font-weight:500;
	color:#241b3d;
	font-size:14.5px;
	line-height:1.75;
	margin:0;
}
.vp-ai-quote-illustration{
	margin-top:auto;
	align-self:center;
	font-size:76px;
	color:#8b5cf6;
	opacity:.3;
	padding-top:20px;
}

/* --- bottom strip --- */
.vp-ai-strip{
	margin-top:44px;
	display:flex;
	align-items:stretch;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 20px 40px -28px rgba(10,18,36,.16);
	overflow:hidden;
}
.vp-ai-strip-item{
	flex:1;
	display:flex;
	align-items:center;
	gap:14px;
	padding:24px 22px;
	transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.vp-ai-strip-item:hover{ transform:translateY(-3px); }
.vp-ai-strip-main{ flex:1.7; align-items:flex-start; }
.vp-ai-strip-icon{
	flex:0 0 44px;
	width:44px;
	height:44px;
	border-radius:13px;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.vp-ai-strip-item:hover .vp-ai-strip-icon{ transform:scale(1.08) rotate(-4deg); }
.vp-ai-strip-icon i{ font-size:19px; }
.vp-ai-strip-item h4{
	font-family:"Cabin";
	font-size:13.5px;
	font-weight:700;
	color:#0a1224;
	margin:0;
}
.vp-ai-strip-main h4{ margin:0 0 4px; }
.vp-ai-strip-main p{ color:#5b6579; font-size:11.5px; line-height:1.45; margin:0; }
.vp-ai-strip-divider{ width:1px; align-self:stretch; background:#e3e8f0; flex:0 0 1px; }

/* --- entrance motion --- */
.vp-ai-badge{ animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both; }
.vp-ai-title{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .1s both; }
.vp-ai-lead{ animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .2s both; }
.vp-ai-features{ opacity:0; animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .3s both; }
.vp-ai-hero-center{ opacity:0; animation:vpFadeIn 1s cubic-bezier(.16,1,.3,1) .3s both; }
.vp-ai-hero-right{ opacity:0; animation:vpFadeIn 1s cubic-bezier(.16,1,.3,1) .45s both; }
.vp-ai-strip{ opacity:0; animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) .55s both; }
@media(prefers-reduced-motion:reduce){
	.vp-ai-badge,.vp-ai-title,.vp-ai-lead,.vp-ai-features,.vp-ai-hero-center,.vp-ai-hero-right,.vp-ai-strip{ animation:none !important; opacity:1 !important; transform:none !important; }
	.vp-ai-diagram-svg line{ animation:none !important; }
}

/* --- responsive --- */
@media(max-width:1560px){
	.vp-ai-agent{ width:210px; padding:9px 12px 9px 9px; }
	.vp-ai-agent-photo{ flex-basis:95px; width:95px; height:95px; }
	.vp-ai-agent h4{ font-size:13px; }
	.vp-ai-hub{ width:196px; height:196px; }
	.vp-ai-hub h3{ font-size:16px; }
}
@media(max-width:1399px){
	.vp-ai-hero-grid{ grid-template-columns:1fr; }
	.vp-ai-hero-right{ order:2; max-width:520px; margin:24px auto 0; }
	.vp-ai-quote{ min-height:0; }
	.vp-ai-hero-center{ order:1; }
	.vp-ai-hero-left{ order:0; }
	.vp-ai-lead,.vp-ai-features{ max-width:none; }
}
@media(max-width:767px){
	.vp-ai-hero-center{ display:none; }
	.vp-ai-title{ font-size:28px; }
	.vp-ai-strip{ flex-wrap:wrap; }
	.vp-ai-strip-item{ flex:1 1 45%; }
	.vp-ai-strip-divider{ display:none; }
}
@media(max-width:575px){
	.vp-ai-hero .container-fluid{ padding:0 20px; }
	.vp-ai-title{ font-size:24px; }
	.vp-ai-strip-item{ flex:1 1 100%; }
}

/* --- VISIOpaie Agents Roster (9 agents / 9 expertises) --- */
.vp-roster{
	position:relative;
	background-color:#fbfbfe;
	background-image:linear-gradient(to bottom,#f4f4fc 0%,transparent 120px);
	padding:100px 0 110px;
	overflow:hidden;
}
.vp-roster::after{
	content:'';
	position:absolute;
	width:560px;
	height:560px;
	border-radius:50%;
	filter:blur(100px);
	pointer-events:none;
	z-index:0;
	bottom:-260px;
	right:-180px;
	background:radial-gradient(circle,rgba(139,92,246,.09) 0%,transparent 70%);
}
.vp-roster .container-fluid{
	position:relative;
	z-index:1;
	max-width:1680px;
	padding:0 50px;
	margin:0 auto;
}
.vp-roster-head{
	text-align:center;
	max-width:640px;
	margin:0 auto 56px;
	display:flex;
	flex-direction:column;
	align-items:center;
	opacity:0;
	animation:vpFadeUp .8s cubic-bezier(.16,1,.3,1) both;
}
.vp-roster-title{
	font-family:"Cabin";
	font-size:38px;
	letter-spacing:-.3px;
	line-height:1.22;
	font-weight:800;
	color:#0a1224;
	margin:20px 0 0;
}
.vp-roster-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-roster-title-rule{
	width:52px;
	height:4px;
	border-radius:999px;
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	box-shadow:0 4px 14px -4px rgba(40,113,254,.55);
	margin:20px 0;
}
.vp-roster-sub{
	color:#5b6579;
	font-size:15.5px;
	line-height:1.65;
	margin:0;
}
.vp-roster-grid{
	display:grid;
	grid-template-columns:repeat(5,1fr);
	gap:24px;
	position:relative;
	z-index:1;
}
.vp-roster-card{
	position:relative;
	background:#ffffff;
	border:1px solid rgba(10,18,36,.06);
	border-radius:24px;
	padding:38px 26px 30px;
	overflow:hidden;
	box-shadow:0 1px 1px rgba(10,18,36,.02),0 18px 40px -28px rgba(10,18,36,.16);
	transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s cubic-bezier(.16,1,.3,1),border-color .4s ease;
	opacity:0;
	animation:vpFadeUp .7s cubic-bezier(.16,1,.3,1) both;
}
.vp-roster-grid .vp-roster-card:nth-child(1){ animation-delay:.05s; }
.vp-roster-grid .vp-roster-card:nth-child(2){ animation-delay:.1s; }
.vp-roster-grid .vp-roster-card:nth-child(3){ animation-delay:.15s; }
.vp-roster-grid .vp-roster-card:nth-child(4){ animation-delay:.2s; }
.vp-roster-grid .vp-roster-card:nth-child(5){ animation-delay:.25s; }
.vp-roster-grid .vp-roster-card:nth-child(6){ animation-delay:.3s; }
.vp-roster-grid .vp-roster-card:nth-child(7){ animation-delay:.35s; }
.vp-roster-grid .vp-roster-card:nth-child(8){ animation-delay:.4s; }
.vp-roster-grid .vp-roster-card:nth-child(9){ animation-delay:.45s; }
.vp-roster-grid .vp-roster-card:nth-child(10){ animation-delay:.5s; }
.vp-roster-card::before{
	content:'';
	position:absolute;
	top:-70px;
	left:50%;
	transform:translateX(-50%);
	width:220px;
	height:220px;
	border-radius:50%;
	background:radial-gradient(circle,var(--vp-roster-tint) 0%,transparent 72%);
	pointer-events:none;
	z-index:0;
}
.vp-roster-card > *{ position:relative; z-index:1; }
.vp-roster-card:hover{
	transform:translateY(-8px);
	border-color:rgba(10,18,36,.09);
	box-shadow:0 1px 1px rgba(10,18,36,.03),0 30px 54px -24px var(--vp-roster-glow);
}
.vp-roster-avatar{
	position:relative;
	width:110px;
	height:110px;
	margin:0 auto 20px;
	padding:3px;
	background:var(--vp-roster-accent);
	border-radius:50%;
	box-shadow:0 14px 26px -12px var(--vp-roster-glow);
	transition:box-shadow .4s ease;
}
.vp-roster-card:hover .vp-roster-avatar{ box-shadow:0 18px 32px -10px var(--vp-roster-glow); }
.vp-roster-avatar img{
	width:100%;
	height:100%;
	border-radius:50%;
	border:3px solid #ffffff;
	object-fit:cover;
	object-position:50% 15%;
	display:block;
	box-sizing:border-box;
}
.vp-roster-badge-icon{
	position:absolute;
	right:-2px;
	bottom:-2px;
	width:36px;
	height:36px;
	border-radius:50%;
	background:#ffffff;
	box-shadow:0 6px 16px -4px rgba(10,18,36,.28),0 0 0 3px #ffffff;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-roster-badge-icon i{ font-size:16px; color:var(--vp-roster-accent); }
.vp-roster-name{
	font-family:"Cabin";
	font-size:20px;
	letter-spacing:-.2px;
	font-weight:800;
	color:var(--vp-roster-accent);
	text-align:center;
	margin:0 0 3px;
}
.vp-roster-role{
	color:#8992a3;
	font-size:11px;
	font-weight:700;
	letter-spacing:.06em;
	text-transform:uppercase;
	text-align:center;
	margin:0;
}
.vp-roster-divider{
	display:block;
	width:26px;
	height:3px;
	border-radius:999px;
	background:var(--vp-roster-accent);
	opacity:.3;
	margin:16px auto 18px;
}
.vp-roster-list{
	list-style:none;
	margin:0;
	padding:0;
	display:flex;
	flex-direction:column;
	gap:11px;
}
.vp-roster-list li{
	display:flex;
	align-items:flex-start;
	gap:10px;
	color:#3f4a5f;
	font-size:13px;
	line-height:1.5;
}
.vp-roster-check{
	flex:0 0 auto;
	width:18px;
	height:18px;
	margin-top:1px;
	border-radius:50%;
	background:var(--vp-roster-accent);
	box-shadow:0 3px 8px -2px var(--vp-roster-glow);
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-roster-check i{ font-size:10px; color:#ffffff; }
.vp-roster-cta{
	background:linear-gradient(165deg,#f6f3fe 0%,#ede4fc 100%);
	border:1px solid #e6def9;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-align:center;
}
.vp-roster-cta-icon{
	position:relative;
	width:60px;
	height:60px;
	border-radius:50%;
	background:#ffffff;
	box-shadow:0 14px 28px -12px rgba(139,92,246,.45),0 0 0 8px rgba(139,92,246,.08),0 0 0 16px rgba(139,92,246,.04);
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:20px;
}
.vp-roster-cta-icon i{ font-size:25px; color:#8b5cf6; }
.vp-roster-cta h4{
	font-family:"Cabin";
	font-size:17px;
	letter-spacing:-.1px;
	font-weight:800;
	color:#0a1224;
	line-height:1.35;
	margin:0 0 10px;
}
.vp-roster-cta p{
	color:#5b6579;
	font-size:12.5px;
	line-height:1.65;
	margin:0;
}
@media(prefers-reduced-motion:reduce){
	.vp-roster-head,.vp-roster-card{ animation:none !important; opacity:1 !important; transform:none !important; }
}
@media(max-width:1399px){
	.vp-roster-grid{ grid-template-columns:repeat(3,1fr); }
}
@media(max-width:767px){
	.vp-roster{ padding:70px 0; }
	.vp-roster-title{ font-size:28px; }
	.vp-roster-grid{ grid-template-columns:repeat(2,1fr); gap:16px; }
	.vp-roster-card{ padding:28px 18px 22px; }
}
@media(max-width:575px){
	.vp-roster .container-fluid{ padding:0 20px; }
	.vp-roster-grid{ grid-template-columns:1fr; }
}

/* ================= VISIOpaie Production Sociale Hero ================= */
.vp-prod-hero{
	position:relative;
	background:#ffffff;
	padding:64px 0 70px;
	overflow:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.vp-prod-hero .container-fluid{
	position:relative;
	z-index:1;
	max-width:1680px;
	padding:0 50px;
	margin:0 auto;
}
.vp-prod-hero-top{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:40px;
	flex-wrap:wrap;
	margin-bottom:52px;
}
.vp-prod-hero-left{ flex:1 1 540px; max-width:640px; }
.vp-prod-title{
	font-family:"Cabin";
	font-size:34px;
	letter-spacing:-.3px;
	line-height:1.24;
	font-weight:800;
	color:#0a1224;
	margin:0 0 16px;
}
.vp-prod-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-prod-lead{
	color:#5b6579;
	font-size:14.5px;
	line-height:1.7;
	margin:0;
}
.vp-prod-title-rule{
	display:block;
	width:44px;
	height:4px;
	border-radius:999px;
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	margin-top:18px;
}
.vp-prod-trust{
	flex:0 1 660px;
	display:flex;
	align-items:stretch;
	margin-top:52px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:16px;
	padding:6px 10px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 36px -26px rgba(10,18,36,.16);
}
.vp-prod-trust-item{
	flex:1;
	display:flex;
	align-items:center;
	gap:10px;
	padding:14px 12px;
}
.vp-prod-trust-icon{
	flex:0 0 36px;
	width:36px;
	height:36px;
	border-radius:11px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-prod-trust-icon i{ font-size:16px; }
.vp-prod-trust-item span:last-child{
	font-size:12px;
	font-weight:700;
	line-height:1.35;
	color:#0a1224;
}
.vp-prod-trust-divider{ width:1px; align-self:center; height:38px; background:#e3e8f0; flex:0 0 1px; }

.vp-prod-steps{
	display:grid;
	grid-template-columns:1fr 60px 1fr 60px 1fr;
	align-items:start;
}
.vp-prod-step{
	position:relative;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:20px;
	padding:22px 24px 22px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 36px -28px rgba(10,18,36,.16);
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease;
}
.vp-prod-step:hover{
	transform:translateY(-4px);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 26px 46px -24px var(--vp-prod-tint);
}
.vp-prod-step-top{ min-height:78px; }
.vp-prod-step-head{
	display:flex;
	align-items:flex-start;
	gap:12px;
}
.vp-prod-step-head-text{ text-align:left; padding-top:4px; }
.vp-prod-step-num{
	flex:0 0 44px;
	width:44px;
	height:44px;
	border-radius:50%;
	background:var(--vp-prod-tint);
	color:var(--vp-prod-accent);
	font-family:"Cabin";
	font-weight:800;
	font-size:20px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-prod-step-head h3{
	font-family:"Cabin";
	font-size:16px;
	letter-spacing:.2px;
	font-weight:800;
	color:var(--vp-prod-accent);
	margin:0 0 6px;
}
.vp-prod-step-desc{
	color:#5b6579;
	font-size:13px;
	line-height:1.55;
	margin:0;
}
.vp-prod-step-media{
	height:150px;
	display:flex;
	align-items:flex-end;
	justify-content:center;
	margin:16px 0 18px;
}
.vp-prod-step-media img{
	max-width:100%;
	max-height:100%;
	width:auto;
	height:auto;
	object-fit:contain;
}
.vp-prod-step-list{
	list-style:none;
	margin:0 0 22px;
	padding:0;
	display:flex;
	flex-direction:column;
	gap:10px;
}
.vp-prod-step-list li{
	display:flex;
	align-items:flex-start;
	gap:10px;
	color:#3f4a5f;
	font-size:12.5px;
	line-height:1.5;
}
.vp-prod-step-list .vp-roster-check{ background:var(--vp-prod-accent); }
.vp-prod-step-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	width:100%;
	background:#ffffff;
	color:var(--vp-prod-accent);
	border:2px solid var(--vp-prod-accent);
	border-radius:10px;
	padding:13px 18px;
	font-size:13.5px;
	font-weight:700;
	transition:.3s cubic-bezier(.4,0,.2,1);
}
.vp-prod-step-btn i{ font-size:15px; transition:transform .3s ease; }
.vp-prod-step-btn:hover{
	background:var(--vp-prod-accent);
	color:#ffffff;
	transform:translateY(-2px);
	box-shadow:0 16px 28px -14px var(--vp-prod-tint);
}
.vp-prod-step-btn:hover i{ transform:translateX(3px); }

.vp-prod-connector{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-top:191px;
}
.vp-prod-connector-line{
	position:absolute;
	left:-6px;
	right:-6px;
	top:50%;
	border-top:2px dashed var(--vp-prod-line);
	transform:translateY(-50%);
	z-index:0;
}
.vp-prod-connector-arrow{
	position:relative;
	z-index:1;
	width:38px;
	height:38px;
	border-radius:50%;
	background:var(--vp-prod-connector);
	color:#ffffff;
	font-size:16px;
	font-weight:800;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 10px 22px -8px var(--vp-prod-shadow,rgba(40,113,254,.5));
}

.vp-prod-bottom{
	display:flex;
	align-items:center;
	gap:36px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	margin-top:36px;
	padding:26px 32px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 36px -28px rgba(10,18,36,.14);
}
.vp-prod-bottom-evolve{
	flex:1 1 280px;
	display:flex;
	align-items:flex-start;
	gap:14px;
}
.vp-prod-bottom-icon{
	flex:0 0 42px;
	width:42px;
	height:42px;
	border-radius:12px;
	background:linear-gradient(180deg,#eaf2ff 0%,#dfeaff 100%);
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-prod-bottom-icon i{ font-size:19px; color:#2871FE; }
.vp-prod-bottom-evolve h4{
	font-family:"Cabin";
	font-size:14px;
	font-weight:800;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-prod-bottom-evolve p{ color:#5b6579; font-size:12px; line-height:1.5; margin:0; }
.vp-prod-bottom-mini{
	flex:1 1 320px;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:0;
}
.vp-prod-mini-step{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:8px;
}
.vp-prod-mini-icon{
	width:38px;
	height:38px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-prod-mini-icon i{ font-size:16px; }
.vp-prod-mini-label{ font-size:10.5px; font-weight:700; color:#5b6579; white-space:nowrap; }
.vp-prod-mini-line{
	flex:0 0 44px;
	height:0;
	border-top:2px dashed var(--c);
	margin:0 6px 18px;
}
.vp-prod-bottom-quality{ flex:1 1 320px; }
.vp-prod-bottom-quality h4{
	font-family:"Cabin";
	font-size:14px;
	font-weight:800;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-prod-bottom-quality p{ color:#5b6579; font-size:12px; line-height:1.5; margin:0; }
.vp-prod-bottom-quality a{ color:#2871FE; font-weight:700; }

@media(max-width:1560px){
	.vp-prod-connector{ margin-top:179px; }
}
@media(max-width:1199px){
	.vp-prod-trust{ flex-basis:100%; }
	.vp-prod-steps{ grid-template-columns:1fr; gap:22px; }
	.vp-prod-connector{ display:none; }
	.vp-prod-bottom{ flex-wrap:wrap; }
	.vp-prod-bottom-mini{ order:3; flex-basis:100%; padding-top:10px; }
}
@media(max-width:767px){
	.vp-prod-hero .container-fluid{ padding:0 20px; }
	.vp-prod-title{ font-size:26px; }
	.vp-prod-trust{ flex-wrap:wrap; }
	.vp-prod-trust-item{ flex:1 1 45%; }
	.vp-prod-trust-divider{ display:none; }
	.vp-prod-bottom{ padding:22px; }
}
@media(max-width:575px){
	.vp-prod-trust-item{ flex:1 1 100%; }
}

/* ================= VISIOpaie Process Flow (6 étapes) ================= */
.vp-flow{
	position:relative;
	background:#ffffff;
	padding:80px 0 90px;
}
.vp-flow .container-fluid{
	max-width:1680px;
	padding:0 50px;
	margin:0 auto;
}
.vp-flow-head{ margin-bottom:44px; max-width:720px; }
.vp-flow-title{
	font-family:"Cabin";
	font-size:32px;
	letter-spacing:-.3px;
	line-height:1.28;
	font-weight:800;
	color:#0a1224;
	margin:18px 0 12px;
}
.vp-flow-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-flow-sub{ color:#5b6579; font-size:14.5px; margin:0; }
.vp-flow-title-rule{
	display:block;
	width:44px;
	height:4px;
	border-radius:999px;
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	margin-top:16px;
}

.vp-flow-row{
	display:flex;
	flex-wrap:nowrap;
	align-items:stretch;
	justify-content:center;
	gap:clamp(8px,1.2vw,22px);
}
.vp-flow-card{
	position:relative;
	display:flex;
	flex-direction:column;
	flex:1 1 clamp(120px,11vw,185px);
	min-width:0;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:20px;
	padding:28px 20px 24px;
	overflow:hidden;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 38px -28px rgba(10,18,36,.16);
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,border-color .35s ease;
}
.vp-flow-card::before{
	content:"";
	position:absolute;
	top:0; left:0; right:0;
	height:3px;
	background:linear-gradient(90deg,var(--c) 0%,transparent 130%);
	opacity:.85;
}
.vp-flow-card:hover{
	transform:translateY(-6px);
	border-color:var(--c);
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 26px 48px -24px var(--t);
}
.vp-flow-card-top{
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom:18px;
}
.vp-flow-num{
	width:32px;
	height:32px;
	border-radius:50%;
	background:var(--t);
	color:var(--c);
	font-family:"Cabin";
	font-weight:800;
	font-size:14px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-flow-icon{
	width:36px;
	height:36px;
	border-radius:50%;
	background:#ffffff;
	border:1.5px solid var(--c);
	color:var(--c);
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-flow-icon i{ font-size:16px; }
.vp-flow-card-title{
	font-family:"Cabin";
	font-size:14px;
	letter-spacing:.3px;
	line-height:1.32;
	font-weight:800;
	color:var(--c);
	margin:0 0 10px;
}
.vp-flow-desc{
	color:#5b6579;
	font-size:12px;
	line-height:1.6;
	margin:0 0 20px;
	min-height:52px;
}
.vp-flow-agents{
	display:flex;
	align-items:center;
	gap:10px;
	margin-bottom:20px;
	padding-bottom:20px;
	border-bottom:1px solid #f0f3f8;
}
.vp-flow-agents-dual{ gap:8px; }
.vp-flow-agent{
	display:flex;
	align-items:center;
	gap:8px;
	min-width:0;
}
.vp-flow-agents-dual .vp-flow-agent{ flex-direction:column; align-items:flex-start; gap:6px; }
.vp-flow-agent img{
	width:88px;
	height:88px;
	object-fit:contain;
	flex:0 0 auto;
}
.vp-flow-agents-dual .vp-flow-agent img{ width:72px; height:72px; }
.vp-flow-agent span{
	display:flex;
	flex-direction:column;
	font-size:11.5px;
	color:#5b6579;
	line-height:1.3;
	min-width:0;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.vp-flow-agent strong{
	color:#2871FE;
	font-family:"Cabin";
	font-size:13px;
	font-weight:800;
}
.vp-flow-list{
	list-style:none;
	margin:auto 0 0;
	padding:0;
	display:flex;
	flex-direction:column;
	gap:10px;
}
.vp-flow-list li{
	display:flex;
	align-items:flex-start;
	gap:9px;
	color:#3f4a5f;
	font-size:12px;
	line-height:1.45;
}
.vp-flow-list .vp-roster-check{
	width:16px;
	height:16px;
	background:var(--c);
}
.vp-flow-list .vp-roster-check i{ font-size:9px; }

.vp-flow-arrow{
	flex:0 0 auto;
	margin-top:44px;
	width:32px;
	height:32px;
	border-radius:50%;
	background:#ffffff;
	border:1.5px solid var(--c);
	color:var(--c);
	font-size:14px;
	font-weight:800;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 8px 18px -8px rgba(10,18,36,.14);
}

.vp-flow-bottom{
	display:flex;
	align-items:center;
	gap:28px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	margin-top:40px;
	padding:24px 30px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 36px -28px rgba(10,18,36,.14);
}
.vp-flow-bottom-main{
	flex:1.6 1 260px;
	display:flex;
	align-items:flex-start;
	gap:14px;
}
.vp-flow-bottom-icon{
	flex:0 0 42px;
	width:42px;
	height:42px;
	border-radius:12px;
	background:linear-gradient(180deg,#f1eafd 0%,#e8def9 100%);
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-flow-bottom-icon i{ font-size:19px; color:#8b5cf6; }
.vp-flow-bottom-main h4{
	font-family:"Cabin";
	font-size:14px;
	font-weight:800;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-flow-bottom-main p{ color:#5b6579; font-size:12px; line-height:1.5; margin:0; }
.vp-flow-bottom-item{
	flex:1 1 140px;
	display:flex;
	align-items:center;
	gap:10px;
}
.vp-flow-bottom-mini{
	flex:0 0 36px;
	width:36px;
	height:36px;
	border-radius:11px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-flow-bottom-mini i{ font-size:16px; }
.vp-flow-bottom-item span:last-child{
	font-size:12px;
	font-weight:700;
	line-height:1.3;
	color:#0a1224;
}
.vp-flow-bottom-divider{ width:1px; align-self:stretch; background:#e3e8f0; flex:0 0 1px; }

@media(max-width:1024px){
	.vp-flow-bottom{ flex-wrap:wrap; }
	.vp-flow-bottom-divider{ display:none; }
	.vp-flow-bottom-item{ flex:1 1 45%; }
}
@media(max-width:767px){
	.vp-flow .container-fluid{ padding:0 20px; }
	.vp-flow-title{ font-size:26px; }
	.vp-flow-row{ flex-wrap:wrap; }
	.vp-flow-arrow{ display:none; }
	.vp-flow-card{ flex:1 1 100%; }
	.vp-flow-bottom{ padding:22px; }
	.vp-flow-bottom-item{ flex:1 1 100%; }
}

/*==================================================*/
/* VISIOpaie IA + Humain (hybride) */
/*==================================================*/
.vp-hybrid{
	position:relative;
	background:#fbfbfe;
	padding:90px 0 90px;
}
.vp-hybrid .container-fluid{
	max-width:1680px;
	padding:0 50px;
	margin:0 auto;
}
.vp-hybrid-head{ max-width:640px; margin-bottom:48px; }
.vp-hybrid-title{
	font-family:"Cabin";
	font-size:34px;
	letter-spacing:-.3px;
	line-height:1.28;
	font-weight:800;
	color:#0a1224;
	margin:18px 0 14px;
}
.vp-hybrid-title .vp-blue{
	background:linear-gradient(90deg,#2871FE 0%,#5b9dff 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.vp-hybrid-sub{ color:#5b6579; font-size:14.5px; line-height:1.6; margin:0; max-width:480px; }

.vp-hybrid-row{
	display:flex;
	align-items:stretch;
	justify-content:center;
	gap:20px;
}
.vp-hybrid-plus{
	flex:0 0 auto;
	align-self:center;
	width:44px;
	height:44px;
	border-radius:50%;
	background:#ffffff;
	color:#8a94a6;
	font-size:20px;
	font-weight:800;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 10px 22px -10px rgba(10,18,36,.16);
}
.vp-hybrid-card{
	position:relative;
	display:flex;
	flex-direction:column;
	flex:1 1 0;
	min-width:0;
	background:linear-gradient(180deg,var(--t) 0%,rgba(255,255,255,.4) 60%);
	border:1px solid rgba(10,18,36,.06);
	border-radius:24px;
	padding:26px 26px 28px;
	box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 20px 42px -30px rgba(10,18,36,.18);
	transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease;
}
.vp-hybrid-card:hover{
	transform:translateY(-4px);
	box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 26px 50px -26px var(--t);
}
.vp-hybrid-card-agents,.vp-hybrid-card-experts{ flex:1.55 1 0; }
.vp-hybrid-card-head{
	display:flex;
	align-items:flex-start;
	gap:14px;
	margin-bottom:20px;
}
.vp-hybrid-icon{
	flex:0 0 52px;
	width:52px;
	height:52px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-hybrid-icon i{ font-size:23px; }
.vp-hybrid-card-head-text h4{
	font-family:"Cabin";
	font-size:15px;
	letter-spacing:.3px;
	font-weight:800;
	color:var(--c);
	margin:0 0 4px;
}
.vp-hybrid-card-head-text p{
	color:#5b6579;
	font-size:12.5px;
	line-height:1.45;
	margin:0;
}
.vp-hybrid-media{
	height:210px;
	border-radius:16px;
	overflow:hidden;
	margin-bottom:20px;
	background:#e9edf4;
}
.vp-hybrid-media img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.vp-hybrid-agents-grid{
	display:flex;
	flex-direction:column;
	gap:10px;
	margin:14px 0 20px;
}
.vp-hybrid-agents-row{
	display:flex;
	justify-content:center;
	gap:10px;
}
.vp-hybrid-agents-row img{
	width:100%;
	max-width:80px;
	aspect-ratio:3/4;
	object-fit:cover;
	border-radius:16px;
	box-shadow:0 6px 14px -8px rgba(10,18,36,.25);
}
.vp-hybrid-list{
	list-style:none;
	margin:auto 0 0;
	padding:18px 0 0;
	display:flex;
	flex-direction:column;
	gap:10px;
	border-top:1px solid rgba(10,18,36,.06);
}
.vp-hybrid-list li{
	display:flex;
	align-items:flex-start;
	gap:9px;
	color:#3f4a5f;
	font-size:12.5px;
	line-height:1.45;
}
.vp-hybrid-list .vp-roster-check{ background:var(--c); }

.vp-hybrid-bottom{
	display:flex;
	align-items:center;
	gap:26px;
	background:#ffffff;
	border:1px solid #edf1f7;
	border-radius:18px;
	margin-top:44px;
	padding:24px 30px;
	box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 36px -28px rgba(10,18,36,.14);
}
.vp-hybrid-bottom-main{
	flex:1.7 1 260px;
	display:flex;
	align-items:flex-start;
	gap:14px;
}
.vp-hybrid-bottom-icon{
	flex:0 0 42px;
	width:42px;
	height:42px;
	border-radius:12px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-hybrid-bottom-icon i{ font-size:19px; }
.vp-hybrid-bottom-main h4{
	font-family:"Cabin";
	font-size:14px;
	font-weight:800;
	color:#0a1224;
	margin:0 0 4px;
}
.vp-hybrid-bottom-main p{ color:#5b6579; font-size:12px; line-height:1.5; margin:0; }
.vp-hybrid-bottom-item{
	flex:1 1 150px;
	display:flex;
	align-items:flex-start;
	gap:10px;
}
.vp-hybrid-bottom-mini{
	flex:0 0 36px;
	width:36px;
	height:36px;
	border-radius:11px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.vp-hybrid-bottom-mini i{ font-size:16px; }
.vp-hybrid-bottom-item h5{
	font-size:13px;
	font-weight:800;
	line-height:1.3;
	color:#0a1224;
	margin:0 0 2px;
}
.vp-hybrid-bottom-item p{
	font-size:11.5px;
	color:#5b6579;
	line-height:1.4;
	margin:0;
}
.vp-hybrid-bottom-divider{ width:1px; align-self:stretch; background:#e3e8f0; flex:0 0 1px; }

@media(max-width:1200px){
	.vp-hybrid-row{ flex-wrap:wrap; }
	.vp-hybrid-plus{ display:none; }
	.vp-hybrid-card,.vp-hybrid-card-agents,.vp-hybrid-card-experts{ flex:1 1 calc(50% - 10px); }
	.vp-hybrid-card-agents{ order:3; flex-basis:100%; }
}
@media(max-width:1024px){
	.vp-hybrid-bottom{ flex-wrap:wrap; }
	.vp-hybrid-bottom-divider{ display:none; }
	.vp-hybrid-bottom-item{ flex:1 1 45%; }
}
@media(max-width:767px){
	.vp-hybrid .container-fluid{ padding:0 20px; }
	.vp-hybrid-title{ font-size:26px; }
	.vp-hybrid-card,.vp-hybrid-card-agents,.vp-hybrid-card-experts{ flex:1 1 100%; }
	.vp-hybrid-agents-row img{ max-width:64px; }
	.vp-hybrid-bottom{ padding:22px; }
	.vp-hybrid-bottom-item{ flex:1 1 100%; }
}