
@import url("https://fonts.googleapis.com/css2?family=Urbanist:ital,wght@0,100..900;1,100..900&amp;display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&amp;display=swap");
:root {
  --primary-text-color: #050d14;
  --primary-color: #7397e9;
  --primary-color-rgb: 115, 151, 233;
  --primary-color-2: #4642fc;
  --primary-color-2-rgb: 70, 66, 252;
  --secondary-color: #d1d7f5;
  --secondary-color-rgb: 209, 215, 245;
  --secondary-color-2: #030303;
  --secondary-color-2-rgb: 3, 3, 3;
  --third-color: #eff7fb;
  --third-color-rgb: 239, 247, 251;
  --body-color: #000;
  --body-text-color: #fff;
  --bg-color-1: #0f171d;
  --bg-color-2: #040a10;
  --bg-color-2-rgb: 4, 10, 16;
  --bg-color-3: #171f26;
  --text-color-main: #fff;
  --text-color-main-rgb: 255, 255, 255;
  --color-black: #000;
  --color-black-rgb: 0, 0, 0;
  --color-black-2: #060606;
  --color-black-2-rgb: 6, 6, 6;
  --color-white: #fff;
  --color-white-rgb: 255, 255, 255;
}

/*=====================****===================== */
/* browser prefix adding  */
@media only screen and (min-width: 1400px) {
  .container-xxl,
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm,
  .container {
    max-width: 1368px;
    padding-left: 12px;
    padding-right: 12px;
  }
}
@media only screen and (min-width: 1400px) {
  .container-xxl.medium-container,
  .container-xl.medium-container,
  .container-lg.medium-container,
  .container-md.medium-container,
  .container-sm.medium-container,
  .container.medium-container {
    max-width: 24px;
    padding-left: 12px;
    padding-right: 12px;
  }
}
@media only screen and (min-width: 1400px) {
  .container-xxl.large-container,
  .container-xl.large-container,
  .container-lg.large-container,
  .container-md.large-container,
  .container-sm.large-container,
  .container.large-container {
    max-width: 24px;
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* @@@@@@@@@@@@@  Extend Property CSS start here  @@@@@@@@@@@@@@ */
.choose-us__item .item-icon, .service-main__item .service-box .item-title, .team-details__content .user-infos ul li, .team-details__content .user-info .title, .team-details__content .user-info.career .career-item, .team-main__header .title, .team-main__item .team-thumb .social, .team-main__item .team-thumb .social ul, .widget__categories .categorie-list li, .widget__recent-posts .posts-list .post-item, .widget__tags .tags-group, .widget__cta, .appreciation__content .btn-customer, .appreciation__content .btn-customer .customer, .contact__form .input-group, .contact__info .info-item, .process__item, .work__item, .work__item .signup-form .input-group, .work__item .user-area .user-item, .workflow__info .info-item, .brand-3__content .brand-title, .brand-3__item, .cta-2__content, .cta-2__content .buttons, .cta-2__thumb, .cta-3__content .buttons, .cta-3__content .features-list ul, .cta-3__content .features-list ul li, .blog-details__wrapper .blog-details .info-section, .blog-details__wrapper .blog-details .info-section .info-item, .blog-details__wrapper .tags-and-share, .blog-details__wrapper .tags-and-share .tags, .blog-details__wrapper .tags-and-share .tags .tags-list, .blog-details__wrapper .tags-and-share .share-group .post-and-share, .blog-details__wrapper .tags-and-share .share-group .post-and-share .post, .blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-list, .blog-details__wrapper .tags-and-share .share-group .post-and-share .share, .blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-list, .blog-details__wrapper .recent-comments__wrapper, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .post-info, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .stars, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer, .blog-details__wrapper .write-comment .comment-form .input-group, .blog__item .blog-content .meta ul, .blog-3__item .item-content .item-tags, .pricing__item .pricing-header .plan-info, .pricing__item .pricing-body ul li, .pricing-2__item .item-body .featcher-list ul li, .pricing-2__item .item-header .item-price .plan-price, .pricing-3__btns, .pricing-3__btns .buttons, .pricing-3__item, .pricing-3__item .item-header .header-inner, .pricing-3__item .item-header .header-inner .header-info .plan-price, .pricing-3__item .item-body .item-features ul, .pricing-3__item .item-body .item-features ul li, .faq-2__content, .testimonial__item, .testimonial__item .item-thumb, .testimonial__item .item-content, .testimonial__navigation, .testimonials-2__navigation, .testimonial-3__item .item-content .item-header, .testimonial-3__item .item-content .item-header .rating-stars ul, .reports__item, .report-customize__item.type-1:has(.item-content), .report-customize__item.type-3 .activity, .report-customize__item.type-3 .activity .progress-wrapper, .report-customize__item.type-3 .profile, .footer-one__right .bottom-content, .social-icons ul, .footer-two__newsletter .newsletter-form, .footer-two__bottom .links ul, .social-icons-2 ul, .footer-three__main .newsletter, .banner-one.section .chart-1__header,
.banner-one.section .sales-goals__header, .banner-one.section .chart-1__main-stats .stats-content,
.banner-one.section .sales-goals__main-stats .stats-content, .banner-one.section .daily-statistic .statistic-container, .banner-one.section .daily-statistic .legend .legend-item, .banner-two__content .customers-info, .banner-two__content .customers-info .info, .banner-two__content .title .line-one, .banner-two__content .title .line-two, .banner-two__content .banner-buttons, .offcanvas-menu .mean-bar .mean-nav > ul li a,
.mean-container .mean-bar .mean-nav > ul li a, .offcanvas-menu .mean-bar .mean-nav > ul li a.mean-expand,
.mean-container .mean-bar .mean-nav > ul li a.mean-expand, .offcanvas-menu .mean-bar .mean-nav > ul li a:has(~ .sub-menu),
.mean-container .mean-bar .mean-nav > ul li a:has(~ .sub-menu), .header-one__main, .header-one__main-menu nav ul:not(.sub-menu), .header-one__main-menu nav ul li a, .header-one__main-menu nav ul li .sub-menu li a:has(i), .header-one__main-menu.menu-right, .header-one__menu-btns, .header-one__menu-btns .buttons, .header-three .header-one__menu-btns .buttons, .mobile-menu-social-media, .section-header-2 .section-sub-title {
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
}

.saaslyn-1-btn, .saaslyn-2-btn, .saaslyn-3-btn, .saaslyn-4-btn, .saaslyn-6-btn, .social-media ul, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer .like-btn,
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer .reply-btn, .pricing__btn-content, .pricing__btn-content .save, .pricing__btn-wrapper, .pricing-2.section .section-header-2 .section-title .icon, .faq-2__accordion .accordion-item .accordion-header .accordion-button::after, .testimonial__navigation .slide-counter, .report-customize__item.type-1 .analysis-list ul li, .footer-one__left .join-btn, .banner-one.section .chart-1__main-stats .stats-content .change-percentage,
.banner-one.section .sales-goals__main-stats .stats-content .change-percentage, .banner-one__content .button-group, .banner-one__content .button-group .learn-more, .section-header .section-sub-title {
  display: inline-flex;
}

.widget__cta, .contact__form .input-group, .process__item, .work__item, .cta-2__content, .cta-2__thumb, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .post-info, .blog-details__wrapper .write-comment .comment-form .input-group, .pricing-3__item, .pricing-3__item .item-body .item-features ul, .faq-2__content, .testimonial__item .item-content, .reports__item, .report-customize__item.type-1:has(.item-content), .report-customize__item.type-3 .activity, .report-customize__item.type-3 .profile, .banner-one__content .button-group {
  flex-direction: column;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
}

.team-main__item .team-thumb .social, .team-main__item .team-thumb .social ul {
  flex-direction: column-reverse;
  -webkit-flex-direction: column-reverse;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -ms-flex-direction: column-reverse;
}

.team-details__content .user-info.career .career-item .year, .team-details__content .contact-section form button, .social-media ul li, .team-main__item .team-thumb .social ul, .widget__search .search-form .input-group .input-group-text, .widget__recent-posts .posts-list .post-item .item-thumb, .contact__info .info-item .item-icon, .awesome-features__item .item-content .item-number, .work__item .signup-form .input-group .input-group-text, .work__item .user-area .user-item .user-icon, .workflow__info .info-item .icon, .integration__content .circle-one .circle-one-inset .icon-block, .integration__content .circle-one .circle-two, .integration__content .circle-one .circle-two .circle-three, .integration__content .circle-one .circle-two .circle-three .circle-four, .blog-details__wrapper .blog-details .info-section .info-item .info-icon, .blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-list li a, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-thumb, .pricing-2__item .item-header .item-icon, .testimonial__item .item-thumb, .testimonials-2__item .author .author-thumb, .testimonials-2__navigation .prev-testimonial,
.testimonials-2__navigation .next-testimonial, .report-customize__item.type-3 .profile .avatar, .report-customize__item.type-3 .profile .avatar img, .features__item .item-icon, .footer-two__newsletter .newsletter-form button, .banner-one.section .chart-1__header .icon-container,
.banner-one.section .sales-goals__header .icon-container, .banner-one.section .chart-1__header .icon-container .icon-box,
.banner-one.section .sales-goals__header .icon-container .icon-box, .banner-one.section .chart-1__main-stats .stats-content .change-percentage .icon-box,
.banner-one.section .sales-goals__main-stats .stats-content .change-percentage .icon-box, .hamburger-menu-close, .header-one__menu-btns .hamburger-menu {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.widget__tags .tags-group, .appreciation__content .btn-customer, .pagination-area__nav .pagination {
  flex-wrap: wrap;
}

.offcanvas.offcanvas-full, .offcanvas.offcanvas-full .offcanvas-full-bg.left-box, .offcanvas.offcanvas-full .offcanvas-full-bg.right-box {
  position: fixed;
}

.saaslyn-1-btn, .saaslyn-2-btn, .saaslyn-3-btn, .saaslyn-4-btn, .saaslyn-5-btn:not(.v2), .saaslyn-5-btn.v2, .saaslyn-6-btn, .service-details__article .process-list li, .service-main.section, .service-main__item, .service-main__item .service-box, .team-main__item .team-thumb, .team-main__item .team-thumb .social ul li, .error.section, .error__content, .error-image, .widget__categories .categorie-list li, .pagination-area__nav .pagination .page-item:first-of-type .page-link, .pagination-area__nav .pagination .page-item:last-of-type .page-link, .awesome-features__content, .awesome-features__content .item-row, .awesome-features__item .item-content, .process__item .item-icon, .benefits.section, .benefits__item, .workflow.section .section-header-2, .integration__content, .integration__content .circle-one, .brand-3__item, .cta-2__thumb, .cta-3.section, .blog__item-wrapper, .blog-3.section, .pricing__btn-content, .pricing-2.section, .pricing-2__item, .pricing-2__item .item-body, .pricing-3.section, .pricing-3__btns .buttons, .pricing-3__item .item-header, .faq__accordion, .faq-2__content, .faq-3.section, .testimonials-2.section, .testimonials-2__slider-wrapper, .testimonial-3__item, .reports.section, .reports__item-wrapper, .report-customize.section, .report-customize__item.type-1 .analysis-list ul li, .report-customize__item.type-3 .activity .progress-wrapper, .report-customize__item.type-3 .activity .progress-wrapper .progress, .features-item__wrapper, .features__item, .features__item .item-icon, .features-2.section, .features-2__item, .features-3.section, .footer-one.section .container, .footer-one__left .join-btn, .footer-one__right, .social-icons ul li a, .footer-two.section, .footer-two__newsletter .newsletter-form button, .social-icons-2 ul li a, .banner-one.section, .banner-one.section .chart-1__chart-container,
.banner-one.section .sales-goals__chart-container, .banner-one__wrapper, .banner-one__thumb, .banner-one__content .button-group, .banner-two.section, .banner-two__wrapper, .banner-two__content, .banner-three.section, .header-one__main, .header-one__main-menu nav ul li, .header-one__main-menu nav ul li .sub-menu li, .section-header-2 .section-sub-title {
  position: relative;
}

.progress-wrap::after, .saaslyn-1-btn::before, .saaslyn-2-btn::before, .saaslyn-3-btn::before, .saaslyn-4-btn::before, .saaslyn-5-btn:not(.v2)::before, .saaslyn-5-btn.v2::before, .saaslyn-6-btn::before, .service-details__article .process-list li::before, .service-main__item::before, .team-details__content .user-info.skills .skill-item .progress-container .skill-percentage, .team-main__item .team-thumb .thumb-shape, .team-main__item .team-thumb .social, .team-main__item .team-thumb .social ul li:not(:last-of-type)::before, .error.section::before, .error.section::after, .error-image::before, .widget__categories .categorie-list li::before, .pagination-area__nav .pagination .page-item:first-of-type .page-link::before, .pagination-area__nav .pagination .page-item:last-of-type .page-link::before, .awesome-features__item .item-content::before, .process__item .item-icon::after, .process__item .item-icon::before, .benefits.section .benefits-shape, .benefits__item .item-bg, .workflow.section .section-header-2 .shape, .integration__content .ellipse-1,
.integration__content .ellipse-2, .integration__content .circle-one .circle-one-inset, .integration__content .circle-one .circle-one-inset .icon-block, .brand-3__item::after, .cta-2__thumb .star-one,
.cta-2__thumb .star-two, .cta-3.section .circle-1, .cta-3.section .circle-2, .cta-3.section .box-1, .cta-3.section .box-2, .cta-3.section .doll-1, .cta-3.section .doll-2, .blog__item-wrapper::before, .blog-3.section .bg-shape, .pricing__btn-content .save, .pricing-2.section .shape-1, .pricing-2.section .shape-2, .pricing-2.section .shape-3, .pricing-2__btn-wrapper .highlighter, .pricing-2__item::before, .pricing-2__item::after, .pricing-2__item .item-bg, .pricing-2__item .item-body::after, .pricing-2__item .item-body::before, .pricing-3.section .circle-bg, .pricing-3__item .item-header::before, .faq__accordion::before, .faq-2__content::before, .faq-2__content::after, .faq-3.section .bg-shape, .faq-3__bg-shape, .testimonials-2.section::before, .testimonials-2__slider-wrapper .test-author-1, .testimonials-2__slider-wrapper .test-author-2, .testimonials-2__slider-wrapper .test-author-3, .testimonials-2__slider-wrapper .test-author-4, .testimonials-2__navigation, .testimonial-3__item .triangle, .testimonial-3__item::after, .testimonial-3__item .item-content .item-author .author-avatar, .reports.section .shape-1, .reports.section .shape-2, .reports__item-wrapper::before, .report-customize.section .bg-shape, .report-customize__item.type-3 .activity .progress-wrapper .progress::before, .report-customize__item.type-3 .activity .progress-wrapper .progress-percentage, .report-customize__item.type-3 .activity .progress-wrapper .progress-percentage::after, .features__item .item-icon::after, .features__item .item-shape, .features-2.section .shape-1, .features-2.section .shape-bg, .features-2.section .shape-line, .features-2__item .item-bg, .features-3.section::before, .footer-one.section .container .footer-long-text, .footer-one__left .join-btn::before, .social-icons ul li a::before, .footer-two.section #footerTwoSvgDraw, .footer-two__newsletter .newsletter-form button::before, .banner-one.section .graphOneDrawing-LeftSvg,
.banner-one.section .graphOneDrawing-RightSvg, .banner-one.section .chart-1__widget,
.banner-one.section .sales-goals__widget, .banner-one.section .chart-1__chart-container .sales-chart-label,
.banner-one.section .sales-goals__chart-container .sales-chart-label, .banner-one.section .daily-statistic, .banner-one__wrapper::after, .banner-one__thumb::after, .banner-one__content, .banner-one__content .button-group .star-1,
.banner-one__content .button-group .star-2,
.banner-one__content .button-group .arrow, .banner-two__wrapper .banner-circles, .banner-two__wrapper .color-circle, .banner-two__wrapper .toots-shape, .banner-two__wrapper .draw-svg, .banner-two__wrapper .banner-graph, .banner-three.section .bottom-shape, .banner-three.section .cube-shape, .banner-three.section .bot-shape, .banner-three.section .aichat-shape, .header-one.section, .header-one__main-menu nav ul li .sub-menu, .header-two.section, .header-three.section, .saaslyn__toggle-btn::before, .saaslyn__toggle-btn::after {
  position: absolute;
  content: "";
}

input,
textarea,
select {
  width: 100%;
}

.home-one, .home-two, .home-three {
  font-weight: 400;
}

.error-text, .report-customize__item.type-1 p, .report-customize__item.type-1 .analysis-list ul li, .home-one h1,
.home-one h2,
.home-one h3,
.home-one h4,
.home-one h5,
.home-one h6, .home-three h1,
.home-three h2,
.home-three h3,
.home-three h4,
.home-three h5,
.home-three h6 {
  font-weight: 500;
}

.home-two h1,
.home-two h2,
.home-two h3,
.home-two h4,
.home-two h5,
.home-two h6 {
  font-weight: 600;
}

.saaslyn-1-btn, .saaslyn-2-btn, .report-customize__item.type-1 .item-title, .home-two h1, .home-three h1 {
  font-weight: 700;
}

.saaslyn-1-btn, .saaslyn-2-btn, .saaslyn-3-btn, .saaslyn-4-btn, .saaslyn-6-btn, .choose-us__item .item-icon, .team-main__header .title, .pagination-area__nav .pagination, .brand-3__item, .cta-3__content .buttons, .cta-3__content .features-list ul li, .pricing__btn-content, .pricing-2.section .section-header-2 .section-title .icon, .pricing-2__item .item-header .item-price .plan-price, .faq-2__accordion .accordion-item .accordion-header .accordion-button::after, .testimonial__navigation .slide-counter, .report-customize__item.type-3 .profile, .banner-one.section .chart-1__header,
.banner-one.section .sales-goals__header, .banner-one.section .chart-1__main-stats .stats-content,
.banner-one.section .sales-goals__main-stats .stats-content, .banner-one.section .daily-statistic .statistic-container, .banner-two__content .customers-info, .banner-two__content .title .line-one, .banner-two__content .title .line-two, .banner-two__content .banner-buttons, .breadcrumb-area__content .breadcrumb-nav .breadcrumb, .section-header-2 .section-sub-title {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.team-main__item .team-thumb .social, .widget__categories .categorie-list li, .cta-2__content, .cta-3__content .features-list ul, .blog-details__wrapper .tags-and-share, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post, .pricing-3__btns .buttons, .pricing-3__item .item-header .header-inner, .faq-2__content, .testimonials-2__navigation, .testimonial-3__item .item-content .item-header, .reports__item, .report-customize__item.type-1:has(.item-content), .report-customize__item.type-3 .activity, .report-customize__item.type-3 .activity .progress-wrapper, .footer-one__right .bottom-content, .offcanvas-menu .mean-bar .mean-nav > ul li a,
.mean-container .mean-bar .mean-nav > ul li a, .offcanvas-menu .mean-bar .mean-nav > ul li a:has(~ .sub-menu),
.mean-container .mean-bar .mean-nav > ul li a:has(~ .sub-menu), .header-one__main, .header-one__main-menu nav ul:not(.sub-menu), .header-one__main-menu nav ul li a, .header-one__main-menu nav ul li .sub-menu li a:has(i) {
  -webkit-box-pack: space-between;
  -ms-flex-pack: space-between;
  justify-content: space-between;
}

.workflow.section .section-header-2 .section-sub-title {
  -webkit-box-pack: flex-start;
  -ms-flex-pack: flex-start;
  justify-content: flex-start;
}

.cta-2__thumb, .testimonial__navigation, .footer-two__bottom .links ul, .offcanvas-menu .mean-bar .mean-nav > ul li a.mean-expand,
.mean-container .mean-bar .mean-nav > ul li a.mean-expand {
  -webkit-box-pack: flex-end;
  -ms-flex-pack: flex-end;
  justify-content: flex-end;
}

.team-details__content .contact-section form button, .social-media ul li a, .team-main__item .team-thumb .social ul li a, .widget__search .search-form .input-group .input-group-text, .contact__info .info-item .item-icon, .awesome-features__item .item-content .item-number, .process__item .item-icon, .process__item .item-icon::before, .work__item .user-area .user-item .user-icon, .benefits__item .item-icon, .workflow__info .info-item .icon, .integration__content .circle-one, .integration__content .circle-one .circle-one-inset .icon-block, .integration__content .circle-one .circle-two, .integration__content .circle-one .circle-two .circle-three, .integration__content .circle-one .circle-two .circle-three .circle-four, .blog-details__wrapper .blog-details .info-section .info-item .info-icon, .blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-list li a, .pricing-2__item .item-header .item-icon, .pricing-3__item .item-header .header-inner .icon, .faq-3__accordion .accordion-item .accordion-header .accordion-button::after, .testimonial__navigation .prev-testimonial,
.testimonial__navigation .next-testimonial, .testimonials-2__navigation .prev-testimonial,
.testimonials-2__navigation .next-testimonial, .report-customize__item.type-3 .activity .progress-wrapper .progress-percentage, .report-customize__item.type-3 .profile .avatar, .features__item .item-icon, .footer-one__left .join-btn .icon-box, .social-icons ul li a, .social-icons-2 ul li a, .banner-one.section .chart-1__header .icon-container,
.banner-one.section .sales-goals__header .icon-container, .banner-one.section .chart-1__header .icon-container .icon-box,
.banner-one.section .sales-goals__header .icon-container .icon-box, .banner-one.section .chart-1__main-stats .stats-content .change-percentage .icon-box,
.banner-one.section .sales-goals__main-stats .stats-content .change-percentage .icon-box, .banner-two__wrapper .banner-circles .circle, .hamburger-menu-close {
  place-content: center;
}

.blog-details__wrapper .blog-details .info-section .info-item, .pricing-3__item .item-body .item-features ul li, .testimonial-3__item .item-content .item-header, .report-customize__item.type-1 .analysis-list ul li, .footer-three__main .newsletter {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: start;
}

.saaslyn-1-btn, .saaslyn-2-btn, .saaslyn-3-btn, .saaslyn-4-btn, .saaslyn-6-btn, .choose-us__item .item-icon, .service-main__item .service-box .item-title, .team-details__content .user-infos ul li, .team-details__content .user-info .title, .social-media ul, .team-main__header .title, .team-main__item .team-thumb .social, .team-main__item .team-thumb .social ul, .widget__categories .categorie-list li, .widget__recent-posts .posts-list .post-item, .widget__cta, .appreciation__content .btn-customer, .appreciation__content .btn-customer .customer, .contact__info .info-item, .process__item, .work__item .signup-form .input-group, .work__item .user-area .user-item, .workflow__info .info-item, .brand-3__content .brand-title, .brand-3__item, .cta-2__content .buttons, .cta-3__content .buttons, .cta-3__content .features-list ul, .cta-3__content .features-list ul li, .blog-details__wrapper .blog-details .info-section, .blog-details__wrapper .tags-and-share, .blog-details__wrapper .tags-and-share .tags, .blog-details__wrapper .tags-and-share .tags .tags-list, .blog-details__wrapper .tags-and-share .share-group .post-and-share, .blog-details__wrapper .tags-and-share .share-group .post-and-share .post, .blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-list, .blog-details__wrapper .tags-and-share .share-group .post-and-share .share, .blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-list, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .stars, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer .like-btn,
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer .reply-btn, .blog__item .blog-content .meta ul, .blog-3__item .item-content .item-tags, .pricing__btn-content, .pricing__item .pricing-header .plan-info, .pricing-3__btns .buttons, .pricing-3__item .item-header .header-inner, .faq-2__accordion .accordion-item .accordion-header .accordion-button::after, .testimonial__navigation, .testimonial__navigation .slide-counter, .testimonials-2__navigation, .report-customize__item.type-3 .profile, .footer-one__left .join-btn, .footer-one__right .bottom-content, .footer-two__newsletter .newsletter-form, .footer-two__bottom .links ul, .banner-one.section .chart-1__header,
.banner-one.section .sales-goals__header, .banner-one.section .chart-1__main-stats .stats-content,
.banner-one.section .sales-goals__main-stats .stats-content, .banner-one.section .chart-1__main-stats .stats-content .change-percentage,
.banner-one.section .sales-goals__main-stats .stats-content .change-percentage, .banner-one.section .daily-statistic .statistic-container, .banner-one.section .daily-statistic .legend .legend-item, .banner-one__content .button-group, .banner-one__content .button-group .learn-more, .banner-two__content .customers-info, .banner-two__content .customers-info .info, .banner-two__content .banner-buttons, .offcanvas-menu .mean-bar .mean-nav > ul li a,
.mean-container .mean-bar .mean-nav > ul li a, .offcanvas-menu .mean-bar .mean-nav > ul li a.mean-expand,
.mean-container .mean-bar .mean-nav > ul li a.mean-expand, .offcanvas-menu .mean-bar .mean-nav > ul li a:has(~ .sub-menu),
.mean-container .mean-bar .mean-nav > ul li a:has(~ .sub-menu), .header-one__main, .header-one__main-menu nav ul:not(.sub-menu), .header-one__main-menu nav ul li a, .header-one__main-menu nav ul li .sub-menu li a:has(i), .header-one__main-menu.menu-right, .header-one__menu-btns, .header-one__menu-btns .buttons, .header-three .header-one__menu-btns .buttons, .mobile-menu-social-media, .section-header-2 .section-sub-title {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .post-info, .pricing__btn-content .save, .pricing-2.section .section-header-2 .section-title .icon, .pricing-2__item .item-header .item-price .plan-price, .testimonial__item .item-thumb {
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: end;
}

.pricing-3__item .item-header .header-inner .header-info .plan-price {
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
}

.pricing-2__btn-wrapper input, .saaslyn__submenu {
  display: -webkit-none;
  display: -ms-none;
  display: none;
}

.progress-wrap, .progress-wrap::after, .team-details__content .contact-section form .form-group input,
.team-details__content .contact-section form .form-group textarea, .widget__recent-posts .posts-list .post-item .item-thumb, .contact__map, .brand-3__content .brand-title .line, .blog__item .blog-thumb, .blog-3__item .item-thumb, .footer-two__newsletter .newsletter-info, .banner-three__content .no-credit-card-required, .offcanvas, .header-one__main-menu nav ul li .sub-menu li a, .header-one__menu-btns .hamburger-menu span, .saaslyn__submenu.saaslyn__active {
  display: -webkit-block;
  display: -ms-block;
  display: block;
}

.team-details__content .user-infos ul li span, .team-main__item .team-thumb .social .line, .team-main__item .team-content .designation, .widget__recent-posts .posts-list .post-item .item-content .post-date, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-info .author-designation, .blog-3__item .item-content .item-tags span, .pricing__item .pricing-header .plan-info .price, .pricing__item .pricing-footer .saving-info, .pricing-3__btns .btn-border, .pricing-3__item .item-header .header-inner .header-info .plan-price span, .footer-one__left .logo, .footer-three__main .footer-info .footer-logo, .banner-two__content .customers-info .info span, .mobile-menu-social-media a, .section-header-2 .section-sub-title::before, .section-header-3 .section-sub-title {
  display: -webkit-inline-block;
  display: -ms-inline-block;
  display: inline-block;
}

.team-details__wrapper, .team-details__content .contact-section form button, .social-media ul li a, .team-main__item .team-thumb .social ul li a, .widget__search .search-form .input-group .input-group-text, .contact__info .info-item .item-icon, .awesome-features__content, .awesome-features__content .item-row, .awesome-features__item .item-content .item-number, .process__item .item-icon, .process__item .item-icon::before, .work__item .user-area .user-item .user-icon, .benefits__item .item-icon, .workflow__info .info-item .icon, .integration__content .circle-one, .integration__content .circle-one .circle-one-inset .icon-block, .integration__content .circle-one .circle-two, .integration__content .circle-one .circle-two .circle-three, .integration__content .circle-one .circle-two .circle-three .circle-four, .blog-details__wrapper .blog-details .info-section .info-item .info-icon, .blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-list li a, .blog__item-wrapper, .pricing__item-wrapper, .pricing-2__item .item-header .item-icon, .pricing-3__item .item-header .header-inner .icon, .faq-3__accordion .accordion-item .accordion-header .accordion-button::after, .testimonial__navigation .prev-testimonial,
.testimonial__navigation .next-testimonial, .testimonials-2__navigation .prev-testimonial,
.testimonials-2__navigation .next-testimonial, .reports__item-wrapper, .report-customize__item.type-3, .report-customize__item.type-3 .activity .progress-wrapper .progress-percentage, .report-customize__item.type-3 .profile .avatar, .features__item .item-icon, .features-2__item-wrapper, .footer-one__left .join-btn .icon-box, .footer-one__right .info-area, .social-icons ul li a, .footer-two__link-area, .social-icons-2 ul li a, .footer-three__main .info-area, .banner-one.section .chart-1__header .icon-container,
.banner-one.section .sales-goals__header .icon-container, .banner-one.section .chart-1__header .icon-container .icon-box,
.banner-one.section .sales-goals__header .icon-container .icon-box, .banner-one.section .chart-1__main-stats .stats-content .change-percentage .icon-box,
.banner-one.section .sales-goals__main-stats .stats-content .change-percentage .icon-box, .banner-one.section .daily-statistic .legend, .banner-two__wrapper .banner-circles .circle, .hamburger-menu-close {
  display: -webkit-grid;
  display: -ms-grid;
  display: grid;
}

/* @@@@@@@@@@@@@  Extend Property CSS Writing Now  @@@@@@@@@@@@@@ */
.saaslyn-1-btn, .saaslyn-2-btn {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.brand-3__content .brand-title .line, .blog-details__wrapper .recent-comments__wrapper .recent-comments-item, .reports__item .item-thumb {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

/* @@@@@@@@@@@@@  Extend Property CSS Writing Now  @@@@@@@@@@@@@@ */
.saaslyn-1-btn, .saaslyn-2-btn, .choose-us__item, .choose-us__item .item-icon, .team-main__header, .error__content, .brand-3__content .brand-title, .cta__content-wrapper, .pricing__item .pricing-footer, .pricing-2__item .item-body .button-wrapper, .pricing-3__item .item-header .header-inner .icon, .faq-2__content, .testimonials-2__item .author, .banner-one.section .chart-1__widget,
.banner-one.section .sales-goals__widget, .banner-one__thumb, .banner-one__content, .breadcrumb-area__content, .mobile-menu-social-media a {
  text-align: center;
}

li {
  list-style: none;
}

/* @@@@@@@@@@@@@  Extend Property Margin 0 - 50 CSS Writing Now  @@@@@@@@@@@@@@ */
ul {
  margin: 0;
}

/* @@@@@@@@@@@@@  Extend Property padding 0 - 50 CSS Writing Now  @@@@@@@@@@@@@@ */
ul {
  padding: 0;
}

/*! 
https://serp.co/tools/css-reset/
<link rel="stylesheet" href="https://css.serp.co/css-reset/normalize.css/">
*/
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  overflow-x: hidden;
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
  overflow-x: hidden;
}

html:has(.offcanvas.show),
body:has(.offcanvas.show) {
  overflow: hidden;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/**
 * Basic typography style for copy text
 */
.home-one {
  line-height: 1;
  font-size: 18px;
  color: var(--body-text-color);
  background: var(--body-color);
  font-family: "Urbanist", sans-serif;
}
.home-one h1,
.home-one h2,
.home-one h3,
.home-one h4,
.home-one h5,
.home-one h6 {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  margin: 0;
  font-family: "Urbanist", sans-serif;
  color: var(--text-color-main);
}
.home-one h1 {
  font-size: 82px;
}
@media only screen and (max-width: 1439.98px) {
  .home-one h1 {
    font-size: 67px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .home-one h1 {
    font-size: 62px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-one h1 {
    font-size: 57px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-one h1 {
    font-size: 47px;
  }
}
.home-one h2 {
  font-size: 62px;
}
@media only screen and (max-width: 1199.98px) {
  .home-one h2 {
    font-size: 52px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-one h2 {
    font-size: 47px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-one h2 {
    font-size: 42px;
  }
}
.home-one h3 {
  font-size: 42px;
}
@media only screen and (max-width: 1199.98px) {
  .home-one h3 {
    font-size: 32px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-one h3 {
    font-size: 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-one h3 {
    font-size: 27px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-one h3 {
    font-size: 24px;
  }
}
.home-one h4 {
  font-size: 32px;
}
@media only screen and (max-width: 991.98px) {
  .home-one h4 {
    font-size: 29px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-one h4 {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-one h4 {
    font-size: 22px;
  }
}
.home-one h5 {
  font-size: 28px;
}
@media only screen and (max-width: 991.98px) {
  .home-one h5 {
    font-size: 27px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-one h5 {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-one h5 {
    font-size: 22px;
  }
}
.home-one h6 {
  font-size: 24px;
}
@media only screen and (max-width: 767.98px) {
  .home-one h6 {
    font-size: 19px;
  }
}

.home-two {
  line-height: 1;
  font-size: 18px;
  color: var(--secondary-color-2);
  background: var(--color-white);
  font-family: "Inter", sans-serif;
}
.home-two h1,
.home-two h2,
.home-two h3,
.home-two h4,
.home-two h5,
.home-two h6 {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  margin: 0;
  font-family: "Inter", sans-serif;
  color: var(--bg-color-2);
}
.home-two h1 {
  font-size: 72px;
}
@media only screen and (max-width: 1439.98px) {
  .home-two h1 {
    font-size: 57px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .home-two h1 {
    font-size: 52px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-two h1 {
    font-size: 47px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-two h1 {
    font-size: 37px;
  }
}
.home-two h2 {
  font-size: 48px;
}
@media only screen and (max-width: 1199.98px) {
  .home-two h2 {
    font-size: 38px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-two h2 {
    font-size: 33px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-two h2 {
    font-size: 28px;
  }
}
.home-two h3 {
  font-size: 42px;
}
@media only screen and (max-width: 1199.98px) {
  .home-two h3 {
    font-size: 32px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-two h3 {
    font-size: 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-two h3 {
    font-size: 27px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-two h3 {
    font-size: 24px;
  }
}
.home-two h4 {
  font-size: 32px;
}
@media only screen and (max-width: 991.98px) {
  .home-two h4 {
    font-size: 29px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-two h4 {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-two h4 {
    font-size: 22px;
  }
}
.home-two h5 {
  font-size: 26px;
}
@media only screen and (max-width: 991.98px) {
  .home-two h5 {
    font-size: 25px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-two h5 {
    font-size: 22px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-two h5 {
    font-size: 20px;
  }
}
.home-two h6 {
  font-size: 24px;
}
@media only screen and (max-width: 767.98px) {
  .home-two h6 {
    font-size: 19px;
  }
}

.home-three {
  line-height: 1;
  font-size: 18px;
  color: var(--color-white);
  background: var(--color-black-2);
  font-family: "Inter", sans-serif;
}
.home-three h1,
.home-three h2,
.home-three h3,
.home-three h4,
.home-three h5,
.home-three h6 {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  margin: 0;
  font-family: "Inter", sans-serif;
  color: var(--color-white);
}
.home-three h1 {
  font-size: 72px;
}
@media only screen and (max-width: 1439.98px) {
  .home-three h1 {
    font-size: 57px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .home-three h1 {
    font-size: 52px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-three h1 {
    font-size: 47px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-three h1 {
    font-size: 37px;
  }
}
.home-three h2 {
  font-size: 52px;
}
@media only screen and (max-width: 1199.98px) {
  .home-three h2 {
    font-size: 42px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-three h2 {
    font-size: 37px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-three h2 {
    font-size: 32px;
  }
}
.home-three h3 {
  font-size: 42px;
}
@media only screen and (max-width: 1199.98px) {
  .home-three h3 {
    font-size: 32px;
  }
}
@media only screen and (max-width: 991.98px) {
  .home-three h3 {
    font-size: 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-three h3 {
    font-size: 27px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-three h3 {
    font-size: 24px;
  }
}
.home-three h4 {
  font-size: 32px;
}
@media only screen and (max-width: 991.98px) {
  .home-three h4 {
    font-size: 29px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-three h4 {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-three h4 {
    font-size: 22px;
  }
}
.home-three h5 {
  font-size: 26px;
}
@media only screen and (max-width: 991.98px) {
  .home-three h5 {
    font-size: 25px;
  }
}
@media only screen and (max-width: 767.98px) {
  .home-three h5 {
    font-size: 22px;
  }
}
@media only screen and (max-width: 575.98px) {
  .home-three h5 {
    font-size: 20px;
  }
}
.home-three h6 {
  font-size: 24px;
}
@media only screen and (max-width: 767.98px) {
  .home-three h6 {
    font-size: 19px;
  }
}
.home-three p {
  color: rgba(var(--color-white-rgb), 0.75);
  opacity: 0.7;
}

img {
  max-width: 100%;
  height: auto;
  -webkit-user-drag: none;
  -moz-user-drag: none;
}

a {
  color: inherit;
  text-decoration: none;
  transition: all 0.3s;
}

p {
  line-height: 133.333%;
  font-weight: 500;
  margin: 0;
  padding: 0;
  letter-spacing: normal;
}

/*
============= Custom Scroll Bar CSS ================
*/
::-webkit-scrollbar {
  width: 0.3em;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(var(--color-white-rgb), 0.5);
  box-shadow: inset 0 0 6px rgba(var(--color-white-rgb), 0.5);
}

::-webkit-scrollbar-thumb {
  background-color: var(--color-2);
  border-radius: 10px;
}

/*
============= Custom Scroll Bar CSS End ================
*/
.preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
  background-color: var(--bg-color-2);
  display: flex;
  align-items: center;
  justify-content: center;
}
.preloader .loading-container {
  margin: 40px auto;
}
.preloader .loading-container,
.preloader .loading {
  height: 120px;
  width: 120px;
  position: relative;
  border-radius: 100%;
}
.preloader .loading {
  border: 2px solid transparent;
  border-color: transparent var(--primary-color-2) transparent var(--primary-color-2);
  animation: rotate-loading 1.5s linear 0s infinite normal;
  transform-origin: 50% 50%;
}
.preloader #loading-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 50px;
  transform: translate(-50%, -50%);
}

/*
============= Section Header START ================
*/
.section-header .section-sub-title {
  height: max-content;
  width: max-content;
  color: var(--bg-color-2);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.36px;
  border-radius: 60px;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 48.08%, var(--third-color) 100%);
  padding: 14px 25px;
}
.section-header .section-sub-title:has(+ .section-title) {
  margin-bottom: 35px;
}
@media only screen and (max-width: 767.98px) {
  .section-header .section-sub-title:has(+ .section-title) {
    margin-bottom: 25px;
  }
}
.section-header .section-title {
  text-align: center;
  font-weight: 700;
  line-height: 104.839%;
  letter-spacing: -1.86px;
}

.section-header-2 .section-sub-title {
  gap: 7px;
  color: var(--primary-color-2);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.84px;
  margin-bottom: 22px;
}
.section-header-2 .section-sub-title::before {
  content: "";
  width: 8px;
  height: 8px;
  aspect-ratio: 1/1;
  border-radius: 50px;
  background: var(--primary-color-2);
}
.section-header-2 .section-title {
  font-weight: 600;
  line-height: 104.839%;
  letter-spacing: -1.9px;
}
.section-header-2 .section-title:has(+ p) {
  margin-bottom: 16px;
}
.section-header-2 p {
  color: rgba(var(--secondary-color-2-rgb), 0.78);
  font-size: 16px;
  font-weight: 500;
  line-height: 178.75%;
  opacity: 0.9;
}

.section-header-3 .section-sub-title {
  z-index: 2;
  color: var(--color-white);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 2.4px;
  margin-bottom: 20px;
  border-radius: 50px;
  border: 1px solid transparent;
  background-image: linear-gradient(var(--color-black-2), var(--color-black-2)), linear-gradient(90deg, #ed7543 0%, #cd4f75 30%, #6a48ed 100%);
  background-origin: border-box;
  background-clip: padding-box, border-box;
  white-space: nowrap;
  padding: 13px 24px;
}
@media only screen and (max-width: 991.98px) {
  .section-header-3 .section-sub-title {
    padding: 12px 20px;
  }
}
@media only screen and (max-width: 767.98px) {
  .section-header-3 .section-sub-title {
    padding: 8px 15px;
    font-size: 13px;
    letter-spacing: 1.4px;
  }
}
.section-header-3 .section-title {
  color: var(--color-white);
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.04px;
}
.section-header-3 .section-title:has(+ p) {
  margin-bottom: 22px;
}
.section-header-3 p {
  font-size: 18px;
  letter-spacing: -0.36px;
  line-height: 150%;
  font-weight: 500;
}

.background-image,
[data-bg-src] {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

@keyframes moveX {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(8px);
  }
}
@keyframes moveY {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(8px);
  }
}
@keyframes banner-one-btn-shape {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(20px);
  }
  to {
    transform: translateX(0);
  }
}
@keyframes bar_anim {
  0%, 100% {
    -webkit-clip-path: inset(-2px 0);
    clip-path: inset(-2px 0);
  }
  42% {
    -webkit-clip-path: inset(-2px 0 -2px 100%);
    clip-path: inset(-2px 0 -2px 100%);
  }
  43% {
    -webkit-clip-path: inset(-2px 100% -2px 0);
    clip-path: inset(-2px 100% -2px 0);
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes circle-rotate {
  0% {
    transform: translate(-50%, -50%) rotate(45deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(405deg);
  }
}
@keyframes img-rotate {
  0% {
    transform: rotate(-45deg);
  }
  to {
    transform: rotate(-405deg);
  }
}
@keyframes draw {
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes float-1 {
  0% {
    -webkit-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
  }
  25% {
    -webkit-transform: translateY(-15px) translateX(5px) rotate(1deg) scale(1.02);
    -ms-transform: translateY(-15px) translateX(5px) rotate(1deg) scale(1.02);
    transform: translateY(-15px) translateX(5px) rotate(1deg) scale(1.02);
  }
  50% {
    -webkit-transform: translateY(-30px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(-30px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(-30px) translateX(0px) rotate(0deg) scale(1);
  }
  75% {
    -webkit-transform: translateY(-15px) translateX(-5px) rotate(-1deg) scale(0.98);
    -ms-transform: translateY(-15px) translateX(-5px) rotate(-1deg) scale(0.98);
    transform: translateY(-15px) translateX(-5px) rotate(-1deg) scale(0.98);
  }
  100% {
    -webkit-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
  }
}
@keyframes float-2 {
  0% {
    -webkit-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
  }
  30% {
    -webkit-transform: translateY(-20px) translateX(-8px) rotate(-1.5deg) scale(1.03);
    -ms-transform: translateY(-20px) translateX(-8px) rotate(-1.5deg) scale(1.03);
    transform: translateY(-20px) translateX(-8px) rotate(-1.5deg) scale(1.03);
  }
  60% {
    -webkit-transform: translateY(-35px) translateX(3px) rotate(0.5deg) scale(1);
    -ms-transform: translateY(-35px) translateX(3px) rotate(0.5deg) scale(1);
    transform: translateY(-35px) translateX(3px) rotate(0.5deg) scale(1);
  }
  90% {
    -webkit-transform: translateY(-10px) translateX(6px) rotate(1deg) scale(0.97);
    -ms-transform: translateY(-10px) translateX(6px) rotate(1deg) scale(0.97);
    transform: translateY(-10px) translateX(6px) rotate(1deg) scale(0.97);
  }
  100% {
    -webkit-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
  }
}
@keyframes float-3 {
  0% {
    -webkit-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
  }
  20% {
    -webkit-transform: translateY(-25px) translateX(7px) rotate(2deg) scale(1.01);
    -ms-transform: translateY(-25px) translateX(7px) rotate(2deg) scale(1.01);
    transform: translateY(-25px) translateX(7px) rotate(2deg) scale(1.01);
  }
  40% {
    -webkit-transform: translateY(-40px) translateX(-4px) rotate(-0.5deg) scale(1.04);
    -ms-transform: translateY(-40px) translateX(-4px) rotate(-0.5deg) scale(1.04);
    transform: translateY(-40px) translateX(-4px) rotate(-0.5deg) scale(1.04);
  }
  70% {
    -webkit-transform: translateY(-20px) translateX(-10px) rotate(-2deg) scale(0.99);
    -ms-transform: translateY(-20px) translateX(-10px) rotate(-2deg) scale(0.99);
    transform: translateY(-20px) translateX(-10px) rotate(-2deg) scale(0.99);
  }
  100% {
    -webkit-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
  }
}
@keyframes float-4 {
  0% {
    -webkit-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
  }
  35% {
    -webkit-transform: translateY(-18px) translateX(-6px) rotate(-1deg) scale(1.02);
    -ms-transform: translateY(-18px) translateX(-6px) rotate(-1deg) scale(1.02);
    transform: translateY(-18px) translateX(-6px) rotate(-1deg) scale(1.02);
  }
  65% {
    -webkit-transform: translateY(-32px) translateX(8px) rotate(1.5deg) scale(0.98);
    -ms-transform: translateY(-32px) translateX(8px) rotate(1.5deg) scale(0.98);
    transform: translateY(-32px) translateX(8px) rotate(1.5deg) scale(0.98);
  }
  85% {
    -webkit-transform: translateY(-12px) translateX(-3px) rotate(-0.5deg) scale(1.01);
    -ms-transform: translateY(-12px) translateX(-3px) rotate(-0.5deg) scale(1.01);
    transform: translateY(-12px) translateX(-3px) rotate(-0.5deg) scale(1.01);
  }
  100% {
    -webkit-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    -ms-transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
    transform: translateY(0px) translateX(0px) rotate(0deg) scale(1);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rippleEffect {
  0% {
    opacity: 0.5;
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1.01);
    -ms-transform: scale(1.01);
    transform: scale(1.01);
  }
}
@keyframes handUpDown {
  0% {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
  }
  8% {
    -webkit-transform: translateY(-25px);
    -ms-transform: translateY(-25px);
    transform: translateY(-25px);
  }
  16% {
    -webkit-transform: translateY(15px);
    -ms-transform: translateY(15px);
    transform: translateY(15px);
  }
  22% {
    -webkit-transform: translateY(-12px);
    -ms-transform: translateY(-12px);
    transform: translateY(-12px);
  }
  28% {
    -webkit-transform: translateY(8px);
    -ms-transform: translateY(8px);
    transform: translateY(8px);
  }
  32% {
    -webkit-transform: translateY(-7px);
    -ms-transform: translateY(-7px);
    transform: translateY(-7px);
  }
  36% {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
  }
  38% {
    -webkit-transform: translateY(-4px);
    -ms-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  40% {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
  }
  40.1%, 100% {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@keyframes floatCircle1 {
  0% {
    -webkit-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
  25% {
    -webkit-transform: translateX(80px) translateY(-60px);
    -ms-transform: translateX(80px) translateY(-60px);
    transform: translateX(80px) translateY(-60px);
  }
  50% {
    -webkit-transform: translateX(0px) translateY(-120px);
    -ms-transform: translateX(0px) translateY(-120px);
    transform: translateX(0px) translateY(-120px);
  }
  75% {
    -webkit-transform: translateX(-80px) translateY(-60px);
    -ms-transform: translateX(-80px) translateY(-60px);
    transform: translateX(-80px) translateY(-60px);
  }
  100% {
    -webkit-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
}
@keyframes floatCircle2 {
  0% {
    -webkit-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
  30% {
    -webkit-transform: translateX(-100px) translateY(80px);
    -ms-transform: translateX(-100px) translateY(80px);
    transform: translateX(-100px) translateY(80px);
  }
  60% {
    -webkit-transform: translateX(60px) translateY(140px);
    -ms-transform: translateX(60px) translateY(140px);
    transform: translateX(60px) translateY(140px);
  }
  90% {
    -webkit-transform: translateX(40px) translateY(-40px);
    -ms-transform: translateX(40px) translateY(-40px);
    transform: translateX(40px) translateY(-40px);
  }
  100% {
    -webkit-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
}
@keyframes hoverSkew {
  0% {
    -webkit-transform: skewX(0deg);
    -ms-transform: skewX(0deg);
    transform: skewX(0deg);
  }
  50% {
    -webkit-transform: skewX(-1.5deg);
    -ms-transform: skewX(-1.5deg);
    transform: skewX(-1.5deg);
  }
  100% {
    -webkit-transform: skewX(0deg);
    -ms-transform: skewX(0deg);
    transform: skewX(0deg);
  }
}
@keyframes pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.8;
    transform: scale(1.1);
  }
}
@keyframes drawSegment {
  from {
    stroke-dashoffset: 1000;
    opacity: 0;
  }
  to {
    stroke-dashoffset: 0;
    opacity: 1;
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes updown-float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-30px);
  }
}
@keyframes updown-float-v2 {
  0%, 100% {
    transform: translateY(0px) rotate(0deg);
  }
  30% {
    transform: translateY(-50px) translateX(50px) rotate(-20deg);
  }
  70% {
    transform: translateY(-80px) translateX(-80px) rotate(10deg);
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes floatImage {
  0%, 100% {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}
@keyframes glowPulse {
  0%, 100% {
    opacity: 0.4;
    filter: blur(20px);
  }
  50% {
    opacity: 0.6;
    filter: blur(25px);
  }
}
@keyframes morphOrb1 {
  0%, 100% {
    -webkit-transform: translate(0, 0) scale(1);
    -ms-transform: translate(0, 0) scale(1);
    transform: translate(0, 0) scale(1);
    border-radius: 50% 45% 55% 50%;
  }
  25% {
    -webkit-transform: translate(50px, 30px) scale(1.1);
    -ms-transform: translate(50px, 30px) scale(1.1);
    transform: translate(50px, 30px) scale(1.1);
    border-radius: 45% 50% 50% 55%;
  }
  50% {
    -webkit-transform: translate(30px, 60px) scale(0.95);
    -ms-transform: translate(30px, 60px) scale(0.95);
    transform: translate(30px, 60px) scale(0.95);
    border-radius: 50% 55% 45% 50%;
  }
  75% {
    -webkit-transform: translate(-20px, 40px) scale(1.05);
    -ms-transform: translate(-20px, 40px) scale(1.05);
    transform: translate(-20px, 40px) scale(1.05);
    border-radius: 55% 50% 50% 45%;
  }
}
@keyframes morphOrb2 {
  0%, 100% {
    -webkit-transform: translate(0, 0) scale(1) rotate(0deg);
    -ms-transform: translate(0, 0) scale(1) rotate(0deg);
    transform: translate(0, 0) scale(1) rotate(0deg);
    border-radius: 50% 50% 45% 55%;
  }
  33% {
    -webkit-transform: translate(-40px, -30px) scale(1.08) rotate(120deg);
    -ms-transform: translate(-40px, -30px) scale(1.08) rotate(120deg);
    transform: translate(-40px, -30px) scale(1.08) rotate(120deg);
    border-radius: 45% 55% 50% 50%;
  }
  66% {
    -webkit-transform: translate(-60px, 20px) scale(0.92) rotate(240deg);
    -ms-transform: translate(-60px, 20px) scale(0.92) rotate(240deg);
    transform: translate(-60px, 20px) scale(0.92) rotate(240deg);
    border-radius: 55% 45% 55% 45%;
  }
}
@keyframes animate_border {
  from {
    transform: translate(-50%, -50%) rotateZ(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotateZ(360deg);
  }
}
@keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.section-padding-top-bottom {
  padding-top: 100px;
  padding-bottom:100px;
}
@media only screen and (max-width: 991.98px) {
  .section-padding-top-bottom {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

.section-padding-top {
  padding-top: 100px;
}
@media only screen and (max-width: 991.98px) {
  .section-padding-top {
    padding-top: 60px;
  }
}

.section-padding-bottom {
  padding-bottom: 100px;
}
@media only screen and (max-width: 991.98px) {
  .section-padding-bottom {
    padding-bottom: 60px;
  }
}

.section-margin-top-bottom {
  margin-top: 100px;
  margin-bottom: 100px;
}
@media only screen and (max-width: 991.98px) {
  .section-margin-top-bottom {
    margin-top: 60px;
    margin-bottom: 60px;
  }
}

.section-margin-top {
  margin-top: 120px;
}
@media only screen and (max-width: 991.98px) {
  .section-margin-top {
    margin-top: 60px;
  }
}

.section-margin-bottom {
  margin-bottom: 120px;
}
@media only screen and (max-width: 991.98px) {
  .section-margin-bottom {
    margin-bottom: 60px;
  }
}

.row-padding-top-bottom {
  padding-top: 70px;
  padding-bottom: 70px;
}
@media only screen and (max-width: 991.98px) {
  .row-padding-top-bottom {
    padding-top: 35px;
    padding-bottom: 35px;
  }
}

.row-padding-top {
  padding-top: 40px;
}
@media only screen and (max-width: 991.98px) {
  .row-padding-top {
    padding-top: 35px;
  }
}

.row-padding-bottom {
  padding-bottom: 70px;
}
@media only screen and (max-width: 991.98px) {
  .row-padding-bottom {
    padding-bottom: 35px;
  }
}

.row-margin-top-bottom {
  margin-top: 70px;
  margin-bottom: 70px;
}
@media only screen and (max-width: 991.98px) {
  .row-margin-top-bottom {
    margin-top: 35px;
    margin-bottom: 35px;
  }
}

.row-margin-top {
  margin-top: 70px;
}
@media only screen and (max-width: 991.98px) {
  .row-margin-top {
    margin-top: 35px;
  }
}

.row-margin-bottom {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991.98px) {
  .row-margin-bottom {
    margin-bottom: 35px;
  }
}

.mobile-menu-contact-info {
  margin-top: 30px;
}

.mobile-menu-social-media {
  gap: 10px;
}
.mobile-menu-social-media a {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  background-color: transparent;
  color: var(--text-color-main);
  border: 1px solid rgba(var(--text-color-main-rgb), 0.1);
  font-size: 16px;
}
.mobile-menu-social-media a:hover {
  color: var(--color-white);
  background-color: var(--text-color-main);
  border-color: var(--text-color-main);
}

.saaslyn__mobile-menu-copyright .saaslyn__mobile-menu-copyright-text {
  font-size: 16px;
  font-weight: 500;
  color: rgba(var(--text-color-main-rgb), 0.6);
}
.saaslyn__mobile-menu-copyright .saaslyn__mobile-menu-copyright-text a {
  font-weight: 700;
  color: rgba(var(--text-color-main-rgb), 0.6);
}
.saaslyn__mobile-menu-copyright .saaslyn__mobile-menu-copyright-text:hover a {
  color: rgba(var(--text-color-main-rgb), 0.6);
}

.saaslyn__nav-item {
  transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.saaslyn__nav-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 18px;
  color: var(--text-color-main);
  text-decoration: none;
  padding: 5px 0;
  font-weight: 500;
  transition: linear 0.4s;
}
.saaslyn__nav-link:hover {
  color: var(--text-color-main);
}
.saaslyn__nav-link:hover .saaslyn__toggle-btn::after,
.saaslyn__nav-link:hover .saaslyn__toggle-btn::before {
  background-color: var(--text-color-main);
}

.saaslyn__nav-item > .saaslyn__nav-link {
  padding: 12px 0;
}

.saaslyn__toggle-btn {
  width: 24px;
  height: 24px;
  position: relative;
  background: none;
  border: none;
  cursor: pointer;
}
.saaslyn__toggle-btn::before, .saaslyn__toggle-btn::after {
  background: var(--text-color-main);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.saaslyn__toggle-btn::before {
  width: 2px;
  height: 12px;
  top: 6px;
  left: 11px;
}
.saaslyn__toggle-btn::after {
  width: 12px;
  height: 2px;
  top: 11px;
  left: 6px;
}
.saaslyn__toggle-btn.saaslyn__active::before {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
.saaslyn__toggle-btn.saaslyn__active::after {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.saaslyn__submenu {
  padding-left: 20px;
  margin-top: 10px;
}
.saaslyn__submenu.saaslyn__active .saaslyn__submenu-item {
  opacity: 1;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}
.saaslyn__submenu .saaslyn__submenu-item {
  margin-bottom: 10px;
  opacity: 0;
  -webkit-transform: translateY(-10px);
  -ms-transform: translateY(-10px);
  transform: translateY(-10px);
  transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}
.saaslyn__submenu .saaslyn__submenu-link {
  color: var(--text-color-main);
  text-decoration: none;
  font-size: 18px;
  font-weight: 500;
  transition: linear 0.4s;
}
.saaslyn__submenu .saaslyn__submenu-link:hover {
  color: var(--text-color-main);
}

.fix-menu {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.fix-menu.transformed {
  position: fixed !important;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 800;
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
}
.fix-menu.sticky {
  position: fixed !important;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 800;
  -webkit-transform: translateY(0%);
  -ms-transform: translateY(0%);
  transform: translateY(0%);
}

.header-one.section {
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
}
.header-one.section:not(.sticky) {
  border-bottom: 1px solid rgba(var(--color-2-rgb), 0.1);
}
.header-one.section.v4 {
  border-bottom: 1px solid rgba(var(--color-white-rgb), 0.1);
}
.header-one.section.v4 .header__main-menu nav > ul > li > a {
  color: var(--color-white);
  border: 1px solid transparent;
}
.header-one.section.v4 .header__main-menu nav > ul > li > a:hover {
  background-color: transparent;
  border-color: rgba(var(--color-white-rgb), 0.1);
}
.header-one.section.v4 .header__main-menu nav > ul > li:hover > a {
  background-color: transparent;
  color: var(--color-white);
  border-color: rgba(var(--color-white-rgb), 0.1);
}
.header-one.section.v4 .header__main-menu nav > ul > li:hover > a:hover {
  background-color: transparent;
  border-color: rgba(var(--color-white-rgb), 0.1);
}
.header-one.section.v4 .header__main-menu nav > ul > li.active > a {
  background-color: transparent;
  border-color: rgba(var(--color-white-rgb), 0.1);
}
.header-one.section .sticky {
  background-color: var(--bg-color-2);
  box-shadow: rgba(var(--color-white-rgb), 0.25) 0px 5px 35px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}
.header-one__main {
  padding-block: 24px;
  gap: 15px;
}
@media only screen and (max-width: 1199.98px) {
  .header-one__main {
    padding-block: 20px;
  }
}
.header-one__main-menu nav.circle {
  border-radius: 999px;
}
@media only screen and (max-width: 991.98px) {
  .header-one__main-menu nav.circle {
    display: none;
  }
}
.header-one__main-menu nav > ul > li > a:hover {
  opacity: 1;
}
.header-one__main-menu nav ul {
  line-height: 1;
}
.header-one__main-menu nav ul li:last-of-type a {
  padding-right: 0;
}
.header-one__main-menu nav ul li a {
  border-radius: 999px;
  white-space: nowrap;
  color: var(--text-color-main);
  font-size: 16px;
  font-weight: 500;
  line-height: 162.5%;
  padding: 8.5px 13.5px;
  gap: 10px;
  opacity: 0.6;
}
@media only screen and (max-width: 1199.98px) {
  .header-one__main-menu nav ul li a {
    gap: 5px;
    line-height: 2.188;
    padding: 5px 15px;
  }
}
.header-one__main-menu nav ul li a i {
  transition: inherit;
  -webkit-transition: inherit;
  -moz-transition: inherit;
  -o-transition: inherit;
  -ms-transition: inherit;
  transform-origin: center center;
  -ms-transform-origin: center center;
  -webkit-transform-origin: center center;
}
.header-one__main-menu nav ul li .sub-menu {
  -webkit-transform: scaleY(0);
  -ms-transform: scaleY(0);
  transform: scaleY(0);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  left: 0;
  top: 100%;
  border: 1px solid rgba(var(--text-color-main-rgb), 0.2);
  border-radius: 15px;
  min-width: 250px;
  transform-origin: top left;
  -ms-transform-origin: top left;
  -webkit-transform-origin: top left;
  background: #222;
}
.header-one__main-menu nav ul li .sub-menu li {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  line-height: 1;
  z-index: 1;
}
.header-one__main-menu nav ul li .sub-menu li:first-of-type {
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
}
.header-one__main-menu nav ul li .sub-menu li:last-of-type {
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
}
.header-one__main-menu nav ul li .sub-menu li a {
  padding: 12px 10px;
  line-height: 1;
  border-radius: 5px;
}
.header-one__main-menu nav ul li .sub-menu li a:hover {
  background-color: #2c2b2e;
}
.header-one__main-menu nav ul li .sub-menu li:first-of-type a {
  border-top-right-radius: 15px;
  border-top-left-radius: 15px;
}
.header-one__main-menu nav ul li .sub-menu li:last-of-type a {
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 15px;
}
.header-one__main-menu nav ul li .sub-menu li:hover::before {
  width: 100%;
}
.header-one__main-menu nav ul li .sub-menu li:hover > a {
  letter-spacing: 1px;
}
.header-one__main-menu nav ul li .sub-menu .sub-menu {
  left: calc(100% + 5px);
  top: 0%;
}
.header-one__main-menu nav ul li:hover > a i {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.header-one__main-menu nav ul li:hover > .sub-menu {
  -webkit-transform: scaleY(1);
  -ms-transform: scaleY(1);
  transform: scaleY(1);
}
.header-one__main-menu nav ul li:last-of-type > .sub-menu:not(.sub-menu .sub-menu), .header-one__main-menu nav ul li:nth-last-of-type(2) > .sub-menu:not(.sub-menu .sub-menu), .header-one__main-menu nav ul li:nth-last-of-type(3) > .sub-menu:not(.sub-menu .sub-menu) {
  left: unset;
  right: 0;
  transform-origin: top right;
}
.header-one__main-menu nav ul li:last-of-type > .sub-menu:not(.sub-menu .sub-menu) li .sub-menu, .header-one__main-menu nav ul li:nth-last-of-type(2) > .sub-menu:not(.sub-menu .sub-menu) li .sub-menu, .header-one__main-menu nav ul li:nth-last-of-type(3) > .sub-menu:not(.sub-menu .sub-menu) li .sub-menu {
  left: unset;
  right: calc(100% + 5px);
  transform-origin: top right;
}
.header-one__main-menu.menu-right {
  gap: 60px;
}
@media only screen and (max-width: 991.98px) {
  .header-one__main-menu.menu-right {
    gap: 30px;
  }
}
.header-one__main-menu.v2 nav > ul > li > a {
  color: var(--secondary-color-2);
  opacity: 0.6;
}
.header-one__main-menu.v2 nav > ul > li > a:hover {
  opacity: 1;
}
@media only screen and (min-width: 992px) {
  .header-one__main-menu.v2 .header-one__menu-btns .hamburger-menu {
    display: none;
  }
}
.header-one__main-menu.v3 nav > ul > li > a {
  color: var(--color-white);
  opacity: 0.7;
}
.header-one__main-menu.v3 nav > ul > li > a:hover {
  opacity: 1;
}
.header-one__menu-btns {
  gap: 16px;
}
.header-one__menu-btns .buttons {
  gap: 16px;
}
@media only screen and (max-width: 575.98px) {
  .header-one__menu-btns .buttons {
    display: none;
  }
}
.header-one__menu-btns .hamburger-menu {
    background-color: #222;
    display: inline-block;
    font-size: inherit;
    width: 30px;
    backdrop-filter: blur(104px);
    width: 38px;
    height: 38px;
    padding: 0;
    padding-right: 10px;
    border: none;
    border-radius: 50%;
}
.header-one__menu-btns .hamburger-menu span {
  background: var(--text-color-main);
  width: 11px;
  margin: 4px 0 4px auto;
  border-radius: 10px;
  height: 2px;
}
.header-one__menu-btns .hamburger-menu span:nth-child(2) {
  width: 20px;
}
.header-one__menu-btns .hamburger-menu:hover span {
  animation: bar_anim 0.8s cubic-bezier(0.44, 1.1, 0.53, 0.99) 1 forwards;
}
.header-one__menu-btns .hamburger-menu:hover span:nth-child(2) {
  animation-delay: 0.1s;
}

.header-two.section {
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
  border-bottom: 1px solid rgba(70, 66, 252, 0.08);
}
.header-two.section .header-one__main {
  padding-block: 10px;
}
.header-two.section .sticky {
  background-color: var(--color-white);
  box-shadow: rgba(var(--color-black-rgb), 0.15) 0px 3px 45px -5px, rgba(var(--color-black-rgb), 0.3) 0px 8px 16px -8px;
}

.header-three.section {
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
}
.header-three.section .sticky {
  background-color: rgba(var(--bg-color-2-rgb), 0.4);
  backdrop-filter: blur(50px);
  box-shadow: rgba(var(--color-white-rgb), 0.25) 0px 5px 35px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}
.header-three .header-one__main {
  padding-block: 15px;
}
.header-three .header-one__main-menu.v3 {
  border-radius: 60px;
  border: 1px solid rgba(var(--color-white-rgb), 0.11);
  padding-inline: 28.5px;
  padding-block: 2.5px;
  margin-left: 7%;
}
@media only screen and (max-width: 991.98px) {
  .header-three .header-one__main-menu.v3 {
    display: none;
  }
}
.header-three .header-one__menu-btns .buttons {
  gap: 10px;
  border-radius: 48px;
  border: 0.5px solid rgba(var(--color-white-rgb), 0.13);
  backdrop-filter: blur(2px);
  padding: 7px 8px;
}
.header-three .header-one__menu-btns .buttons .divider {
  width: 0.5px;
  height: 30px;
  background-color: #4a3536;
}
@media only screen and (max-width: 767.98px) {
  .header-three .header-one__menu-btns .buttons {
    display: none;
  }
}
@media only screen and (min-width: 992px) {
  .header-three .header-one__menu-btns .hamburger-menu {
    display: none;
  }
}

.has-child-menu-mega-menu {
  position: unset !important;
}
.has-child-menu-mega-menu ul {
  display: none;
  z-index: -1;
}
.has-child-menu-mega-menu .sub-nav {
  position: absolute;
  width: max-content;
  height: 75vh;
  overflow-y: scroll;
  left: 0;
  right: 0;
  top: 72%;
  transition: all ease 0.4s;
  z-index: 5;
  border-radius: 28px;
  padding: 20px 0;
  background-color: #f3f3f3;
  max-width: 98%;
  margin: 0 auto;
  transform-origin: 0 0 0;
  transform: scaleY(0.5);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@media only screen and (max-width: 991.98px) {
  .has-child-menu-mega-menu .sub-nav {
    display: none;
  }
}
.has-child-menu-mega-menu .sub-nav::-webkit-scrollbar {
  width: 0.3em;
}
.has-child-menu-mega-menu .sub-nav::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.has-child-menu-mega-menu .sub-nav::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
  border-radius: 10px;
}
.has-child-menu-mega-menu .sub-nav .nav-item .nav-item-img {
  border-radius: 16px;
  padding: 6px;
  background-color: #ddd;
}
.has-child-menu-mega-menu .sub-nav .nav-item .nav-item-img img {
  border-radius: 14px;
  transition: all 0.3s;
}
.has-child-menu-mega-menu .sub-nav .nav-item h6 {
  font-weight: 600;
  font-size: 18px;
  color: #040a10;
}
.has-child-menu-mega-menu .sub-nav .nav-item a {
  padding: 0;
}
.has-child-menu-mega-menu:hover .sub-nav {
  transform: scaleY(1);
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

.offcanvas {
  color: rgba(var(--text-color-main-rgb), 0.6);
  background-color: var(--bg-color-2);
  overflow-y: auto;
}
.offcanvas.offcanvas-end {
  border-left: 5px solid var(--primary-color);
}
.offcanvas-backdrop:hover {
  cursor: url("../images/cross-out.webp"), auto;
}
.offcanvas.offcanvas-full {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100vw;
  height: 100vh;
  transform: none;
  background-color: transparent;
  border-left: none !important;
}
.offcanvas.offcanvas-full::-webkit-scrollbar {
  display: none !important;
}
.offcanvas.offcanvas-full.show .offcanvas-full-bg.is-left {
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
  transition-delay: 0s;
}
.offcanvas.offcanvas-full.show .offcanvas-full-bg.is-right {
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
  transition-delay: 0s;
}
.offcanvas.offcanvas-full.show .offcanvas-header {
  opacity: 1;
  visibility: visible;
}
.offcanvas.offcanvas-full.show .offcanvas-menu,
.offcanvas.offcanvas-full.show .offcanvas-body {
  opacity: 1;
  visibility: visible;
}
.offcanvas.offcanvas-full .offcanvas-full-bg.is-left {
  left: 0;
  -webkit-transform: scale(1, 0);
  -moz-transform: scale(1, 0);
  -ms-transform: scale(1, 0);
  -o-transform: scale(1, 0);
  transform: scale(1, 0);
  transform-origin: top center;
  transition-delay: 1s;
}
.offcanvas.offcanvas-full .offcanvas-full-bg.is-right {
  right: 0;
  transform-origin: bottom center;
  -webkit-transform: scale(1, 0);
  -moz-transform: scale(1, 0);
  -ms-transform: scale(1, 0);
  -o-transform: scale(1, 0);
  transform: scale(1, 0);
  transition-delay: 1s;
}
.offcanvas.offcanvas-full .offcanvas-full-bg.left-box {
  top: 0;
  height: 100%;
  width: 60%;
  transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  background-color: var(--color-1);
  z-index: -1;
}
@media only screen and (max-width: 767.98px) {
  .offcanvas.offcanvas-full .offcanvas-full-bg.left-box {
    width: 100%;
  }
}
.offcanvas.offcanvas-full .offcanvas-full-bg.right-box {
  top: 0;
  height: 100%;
  width: 40%;
  transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  background-color: var(--color-3);
  z-index: -1;
}
@media only screen and (max-width: 767.98px) {
  .offcanvas.offcanvas-full .offcanvas-full-bg.right-box {
    width: 0%;
  }
}
.offcanvas.offcanvas-full .offcanvas-menu {
  height: 90vh;
  overflow-y: scroll;
  padding: 50px;
}
@media only screen and (max-width: 1199.98px) {
  .offcanvas.offcanvas-full .offcanvas-menu {
    padding: 30px;
  }
}
.offcanvas.offcanvas-full .offcanvas-menu::-webkit-scrollbar {
  display: none !important;
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list:hover > .saaslyn__nav-item > .saaslyn__nav-link {
  opacity: 0.5;
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list:hover > .saaslyn__nav-item:hover > .saaslyn__nav-link {
  opacity: 1;
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item:not(:last-of-type) {
  padding-bottom: 30px;
}
@media only screen and (max-width: 991.98px) {
  .offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item:not(:last-of-type) {
    padding-bottom: 10px;
  }
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link {
  font-weight: 700;
  font-size: 40px;
}
@media only screen and (max-width: 991.98px) {
  .offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link {
    font-size: 30px;
  }
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link .saaslyn__toggle-btn {
  width: 30px;
  height: 30px;
}
@media only screen and (max-width: 991.98px) {
  .offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link .saaslyn__toggle-btn {
    width: 20px;
    height: 20px;
  }
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link .saaslyn__toggle-btn::before {
  height: 30px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media only screen and (max-width: 991.98px) {
  .offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link .saaslyn__toggle-btn::before {
    height: 20px;
  }
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link .saaslyn__toggle-btn::after {
  width: 30px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media only screen and (max-width: 991.98px) {
  .offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link .saaslyn__toggle-btn::after {
    width: 20px;
  }
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link .saaslyn__toggle-btn.saaslyn__active::before {
  -webkit-transform: translate(-50%, -50%) rotate(90deg);
  -ms-transform: translate(-50%, -50%) rotate(90deg);
  transform: translate(-50%, -50%) rotate(90deg);
}
.offcanvas.offcanvas-full .offcanvas-menu nav .saaslyn__nav-list > .saaslyn__nav-item > .saaslyn__nav-link .saaslyn__toggle-btn.saaslyn__active::after {
  -webkit-transform: translate(-50%, -50%) rotate(180deg);
  -ms-transform: translate(-50%, -50%) rotate(180deg);
  transform: translate(-50%, -50%) rotate(180deg);
}
.offcanvas.offcanvas-full .offcanvas-body {
  margin-block: 50px;
  padding-inline: 50px;
}
@media only screen and (max-width: 1199.98px) {
  .offcanvas.offcanvas-full .offcanvas-body {
    margin-block: 30px;
    padding-inline: 30px;
  }
}
.offcanvas.offcanvas-full .offcanvas-menu,
.offcanvas.offcanvas-full .offcanvas-body {
  opacity: 0;
  visibility: hidden;
  transition-delay: 0.5s;
}
.offcanvas.offcanvas-full .offcanvas-header {
  padding-inline: 50px;
  transition-delay: 0.5s;
  opacity: 0;
  visibility: hidden;
}
@media only screen and (max-width: 1199.98px) {
  .offcanvas.offcanvas-full .offcanvas-header {
    padding-inline: 30px;
  }
}
.offcanvas.offcanvas-full .offcanvas-main {
  display: flex;
}
.offcanvas.offcanvas-full .offcanvas-main .offcanvas-menu {
  width: 60%;
}
@media only screen and (max-width: 767.98px) {
  .offcanvas.offcanvas-full .offcanvas-main .offcanvas-menu {
    width: 100%;
  }
}
.offcanvas.offcanvas-full .offcanvas-main .offcanvas-body {
  width: 40%;
}
@media only screen and (max-width: 767.98px) {
  .offcanvas.offcanvas-full .offcanvas-main .offcanvas-body {
    width: 0%;
    visibility: hidden;
    opacity: 0;
    padding: 0;
  }
}

.offcanvas-menu {
  padding: 16px;
}
@media only screen and (min-width: 992px) {
  .offcanvas-menu nav {
    display: none;
  }
}

.offcanvas-menu,
.mean-container {
  overflow: hidden;
}
.offcanvas-menu .mean-bar,
.mean-container .mean-bar {
  padding: 0;
  background: transparent;
}
.offcanvas-menu .mean-bar *,
.mean-container .mean-bar * {
  box-sizing: border-box;
}
.offcanvas-menu .mean-bar .meanmenu-reveal,
.mean-container .mean-bar .meanmenu-reveal {
  display: none !important;
  display: -ms-none !important;
  display: -webkit-none !important;
}
.offcanvas-menu .mean-bar .mean-nav,
.mean-container .mean-bar .mean-nav {
  background: transparent;
}
.offcanvas-menu .mean-bar .mean-nav > ul,
.mean-container .mean-bar .mean-nav > ul {
  display: block !important;
  display: -ms-block !important;
  display: -webkit-block !important;
}
.offcanvas-menu .mean-bar .mean-nav > ul li,
.mean-container .mean-bar .mean-nav > ul li {
  background: transparent;
}
.offcanvas-menu .mean-bar .mean-nav > ul li a,
.mean-container .mean-bar .mean-nav > ul li a {
  line-height: 1;
  background: transparent;
  text-transform: capitalize;
  border-top: 1px solid rgba(var(--color-primary-rgb), 0.4);
  border-bottom: none;
  width: 100%;
}
.offcanvas-menu .mean-bar .mean-nav > ul li a.mean-expand,
.mean-container .mean-bar .mean-nav > ul li a.mean-expand {
  width: 100%;
  line-height: 1;
  height: 55px;
  border-left: none !important;
  border-bottom: none !important;
  background: transparent;
  border-bottom: none;
}
.offcanvas-menu .mean-bar .mean-nav > ul li a.mean-expand:hover,
.mean-container .mean-bar .mean-nav > ul li a.mean-expand:hover {
  background: transparent;
}
.offcanvas-menu .mean-bar .mean-nav > ul li a:has(~ .sub-menu) i,
.mean-container .mean-bar .mean-nav > ul li a:has(~ .sub-menu) i {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.offcanvas-menu .mean-bar .mean-nav > ul li a:has(~ .mean-clicked) i,
.mean-container .mean-bar .mean-nav > ul li a:has(~ .mean-clicked) i {
  -webkit-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  transform: rotate(-180deg);
}
.offcanvas-menu .mean-bar .mean-nav > ul .sub-menu > li a,
.mean-container .mean-bar .mean-nav > ul .sub-menu > li a {
  padding-left: 12px;
  margin-left: 25px;
  padding-right: 12%;
  border-left: 1px solid rgba(var(--color-primary-rgb), 0.4);
  border-bottom: 1px solid rgba(var(--color-primary-rgb), 0.4);
}
.offcanvas-menu .mean-bar .mean-nav > ul .sub-menu > li .sub-menu > li a,
.mean-container .mean-bar .mean-nav > ul .sub-menu > li .sub-menu > li a {
  padding-left: 12px;
  margin-left: 50px;
  padding-right: 20%;
  border-left: 1px solid rgba(var(--color-primary-rgb), 0.4);
}

.offcanvas-body {
  overflow: unset;
}
@media only screen and (max-width: 991.98px) {
  .offcanvas-body {
    border-top: 1px solid rgba(var(--text-color-main-rgb), 0.2);
  }
}
.offcanvas-body .info {
  font-size: 18px;
}
.offcanvas-body .offcanvas-img {
  padding-block: 20px;
}
.offcanvas-body .contact-area .title {
  font-weight: 700;
  margin-bottom: 20px;
}
.offcanvas-body .contact-area ul li {
  gap: 5px;
}
.offcanvas-body .contact-area ul li:not(:first-of-type) {
  margin-top: 20px;
}
.offcanvas-body .contact-area ul li .icon {
  color: var(--primary-color);
}
.offcanvas-body .social-area {
  margin-block: 20px;
}
.offcanvas-body .social-area .title {
  font-weight: 700;
  margin-bottom: 15px;
}

.hamburger-menu-close {
  width: 40px;
  height: 40px;
  font-size: 20px;
  border: none;
  border-radius: 50%;
  background-color: var(--text-color-main);
  color: var(--primary-text-color);
  margin-left: auto;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.hamburger-menu-close i {
  color: var(--primary-text-color);
}
.hamburger-menu-close i::before, .hamburger-menu-close i::after {
  opacity: 1;
}
.hamburger-menu-close:hover {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.breadcrumb-area.section {
  padding-inline: 8px;
  padding-block-start: 8px;
}
.breadcrumb-area__wrapper {
  width: 100%;
  height: 100%;
  border-radius: 24px;
  overflow: hidden;
  padding-block: 200px 190px;
  background-size: 100% 100%;
}
@media only screen and (max-width: 991.98px) {
  .breadcrumb-area__wrapper {
    padding-block: 130px 110px;
    background-size: cover;
  }
}
.breadcrumb-area__content .breadcrumb-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 700;
  line-height: 144.444%;
  letter-spacing: -2.16px;
  margin-bottom: 10px;
}
.breadcrumb-area__content .breadcrumb-nav {
  --bs-breadcrumb-divider: "|";
}
.breadcrumb-area__content .breadcrumb-nav .breadcrumb .breadcrumb-item {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 112.5%;
  letter-spacing: 0.5px;
}
.breadcrumb-area__content .breadcrumb-nav .breadcrumb .breadcrumb-item::before {
  color: var(--color-white);
}
.breadcrumb-area__content .breadcrumb-nav .breadcrumb .breadcrumb-item a:hover {
  color: var(--primary-color);
}
.breadcrumb-area__content .breadcrumb-nav.v2 .breadcrumb {
  gap: 16px;
}
.breadcrumb-area__content .breadcrumb-nav.v2 .breadcrumb .breadcrumb-item {
  border-radius: 40px;
  background: rgba(var(--color-white-rgb), 0.16);
  line-height: 1;
  padding: 10px 13px;
}
.breadcrumb-area__content .breadcrumb-nav.v2 .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  content: unset;
}
.breadcrumb-area__content.v2 {
  max-width: 1200px;
  margin-inline: auto;
}
.breadcrumb-area__content.v2 .breadcrumb-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -3.6px;
  margin-bottom: 20px;
}

.banner-one.section {
  z-index: 2;
}
@media only screen and (max-width: 1599.98px) {
  .banner-one.section .graphOneDrawing-LeftSvg,
  .banner-one.section .graphOneDrawing-RightSvg {
    max-width: 30%;
  }
}
@media only screen and (max-width: 991.98px) {
  .banner-one.section .graphOneDrawing-LeftSvg,
  .banner-one.section .graphOneDrawing-RightSvg {
    display: none;
  }
}
.banner-one.section .graphOneDrawing-LeftSvg {
  left: 0;
  bottom: 80px;
  z-index: 4;
  opacity: 0.5;
}
.banner-one.section .graphOneDrawing-LeftSvg path {
  stroke: #7397e9;
  stroke-width: 1;
  fill: none;
  stroke-linecap: round;
  opacity: 0.8;
}
.banner-one.section .graphOneDrawing-RightSvg {
  right: 0;
  bottom: 0;
  z-index: 4;
}
.banner-one.section .graphOneDrawing-RightSvg path {
  stroke: #7397e9;
  stroke-width: 1;
  fill: none;
  stroke-linecap: round;
  opacity: 0.5;
}
.banner-one.section .chart-1__widget,
.banner-one.section .sales-goals__widget {
  width: 300px;
  height: auto;
  left: 120px;
  top: 50%;
  overflow: hidden;
  z-index: 4;
  border-radius: 23px;
  background: rgba(var(--color-white-rgb), 0.08);
  box-shadow: 0 74px 130px 0 rgba(var(--color-black), 0.09);
  backdrop-filter: blur(40px);
  padding: 22.5px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media only screen and (max-width: 1599.98px) {
  .banner-one.section .chart-1__widget,
  .banner-one.section .sales-goals__widget {
    left: 50px;
    width: 250px;
    top: 25%;
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    transform: translateY(0%);
  }
}
@media only screen and (max-width: 991.98px) {
  .banner-one.section .chart-1__widget,
  .banner-one.section .sales-goals__widget {
    display: none;
  }
}
.banner-one.section .chart-1__header,
.banner-one.section .sales-goals__header {
  gap: 12px;
  margin-bottom: 15px;
}
.banner-one.section .chart-1__header .icon-container,
.banner-one.section .sales-goals__header .icon-container {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  border: 1px solid rgba(var(--color-white-rgb), 0.18);
}
.banner-one.section .chart-1__header .icon-container .icon-box,
.banner-one.section .sales-goals__header .icon-container .icon-box {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: linear-gradient(180deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
  font-size: 8px;
  color: #050d14;
}
.banner-one.section .chart-1__header .sales-title,
.banner-one.section .sales-goals__header .sales-title {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 17.5px;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: -0.535px;
}
.banner-one.section .chart-1__main-stats,
.banner-one.section .sales-goals__main-stats {
  margin-bottom: 15px;
}
.banner-one.section .chart-1__main-stats .stats-content,
.banner-one.section .sales-goals__main-stats .stats-content {
  margin-bottom: 8px;
  gap: 15px;
}
.banner-one.section .chart-1__main-stats .stats-content .current-value,
.banner-one.section .sales-goals__main-stats .stats-content .current-value {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 31.683px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.95px;
}
.banner-one.section .chart-1__main-stats .stats-content .change-percentage,
.banner-one.section .sales-goals__main-stats .stats-content .change-percentage {
  gap: 5.5px;
  padding: 7.5px;
  padding-inline-end: 12px;
  border-radius: 55px;
  background: rgba(var(--color-white-rgb), 0.19);
}
.banner-one.section .chart-1__main-stats .stats-content .change-percentage .icon-box,
.banner-one.section .sales-goals__main-stats .stats-content .change-percentage .icon-box {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: linear-gradient(180deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
  font-size: 8px;
  color: #050d14;
}
.banner-one.section .chart-1__main-stats .stats-content .change-percentage .percentage-value,
.banner-one.section .sales-goals__main-stats .stats-content .change-percentage .percentage-value {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.353px;
}
.banner-one.section .chart-1__main-stats p,
.banner-one.section .sales-goals__main-stats p {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 15.5px;
  font-weight: 500;
  line-height: 112.5%;
  letter-spacing: -0.475px;
  opacity: 0.6;
}
.banner-one.section .chart-1__chart-container,
.banner-one.section .sales-goals__chart-container {
  height: 150px;
}
@media only screen and (max-width: 1599.98px) {
  .banner-one.section .chart-1__chart-container,
  .banner-one.section .sales-goals__chart-container {
    height: 130px;
  }
}
.banner-one.section .chart-1__chart-container canvas,
.banner-one.section .sales-goals__chart-container canvas {
  max-width: 247px;
  width: 100%;
  margin-inline: auto;
}
.banner-one.section .chart-1__chart-container .sales-chart-label,
.banner-one.section .sales-goals__chart-container .sales-chart-label {
  left: 50%;
  bottom: 30px;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.banner-one.section .chart-1__chart-container .sales-chart-label .label-text,
.banner-one.section .sales-goals__chart-container .sales-chart-label .label-text {
  color: rgba(var(--color-white-rgb), 0.5);
  font-size: 11px;
  font-weight: 400;
  line-height: 150%;
}
.banner-one.section .chart-1__chart-container .sales-chart-label .label-value,
.banner-one.section .sales-goals__chart-container .sales-chart-label .label-value {
  color: var(--color-white);
  font-size: 23.5px;
  font-weight: 600;
  line-height: 150%;
}
.banner-one.section .daily-statistic {
  right: 142px;
  top: 140px;
  z-index: 4;
  background: rgba(var(--color-white-rgb), 0.04);
  backdrop-filter: blur(40px);
  border-radius: 20px;
  padding: 22px;
  box-shadow: 0 25px 60px 0px rgba(var(--color-black-rgb), 0.25);
  width: 300px;
  animation: slideIn 0.8s ease-out;
}
@media only screen and (max-width: 1599.98px) {
  .banner-one.section .daily-statistic {
    right: 50px;
  }
}
@media only screen and (max-width: 991.98px) {
  .banner-one.section .daily-statistic {
    display: none;
  }
}
.banner-one.section .daily-statistic .statistic-header .title {
  color: var(--color-white);
  font-size: 18px;
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  margin-bottom: 10px;
  font-weight: 700;
  line-height: 112.5%;
  letter-spacing: -0.292px;
  animation: fadeIn 1s ease-out 0.3s both;
}
.banner-one.section .daily-statistic .statistic-header p {
  color: rgba(var(--color-white-rgb), 0.57);
  font-size: 14px;
  font-family: "Urbanist", sans-serif;
  line-height: 133.333%;
  letter-spacing: -0.438px;
  animation: fadeIn 1s ease-out 0.5s both;
}
.banner-one.section .daily-statistic .statistic-container {
  margin: 15px 0;
  animation: scaleIn 1s ease-out 0.7s both;
}
.banner-one.section .daily-statistic .donut-statistic {
  position: relative;
  width: 110px;
  height: 110px;
}
.banner-one.section .daily-statistic .donut-statistic .statistic-svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.banner-one.section .daily-statistic .donut-statistic .statistic-svg .chart-segment {
  fill: none;
  stroke-width: 20;
  stroke-linecap: round;
  opacity: 0;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
}
.banner-one.section .daily-statistic .donut-statistic .statistic-svg .chart-segment:hover {
  filter: drop-shadow(0 0 10px currentColor);
}
.banner-one.section .daily-statistic .legend {
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  animation: fadeInUp 1s ease-out 1s both;
}
.banner-one.section .daily-statistic .legend .legend-item {
  gap: 5px;
  font-size: 12px;
  transition: transform 0.2s ease;
  color: #9c9ca6;
  font-family: "Urbanist", sans-serif;
  font-weight: 500;
  line-height: 115.942%;
  letter-spacing: -0.365px;
  cursor: pointer;
}
.banner-one.section .daily-statistic .legend .legend-item:hover {
  transform: translateX(4px);
}
.banner-one.section .daily-statistic .legend .legend-item .legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  animation: pulse 2s infinite;
}
.banner-one__wrapper {
  border-radius: 24px;
  background: rgba(var(--text-color-main-rgb), 0.04);
  padding-top: 50px;
}
@media only screen and (max-width: 350.98px) {
  .banner-one__wrapper {
    padding-top: 100px;
  }
}
.banner-one__wrapper::after {
  width: 100%;
  left: 0;
  bottom: 0;
  height: 639px;
  background: linear-gradient(0deg, var(--color-black) 9.47%, rgba(5, 13, 20, 0) 83.26%);
  z-index: 2;
}
@media only screen and (max-width: 767.98px) {
  .banner-one__wrapper::after {
    background: linear-gradient(0deg, var(--color-black) 9.47%, rgba(5, 13, 20, 0) 53.26%);
  }
}
.banner-one__thumb {
  z-index: 2;
}
.banner-one__thumb::after {
  width: 778px;
  height: 250px;
  border-radius: 778px;
  background: var(--primary-text-color);
  filter: blur(80px);
  bottom: 220px;
  left: 50%;
  z-index: 2;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
@media only screen and (max-width: 767.98px) {

  .banner-one__thumb::after {
    width: 778px;
    height: 200px;
  }
}
.banner-one__content {
  left: 50%;
  bottom: 120px;
  z-index: 4;
  width: 100%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
@media only screen and (max-width: 991.98px) {
  .banner-one__content {
    bottom: 60px;
  }
}
@media only screen and (max-width: 575.98px) {
  .banner-one__content {
    bottom: 0px;
  }
    .common-btn {
    font-size: 10px;
}
}
.banner-one__content .banner-title {
  font-weight: 600;
  line-height: 110.976%;
  letter-spacing: -2.46px;
}
.banner-one__content .banner-title span {
  font-weight: 900;
}
.banner-one__content .button-group {
  gap: 18px;
  margin-top: 45px;
}
.banner-one__content .button-group .learn-more {
  gap: 10px;
  color: var(--text-color-main);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.36px;
  text-transform: capitalize;
}
.banner-one__content .button-group .learn-more i,
.banner-one__content .button-group .learn-more svg {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.banner-one__content .button-group .learn-more:hover i,
.banner-one__content .button-group .learn-more:hover svg {
  animation: moveX 0.6s ease-in-out infinite alternate;
}
.banner-one__content .button-group .star-1 {
  right: 30px;
  top: -20px;
  animation: banner-one-btn-shape 4s linear infinite;
}
.banner-one__content .button-group .star-2 {
  left: 0px;
  bottom: 15px;
  animation: banner-one-btn-shape 4s linear infinite;
}
.banner-one__content .button-group .arrow {
  left: -80px;
  bottom: 35px;
  animation: moveY 1.5s ease-in-out infinite alternate;
}

.banner-two.section {position: relative;
  padding-top: 140px;
  overflow: hidden;
  z-index: 3;
}
.banner-two::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/banner/hero.webp") no-repeat center center;
    background-size: contain;
    opacity: .6;
    z-index: 1;
    transform: translateY(-11%);
}
@media only screen and (max-width: 991.98px) {
  .banner-two.section {
    padding-top: 150px;
  }
}
.banner-two__wrapper {
  min-height: 100vh;
  z-index: 3;
}
.banner-two__wrapper .banner-circles {
  left: 50%;
  bottom: 0%;
  z-index: -2;
  -webkit-transform: translateX(-50%) translateY(695px);
  -ms-transform: translateX(-50%) translateY(695px);
  transform: translateX(-50%) translateY(695px);
}
.banner-two__wrapper .banner-circles .circle {
  border-radius: 100%;
  border: 1px solid rgba(3, 3, 3, 0.11);
  animation: rippleEffect 2s cubic-bezier(0.25, 0.46, 0.45, 0.94) infinite;
  animation-fill-mode: forwards;
}
.banner-two__wrapper .banner-circles .circle-1 {
  width: 1395px;
  height: 1395px;
}
.banner-two__wrapper .banner-circles .circle-2 {
  width: 1150px;
  height: 1150px;
}
.banner-two__wrapper .banner-circles .circle-3 {
  width: 920px;
  height: 920px;
}
.banner-two__wrapper .banner-circles .circle-4 {
  width: 690px;
  height: 690px;
}
.banner-two__wrapper .banner-circles .circle-5 {
  width: 488px;
  height: 488px;
}
.banner-two__wrapper .color-circle {
  border-radius: 100%;
  opacity: 0.8;
  z-index: -2;
}
.banner-two__wrapper .color-circles-1 {
  width: 686px;
  height: 685px;
  background:#6dafd1;
  filter: blur(150px);
  left: 0%;
  bottom: 100px;
  animation: floatCircle1 4s ease-in-out infinite;
}
.banner-two__wrapper .color-circles-2 {
    width: 659px;
    height: 658px;
    opacity: 0.8;
    background: #b9affea6;
    filter: blur(150px);
    right: 0%;
    top: 10%;
    animation: floatCircle2 5s ease-in-out infinite;
    animation-delay: 1s;
}
.banner-two__wrapper .toots-shape {
  left: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  z-index: -5;
}
.banner-two__wrapper .draw-svg {
  width: 612px;
  height: auto;
  left: -100px;
  bottom: 300px;
  z-index: -2;
}
@media only screen and (max-width: 1439.98px) {
  .banner-two__wrapper .draw-svg {
    bottom: 250px;
  }
}
@media only screen and (max-width: 767.98px) {
  .banner-two__wrapper .draw-svg {
    bottom: 100px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}
@media only screen and (max-width: 575.98px) {
  .banner-two__wrapper .draw-svg {
    width: 100%;
  }
}
.banner-two__wrapper .draw-svg #bannerTwoSvgPath {
  transition: stroke-dashoffset 2s ease-in-out;
  -webkit-transition: stroke-dashoffset 2s ease-in-out;
  -moz-transition: stroke-dashoffset 2s ease-in-out;
  -o-transition: stroke-dashoffset 2s ease-in-out;
  -ms-transition: stroke-dashoffset 2s ease-in-out;
  color: rgba(70, 66, 252, 0.08);
}
.banner-two__wrapper .banner-graph {
  padding: 10px;
}
.banner-two__wrapper .banner-graph-1 {
  border-radius: 30px;
  background: #ceeeff;
  backdrop-filter: blur(14.9999990463px);
  width: 250px;
  height: 252.336px;
  transform: rotate(-15deg);
  left: 0;
  bottom: 450px;
}
@media only screen and (max-width: 1439.98px) {
  .banner-two__wrapper .banner-graph-1 {
    bottom: 300px;
    width: 230px;
    height: 190px;
  }
}
@media only screen and (max-width: 991.98px) {
  .banner-two__wrapper .banner-graph-1 {
    width: 220px;
    height: 200px;
    bottom: 240px;
    transform: rotate(0deg);
  }
}
@media only screen and (max-width: 767.98px) {
  .banner-two__wrapper .banner-graph-1 {
    opacity: 0;
  }
}
.banner-two__wrapper .banner-graph-2 {
  width: 300px;
  height: 223.611px;
  flex-shrink: 0;
  border-radius: 24px;
  background: #e7e4ff;
  backdrop-filter: blur(11.9999990463px);
  left: 200px;
  bottom: 280px;
}
@media only screen and (max-width: 1439.98px) {
  .banner-two__wrapper .banner-graph-2 {
    left: 150px;
    bottom: 120px;
    width: 250px;
    height: 210px;
  }
}
@media only screen and (max-width: 991.98px) {
  .banner-two__wrapper .banner-graph-2 {
    left: 0px;
    bottom: 50px;
    width: 220px;
    height: 180px;
  }
}
@media only screen and (max-width: 767.98px) {
  .banner-two__wrapper .banner-graph-2 {
    opacity: 0;
  }
}
.banner-two__content {
  z-index: 2;
  text-align: center;
  max-width: 808px;
  margin-inline: auto;
}
.banner-two__content .customers-info {
  margin-bottom: 26px;
  gap: 10px;
}
.banner-two__content .customers-info .customers img {
  width: 38px;
  height: 38px;
  border-radius: 100%;
  border: 2px solid #f9f8ff;
}
.banner-two__content .customers-info .customers img:not(:first-of-type) {
  margin-left: -14px;
}
.banner-two__content .customers-info .info {
  gap: 3px;
  color: rgba(3, 3, 3, 0.7);
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.96px;
}
.banner-two__content .customers-info .info span {
  color: #4642fc;
  font-size: 16px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.96px;
}
.banner-two__content .title {
  margin-bottom: 18px;
}
.banner-two__content .title .line-one {
  gap: 12px;
}
.banner-two__content .title .line-one__span {
  color: var(--primary-color-2);
}
@media only screen and (max-width: 575.98px) {
  .banner-two__content .title .line-one__span {
    display: none;
  }
}
.banner-two__content .title .line-two {
  gap: 12px;
}
.banner-two__content .title .line-two__span {
  color: var(--primary-color-2);
}
.banner-two__content p {
  color: #030303;
  font-size: 18px;
  font-weight: 500;
  line-height: 158.889%;
  opacity: 0.9;
}
.banner-two__content .banner-buttons {
  column-gap: 24px;
  row-gap: 15px;
  margin-top: 30px;
}
@media only screen and (max-width: 575.98px) {
  .banner-two__content .banner-buttons {
    flex-direction: column;
  }
  .banner-two__content .banner-buttons a {
    width: 100%;
  }
}
.banner-two__content .banner-buttons .saaslyn-3-btn.v2 {
  background-color: white;
}
.banner-two__thumb {
  text-align: right;
  margin-bottom: -30px;
}
@media only screen and (max-width: 767.98px) {
  .banner-two__thumb {
    margin-top: 30px;
  }
}
.banner-two__thumb img {
  animation: handUpDown 5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
@media only screen and (max-width: 1439.98px) {
  .banner-two__thumb img {
    max-width: 650px;
  }
}
@media only screen and (max-width: 991.98px) {
  .banner-two__thumb img {
    max-width: 500px;
  }
}
@media only screen and (max-width: 575.98px) {
  .banner-two__thumb img {
    max-width: 100%;
  }
}

.banner-three.section {
  z-index: 2;
  background-position: top center;
  padding-top: 200px;
}
@media only screen and (max-width: 991.98px) {
  .banner-three.section {
    padding-top: 150px;
  }
}
@media only screen and (max-width: 767.98px) {
  .banner-three.section {
    padding-top: 120px;
  }
}
.banner-three.section .bottom-shape {
  right: 0;
  bottom: 120px;
  z-index: -1;
}
.banner-three.section .cube-shape {
  left: 77px;
  top: 40%;
  z-index: -1;
}
@media only screen and (max-width: 1199.98px) {
  .banner-three.section .cube-shape {
    left: 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .banner-three.section .cube-shape {
    display: none;
  }
}
.banner-three.section .cube-shape img {
  animation: updown-float 3s ease-in-out infinite;
}
.banner-three.section .bot-shape {
  right: 200px;
  top: 420px;
  z-index: -1;
}
@media only screen and (max-width: 1599.98px) {
  .banner-three.section .bot-shape {
    right: 80px;
  }
}
@media only screen and (max-width: 1439.98px) {
  .banner-three.section .bot-shape {
    right: 30px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .banner-three.section .bot-shape {
    top: 480px;
    right: -10px;
  }
  .banner-three.section .bot-shape img {
    max-width: 70%;
  }
}
@media only screen and (max-width: 767.98px) {
  .banner-three.section .bot-shape {
    display: none;
  }
}
.banner-three.section .bot-shape img {
  animation: updown-float-v2 8s ease-in-out infinite;
}
.banner-three.section .aichat-shape {
  z-index: -1;
}
@media only screen and (max-width: 991.98px) {
  .banner-three.section .aichat-shape {
    display: none;
  }
}
.banner-three.section .aichat-shape-1 {
  left: 175px;
  top: 317px;
  animation: updown-float 4s ease-in-out infinite;
}
@media only screen and (max-width: 1439.98px) {
  .banner-three.section .aichat-shape-1 {
    left: 80px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .banner-three.section .aichat-shape-1 {
    left: 20px;
  }
}
.banner-three.section .aichat-shape-2 {
  left: 310px;
  top: 570px;
  animation: updown-float 6s ease-in-out infinite;
}
@media only screen and (max-width: 1439.98px) {
  .banner-three.section .aichat-shape-2 {
    left: 110px;
    top: 500px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .banner-three.section .aichat-shape-2 {
    left: 50px;
  }
}
.banner-three.section .aichat-shape-3 {
  right: 130px;
  top: 265px;
  animation: updown-float 3s ease-in-out infinite;
}
@media only screen and (max-width: 1439.98px) {
  .banner-three.section .aichat-shape-3 {
    right: 80px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .banner-three.section .aichat-shape-3 {
    right: 50px;
  }
}
.banner-three__content {
  max-width: 700px;
  margin-inline: auto;
  text-align: center;
}
.banner-three__content .saaslyn-4-btn {
  margin-top: 50px;
}
@media only screen and (max-width: 575.98px) {
  .banner-three__content .saaslyn-4-btn {
    margin-top: 35px;
  }
}
.banner-three__content .no-credit-card-required {
  padding: 24px 32px;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.48px;
  margin-top: 20px;
}

.footer-one.section .container .footer-long-text {
  width: auto;
  left: 0;
  bottom: 0;
  z-index: 0;
  pointer-events: none;
}
@media only screen and (max-width: 575.98px) {
  .footer-one.section .container .footer-long-text {
    width: 100%;
  }
}
.footer-one.v2 {
  background: #040a10;
}
.footer-one__wrapper {
  padding-bottom: 80px;
}
.footer-one__left .logo {
  margin-bottom: 40px;
}
.footer-one__left .join-title {
  font-weight: 500;
  line-height: 104.839%;
  letter-spacing: -1.86px;
  margin-bottom: 32px;
}
.footer-one__left .join-btn {
  gap: 95px;
  height: max-content;
  border-radius: 70px;
  overflow: hidden;
  background-image: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 54.13%, var(--third-color) 112.59%);
  padding-block: 10px;
  padding-inline: 24px 16px;
  z-index: 2;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.footer-one__left .join-btn::before {
  z-index: -1;
  inset: 0;
  background-image: linear-gradient(273deg, var(--primary-color) 0.49%, var(--secondary-color) 48.33%, var(--third-color) 100%);
  opacity: 0;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.footer-one__left .join-btn .text {
  color: var(--bg-color-2);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.48px;
}
.footer-one__left .join-btn .icon-box {
  width: 33px;
  height: 33px;
  background-color: var(--text-color-main);
  color: var(--bg-color-2);
  border-radius: 50%;
  font-size: 14px;
}
.footer-one__left .join-btn:hover {
  background-image: transparent;
}
.footer-one__left .join-btn:hover::before {
  opacity: 1;
}
.footer-one__right {
  height: 100%;
  border-radius: 24px;
  background: var(--bg-color-1);
  padding: 60px 70px;
  z-index: 2;
}
@media only screen and (max-width: 1199.98px) {
  .footer-one__right {
    border-radius: 20px;
    padding: 40px 50px;
  }
}
@media only screen and (max-width: 767.98px) {
  .footer-one__right {
    border-radius: 15px;
    padding: 30px;
  }
}
.footer-one__right .info-area {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 55px;
  gap: 25px;
}
@media only screen and (max-width: 767.98px) {
  .footer-one__right .info-area {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media only screen and (max-width: 575.98px) {
  .footer-one__right .info-area {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media only screen and (max-width: 767.98px) {
  .footer-one__right .info-area .links-group:nth-of-type(3) {
    grid-column: span 2/span 2;
  }
}
@media only screen and (max-width: 575.98px) {
  .footer-one__right .info-area .links-group:nth-of-type(3) {
    grid-column: span 1/span 1;
  }
}
.footer-one__right .bottom-content {
  border-top: 1px solid rgba(var(--text-color-main-rgb), 0.1);
  padding-top: 25px;
  gap: 15px;
}
@media only screen and (max-width: 575.98px) {
  .footer-one__right .bottom-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}
.footer-one__right .bottom-content .copy-right {
  font-size: 16px;
  font-weight: 500;
  line-height: 131.25%;
  letter-spacing: -0.64px;
  opacity: 0.8;
}

.social-icons ul {
  gap: 11px;
}
.social-icons ul li {
  line-height: 1;
}
.social-icons ul li a {
  width: 25px;
  height: 25px;
  border-radius: 100%;
  background-image: linear-gradient(180deg, var(--primary-color) 0%, var(--secondary-color) 48.08%, var(--third-color) 100%);
  font-size: 10px;
  color: #383838;
  z-index: 2;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.social-icons ul li a::before {
  z-index: -1;
  inset: 0;
  background-image: linear-gradient(360deg, var(--primary-color) 0.49%, var(--secondary-color) 48.33%, var(--third-color) 100%);
  opacity: 0;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.social-icons ul li a:hover {
  background-image: transparent;
}
.social-icons ul li a:hover::before {
  opacity: 1;
}
.social-icons.v2 ul li a {
  width: 30px;
  height: 30px;
  font-size: 14px;
}

.links-group .link-title {
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: 1.08px;
  margin-bottom: 35px;
}
@media only screen and (max-width: 767.98px) {
  .links-group .link-title {
    margin-bottom: 25px;
  }
}
.links-group .link-list ul li {
  line-height: 1;display: inline-block;margin: 15px;
}
.links-group .link-list ul li:not(:last-of-type) {
  margin-bottom: 16px;
}
@media only screen and (max-width: 767.98px) {
  .links-group .link-list ul li:not(:last-of-type) {
    margin-bottom: 10px;
  }
}
.links-group .link-list ul li a {
  opacity: 0.8;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.64px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.links-group .link-list ul li a:hover {
  opacity: 1;
  color: var(--primary-color);
}
.links-group.v2 .link-title {
  color: var(--color-white);
}
.links-group.v2 .link-list ul li a {
  color: var(--color-white);
  opacity: 0.73;
}
.links-group.v2 .link-list ul li a:hover {
  opacity: 1;
}
.links-group.v3 .link-title {
  color: var(--color-white);
  font-weight: 500;
  line-height: 95.833%;
  letter-spacing: -0.48px;
  opacity: 0.8;
}
.links-group.v3 .link-list ul li:not(:last-of-type) {
  margin-bottom: 10px;
}
@media only screen and (max-width: 767.98px) {
  .links-group.v3 .link-list ul li:not(:last-of-type) {
    margin-bottom: 6px;
  }
}
.links-group.v3 .link-list ul li a {
  color: rgba(var(--color-white-rgb), 0.75);
  font-size: 14px;
  font-weight: 500;
  line-height: 164.286%;
  letter-spacing: -0.28px;
}
.links-group.v3 .link-list ul li a:hover {
  opacity: 1;
  color: var(--color-white);
}

.footer-two.section {
  z-index: 2;
  background-color: #5a5afc;
}
.footer-two.section #footerTwoSvgDraw {
  width: 100%;
  left: 50%;
  bottom: 0;
  z-index: -1;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.footer-two.section #footerTwoSvgDraw svg {
  width: 100%;
}
@media only screen and (max-width: 575.98px) {
  .footer-two.section #footerTwoSvgDraw {
    display: none;
  }
}
.footer-two__main {padding-top: 50px;
  padding-bottom: 20px;
}
.footer-two__main .footer-info p {
  color: var(--color-white);
  font-size: 18px;
  font-weight: 400;
  line-height: 141.946%;
  opacity: 0.65;
  max-width: 330px;
  margin-block: 30px;
}
@media only screen and (max-width: 991.98px) {
  .footer-two__main .footer-info p {
    max-width: 100%;
  }
}
.footer-two__link-area {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.footer-two__newsletter {
  margin-left: auto;
  border-radius: 20px;
  border: 1px solid rgba(var(--color-white-rgb), 0.24);
  background: var(--color-white);
  padding: 32px;
}
@media only screen and (max-width: 767.98px) {
  .footer-two__newsletter {
    max-width: 100%;
  }
}
.footer-two__newsletter .newsletter-title {
  color: var(--color-black);
  font-weight: 600;
  line-height: normal;
  margin-bottom: 5px;
}
.footer-two__newsletter p {
  color: rgba(136, 136, 136, 0.64);
  font-size: 15px;
  font-weight: 400;
  line-height: 133.333%;
  letter-spacing: -0.3px;
}
.footer-two__newsletter .newsletter-form {
  gap: 5px;
  border-radius: 10px;
  border: 1px solid rgba(90, 90, 252, 0.32);
  background: rgba(90, 90, 252, 0.08);
  padding-block: 8px;
  padding-inline: 16px 8px;
  margin-top: 22px;
}
.footer-two__newsletter .newsletter-form input,
.footer-two__newsletter .newsletter-form button {
  height: 50px;
  overflow: hidden;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.footer-two__newsletter .newsletter-form input {
  border: none;
  width: 100%;
  color: rgba(var(--color-black-rgb), 0.8);
  background-color: transparent;
}
.footer-two__newsletter .newsletter-form input:focus, .footer-two__newsletter .newsletter-form input:focus-visible, .footer-two__newsletter .newsletter-form input:active {
  outline: none;
  box-shadow: none;
}
.footer-two__newsletter .newsletter-form input::placeholder {
  color: rgba(var(--color-black-rgb), 0.28);
  opacity: 1;
}
.footer-two__newsletter .newsletter-form button {
  border: none;
  border-radius: 7px;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  z-index: 2;
  color: var(--color-white);
  font-size: 14px;
  font-weight: 500;
  line-height: normal;
  padding-inline: 16px;
}
.footer-two__newsletter .newsletter-form button::before {
  inset: 0;
  z-index: -1;
  opacity: 0;
  background: linear-gradient(315deg, #4642fc 0%, #adbbfe 100%);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.footer-two__newsletter .newsletter-form button:hover {
  background-image: transparent;
}
.footer-two__newsletter .newsletter-form button:hover::before {
  opacity: 1;
}
.footer-two__newsletter .newsletter-info {
  color: #b3b3b3;
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.42px;
  margin-top: 10px;
}
.footer-two__bottom {
  padding-block: 25px;
  border-top: 1px solid rgba(var(--color-white-rgb), 0.14);
}
@media only screen and (max-width: 767.98px) {
  .footer-two__bottom {
    text-align: center;
  }
}
.footer-two__bottom .copy-right {
  color: rgba(var(--color-white-rgb), 0.73);
  font-size: 18px;
  font-weight: 400;
  line-height: 141.946%;
}
@media only screen and (max-width: 575.98px) {
  .footer-two__bottom .copy-right {
    font-size: 16px;
  }
}
.footer-two__bottom .copy-right a:hover {
  color: var(--color-white);
}
.footer-two__bottom .links ul {
  gap: 15px;
}
@media only screen and (max-width: 767.98px) {
  .footer-two__bottom .links ul {
    justify-content: center;
  }
}
.footer-two__bottom .links ul li {
  color: rgba(var(--color-white-rgb), 0.73);
  font-size: 18px;
  font-weight: 400;
  line-height: 141.946%;
}
@media only screen and (max-width: 575.98px) {
  .footer-two__bottom .links ul li {
    font-size: 16px;
  }
}

.social-icons-2 ul {margin-top: 10px;
  gap: 11px;justify-content: center;
}
.social-icons-2 ul li {
  line-height: 1;
}
.social-icons-2 ul li a {
  width: 27px;
  height: 27px;
  border-radius: 100%;
  border: 0.676px solid rgba(var(--color-white-rgb), 0.22);
  background-color: transparent;
  font-size: 10px;
  color: var(--color-white);
  z-index: 2;
  overflow: hidden;
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -ms-transition: all 0.3s;
}
.social-icons-2 ul li a:hover {
  background-color: var(--color-white);
  border-color: var(--color-white);
  color: var(--color-black);
}

.footer-three__main .footer-info {
  max-width: 318px;
  margin-bottom: 80px;
}
.footer-three__main .footer-info .footer-logo {
  margin-bottom: 30px;
}
.footer-three__main .footer-info p {
  color: rgba(var(--color-white-rgb), 0.75);
  font-size: 14px;
  font-weight: 500;
  line-height: 164.286%;
  letter-spacing: -0.28px;
}
.footer-three__main .newsletter {
  max-width: 338px;
  height: 38px;
  border-bottom: 1px solid var(--color-white);
  padding-bottom: 25px;
}
.footer-three__main .newsletter button,
.footer-three__main .newsletter input {
  height: 100%;
  border: none;
  outline: none;
  background-color: transparent;
  color: var(--color-white);
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.36px;
}
.footer-three__main .info-area {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 55px;
  gap: 25px;
}
@media only screen and (max-width: 767.98px) {
  .footer-three__main .info-area {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media only screen and (max-width: 575.98px) {
  .footer-three__main .info-area {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
.footer-three__main .footer-crop-logo {
  text-align: right;
  margin-right: 130px;
}
@media only screen and (max-width: 767.98px) {
  .footer-three__main .footer-crop-logo {
    margin-right: 50px;
  }
}
.footer-three__bottom {
  padding-block: 22px;
  border-top: 1px solid rgba(var(--color-white-rgb), 0.11);
}
.footer-three__bottom a:hover {
  color: var(--color-white);
}
.footer-three__bottom .copyright,
.footer-three__bottom .terms {
  color: #7c7c7c;
  font-size: 14px;
  font-weight: 400;
  line-height: 182.502%;
}

.features.section {
  background-color: var(--bg-color-2);
}
.features-item__wrapper {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  border-radius: 31px;
  border: 4px solid rgba(115, 151, 233, 0.16);
  background: rgba(14, 24, 37, 0.52);
  padding: 8px;
}
@media only screen and (max-width: 1199.98px) {
  .features-item__wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media only screen and (max-width: 767.98px) {
  .features-item__wrapper {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
.features__item {
  border-radius: 24px;
  border: 2px solid transparent;
  background: var(--primary-text-color);
  padding: 42px 24px;
  overflow: hidden;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.features__item .item-icon {
  z-index: 2;
  width: 70px;
  height: 70px;
  flex-shrink: 0;
  aspect-ratio: 1/1;
  text-align: center;
  margin-inline: auto;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(115, 151, 233, 0.08) 2.27%, rgba(209, 215, 245, 0.08) 50.35%, rgba(239, 247, 251, 0.08) 102.27%);
  overflow: hidden;
  margin-bottom: 25px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.features__item .item-icon i,
.features__item .item-icon svg {
  color: var(--text-color-main);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.features__item .item-icon::after {
  z-index: -1;
  inset: 0;
  background: linear-gradient(135deg, #7397e9 2.27%, #d1d7f5 50.35%, #eff7fb 102.27%);
  opacity: 0;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.features__item .item-content {
  text-align: center;
}
.features__item .item-content .item-title {
  font-weight: 700;
  line-height: 108.333%;
  letter-spacing: -0.48px;
}
.features__item .item-content .item-title a {
  font: inherit;
}
.features__item .item-content p {
  font-weight: 500;
  line-height: 122.222%;
  letter-spacing: -0.72px;
  opacity: 0.64;
  margin-top: 25px;
}
.features__item .item-shape {
  right: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.features__item:hover, .features__item.active {
  border-color: rgba(var(--text-color-main-rgb), 0.2);
  box-shadow: 0 40px 60px 0 rgba(131, 160, 231, 0.24) inset;
}
.features__item:hover .item-icon, .features__item.active .item-icon {
  background-color: transparent;
}
.features__item:hover .item-icon i,
.features__item:hover .item-icon svg, .features__item.active .item-icon i,
.features__item.active .item-icon svg {
  color: var(--bg-color-2);
}
.features__item:hover .item-icon::after, .features__item.active .item-icon::after {
  opacity: 1;
}
.features__item:hover .item-shape, .features__item.active .item-shape {
  opacity: 1;
}

.features-2.section {
  z-index: 2;
}
.features-2.section .shape-1 {
  left: 60px;
  top: 120px;
  z-index: -1;
}
@media only screen and (max-width: 1199.98px) {
  .features-2.section .shape-1 {
    top: 50px;
  }
}
@media only screen and (max-width: 767.98px) {
  .features-2.section .shape-1 {
    display: none;
  }
}
.features-2.section .shape-bg {
  bottom: 100px;
  right: 0;
  z-index: -1;
}
.features-2.section .shape-line {
  z-index: -1;
  left: 0;
  bottom: 130px;
  width: 90%;
}
.features-2.section .shape-line #featuresTwoSvgPath {
  transition: stroke-dashoffset 3s ease-in-out;
}
.features-2__thumb {
  padding-left: 30px;
}
@media only screen and (max-width: 991.98px) {
  .features-2__thumb {
    padding-left: 0px;
  }
}
.features-2__thumb img {
  width: 100%;
}
.features-2__item-wrapper {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 42px;
  padding-inline-end: 60px;
  padding-bottom: 70px;
}
@media only screen and (max-width: 1199.98px) {
  .features-2__item-wrapper {
    gap: 24px;
    padding-inline: 0px;
    padding-bottom: 50px;
  }
}
@media only screen and (max-width: 575.98px) {
  .features-2__item-wrapper {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    padding-bottom: 0px;
  }
}
.features-2__item-wrapper .features-2__item:nth-of-type(even) {
  -webkit-transform: translateY(60px);
  -ms-transform: translateY(60px);
  transform: translateY(60px);
}
@media only screen and (max-width: 991.98px) {
  .features-2__item-wrapper .features-2__item:nth-of-type(even) {
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
  }
}
@media only screen and (max-width: 575.98px) {
  .features-2__item-wrapper .features-2__item:nth-of-type(even) {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
  }
}
.features-2__item {
  z-index: 2;
  border-radius: 24px;
  border: 1px solid var(--color-white);
  background: var(--color-white);
  box-shadow: 0 20px 30px 0 rgba(var(--color-black-rgb), 0.05);
  padding: 30px;
  height: max-content;
}
.features-2__item .item-bg {
  inset: 0;
  z-index: -1;
  object-fit: fill;
}
.features-2__item .item-thumb {
  margin-bottom: 28px;
  padding-inline: 13px;
}
.features-2__item .item-content .item-title {
  color: #141414;
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.2px;
  margin-bottom: 10px;
}
.features-2__item .item-content p {
  color: #848484;
  font-size: 15px;
  font-weight: 400;
  line-height: 133.333%;
  letter-spacing: -0.9px;
}

.features-3.section {
  z-index: 2;
}
.features-3.section::before {
  width: 913px;
  height: 913px;
  left: 50%;
  top: 50%;
  border-radius: 913px;
  opacity: 0.37;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  filter: blur(301.4128417969px);
  z-index: -1;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.features-3.section .section-header-3 {
  max-width: 1050px;
  margin-inline: auto;
  text-align: center;
}
.features-3.section .section-header-3 .logo {
  width: max-content;
  margin-inline: auto;
  margin-bottom: 65px;
}
@media only screen and (max-width: 767.98px) {
  .features-3.section .section-header-3 .logo {
    margin-bottom: 35px;
  }
}
@media only screen and (max-width: 767.98px) {
  .features-3.section .section-header-3 .logo i,
  .features-3.section .section-header-3 .logo svg {
    width: 80px;
    height: 80px;
  }
}
.features-3.section .section-header-3 p {
  max-width: 784px;
  margin-inline: auto;
  color: rgba(var(--color-white-rgb), 0.75);
  font-size: 18px;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: -0.36px;
}
.features-3__content {
  text-align: center;
  margin-inline: center;
  -webkit-user-drag: none;
  pointer-events: none;
}
.features-3__content > * {
  width: 1646px;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
}

.report-customize.section {
  background-color: var(--bg-color-1);
  z-index: 2;
  overflow: hidden;
}
.report-customize.section .bg-shape {
  right: -5px;
  bottom: -5px;
  z-index: -1;
}
.report-customize__wrapper {
  overflow: hidden;
  border-radius: 30px;
  padding: 8px;
  background: linear-gradient(180deg, rgba(var(--primary-color-rgb), 0.02) 0%, rgba(var(--secondary-color-rgb), 0.02) 48.08%, rgba(var(--third-color-rgb), 0.02) 100%);
}
.report-customize__item {
  border-radius: 24px;
  background: var(--bg-color-2);
  padding: 42px;
  height: 100%;
}
@media only screen and (max-width: 1439.98px) {
  .report-customize__item {
    padding: 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .report-customize__item {
    padding: 20px;
  }
}
.report-customize__item.type-1:has(.item-content) {
  gap: 40px;
}
.report-customize__item.type-1 .item-title {
  color: var(--text-color-main);
  line-height: 107.143%;
  letter-spacing: -1.68px;
}
.report-customize__item.type-1 p {
  color: rgba(var(--text-color-main-rgb), 0.72);
  font-weight: 600;
  margin-top: 20px;
}
.report-customize__item.type-1 .analysis-list {
  margin-top: 22px;
}
.report-customize__item.type-1 .analysis-list ul li {
  gap: 10px;
  color: rgba(var(--text-color-main-rgb), 0.72);
  line-height: 150%;
  font-size: 16px;
  font-weight: 600;
}
.report-customize__item.type-1 .analysis-list ul li:not(:last-of-type) {
  margin-bottom: 8px;
}
.report-customize__item.type-1 .analysis-list ul li i,
.report-customize__item.type-1 .analysis-list ul li svg {
  color: var(--primary-color);
  margin-top: 4px;
}
.report-customize__item.type-3 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
@media only screen and (max-width: 575.98px) {
  .report-customize__item.type-3 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 24px;
  }
}
.report-customize__item.type-3 .activity {
  gap: 30px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 32px;
  padding: 32px;
}
@media only screen and (max-width: 1439.98px) {
  .report-customize__item.type-3 .activity {
    padding: 25px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .report-customize__item.type-3 .activity {
    padding: 20px;
    border-radius: 20px;
  }
}
.report-customize__item.type-3 .activity .activity-header .title {
  color: var(--text-color-main);
  font-weight: 500;
  line-height: 100%;
  letter-spacing: -1.6px;
}
.report-customize__item.type-3 .activity .activity-header .avatars {
  margin-top: 18px;
}
.report-customize__item.type-3 .activity .activity-header .avatars img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
}
.report-customize__item.type-3 .activity .activity-header .avatars img:not(:last-of-type) {
  margin-right: -10px;
}
.report-customize__item.type-3 .activity .progress-wrapper {
  gap: 10px;
}
.report-customize__item.type-3 .activity .progress-wrapper .progress {
  width: 23px;
  height: 118px;
  border-radius: 30px;
}
.report-customize__item.type-3 .activity .progress-wrapper .progress::before {
  content: "";
  left: 0;
  bottom: 0;
  width: 100%;
  border-radius: 30px;
}
.report-customize__item.type-3 .activity .progress-wrapper .progress:nth-of-type(1)::before {
  height: 80.27%;
  background-color: #b1e3ff;
}
.report-customize__item.type-3 .activity .progress-wrapper .progress:nth-of-type(2)::before {
  height: 42.857%;
  background: linear-gradient(180deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
}
.report-customize__item.type-3 .activity .progress-wrapper .progress:nth-of-type(3)::before {
  height: 56.46%;
  background-color: #baedbd;
}
.report-customize__item.type-3 .activity .progress-wrapper .progress:nth-of-type(4)::before {
  height: 42.857%;
  background: linear-gradient(180deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
}
.report-customize__item.type-3 .activity .progress-wrapper .progress:nth-of-type(5)::before {
  height: 56.46%;
  background-color: #b1e3ff;
}
.report-customize__item.type-3 .activity .progress-wrapper .progress:nth-of-type(6)::before {
  height: 70.75%;
  background-color: #baedbd;
}
.report-customize__item.type-3 .activity .progress-wrapper .progress:nth-of-type(7)::before {
  height: 89.8%;
  background: linear-gradient(180deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
}
.report-customize__item.type-3 .activity .progress-wrapper .progress-percentage {
  left: 50%;
  top: 15px;
  border-radius: 31.579px;
  background: var(--bg-color-2);
  color: var(--text-color-main);
  font-size: 15.158px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.303px;
  padding: 7px 16px;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.report-customize__item.type-3 .activity .progress-wrapper .progress-percentage::after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid var(--bg-color-2);
  top: 100%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.report-customize__item.type-3 .profile {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 32px;
  padding: 32px;
  text-align: center;
}
@media only screen and (max-width: 1439.98px) {
  .report-customize__item.type-3 .profile {
    padding: 25px;
  }
}
@media only screen and (max-width: 767.98px) {
  .report-customize__item.type-3 .profile {
    padding: 20px;
  }
}
.report-customize__item.type-3 .profile .avatar {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background-color: #eeeffa;
}
.report-customize__item.type-3 .profile .avatar img {
  width: 75.429px;
  height: 75.429px;
  object-fit: cover;
}
.report-customize__item.type-3 .profile .title {
  color: var(--text-color-main);
  font-weight: 500;
  line-height: 127.386%;
  letter-spacing: -0.84px;
  margin-top: 27px;
}
.report-customize__item.type-3 .profile .designation {
  color: var(--text-color-main);
  font-weight: 500;
  line-height: 119.483%;
  letter-spacing: -1.24px;
  opacity: 0.63;
  margin-top: 6px;
}
@media only screen and (min-width: 992px) {
  .report-customize__item.type-3 .profile .designation {
    font-size: 31px;
  }
}

.reports.section {
  z-index: 2;
}
.reports.section .shape-1 {
  top: 0;
  left: 0;
  height: 100%;
  z-index: -1;
}
@media only screen and (max-width: 767.98px) {
  .reports.section .shape-1 {
    left: -200px;
  }
}
.reports.section .shape-2 {
  top: 50%;
  right: 0;
  height: 100%;
  z-index: -1;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media only screen and (max-width: 1439.98px) {
  .reports.section .shape-2 {
    right: -100px;
  }
}
@media only screen and (max-width: 767.98px) {
  .reports.section .shape-2 {
    right: -200px;
  }
}
.reports__item-wrapper {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  border-radius: 24px;
  z-index: 2;
  padding: 8px;
}
@media only screen and (max-width: 767.98px) {
  .reports__item-wrapper {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
.reports__item-wrapper::before {
  inset: -8px;
  border: 8px solid var(--primary-color);
  filter: blur(24px);
  z-index: -1;
}
.reports__item {
  gap: 50px;
  border-radius: 24px;
  padding: 42px;
  background: var(--bg-color-1);
}
@media only screen and (max-width: 991.98px) {
  .reports__item {
    border-radius: 15px;
    padding: 20px;
    gap: 30px;
  }
}
@media only screen and (max-width: 575.98px) {
  .reports__item {
    padding: 20px 15px;
  }
}
.reports__item .item-thumb {
  border-radius: 23.588px;
  background: var(--bg-color-3);
  padding: 42px;
  min-height: 380px;
}
@media only screen and (max-width: 991.98px) {
  .reports__item .item-thumb {
    padding: 20px;
    border-radius: 15px;
  }
}
@media only screen and (max-width: 575.98px) {
  .reports__item .item-thumb {
    padding: 20px 15px;
    min-height: 300px;
  }
}
.reports__item .item-thumb canvas {
  height: 100%;
}
.reports__item .item-content {
  text-align: center;
  max-width: 410px;
  margin-inline: auto;
}
.reports__item .item-content .title {
  color: var(--text-color-main);
  font-weight: 700;
  line-height: 107.143%;
  letter-spacing: -1.68px;
  margin-bottom: 20px;
}
@media only screen and (max-width: 991.98px) {
  .reports__item .item-content .title {
    margin-bottom: 15px;
  }
}
.reports__item .item-content p {
  color: rgba(var(--text-color-main-rgb), 0.72);
  font-weight: 500;
}

.testimonial__item {
  border-radius: 40px;
  overflow: hidden;
  padding-inline: 60px 40px;
  padding-block-start: 50px;
  user-select: none;
}
@media only screen and (max-width: 991.98px) {
  .testimonial__item {
    padding-inline: 30px;
    padding-block-start: 30px;
  }
}
@media only screen and (max-width: 1699.98px) {
  .testimonial__item .item-thumb {
    max-width: 260px;
  }
}
@media only screen and (max-width: 991.98px) {
  .testimonial__item .item-thumb {
    width: auto;
    display: none;
  }
}
.testimonial__item .item-content {
  row-gap: 120px;
  padding-block-end: 50px;
}
@media only screen and (max-width: 1599.98px) {
  .testimonial__item .item-content {
    row-gap: 40px;
  }
}
.testimonial__item .item-content .item-header .brand {
  margin-bottom: 52px;
}
@media only screen and (max-width: 1599.98px) {
  .testimonial__item .item-content .item-header .brand {
    margin-bottom: 20px;
  }
}
.testimonial__item .item-content .item-header .text {
  font-weight: 600;
  line-height: 135.714%;
  letter-spacing: -0.84px;
}
.testimonial__item .item-content .author-name {
  font-weight: 600;
  line-height: 118.75%;
  letter-spacing: -0.96px;
}
.testimonial__item .item-content .author-designation {
  color: rgba(var(--text-color-main-rgb), 0.6);
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: -0.6px;
}
.testimonial__navigation {
  gap: 16px;
}
@media only screen and (max-width: 767.98px) {
  .testimonial__navigation {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}
.testimonial__navigation .prev-testimonial,
.testimonial__navigation .next-testimonial {
  width: 60px;
  height: 60px;
  flex-shrink: 0;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: rgba(var(--text-color-main-rgb), 0.06);
  font-size: 20px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 991.98px) {
  .testimonial__navigation .prev-testimonial,
  .testimonial__navigation .next-testimonial {
    width: 45px;
    height: 45px;
    font-size: 18px;
  }
}
.testimonial__navigation .prev-testimonial:hover, .testimonial__navigation .prev-testimonial.active,
.testimonial__navigation .next-testimonial:hover,
.testimonial__navigation .next-testimonial.active {
  background-color: var(--text-color-main);
  color: var(--bg-color-2);
}
.testimonial__navigation .slide-counter {
  color: rgba(var(--text-color-main-rgb), 0.8);
  font-size: 28px;
  font-weight: 600;
  line-height: 135.714%;
  letter-spacing: -0.84px;
  width: 80px;
}
@media only screen and (max-width: 991.98px) {
  .testimonial__navigation .slide-counter {
    font-size: 22px;
    width: 65px;
  }
}

.testimonials-2.section {
  z-index: 2;
  overflow: hidden;
}
.testimonials-2.section::before {
  width: 1920px;
  height: 1690px;
  left: 50%;
  top: 50%;
  z-index: -1;
  border-radius: 1920px;
  background: #e7f5ff;
  filter: blur(250px);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.testimonials-2__slider-wrapper {
  z-index: 2;
}
.testimonials-2__slider-wrapper .test-author {
  position: absolute;
  border-radius: 50%;
  overflow: hidden;
  pointer-events: none;
  will-change: transform;
}
.testimonials-2__slider-wrapper .test-author-1 {
  left: -280px;
  bottom: 50%;
  animation: float-1 12s ease-in-out infinite;
  animation-delay: 0s;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1439.98px) {
  .testimonials-2__slider-wrapper .test-author-1 {
    left: -140px;
    bottom: 45%;
  }
}
@media only screen and (max-width: 991.98px) {
  .testimonials-2__slider-wrapper .test-author-1 {
    display: none;
  }
}
.testimonials-2__slider-wrapper .test-author-2 {
  left: -180px;
  top: -10%;
  animation: float-2 14s ease-in-out infinite;
  animation-delay: 0.5s;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1439.98px) {
  .testimonials-2__slider-wrapper .test-author-2 {
    left: -80px;
    top: 10%;
  }
}
@media only screen and (max-width: 991.98px) {
  .testimonials-2__slider-wrapper .test-author-2 {
    display: none;
  }
}
.testimonials-2__slider-wrapper .test-author-3 {
  right: -180px;
  top: -10%;
  animation: float-3 16s ease-in-out infinite;
  animation-delay: 1s;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1439.98px) {
  .testimonials-2__slider-wrapper .test-author-3 {
    right: -80px;
    top: 10%;
  }
}
@media only screen and (max-width: 991.98px) {
  .testimonials-2__slider-wrapper .test-author-3 {
    display: none;
  }
}
.testimonials-2__slider-wrapper .test-author-4 {
  right: -280px;
  bottom: 50%;
  animation: float-4 18s ease-in-out infinite;
  animation-delay: 1.5s;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1439.98px) {
  .testimonials-2__slider-wrapper .test-author-4 {
    right: -150px;
    bottom: 40%;
  }
}
@media only screen and (max-width: 991.98px) {
  .testimonials-2__slider-wrapper .test-author-4 {
    display: none;
  }
}
.testimonials-2__slider {
  max-width: 750px;
  margin-inline: auto;
}
.testimonials-2__item .testimonials-quote {
  color: #040a10;
  text-align: center;
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -1.68px;
  margin-bottom: 66px;
}
.testimonials-2__item .author {
  margin-inline: auto;
  width: max-content;
}
.testimonials-2__item .author .author-thumb {
  width: 95px;
  height: 95px;
  border-radius: 100%;
  margin-inline: auto;
  overflow: hidden;
  margin-bottom: 10px;
}
.testimonials-2__item .author .author-thumb img {
  width: 100%;
  height: 100%;
}
.testimonials-2__item .author .author-name {
  color: #040a10;
  font-size: 20px;
  font-weight: 500;
  line-height: 210%;
  letter-spacing: -1.2px;
  margin-bottom: 0px;
}
.testimonials-2__item .author .author-designation {
  color: rgba(4, 10, 16, 0.8);
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.96px;
}
.testimonials-2__navigation {
  left: 50%;
  bottom: 90px;
  z-index: 1;
  width: 100%;
  pointer-events: none;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.testimonials-2__navigation .prev-testimonial,
.testimonials-2__navigation .next-testimonial {
  width: 56px;
  height: 56px;
  border-radius: 100%;
  background-color: var(--color-white);
  color: var(--color-black);
  pointer-events: auto;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.testimonials-2__navigation .prev-testimonial:hover,
.testimonials-2__navigation .next-testimonial:hover {
  background-color: var(--primary-color-2);
  color: var(--color-white);
}

.testimonial-3__info p {
  color: rgba(var(--color-white-rgb), 0.75);
  font-size: 18px;
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -0.36px;
  opacity: 0.7;
}
.testimonial-3__slider {
  padding-left: 40px;
}
@media only screen and (max-width: 767.98px) {
  .testimonial-3__slider {
    padding-left: 0px;
  }
}
.testimonial-3__item {
  border-radius: 24px;
  border: 1px solid rgba(var(--color-white-rgb), 0.1);
  background: #0f1313;
  padding: 42px 42px 42px 82px;
  z-index: 2;
}
@media only screen and (max-width: 767.98px) {
  .testimonial-3__item {
    padding: 30px;
  }
}
.testimonial-3__item .triangle {
  width: 73px;
  height: 150px;
  top: 50%;
  left: 0;
  color: var(--color-white);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media only screen and (max-width: 767.98px) {
  .testimonial-3__item .triangle {
    display: none;
  }
}
.testimonial-3__item::after {
  width: 100px;
  height: 100px;
  border-radius: 100%;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  opacity: 0.4;
  filter: blur(25px);
  left: -40px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  border-radius: 80px;
  z-index: -1;
}
@media only screen and (max-width: 767.98px) {
  .testimonial-3__item::after {
    display: none;
  }
}
.testimonial-3__item .item-content .item-header {
  margin-bottom: 5px;
}
.testimonial-3__item .item-content .item-header .rating-stars ul {
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.testimonial-3__item .item-content .item-header .rating-stars ul li {
  color: #ffc107;
  font-size: 16px;
}
.testimonial-3__item .item-content .item-header .icon {
  color: var(--color-white);
}
.testimonial-3__item .item-content .item-author {
  margin-bottom: 23px;
}
.testimonial-3__item .item-content .item-author .author-avatar {
  width: 80px;
  height: 80px;
  aspect-ratio: 1/1;
  border: 1px solid rgba(255, 255, 255, 0.4);
  left: -40px;
  top: 50%;
  overflow: hidden;
  border-radius: 100%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media only screen and (max-width: 767.98px) {
  .testimonial-3__item .item-content .item-author .author-avatar {
    display: none;
  }
}
.testimonial-3__item .item-content .item-author .author-title {
  color: var(--color-white);
  font-size: 22px;
  font-weight: 600;
  line-height: 122.727%;
  letter-spacing: -0.44px;
  margin-bottom: 6px;
}
@media only screen and (max-width: 767.98px) {
  .testimonial-3__item .item-content .item-author .author-title {
    font-size: 17px;
  }
}
.testimonial-3__item .item-content .item-author .author-designation {
  color: rgba(var(--color-white-rgb), 0.7);
  font-size: 16px;
  font-weight: 400;
  line-height: 168.75%;
  letter-spacing: -0.32px;
}
.testimonial-3__item .item-content p {
  color: rgba(var(--color-white-rgb), 0.7);
  font-size: 16px;
  font-weight: 400;
  line-height: 168.75%;
  letter-spacing: -0.32px;
}

.faq.section {
  background-color: var(--bg-color-1);
}
.faq.section .section-header p {
  max-width: 391px;
  color: rgba(var(--text-color-main-rgb), 0.72);
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  margin-left: auto;
}
@media only screen and (max-width: 767.98px) {
  .faq.section .section-header p {
    max-width: 100%;
  }
}
.faq__accordion {
  max-width: 1148px;
  margin-inline: auto;
  z-index: 2;
}
.faq__accordion::before {
  inset: 0;
  opacity: 0.15;
  background: var(--text-color-main);
  filter: blur(27px);
  z-index: -1;
  border: 8px solid var(--primary-color);
}
.faq__accordion .accordion-item {
  border-radius: 16px;
  background: var(--bg-color-2);
  border: 1px solid rgba(255, 255, 255, 0.32);
}
.faq__accordion .accordion-item:not(:last-of-type) {
  margin-bottom: 8px;
}
.faq__accordion .accordion-item .accordion-header {
  border-bottom: none;
  overflow: hidden;
  background-color: transparent;
}
.faq__accordion .accordion-item .accordion-header .accordion-button {
  background-color: transparent;
  transition-delay: 0.5s;
  font: inherit;
  color: var(--text-color-main);
  padding: 28px 32px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.faq__accordion .accordion-item .accordion-header .accordion-button::after {
  display: inline-grid;
  place-content: center;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  background-image: unset;
  font: var(--fa-font-thin);
  content: "\f056";
  transform-origin: center center;
  width: 28px;
  height: 28px;
  line-height: 0;
}
@media only screen and (max-width: 767.98px) {
  .faq__accordion .accordion-item .accordion-header .accordion-button {
    padding: 20px 25px;
  }
}
.faq__accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
  color: var(--text-color-main);
  box-shadow: none;
  border-bottom: none;
  padding: 28px 32px 18px 32px;
}
@media only screen and (max-width: 767.98px) {
  .faq__accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
    padding: 20px 25px 15px 25px;
  }
}
.faq__accordion .accordion-item .accordion-header .accordion-button.collapsed {
  border-radius: 16px;
}
.faq__accordion .accordion-item .accordion-header .accordion-button.collapsed::after {
  content: "\f055";
}
.faq__accordion .accordion-item .accordion-header .accordion-button:focus, .faq__accordion .accordion-item .accordion-header .accordion-button:active, .faq__accordion .accordion-item .accordion-header .accordion-button:hover {
  box-shadow: none;
}
.faq__accordion .accordion-item .accordion-body {
  color: rgba(var(--text-color-main-rgb), 0.72);
  font-size: 18px;
  font-weight: 500;
  line-height: 133.333%;
  padding: 28px 32px;
  padding-top: 0px;
  max-width: 90%;
}
@media only screen and (max-width: 767.98px) {
  .faq__accordion .accordion-item .accordion-body {
    padding: 20px 25px;
    padding-top: 0px;
  }
}
.faq__accordion .accordion-item .accordion-collapse {
  border: none;
}

.faq-2.section .section-header-2.left {
  max-width: 510px;
}
.faq-2.section .section-header-2.right p {
  color: #797979;
  font-weight: 500;
  line-height: 141.946%;
  max-width: 435px;
}
.faq-2__accordion .accordion-item {
  border: none;
  border-radius: 16px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.faq-2__accordion .accordion-item:not(:last-of-type) {
  margin-bottom: 16px;
}
.faq-2__accordion .accordion-item:not(:last-of-type):has(.accordion-button:not(.collapsed)) {
  margin-bottom: 24px;
}
.faq-2__accordion .accordion-item:has(.accordion-button:not(.collapsed)) {
    border: 1px solid rgb(154 127 255);
    background: #dcebff8c;
}
.faq-2__accordion .accordion-item .accordion-header {
  overflow: hidden;
  color: var(--bg-color-2);
  font-size: 18px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.08px;
}
.faq-2__accordion .accordion-item .accordion-header .accordion-button {
  gap: 20px;
  border-radius: 16px;
  font: inherit;
  padding: 12px 20px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.faq-2__accordion .accordion-item .accordion-header .accordion-button::after {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 7' fill='none'><path d='M12.5 0.750047C12.5 0.750047 8.44934 6.25 7 6.25C5.55057 6.25 1.5 0.75 1.5 0.75' stroke='%23040A10' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-position: center;
}
@media only screen and (max-width: 991.98px) {
  .faq-2__accordion .accordion-item .accordion-header .accordion-button {
    padding: 20px;
  }
}
.faq-2__accordion .accordion-item .accordion-header .accordion-button.collapsed {
  border-radius: 16px;
  border: 1px solid rgba(var(--color-black-rgb), 0.04);
  background: #f5fbff;
}
.faq-2__accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
  background: transparent;
  box-shadow: none;
  padding-bottom: 14px;
  color: inherit;
}
@media only screen and (max-width: 991.98px) {
  .faq-2__accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
    padding-bottom: 10px;
  }
}
.faq-2__accordion .accordion-item .accordion-header .accordion-button:focus, .faq-2__accordion .accordion-item .accordion-header .accordion-button:active, .faq-2__accordion .accordion-item .accordion-header .accordion-button:focus-visible {
  box-shadow: none;
}
.faq-2__accordion .accordion-collapse .accordion-body {
  padding: 29px 32px;
  padding-top: 0;
  color: #373737;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 159.689%;
  opacity: 0.6;
}
@media only screen and (max-width: 991.98px) {
  .faq-2__accordion .accordion-collapse .accordion-body {
    padding: 20px;
    padding-top: 0;
  }
}
.faq-2__content {
  width: 100%;
  border-radius: 32px;
  overflow: hidden;
  padding: 42px;
  z-index: 2;
  gap: 30px;
}
@media only screen and (max-width: 575.98px) {
  .faq-2__content {
    padding: 25px 20px;
    gap: 20px;
  }
}
.faq-2__content::before {
  z-index: -1;
  width: 482px;
  height: 482px;
  border-radius: 50%;
  background: rgba(188, 232, 255, 0.64);
  filter: blur(110px);
  top: -132px;
  left: -156px;
}
.faq-2__content::after {
  z-index: -1;
  width: 418px;
  height: 418px;
  border-radius: 418px;
  opacity: 0.6;
  background: #b9affe;
  filter: blur(110px);
  top: 48px;
  left: 170px;
}
.faq-2__content .content-header .title {
  color: var(--color-black);
  font-size: 24px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.44px;
  margin-bottom: 10px;
}
.faq-2__content .content-header p {
  color: #373737;
  font-size: 15px;
  font-weight: 400;
  line-height: 157.333%;
  letter-spacing: -0.45px;
  opacity: 0.6;
}
.faq-2__content .content-body {
  margin-top: 20px;
}

.faq-3.section {
  z-index: 2;
  background: #0a0808;
}
.faq-3.section .bg-shape {
  z-index: -1;
  top: 150px;
  left: 100px;
  animation: updown-float 3s ease-in-out infinite;
  transform-origin: center center;
}
@media only screen and (max-width: 991.98px) {
  .faq-3.section .bg-shape {
    display: none;
  }
}
.faq-3__bg-shape {
  z-index: -1;
  top: -100px;
  left: -10px;
  width: 655px;
  height: 655px;
  border-radius: 654px;
  opacity: 0.27;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  filter: blur(301.4128417969px);
}
.faq-3__accordion .accordion-item {
  border-radius: 0;
  background-color: transparent;
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.11);
}
.faq-3__accordion .accordion-item:first-of-type > .accordion-header .accordion-button {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.faq-3__accordion .accordion-item:last-of-type > .accordion-collapse {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.faq-3__accordion .accordion-item .accordion-header {
  font-family: "Urbanist", sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: -0.4px;
  color: #c1c1c1;
}
.faq-3__accordion .accordion-item .accordion-header .accordion-button {
  background-color: transparent;
  box-shadow: none;
  font: inherit;
  color: inherit;
  padding-block: 24px;
  padding-inline: 0px;
  gap: 15px;
}
.faq-3__accordion .accordion-item .accordion-header .accordion-button::after {
  content: "\f055";
  font: var(--fa-font-light);
  background: unset;
}
.faq-3__accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
  background-color: transparent;
  box-shadow: none;
  color: var(--color-white);
  padding-block-end: 14px;
}
.faq-3__accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
  content: "\f056";
}
.faq-3__accordion .accordion-item .accordion-body {
  color: rgba(255, 255, 255, 0.7);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: -0.32px;
  padding-block: 24px;
  padding-block-start: 0px;
  padding-inline: 0px;
  padding-inline-end: 24px;
}

.pricing__btn-content {
  z-index: 2;
  width: max-content;
  gap: 20px;
}
@media only screen and (max-width: 575.98px) {
  .pricing__btn-content {
    flex-direction: column-reverse;
  }
}
.pricing__btn-content p {
  max-width: 195px;
  text-align: left;
  font-size: 20.69px;
  font-weight: 500;
  line-height: 108.333%;
  letter-spacing: -0.414px;
  opacity: 0.8;
}
.pricing__btn-content .save {
  gap: 10px;
  z-index: -1;
  left: 26px;
  top: calc(100% + 12px);
}
.pricing__btn-content .save span {
  font-size: 20.69px;
  font-weight: 700;
  line-height: 108.333%;
  letter-spacing: -0.414px;
}
.pricing__btn-content .save svg:nth-last-of-type(1) {
  margin-top: -10px;
  -webkit-transform: translate(-10px, -18px) rotate(-19deg);
  -ms-transform: translate(-10px, -18px) rotate(-19deg);
  transform: translate(-10px, -18px) rotate(-19deg);
}
.pricing__btn-wrapper {
  z-index: 2;
  margin-inline: auto;
}
.pricing__btn-wrapper .price-btn {
  border-radius: 48.276px;
  border: 0.862px solid rgba(var(--text-color-main-rgb), 0.32);
  background-color: transparent;
  color: var(--text-color-main);
  font-size: 20.69px;
  font-weight: 500;
  line-height: 108.333%;
  letter-spacing: -0.414px;
  padding: 15.5px 27px;
}
.pricing__btn-wrapper .price-btn.active {
  background-color: #ffa4e7;
  border-color: #ffa4e7;
  color: var(--bg-color-2);
}
.pricing__item-wrapper {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}
@media only screen and (max-width: 1439.98px) {
  .pricing__item-wrapper {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media only screen and (max-width: 1199.98px) {
  .pricing__item-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media only screen and (max-width: 767.98px) {
  .pricing__item-wrapper {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
.pricing__item {
  border-radius: 32px;
  border: 1px solid rgba(var(--text-color-main-rgb), 0.12);
  background: var(--bg-color-2);
  padding: 32px;
  transition: all 0.8s ease-in-out;
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out;
  -ms-transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 575.98px) {
  .pricing__item {
    padding: 25px;
  }
}
.pricing__item .pricing-header .plan-type {
  font-weight: 700;
  line-height: 108.333%;
  letter-spacing: -0.48px;
  margin-bottom: 25px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing__item .pricing-header .plan-info {
  gap: 16px;
}
.pricing__item .pricing-header .plan-info .price {
  border-radius: 12px;
  background: rgba(var(--text-color-main-rgb), 0.08);
  font-weight: 700;
  line-height: 107.143%;
  letter-spacing: -1.68px;
  padding: 10px 20px;
  font-size: 42px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1199.98px) {
  .pricing__item .pricing-header .plan-info .price {
    font-size: 32px;
  }
}
@media only screen and (max-width: 991.98px) {
  .pricing__item .pricing-header .plan-info .price {
    font-size: 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .pricing__item .pricing-header .plan-info .price {
    font-size: 27px;
  }
}
@media only screen and (max-width: 575.98px) {
  .pricing__item .pricing-header .plan-info .price {
    font-size: 24px;
  }
}
.pricing__item .pricing-header .plan-info .period {
  font-size: 18px;
  font-weight: 600;
  line-height: 144.444%;
  letter-spacing: -0.36px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing__item .pricing-body {
  padding-block: 40px;
}
.pricing__item .pricing-body ul li {
  gap: 8px;
  color: var(--text-color-main);
  opacity: 0.72;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing__item .pricing-body ul li:not(:last-of-type) {
  margin-bottom: 20px;
}
.pricing__item .pricing-body ul li i,
.pricing__item .pricing-body ul li svg {
  margin-top: 2px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing__item .pricing-footer .saving-info {
  font-weight: 600;
  line-height: 144.444%;
  letter-spacing: -0.36px;
  margin-top: 15px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing__item:hover {
  animation: hoverSkew 0.5s ease-in-out;
}
.pricing__item:hover, .pricing__item.active {
  border-color: var(--primary-color);
  background-color: var(--text-color-main);
}
.pricing__item:hover .pricing-header .plan-type, .pricing__item.active .pricing-header .plan-type {
  color: var(--bg-color-2);
}
.pricing__item:hover .pricing-header .plan-info .price, .pricing__item.active .pricing-header .plan-info .price {
  background: rgba(83, 83, 83, 0.08);
  color: var(--bg-color-2);
}
.pricing__item:hover .pricing-header .plan-info .period, .pricing__item.active .pricing-header .plan-info .period {
  color: var(--bg-color-2);
}
.pricing__item:hover .pricing-body ul li, .pricing__item.active .pricing-body ul li {
  color: var(--bg-color-2);
  opacity: 0.6;
}
.pricing__item:hover .pricing-footer .saving-info, .pricing__item.active .pricing-footer .saving-info {
  color: var(--bg-color-2);
}

.pricing-2.section {
  z-index: 2;
  overflow: hidden;
}
.pricing-2.section .shape-1 {
  bottom: -295px;
  left: 157px;
  width: 593px;
  height: 593px;
  border-radius: 593px;
  opacity: 0.7;
  background: rgba(188, 232, 255, 0.5);
  filter: blur(110px);
  z-index: -2;
}
.pricing-2.section .shape-2 {
  bottom: -352px;
  right: 148px;
  width: 705px;
  height: 705px;
  border-radius: 705px;
  opacity: 0.7;
  background: rgba(185, 175, 254, 0.6);
  filter: blur(110px);
  z-index: -1;
}
.pricing-2.section .shape-3 {
  top: 100px;
  right: 0;
  z-index: -1;
}
@media only screen and (max-width: 767.98px) {
  .pricing-2.section .section-header-2 .section-title .icon img {
    max-width: 75%;
  }
}
.pricing-2__btn-wrapper {
  position: relative;
  display: inline-flex;
  border: 1px solid rgba(var(--color-black-rgb), 0.12);
  border-radius: 45.845px;
  min-width: 150px;
  max-width: max-content;
  width: 100%;
  gap: 10px;
  background: var(--color-white);
  padding: 7.5px;
}
@media only screen and (max-width: 767.98px) {
  .pricing-2__btn-wrapper {
    display: flex;
    margin-inline: auto;
  }
}
.pricing-2__btn-wrapper label {
  padding: 6px 17px;
  text-align: center;
  cursor: pointer;
  white-space: nowrap;
  user-select: none;
  border-radius: 6px;
  color: rgba(var(--color-black-rgb), 0.6);
  font-size: 14px;
  font-weight: 500;
  line-height: 167.335%;
  letter-spacing: -0.7px;
  z-index: 1;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-2__btn-wrapper .highlighter {
  top: 7.5px;
  left: 0;
  height: calc(100% - 15px);
  border-radius: 36.676px;
  background: #4642fc;
  z-index: 0;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-2__btn-wrapper #monthly:checked ~ label[for=monthly] {
  color: #fff;
}
.pricing-2__btn-wrapper #yearly:checked ~ label[for=yearly] {
  color: #fff;
}
.pricing-2__item {
  margin: 4px;
  padding: 42px;
  border-radius: 32px;
  background: var(--color-white);
  box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.1);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1439.98px) {
  .pricing-2__item {
    padding: 25px;
  }
}
.pricing-2__item::before {
  inset: -2px;
  border-radius: 34px;
  background: linear-gradient(180deg, #4642fc -159.4%, #fff 47.24%);
  z-index: -1;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-2__item::after {
  inset: 0px;
  border-radius: 32px;
  background: var(--color-white);
  z-index: -1;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-2__item .item-bg {
  top: 150px;
  left: 0;
  width: 100%;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-2__item .item-body {
  margin: 1px;
  border: 1px solid transparent;
  padding: 42px;
  border-radius: 32px;
  background: var(--color-white);
  z-index: 1;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1439.98px) {
  .pricing-2__item .item-body {
    padding: 25px;
  }
}
@media only screen and (max-width: 575.98px) {
  .pricing-2__item .item-body {
    padding: 15px 10px;
  }
}
.pricing-2__item .item-body::after {
  inset: -2px;
  border-radius: 34px;
  background: linear-gradient(180deg, rgba(70, 66, 252, 0.25) 0%, rgba(255, 255, 255, 0.6) 100%);
  z-index: -2;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-2__item .item-body::before {
  inset: -1px;
  border-radius: 32px;
  background: var(--color-white);
  z-index: -1;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-2__item .item-body .featcher-list {
  margin-bottom: 38px;
}
.pricing-2__item .item-body .featcher-list ul li {
  gap: 10px;
  color: rgba(var(--color-black-rgb), 0.6);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: -1.08px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-2__item .item-body .featcher-list ul li:not(:last-of-type) {
  margin-bottom: 22px;
}
.pricing-2__item .item-body .button-wrapper a {
  border: 1px solid #d8c6ff;
  background-color: transparent;
  color: var(--color-black);
}
.pricing-2__item .item-header {
  margin-bottom: 48px;
  text-align: center;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1439.98px) {
  .pricing-2__item .item-header {
    margin-bottom: 30px;
  }
}
.pricing-2__item .item-header .item-icon {
  margin-inline: auto;
  width: 92px;
  height: 60.024px;
  border-radius: 32px;
  color: #9391ff;
  background: #f3f3ff;
  border: 3px solid #dfdeff;
  margin-bottom: 28px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1439.98px) {
  .pricing-2__item .item-header .item-icon {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 575.98px) {
  .pricing-2__item .item-header .item-icon {
    width: 80px;
    height: 50px;
  }
}
.pricing-2__item .item-header .item-info {
  margin-bottom: 28px;
}
@media only screen and (max-width: 1439.98px) {
  .pricing-2__item .item-header .item-info {
    margin-bottom: 20px;
  }
}
.pricing-2__item .item-header .item-info .item-title {
  color: var(--color-black);
  font-size: 26px;
  font-weight: 500;
  line-height: 98.27%;
  letter-spacing: -1.56px;
  margin-bottom: 14px;
}
.pricing-2__item .item-header .item-info p {
  color: #848484;
  font-size: 15px;
  font-weight: 400;
  line-height: 146.667%;
  letter-spacing: -0.9px;
}
.pricing-2__item .item-header .item-price .plan-price {
  gap: 8px;
}
.pricing-2__item .item-header .item-price .plan-price .price {
  color: var(--color-black);
  font-weight: 600;
  line-height: 52.381%;
  letter-spacing: -2.52px;
}
.pricing-2__item .item-header .item-price .plan-price .period {
  color: #848484;
  font-size: 15px;
  font-weight: 500;
  line-height: 146.667%;
  letter-spacing: -0.9px;
}
.pricing-2__item:hover, .pricing-2__item.active {
  border-color: rgba(70, 66, 252, 0.45);
  box-shadow: 0px 0px 40px rgba(70, 66, 252, 0.1);
  background-color: transparent;
}
.pricing-2__item:hover::before, .pricing-2__item.active::before {
  border-radius: 32px;
}
.pricing-2__item:hover::after, .pricing-2__item.active::after {
  background-color: transparent;
}
.pricing-2__item:hover .item-bg, .pricing-2__item.active .item-bg {
  opacity: 1;
}
.pricing-2__item:hover .item-header .item-icon, .pricing-2__item.active .item-header .item-icon {
  color: #4642fc;
  background: var(--color-white);
}
.pricing-2__item:hover .item-body, .pricing-2__item.active .item-body {
  border-color: rgba(70, 66, 252, 0.45);
  transform: scale(1);
}
.pricing-2__item:hover .item-body::before, .pricing-2__item.active .item-body::before {
  transform: scale(0.99);
}
.pricing-2__item:hover .item-body::after, .pricing-2__item.active .item-body::after {
  transform: scale(0.97);
}
.pricing-2__item:hover .item-body .button-wrapper a, .pricing-2__item.active .item-body .button-wrapper a {
  border-color: var(--color-white);
  background-color: var(--primary-color-2);
  color: var(--color-white);
}

.pricing-3.section {
  z-index: 2;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(70, 66, 252, 0.075) 0%, rgba(173, 187, 254, 0.075) 100%);
  backdrop-filter: blur(301.4128417969px);
}
.pricing-3.section .circle-bg {
  width: 913px;
  height: 913px;
  border-radius: 913px;
  opacity: 0.24;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  filter: blur(301.4128417969px);
  right: -170px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: -1;
}
.pricing-3__btns {
  gap: 22px;
}
.pricing-3__btns .buttons {
  gap: 20px;
  height: max-content;
  border-radius: 48px;
  border: 1px solid rgba(var(--color-white-rgb), 0.08);
  backdrop-filter: blur(2px);
  padding: 7px 8px;
  gap: 21px;
}
.pricing-3__btns .btn-border {
  width: 2px;
  height: 20px;
  background-color: #424242;
}
.pricing-3__item {
  gap: 30px;
  padding: 32px;
  border-radius: 52px;
  border: 1px solid rgba(var(--color-white-rgb), 0.11);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 575.98px) {
  .pricing-3__item {
    border-radius: 30px;
    padding: 25px;
  }
}
.pricing-3__item .item-header {
  border-radius: 24px;
  border: 1px solid rgba(var(--color-white-rgb), 0.1);
  background: rgba(var(--color-white-rgb), 0.1);
  backdrop-filter: blur(50px);
  padding-inline: 32px;
  padding-block: 20px;
  z-index: 2;
  overflow: hidden;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 575.98px) {
  .pricing-3__item .item-header {
    border-radius: 20px;
    padding-inline: 25px;
    padding-block: 15px;
  }
}
.pricing-3__item .item-header::before {
  width: 226px;
  height: 226px;
  border-radius: 100%;
  background: #527af4;
  z-index: -1;
  opacity: 0;
  filter: blur(40px);
  top: 90px;
  left: 0;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pricing-3__item .item-header .header-inner {
  gap: 20px;
  border-bottom: 1px solid rgba(var(--color-white-rgb), 0.16);
  margin-block-end: 14px;
}
.pricing-3__item .item-header .header-inner .header-info .plan-title {
  color: rgba(var(--color-white-rgb), 0.8);
  font-size: 18px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.54px;
}
@media only screen and (max-width: 991.98px) {
  .pricing-3__item .item-header .header-inner .header-info .plan-title {
    font-size: 14px;
  }
}
.pricing-3__item .item-header .header-inner .header-info .plan-price {
  gap: 5px;
  font-size: 40px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.8px;
  padding-block: 10px 14px;
}
@media only screen and (max-width: 1199.98px) {
  .pricing-3__item .item-header .header-inner .header-info .plan-price {
    font-size: 30px;
  }
}
@media only screen and (max-width: 991.98px) {
  .pricing-3__item .item-header .header-inner .header-info .plan-price {
    font-size: 28px;
  }
}
@media only screen and (max-width: 767.98px) {
  .pricing-3__item .item-header .header-inner .header-info .plan-price {
    font-size: 25px;
  }
}
@media only screen and (max-width: 575.98px) {
  .pricing-3__item .item-header .header-inner .header-info .plan-price {
    font-size: 22px;
  }
}
.pricing-3__item .item-header .header-inner .header-info .plan-price span {
  color: rgba(var(--color-white-rgb), 0.5);
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.32px;
}
.pricing-3__item .item-header .header-inner .icon {
  width: 60px;
  height: 60px;
  border-radius: 100%;
  overflow: hidden;
  background-color: rgba(var(--color-white-rgb), 0.05);
}
@media only screen and (max-width: 991.98px) {
  .pricing-3__item .item-header .header-inner .icon {
    width: 50px;
    height: 50px;
  }
  .pricing-3__item .item-header .header-inner .icon i,
  .pricing-3__item .item-header .header-inner .icon svg {
    width: 80%;
    margin-inline: auto;
  }
}
.pricing-3__item .item-header p {
  color: rgba(var(--color-white-rgb), 0.8);
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.42px;
}
.pricing-3__item .item-body .item-features ul {
  gap: 32px;
}
.pricing-3__item .item-body .item-features ul li {
  gap: 12px;
  color: rgba(var(--color-white-rgb), 0.6);
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -1.08px;
}
.pricing-3__item .item-body .item-features ul li i,
.pricing-3__item .item-body .item-features ul li svg {
  color: #6a48ed;
}
.pricing-3__item .item-footer a {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background-color: transparent;
}
.pricing-3__item.active .item-header {
  border-color: rgba(var(--color-white-rgb), 0.4);
  background: rgba(15, 19, 19, 0.7);
}
.pricing-3__item.active .item-header::before {
  opacity: 0.34;
}
.pricing-3__item.active .item-footer a::before {
  opacity: 1;
}

.blog__item-wrapper {
  border-radius: 30px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
  z-index: 2;
  overflow: hidden;
}
@media only screen and (max-width: 991.98px) {
  .blog__item-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media only screen and (max-width: 767.98px) {
  .blog__item-wrapper {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    border-radius: 20px;
  }
}
.blog__item-wrapper::before {
  z-index: -1;
  inset: 0;
  opacity: 0.08;
  background: linear-gradient(180deg, var(--primary-color) 0%, var(--secondary-color) 48.08%, var(--third-color) 100%);
}
.blog__item .blog-thumb {
  border-radius: 24px;
  overflow: hidden;
}
@media only screen and (max-width: 767.98px) {
  .blog__item .blog-thumb {
    border-radius: 15px;
  }
}
.blog__item .blog-content {
  padding: 24px;
}
@media only screen and (max-width: 767.98px) {
  .blog__item .blog-content {
    padding: 20px 15px;
  }
}
.blog__item .blog-content .meta {
  margin-bottom: 24px;
}
.blog__item .blog-content .meta ul {
  gap: 16px;
}
.blog__item .blog-content .meta ul li .category,
.blog__item .blog-content .meta ul li .date {
  color: var(--text-color-main);
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  line-height: 128.571%;
  letter-spacing: -0.56px;
  padding: 6.5px 14px;
}
.blog__item .blog-content .meta ul li .category {
  border-radius: 40px;
  background: rgba(var(--text-color-main-rgb), 0.16);
}
.blog__item .blog-content .blog-title {
  color: var(--text-color-main);
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -1.2px;
}
.blog__item .blog-content p {
  color: var(--text-color-main);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 137.5%;
  letter-spacing: -0.32px;
  opacity: 0.72;
  margin-top: 12px;
  margin-bottom: 25px;
}
@media only screen and (max-width: 767.98px) {
  .blog__item .blog-content p {
    margin-top: 8px;
    margin-bottom: 20px;
  }
}
.blog__item.v2 {
  overflow: hidden;
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(var(--primary-color-rgb), 0.08) 0%, rgba(var(--secondary-color-rgb), 0.08) 48.08%, rgba(var(--third-color-rgb), 0.08) 100%);
}
@media only screen and (max-width: 767.98px) {
  .blog__item.v2 {
    border-radius: 20px;
  }
}

.blog-3.section {
  z-index: 2;
}
.blog-3.section .bg-shape {
  z-index: 1;
  bottom: 0;
  left: 0;
}
@media only screen and (max-width: 767.98px) {
  .blog-3.section .bg-shape {
    display: none;
  }
}
.blog-3.section .section-header-3 a {
  margin-top: 70px;
}
.blog-3__item .item-thumb {
  border-radius: 15px;
  overflow: hidden;
}
.blog-3__item .item-content {
  padding-inline: 24px;
  padding-block-start: 24px;
}
@media only screen and (max-width: 1199.98px) {
  .blog-3__item .item-content {
    padding: 20px 10px 0 10px;
  }
}
@media only screen and (max-width: 991.98px) {
  .blog-3__item .item-content {
    padding-inline: 24px;
    padding-block-start: 24px;
  }
}
.blog-3__item .item-content .item-tags {
  gap: 16px;
  margin-bottom: 20px;
}
.blog-3__item .item-content .item-tags span {
  color: rgba(var(--color-white-rgb), 0.72);
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.3px;
  padding: 8px 18px;
  border-radius: 50px;
  border: 1px solid rgba(var(--color-white-rgb), 0.1);
}
.blog-3__item .item-content .item-title {
  color: var(--color-white);
  font-style: normal;
  line-height: normal;
  letter-spacing: -0.48px;
  margin-bottom: 20px;
}
.blog-3__item .item-content .item-title a {
  color: inherit;
  font: inherit;
}
.blog-3__item .item-content p {
  color: rgba(var(--color-white-rgb), 0.75);
  font-size: 14px;
  font-weight: 500;
  line-height: 164.286%;
  letter-spacing: -0.28px;
  opacity: 0.7;
  margin-bottom: 20px;
}

.blog-details.section {
  background: var(--bg-color-2);
}
.blog-details__wrapper .blog-details p {
  color: #a1a0a3;
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 177.778%;
  letter-spacing: -0.72px;
  opacity: 1;
}
.blog-details__wrapper .blog-details .thumbnail {
  border-radius: 32px;
  overflow: hidden;
  margin-block: 50px;
}
.blog-details__wrapper .blog-details .sub-section {
  margin-top: 60px;
  margin-bottom: 60px;
}
.blog-details__wrapper .blog-details .sub-section h4.title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: -1.6px;
  margin-bottom: 22px;
}
.blog-details__wrapper .blog-details .sub-section h3.title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 123.81%;
  letter-spacing: -2.1px;
  margin-bottom: 22px;
  max-width: 820px;
}
.blog-details__wrapper .blog-details .info-section {
  gap: 40px;
  margin-bottom: 40px;
}
@media only screen and (max-width: 767.98px) {
  .blog-details__wrapper .blog-details .info-section {
    flex-direction: column;
    gap: 25px;
  }
}
.blog-details__wrapper .blog-details .info-section .info-item {
  gap: 25px;
}
.blog-details__wrapper .blog-details .info-section .info-item .info-icon {
  width: 66px;
  height: 66px;
  border-radius: 100%;
  overflow: hidden;
  background-color: rgba(var(--color-white-rgb), 0.08);
}
.blog-details__wrapper .blog-details .info-section .info-item .info-content .info-title {
  margin-bottom: 14px;
}
.blog-details__wrapper .blog-details .paragraph-group p {
  margin-bottom: 22px;
}
.blog-details__wrapper .tags-and-share {
  gap: 25px;
  border-radius: 10px;
  border: 2px solid rgba(217, 217, 217, 0.23);
  padding: 40px;
}
@media only screen and (max-width: 1199.98px) {
  .blog-details__wrapper .tags-and-share {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding: 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .blog-details__wrapper .tags-and-share {
    align-items: center;
    gap: 10px;
    padding: 25px;
  }
}
.blog-details__wrapper .tags-and-share .tags {
  gap: 24px;
}
@media only screen and (max-width: 767.98px) {
  .blog-details__wrapper .tags-and-share .tags {
    gap: 15px;
  }
}
.blog-details__wrapper .tags-and-share .tags .tag-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -1.2px;
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .tags-and-share .tags .tag-title {
    font-size: 16px;
  }
}
.blog-details__wrapper .tags-and-share .tags .tags-list {
  gap: 16px;
}
@media only screen and (max-width: 767.98px) {
  .blog-details__wrapper .tags-and-share .tags .tags-list {
    gap: 10px;
  }
}
.blog-details__wrapper .tags-and-share .tags .tags-list li {
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.56px;
  width: max-content;
  padding: 14px 20px;
  border-radius: 40px;
  background: rgba(var(--color-white-rgb), 0.16);
}
@media only screen and (max-width: 991.98px) {
  .blog-details__wrapper .tags-and-share .tags .tags-list li {
    padding: 10px 16px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .tags-and-share .tags .tags-list li {
    padding: 8px 12px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .blog-details__wrapper .tags-and-share .share-group {
    width: 100%;
  }
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share {
  gap: 24px;
}
@media only screen and (max-width: 1199.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share {
    justify-content: space-between;
    gap: 20px;
  }
}
@media only screen and (max-width: 767.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share {
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share .post {
  gap: 24px;
}
@media only screen and (max-width: 767.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share .post {
    gap: 15px;
  }
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -1.2px;
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-title {
    font-size: 16px;
  }
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-list {
  gap: 16px;
}
@media only screen and (max-width: 767.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-list {
    gap: 10px;
  }
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-list li {
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.56px;
  width: max-content;
  padding: 14px 20px;
  border-radius: 40px;
  background: rgba(var(--color-white-rgb), 0.16);
}
@media only screen and (max-width: 991.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-list li {
    padding: 10px 16px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share .post .post-list li {
    padding: 8px 12px;
  }
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share .share {
  gap: 24px;
}
@media only screen and (max-width: 767.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share .share {
    gap: 15px;
  }
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -1.2px;
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-title {
    font-size: 16px;
  }
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-list {
  flex-shrink: 0;
  gap: 10px;
}
.blog-details__wrapper .tags-and-share .share-group .post-and-share .share .share-list li a {
  width: 30px;
  height: 30px;
  border-radius: 100%;
  overflow: hidden;
  background-color: var(--color-white);
  color: #383838;
  font-size: 12px;
}
.blog-details__wrapper .recent-comments .title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -1.2px;
  margin-bottom: 32px;
}
.blog-details__wrapper .recent-comments__wrapper {
  gap: 24px;
  margin-bottom: 30px;
}
@media only screen and (max-width: 991.98px) {
  .blog-details__wrapper .recent-comments__wrapper {
    flex-direction: column;
    gap: 20px;
  }
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item {
  border-radius: 24px;
  background: #0c0d0d;
  padding: 32px;
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .recent-comments__wrapper .recent-comments-item {
    padding: 20px;
  }
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post {
  margin-bottom: 20px;
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author {
  gap: 16px;
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-thumb {
  width: 60px;
  height: 60px;
  border-radius: 100%;
  overflow: hidden;
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-thumb {
    width: 45px;
    height: 45px;
  }
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-info .author-name {
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 177.778%;
  letter-spacing: -0.9px;
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-info .author-name {
    line-height: 1.1;
    font-size: 16px;
  }
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-info .author-designation {
  color: rgba(var(--color-white-rgb), 0.64);
  font-family: "Urbanist", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 228.571%;
  letter-spacing: -0.7px;
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .author .author-info .author-designation {
    font-size: 12px;
  }
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .post-info .post-time,
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .post-info .post-date {
  color: rgba(var(--color-white-rgb), 0.64);
  text-align: right;
  font-family: "Urbanist", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 228.571%;
  letter-spacing: -0.7px;
}
@media only screen and (max-width: 575.98px) {
  .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .post-info .post-time,
  .blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .author-post .post-info .post-date {
    font-size: 12px;
    line-height: 2;
  }
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-header .stars {
  gap: 6px;
  color: #ffab00;
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-body {
  padding-block: 20px 30px;
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-body p {
  color: rgba(var(--color-white-rgb), 0.64);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 162.5%;
  letter-spacing: -0.8px;
  opacity: 1;
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer {
  gap: 40px;
}
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer .like-btn,
.blog-details__wrapper .recent-comments__wrapper .recent-comments-item .item-footer .reply-btn {
  gap: 8px;
  color: rgba(var(--color-white-rgb), 0.64);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 162.5%;
  letter-spacing: -0.8px;
}
.blog-details__wrapper .write-comment .title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -1.2px;
  margin-bottom: 32px;
}
.blog-details__wrapper .write-comment .comment-form .input-group .form-label {
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 155.556%;
  letter-spacing: -0.72px;
  margin-bottom: 13px;
}
.blog-details__wrapper .write-comment .comment-form .input-group input,
.blog-details__wrapper .write-comment .comment-form .input-group textarea {
  width: 100% !important;
  border-radius: 10px !important;
  margin: 0 !important;
  border: 1px solid rgba(var(--color-white-rgb), 0.2);
  color: rgba(var(--color-white-rgb), 0.62);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 175%;
  letter-spacing: -0.64px;
  padding: 15px 24px;
  background-color: transparent;
}
.blog-details__wrapper .write-comment .comment-form .input-group input::placeholder,
.blog-details__wrapper .write-comment .comment-form .input-group textarea::placeholder {
  color: rgba(var(--color-white-rgb), 0.62);
  opacity: 1;
}
.blog-details__wrapper .write-comment .comment-form .button-area {
  margin-top: 50px;
}

.cta__content-wrapper {
  border-radius: 42px;
  border: 2px solid rgba(var(--primary-color-rgb), 0.5);
  background: var(--bg-color-2);
  overflow: hidden;
  padding: 120px;
}
@media only screen and (max-width: 991.98px) {
  .cta__content-wrapper {
    padding: 60px;
  }
}
@media only screen and (max-width: 767.98px) {
  .cta__content-wrapper {
    padding: 40px;
  }
}
@media only screen and (max-width: 575.98px) {
  .cta__content-wrapper {
    padding: 30px;
  }
}
.cta__content .section-title {
  max-width: 782px;
  margin-inline: auto;
}
.cta__content p {
  max-width: 508px;
  margin-inline: auto;
  font-size: 20px;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: -0.8px;
  opacity: 0.69;
  margin-top: 12px;
  margin-bottom: 32px;
}
@media only screen and (max-width: 767.98px) {
  .cta__content p {
    font-size: 16px;
    margin-bottom: 22px;
  }
}

.cta-2.section {position: relative;
}
.cta-2.section:before{
content: "";
bottom: 0;z-index: -1;
width: 100%;
height: 50%;
  position: absolute;
  background-color: #5a5afc;
}
.cta-2__wrapper {
  border-radius: 42px;
  background: linear-gradient(270deg, #b1e4ff 0.38%, #f8f7ff 132.43%);
  padding-inline: 80px;
  padding-block-start: 70px;
  overflow: hidden;
}
@media only screen and (max-width: 1199.98px) {
  .cta-2__wrapper {
    padding-inline: 50px;
    padding-block-start: 40px;
  }
}
@media only screen and (max-width: 991.98px) {
  .cta-2__wrapper {
    padding-inline: 40px;
    padding-block-start: 30px;
  }
}
@media only screen and (max-width: 575.98px) {
  .cta-2__wrapper {
    padding-inline: 30px;
  }
}
.cta-2__content {
  padding-block-end: 70px;
  height: 100%;
  gap: 30px;
}
@media only screen and (max-width: 1199.98px) {
  .cta-2__content {
    padding-block-end: 40px;
    padding-inline-end: 40px;
  }
}
@media only screen and (max-width: 991.98px) {
  .cta-2__content {
    padding-block-end: 30px;
    padding-inline-end: 0px;
  }
}
.cta-2__content .section-header-2 p {
  max-width: 537px;
  color: rgba(4, 10, 16, 0.5);
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
}
.cta-2__content .buttons {
  gap: 16px;
}
@media only screen and (max-width: 991.98px) {
  .cta-2__content .buttons {
    flex-direction: column;
  }
  .cta-2__content .buttons a {
    width: 100%;
  }
}
.cta-2__thumb {
  padding-inline: 10px;
  padding-block-start: 10px;
  border-radius: 56px 56px 0 0;
  border: 0.5px solid rgba(245, 251, 255, 0.4);
  backdrop-filter: blur(5.808218956px);
  margin-bottom: -3px;
  margin-right: 60px;
}
@media only screen and (max-width: 1199.98px) {
  .cta-2__thumb {
    margin-right: 20px;
  }
}
@media only screen and (max-width: 991.98px) {
  .cta-2__thumb {
    margin-right: 0px;
    padding-inline: 5px;
    padding-block-start: 5px;
  }
}
@media only screen and (max-width: 991.98px) {
  .cta-2__thumb .star-one,
  .cta-2__thumb .star-two {
    display: none;
  }
}
.cta-2__thumb .star-one {
  top: 90px;
  left: -70px;
  color: var(--color-white);
  animation: spin 7s infinite linear;
}
.cta-2__thumb .star-two {
  bottom: 73px;
  right: -53px;
  color: var(--primary-color-2);
  animation: spin 7s infinite linear reverse;
}
.cta-2__thumb .thumb-wrapper {
  background-color: var(--color-white);
  padding-inline: 10px;
  padding-block-start: 10px;
  border-radius: 46px 46px 0 0;
  backdrop-filter: blur(5.808218956px);
  overflow: hidden;
}
@media only screen and (max-width: 991.98px) {
  .cta-2__thumb .thumb-wrapper {
    padding-inline: 5px;
    padding-block-start: 5px;
  }
}
.cta-2__thumb .thumb-wrapper img {
  border-radius: 41px 41px 0 0;
  background-color: #000;
}

.cta-3.section {
  z-index: 2;
  background: #0a0808;
  overflow: hidden;
}
.cta-3.section .circle-1 {
  z-index: -1;
  width: 634px;
  height: 634px;
  left: 50px;
  bottom: -255px;
  border-radius: 634px;
  opacity: 0.53;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  filter: blur(301.4128417969px);
}
.cta-3.section .circle-2 {
  z-index: -2;
  width: 520px;
  height: 519px;
  top: -115px;
  right: -80px;
  border-radius: 520px;
  opacity: 0.24;
  background: #ef3e41;
  filter: blur(226.0596313477px);
}
.cta-3.section .box-1 {
  z-index: -1;
  left: 145px;
  bottom: 50px;
  animation: updown-float 3s ease-in-out infinite;
}
@media only screen and (max-width: 1439.98px) {
  .cta-3.section .box-1 {
    max-width: 5%;
  }
}
@media only screen and (max-width: 991.98px) {
  .cta-3.section .box-1 {
    display: none;
  }
}
.cta-3.section .box-2 {
  z-index: -2;
  right: 125px;
  top: 50%;
  animation: updown-float 8s ease-in-out infinite;
}
@media only screen and (max-width: 1439.98px) {
  .cta-3.section .box-2 {
    max-width: 5%;
  }
}
@media only screen and (max-width: 991.98px) {
  .cta-3.section .box-2 {
    display: none;
  }
}
.cta-3.section .doll-1 {
  z-index: -1;
  left: 12%;
  top: 30%;
  animation: updown-float 5s ease-in-out infinite;
}
@media only screen and (max-width: 1439.98px) {
  .cta-3.section .doll-1 {
    left: 5%;
    max-width: 10%;
  }
}
@media only screen and (max-width: 991.98px) {
  .cta-3.section .doll-1 {
    display: none;
  }
}
.cta-3.section .doll-2 {
  z-index: -1;
  right: 12%;
  top: 30%;
  animation: updown-float 3s ease-in-out infinite;
}
@media only screen and (max-width: 1439.98px) {
  .cta-3.section .doll-2 {
    right: 5%;
    max-width: 15%;
  }
}
@media only screen and (max-width: 991.98px) {
  .cta-3.section .doll-2 {
    display: none;
  }
}
.cta-3__content {
  text-align: center;
  max-width: 752px;
  margin-inline: auto;
}
.cta-3__content .buttons {
  gap: 24px;
  margin: 45px;
}
@media only screen and (max-width: 575.98px) {
  .cta-3__content .buttons {
    flex-direction: column;
    gap: 15px;
  }
  .cta-3__content .buttons a {
    width: 100%;
  }
}
.cta-3__content .features-list ul {
  gap: 15px;
}
@media only screen and (max-width: 767.98px) {
  .cta-3__content .features-list ul {
    flex-direction: column;
  }
}
.cta-3__content .features-list ul li {
  gap: 12px;
  color: var(--color-white);
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -1.08px;
}
@media only screen and (max-width: 991.98px) {
  .cta-3__content .features-list ul li {
    font-size: 16px;
  }
}

.brand.section {
  border-top: 1px solid rgba(70, 66, 252, 0.11);
}
.brand__slider .swiper-slide {
  width: auto;
}

.brand-3__content .brand-title {
  gap: 60px;
  font-weight: 600;
  line-height: 112.5%;
  letter-spacing: -0.48px;
}
@media only screen and (max-width: 1199.98px) {
  .brand-3__content .brand-title {
    gap: 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .brand-3__content .brand-title {
    gap: 15px;
  }
}
.brand-3__content .brand-title .line {
  width: 100%;
  height: 1px;
  background-color: rgba(var(--color-white-rgb), 0.22);
}
.brand-3__item {
  width: 200px;
  height: 110px;
  aspect-ratio: 204/113;
  border-radius: 12px;
  border: 1px solid rgba(var(--color-white-rgb), 0.1);
  background: #0f1313;
  overflow: hidden;
  user-select: none;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.brand-3__item::after {
  width: 162px;
  height: 162px;
  border-radius: 50%;
  opacity: 0.14;
  background: #527af4;
  filter: blur(40px);
}
.brand-3__item img {
  opacity: 0.6;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.brand-3__item:hover {
  border-color: rgba(var(--color-white-rgb), 0.3);
}
.brand-3__item:hover img {
  opacity: 1;
}
.brand-3__slider .swiper-slide {
  width: auto;
}

.integration.section {
  overflow: hidden;
}
.integration.section .section-header-2 {
  max-width: 652px;
}
.integration__content {
  z-index: 5;
}
.integration__content .ellipse-1,
.integration__content .ellipse-2 {
  width: 784px;
  height: 784px;
  border-radius: 100%;
  pointer-events: none;
}
@media only screen and (max-width: 767.98px) {
  .integration__content .ellipse-1,
  .integration__content .ellipse-2 {
    opacity: 0.3 !important;
  }
}
.integration__content .ellipse-1 {
  top: -160px;
  left: -200px;
  border-radius: 50%;
  opacity: 0.5;
  background: #bce8ff;
  filter: blur(110px);
  z-index: -4;
}
.integration__content .ellipse-2 {
  right: -68px;
  bottom: 20px;
  border-radius: 50%;
  opacity: 0.7;
  background: #b9affe;
  filter: blur(110px);
  z-index: -5;
}
.integration__content .circle-one {
  width: 849px;
  height: 849px;
  border-radius: 100%;
  border: 2px solid rgba(0, 0, 0, 0.03);
  backdrop-filter: blur(12px);
  z-index: 10;
  pointer-events: none;
}
@media only screen and (max-width: 1439.98px) {
  .integration__content .circle-one {
    width: 720px;
    height: 720px;
  }
}
@media only screen and (max-width: 991.98px) {
  .integration__content .circle-one {
    width: 600px;
    height: 600px;
  }
}
@media only screen and (max-width: 767.98px) {
  .integration__content .circle-one {
    width: 450px;
    height: 450px;
  }
}
@media only screen and (max-width: 575.98px) {
  .integration__content .circle-one {
    width: 270px;
    height: 270px;
  }
}
.integration__content .circle-one .circle-one-inset {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  animation: circle-rotate 20s linear infinite;
  -webkit-animation: circle-rotate 20s linear infinite;
}
.integration__content .circle-one .circle-one-inset .icon-block {
  width: 100px;
  height: 100px;
  aspect-ratio: 1/1;
  background-color: var(--color-white);
  border-radius: 50%;
  z-index: 10;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
}
.integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(1) {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(0deg) translate(0, -424.5px) rotate(0deg);
  -ms-transform: translate(-50%, -50%) rotate(0deg) translate(0, -424.5px) rotate(0deg);
  transform: translate(-50%, -50%) rotate(0deg) translate(0, -424.5px) rotate(0deg);
}
.integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(2) {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(45deg) translate(0, -424.5px) rotate(-45deg);
  -ms-transform: translate(-50%, -50%) rotate(45deg) translate(0, -424.5px) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(45deg) translate(0, -424.5px) rotate(-45deg);
}
.integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(3) {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(90deg) translate(0, -424.5px) rotate(-90deg);
  -ms-transform: translate(-50%, -50%) rotate(90deg) translate(0, -424.5px) rotate(-90deg);
  transform: translate(-50%, -50%) rotate(90deg) translate(0, -424.5px) rotate(-90deg);
}
.integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(4) {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(135deg) translate(0, -424.5px) rotate(-135deg);
  -ms-transform: translate(-50%, -50%) rotate(135deg) translate(0, -424.5px) rotate(-135deg);
  transform: translate(-50%, -50%) rotate(135deg) translate(0, -424.5px) rotate(-135deg);
}
.integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(5) {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(180deg) translate(0, -424.5px) rotate(-180deg);
  -ms-transform: translate(-50%, -50%) rotate(180deg) translate(0, -424.5px) rotate(-180deg);
  transform: translate(-50%, -50%) rotate(180deg) translate(0, -424.5px) rotate(-180deg);
}
.integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(6) {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(225deg) translate(0, -424.5px) rotate(-225deg);
  -ms-transform: translate(-50%, -50%) rotate(225deg) translate(0, -424.5px) rotate(-225deg);
  transform: translate(-50%, -50%) rotate(225deg) translate(0, -424.5px) rotate(-225deg);
}
.integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(7) {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(270deg) translate(0, -424.5px) rotate(-270deg);
  -ms-transform: translate(-50%, -50%) rotate(270deg) translate(0, -424.5px) rotate(-270deg);
  transform: translate(-50%, -50%) rotate(270deg) translate(0, -424.5px) rotate(-270deg);
}
.integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(8) {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(315deg) translate(0, -424.5px) rotate(-315deg);
  -ms-transform: translate(-50%, -50%) rotate(315deg) translate(0, -424.5px) rotate(-315deg);
  transform: translate(-50%, -50%) rotate(315deg) translate(0, -424.5px) rotate(-315deg);
}
@media only screen and (max-width: 1439.98px) {
  .integration__content .circle-one .circle-one-inset .icon-block {
    width: 70px;
    height: 70px;
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(1) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(0deg) translate(0, -360px) rotate(0deg);
    -ms-transform: translate(-50%, -50%) rotate(0deg) translate(0, -360px) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg) translate(0, -360px) rotate(0deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(2) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(45deg) translate(0, -360px) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg) translate(0, -360px) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(45deg) translate(0, -360px) rotate(-45deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(3) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(90deg) translate(0, -360px) rotate(-90deg);
    -ms-transform: translate(-50%, -50%) rotate(90deg) translate(0, -360px) rotate(-90deg);
    transform: translate(-50%, -50%) rotate(90deg) translate(0, -360px) rotate(-90deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(4) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(135deg) translate(0, -360px) rotate(-135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg) translate(0, -360px) rotate(-135deg);
    transform: translate(-50%, -50%) rotate(135deg) translate(0, -360px) rotate(-135deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(5) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(180deg) translate(0, -360px) rotate(-180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg) translate(0, -360px) rotate(-180deg);
    transform: translate(-50%, -50%) rotate(180deg) translate(0, -360px) rotate(-180deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(6) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(225deg) translate(0, -360px) rotate(-225deg);
    -ms-transform: translate(-50%, -50%) rotate(225deg) translate(0, -360px) rotate(-225deg);
    transform: translate(-50%, -50%) rotate(225deg) translate(0, -360px) rotate(-225deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(7) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(270deg) translate(0, -360px) rotate(-270deg);
    -ms-transform: translate(-50%, -50%) rotate(270deg) translate(0, -360px) rotate(-270deg);
    transform: translate(-50%, -50%) rotate(270deg) translate(0, -360px) rotate(-270deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(8) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(315deg) translate(0, -360px) rotate(-315deg);
    -ms-transform: translate(-50%, -50%) rotate(315deg) translate(0, -360px) rotate(-315deg);
    transform: translate(-50%, -50%) rotate(315deg) translate(0, -360px) rotate(-315deg);
  }
}
@media only screen and (max-width: 991.98px) {
  .integration__content .circle-one .circle-one-inset .icon-block {
    width: 70px;
    height: 70px;
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(1) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(0deg) translate(0, -300px) rotate(0deg);
    -ms-transform: translate(-50%, -50%) rotate(0deg) translate(0, -300px) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg) translate(0, -300px) rotate(0deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(2) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(45deg) translate(0, -300px) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg) translate(0, -300px) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(45deg) translate(0, -300px) rotate(-45deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(3) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(90deg) translate(0, -300px) rotate(-90deg);
    -ms-transform: translate(-50%, -50%) rotate(90deg) translate(0, -300px) rotate(-90deg);
    transform: translate(-50%, -50%) rotate(90deg) translate(0, -300px) rotate(-90deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(4) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(135deg) translate(0, -300px) rotate(-135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg) translate(0, -300px) rotate(-135deg);
    transform: translate(-50%, -50%) rotate(135deg) translate(0, -300px) rotate(-135deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(5) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(180deg) translate(0, -300px) rotate(-180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg) translate(0, -300px) rotate(-180deg);
    transform: translate(-50%, -50%) rotate(180deg) translate(0, -300px) rotate(-180deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(6) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(225deg) translate(0, -300px) rotate(-225deg);
    -ms-transform: translate(-50%, -50%) rotate(225deg) translate(0, -300px) rotate(-225deg);
    transform: translate(-50%, -50%) rotate(225deg) translate(0, -300px) rotate(-225deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(7) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(270deg) translate(0, -300px) rotate(-270deg);
    -ms-transform: translate(-50%, -50%) rotate(270deg) translate(0, -300px) rotate(-270deg);
    transform: translate(-50%, -50%) rotate(270deg) translate(0, -300px) rotate(-270deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(8) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(315deg) translate(0, -300px) rotate(-315deg);
    -ms-transform: translate(-50%, -50%) rotate(315deg) translate(0, -300px) rotate(-315deg);
    transform: translate(-50%, -50%) rotate(315deg) translate(0, -300px) rotate(-315deg);
  }
}
@media only screen and (max-width: 767.98px) {
  .integration__content .circle-one .circle-one-inset .icon-block {
    width: 40px;
    height: 40px;
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(1) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(0deg) translate(0, -225px) rotate(0deg);
    -ms-transform: translate(-50%, -50%) rotate(0deg) translate(0, -225px) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg) translate(0, -225px) rotate(0deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(2) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(45deg) translate(0, -225px) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg) translate(0, -225px) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(45deg) translate(0, -225px) rotate(-45deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(3) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(90deg) translate(0, -225px) rotate(-90deg);
    -ms-transform: translate(-50%, -50%) rotate(90deg) translate(0, -225px) rotate(-90deg);
    transform: translate(-50%, -50%) rotate(90deg) translate(0, -225px) rotate(-90deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(4) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(135deg) translate(0, -225px) rotate(-135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg) translate(0, -225px) rotate(-135deg);
    transform: translate(-50%, -50%) rotate(135deg) translate(0, -225px) rotate(-135deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(5) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(180deg) translate(0, -225px) rotate(-180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg) translate(0, -225px) rotate(-180deg);
    transform: translate(-50%, -50%) rotate(180deg) translate(0, -225px) rotate(-180deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(6) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(225deg) translate(0, -225px) rotate(-225deg);
    -ms-transform: translate(-50%, -50%) rotate(225deg) translate(0, -225px) rotate(-225deg);
    transform: translate(-50%, -50%) rotate(225deg) translate(0, -225px) rotate(-225deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(7) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(270deg) translate(0, -225px) rotate(-270deg);
    -ms-transform: translate(-50%, -50%) rotate(270deg) translate(0, -225px) rotate(-270deg);
    transform: translate(-50%, -50%) rotate(270deg) translate(0, -225px) rotate(-270deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(8) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(315deg) translate(0, -225px) rotate(-315deg);
    -ms-transform: translate(-50%, -50%) rotate(315deg) translate(0, -225px) rotate(-315deg);
    transform: translate(-50%, -50%) rotate(315deg) translate(0, -225px) rotate(-315deg);
  }
}
@media only screen and (max-width: 575.98px) {
  .integration__content .circle-one .circle-one-inset .icon-block {
    width: 35px;
    height: 35px;
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(1) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(0deg) translate(0, -135px) rotate(0deg);
    -ms-transform: translate(-50%, -50%) rotate(0deg) translate(0, -135px) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg) translate(0, -135px) rotate(0deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(2) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(45deg) translate(0, -135px) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg) translate(0, -135px) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(45deg) translate(0, -135px) rotate(-45deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(3) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(90deg) translate(0, -135px) rotate(-90deg);
    -ms-transform: translate(-50%, -50%) rotate(90deg) translate(0, -135px) rotate(-90deg);
    transform: translate(-50%, -50%) rotate(90deg) translate(0, -135px) rotate(-90deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(4) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(135deg) translate(0, -135px) rotate(-135deg);
    -ms-transform: translate(-50%, -50%) rotate(135deg) translate(0, -135px) rotate(-135deg);
    transform: translate(-50%, -50%) rotate(135deg) translate(0, -135px) rotate(-135deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(5) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(180deg) translate(0, -135px) rotate(-180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg) translate(0, -135px) rotate(-180deg);
    transform: translate(-50%, -50%) rotate(180deg) translate(0, -135px) rotate(-180deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(6) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(225deg) translate(0, -135px) rotate(-225deg);
    -ms-transform: translate(-50%, -50%) rotate(225deg) translate(0, -135px) rotate(-225deg);
    transform: translate(-50%, -50%) rotate(225deg) translate(0, -135px) rotate(-225deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(7) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(270deg) translate(0, -135px) rotate(-270deg);
    -ms-transform: translate(-50%, -50%) rotate(270deg) translate(0, -135px) rotate(-270deg);
    transform: translate(-50%, -50%) rotate(270deg) translate(0, -135px) rotate(-270deg);
  }
  .integration__content .circle-one .circle-one-inset .icon-block:nth-of-type(8) {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(315deg) translate(0, -135px) rotate(-315deg);
    -ms-transform: translate(-50%, -50%) rotate(315deg) translate(0, -135px) rotate(-315deg);
    transform: translate(-50%, -50%) rotate(315deg) translate(0, -135px) rotate(-315deg);
  }
}
.integration__content .circle-one .circle-one-inset .icon-block:hover {
  background-color: var(--secondary-color);
  backdrop-filter: blur(5px);
}
.integration__content .circle-one .circle-one-inset .icon-block img {
  animation: img-rotate 20s linear infinite;
  -webkit-animation: img-rotate 20s linear infinite;
  margin-inline: auto;
}
@media only screen and (max-width: 1439.98px) {
  .integration__content .circle-one .circle-one-inset .icon-block img {
    max-width: 60%;
  }
}
@media only screen and (max-width: 767.98px) {
  .integration__content .circle-one .circle-one-inset .icon-block img {
    max-width: 40%;
  }
}
.integration__content .circle-one .circle-two {
  width: 622px;
  height: 622px;
  border-radius: 100%;
  border: 3px solid rgba(var(--color-white-rgb), 0.3);
  backdrop-filter: blur(12px);
  background: rgba(var(--color-white-rgb), 0.32);
}
@media only screen and (max-width: 1439.98px) {
  .integration__content .circle-one .circle-two {
    width: 570px;
    height: 570px;
  }
}
@media only screen and (max-width: 991.98px) {
  .integration__content .circle-one .circle-two {
    width: 470px;
    height: 470px;
  }
}
@media only screen and (max-width: 767.98px) {
  .integration__content .circle-one .circle-two {
    width: 370px;
    height: 370px;
  }
}
@media only screen and (max-width: 575.98px) {
  .integration__content .circle-one .circle-two {
    width: 220px;
    height: 220px;
  }
}
.integration__content .circle-one .circle-two .circle-three {
  width: 520px;
  height: 520px;
  border-radius: 100%;
  border: 3px solid rgba(var(--color-white-rgb), 0.3);
  backdrop-filter: blur(12px);
  background: rgba(var(--color-white-rgb), 0.32);
}
@media only screen and (max-width: 1439.98px) {
  .integration__content .circle-one .circle-two .circle-three {
    width: 480px;
    height: 480px;
  }
}
@media only screen and (max-width: 991.98px) {
  .integration__content .circle-one .circle-two .circle-three {
    width: 380px;
    height: 380px;
  }
}
@media only screen and (max-width: 767.98px) {
  .integration__content .circle-one .circle-two .circle-three {
    width: 280px;
    height: 280px;
  }
}
@media only screen and (max-width: 575.98px) {
  .integration__content .circle-one .circle-two .circle-three {
    width: 180px;
    height: 180px;
  }
}
.integration__content .circle-one .circle-two .circle-three .circle-four {
  width: 408px;
  height: 408px;
  border-radius: 100%;
  border: 3px solid rgba(var(--color-white-rgb), 0.3);
  backdrop-filter: blur(12px);
  background: rgba(var(--color-white-rgb), 0.32);
}
@media only screen and (max-width: 1439.98px) {
  .integration__content .circle-one .circle-two .circle-three .circle-four {
    width: 350px;
    height: 350px;
  }
}
@media only screen and (max-width: 991.98px) {
  .integration__content .circle-one .circle-two .circle-three .circle-four {
    width: 250px;
    height: 250px;
  }
}
@media only screen and (max-width: 767.98px) {
  .integration__content .circle-one .circle-two .circle-three .circle-four {
    width: 200px;
    height: 200px;
  }
}
@media only screen and (max-width: 575.98px) {
  .integration__content .circle-one .circle-two .circle-three .circle-four {
    width: 150px;
    height: 150px;
  }
}
.integration__content .main-logo {
  color: #4642fc;
}
@media only screen and (max-width: 991.98px) {
  .integration__content .main-logo svg {
    width: 120px;
    height: 120px;
  }
}
@media only screen and (max-width: 767.98px) {
  .integration__content .main-logo svg {
    width: 100px;
    height: 100px;
  }
}
@media only screen and (max-width: 575.98px) {
  .integration__content .main-logo svg {
    width: 80px;
    height: 80px;
  }
}
.integration__content .main-logo svg stop:last-child {
  stop-color: #adbbfe;
}

.workflow.section {
  overflow: hidden;
  background: #5a5afc;
}
.workflow.section .section-header-2 .shape {
  right: calc(100% - 80px);
  top: -110px;
}
@media only screen and (max-width: 991.98px) {
  .workflow.section .section-header-2 .shape {
    display: none;
  }
}
.workflow.section .section-header-2 .section-sub-title {
  color: var(--color-white);
}
.workflow.section .section-header-2 .section-sub-title::before {
  background-color: var(--color-white);
}
.workflow.section .section-header-2 .section-title {
  color: var(--color-white);
}
.workflow.section .section-header-2 p {
  color: rgba(var(--color-white-rgb), 0.78);
  opacity: 0.9;
}
.workflow__content {
  margin-top: 120px;
}
@media only screen and (max-width: 991.98px) {
  .workflow__content {
    margin-top: 40px;
  }
}
.workflow__content .title {
  color: var(--color-white);
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.44px;
  margin-bottom: 14px;
}
.workflow__content p {
  color: var(--color-white);
  color: rgba(var(--color-white-rgb), 0.78);
  font-size: 15px;
  font-weight: 500;
  line-height: 146.667%;
  opacity: 0.9;
}
.workflow__info {
  border-radius: 47px;
  border: 1px solid rgba(var(--color-white-rgb), 0.24);
  background: rgba(var(--color-white-rgb), 0.06);
  backdrop-filter: blur(5.5px);
  padding: 54px 64px;
  max-width: 575px;
  width: 100%;
  margin-left: auto;
}
@media only screen and (max-width: 991.98px) {
  .workflow__info {
    max-width: 100%;
  }
}
@media only screen and (max-width: 1199.98px) {
  .workflow__info {
    padding: 30px;
  }
}
@media only screen and (max-width: 575.98px) {
  .workflow__info {
    padding: 25px;
  }
}
.workflow__info .info-item {
  gap: 32px;
}
@media only screen and (max-width: 1199.98px) {
  .workflow__info .info-item {
    gap: 20px;
  }
}
.workflow__info .info-item:not(:last-of-type) {
  margin-bottom: 40px;
}
@media only screen and (max-width: 1199.98px) {
  .workflow__info .info-item:not(:last-of-type) {
    margin-bottom: 20px;
  }
}
.workflow__info .info-item .icon {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  background: rgba(var(--color-white-rgb), 0.12);
  border-radius: 100%;
  color: var(--color-white);
}
@media only screen and (max-width: 575.98px) {
  .workflow__info .info-item .icon {
    width: 35px;
    height: 35px;
  }
  .workflow__info .info-item .icon i,
  .workflow__info .info-item .icon svg {
    width: 15px;
    height: 15px;
  }
}
.workflow__info .info-item .info .title {
  color: var(--color-white);
  font-weight: 600;
  line-height: 175%;
  letter-spacing: -1.44px;
  margin-bottom: 2px;
}
@media only screen and (max-width: 575.98px) {
  .workflow__info .info-item .info .title {
    line-height: 125%;
  }
}
.workflow__info .info-item .info p {
  color: rgba(var(--color-white-rgb), 0.78);
  font-size: 15px;
  font-weight: 500;
  line-height: 146.667%;
  opacity: 0.9;
}

.benefits.section {
  z-index: 2;
}
.benefits.section .benefits-shape {
  top: 178px;
  left: 38px;
  color: var(--primary-color-2);
  z-index: -1;
}
@media only screen and (max-width: 991.98px) {
  .benefits.section .benefits-shape {
    top: 80px;
    left: 10px;
  }
}
@media only screen and (max-width: 575.98px) {
  .benefits.section .benefits-shape {
    display: none;
  }
}
.benefits.section .benefits-shape .animated-path {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
}
.benefits.section .benefits-shape .animate-on-view {
  animation: draw 3s ease-in-out forwards;
}
@media only screen and (min-width: 992px) {
  .benefits .benefits__item-row > [class*=col-]:nth-child(even) .benefits__item {
    margin-top: 60px;
  }
}
.benefits__item {
  border-radius: 24px;
  border: 1px solid #e2e2ff;
  background: var(--color-white);
  padding: 32px;
  overflow: hidden;
  z-index: 2;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1199.98px) {
  .benefits__item {
    padding: 20px;
  }
}
.benefits__item .item-bg {
  inset: 0;
  z-index: -1;
}
.benefits__item .item-bg img {
  object-fit: fill;
  width: 100%;
  height: 100%;
}
.benefits__item .item-icon {
  width: 76px;
  height: 76px;
  flex-shrink: 0;
  border: 1px solid #eaeaff;
  border-radius: 50%;
  padding: 15px;
  margin-bottom: 25px;
  color: var(--color-black);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1199.98px) {
  .benefits__item .item-icon {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767.98px) {
  .benefits__item .item-icon {
    margin-bottom: 50px;
  }
}
.benefits__item .item-content .title {
  color: #141414;
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.2px;
  margin-bottom: 10px;
}
.benefits__item .item-content p {
  color: #848484;
  font-size: 15px;
  font-weight: 400;
  line-height: 133.333%;
  letter-spacing: -0.9px;
  max-width: 200px;
}
@media only screen and (max-width: 767.98px) {
  .benefits__item .item-content p {
    max-width: 100%;
  }
}
.benefits__item:hover {
  background-color: #e2e2ff;
}
.benefits__item:hover .item-icon {
  background-color: var(--primary-color-2);
  border-color: var(--primary-color-2);
  color: var(--color-white);
}

.work__item {
  border-radius: 46px;
  border: 1px solid rgba(var(--primary-color-2-rgb), 0.1);
  background: rgba(var(--color-black-rgb), 0.02);
  padding: 25px;
  height: 100%;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 575.98px) {
  .work__item {
    border-radius: 20px;
    padding-inline: 10px;
    padding-block: 10px 20px;
  }
}
.work__item .item-inner {
  margin-bottom: 22px;
  border-radius: 24px;
  border: 1px solid rgba(var(--color-black-rgb), 0.07);
  background: var(--color-white);
  box-shadow: 0 14px 26px 0 rgba(var(--color-black-rgb), 0.04);
  padding: 24px;
  height: 100%;
}
@media only screen and (max-width: 575.98px) {
  .work__item .item-inner {
    border-radius: 20px;
    padding: 20px;
  }
}
.work__item .signup-form {
  user-select: none;
}
.work__item .signup-form .input-group {
  border-radius: 40px;
  background: #f5f5f8;
  padding: 12px 18px;
  gap: 12px;
}
.work__item .signup-form .input-group .input-group-text {
  border: none;
  background-color: transparent;
  padding: 0;
  color: #8f8f8f;
}
.work__item .signup-form .input-group .form-control {
  background-color: transparent;
  border: none;
  color: #141414;
  font-size: 14px;
  font-weight: 500;
  line-height: 171.429%;
  letter-spacing: -0.84px;
  padding: 0;
  cursor: context-menu;
  pointer-events: none;
}
.work__item .signup-form .input-group .form-control::placeholder {
  color: #8f8f8f;
  opacity: 1;
}
.work__item .signup-form .input-group .form-control:focus, .work__item .signup-form .input-group .form-control:focus-visible {
  box-shadow: none;
}
.work__item .signup-form .input-group:not(:last-of-type) {
  margin-bottom: 12px;
}
.work__item .signup-form .btn-submit {
  width: 100%;
  border: none;
  background-color: var(--primary-color);
  color: var(--color-white);
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.96px;
  border-radius: 40px;
  background: #131823;
  padding: 16px;
  cursor: context-menu;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.work__item .work-flow {
  width: 100%;
  height: 100%;
}
.work__item .work-flow img,
.work__item .work-flow svg {
  width: 100%;
  height: 100%;
}
.work__item .user-area .user-item {
  gap: 10px;
  border-radius: 12px;
  border: 1px solid rgba(var(--color-black-rgb), 0.04);
  background: #f5f5f8;
  padding: 24px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.work__item .user-area .user-item:not(:last-of-type) {
  margin-bottom: 18px;
}
.work__item .user-area .user-item .user-icon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--color-white);
  color: #8f8f8f;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.work__item .user-area .user-item .user-icon i,
.work__item .user-area .user-item .user-icon svg {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.work__item .user-area .user-item .user-info .user-title {
  color: #8f8f8f;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.84px;
  margin-bottom: 8px;
}
.work__item .user-area .user-item .user-info p {
  color: #8f8f8f;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.84px;
}
.work__item .user-area .user-item:hover {
  border-color: rgba(var(--primary-color-2-rgb), 0.32);
}
.work__item .user-area .user-item:hover .user-icon {
  background-color: rgba(var(--primary-color-2-rgb), 0.32);
  color: var(--color-white);
}
.work__item .user-area .user-item:hover .user-icon i,
.work__item .user-area .user-item:hover .user-icon svg {
  color: var(--color-white);
}
.work__item .item-content {
  text-align: center;
}
.work__item .item-content .title {
  font-size: 24px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -1.44px;
  margin-bottom: 14px;
}
.work__item .item-content p {
  color: #848484;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: -0.96px;
  max-width: 280px;
  margin-inline: auto;
}
.work__item:hover {
  border-color: rgba(var(--primary-color-2-rgb), 0.32);
}

.process.section {
  counter-reset: process-counter;
}
.process__item {
  text-align: center;
  gap: 60px;
}
@media only screen and (max-width: 767.98px) {
  .process__item {
    gap: 50px;
  }
}
.process__item .item-icon {
  width: 155px;
  height: 155px;
  border-radius: 100%;
  background-color: #f1f2ff;
  color: var(--color-black-2);
  margin-block-start: 24px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1199.98px) {
  .process__item .item-icon {
    width: 140px;
    height: 140px;
  }
}
@media only screen and (max-width: 767.98px) {
  .process__item .item-icon {
    width: 120px;
    height: 120px;
  }
}
.process__item .item-icon::after {
  inset: -24px;
  background-color: transparent;
  z-index: -2;
  border-radius: 100%;
  border: 2px solid rgba(var(--color-white-rgb), 0.13);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.process__item .item-icon::before {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  top: -24px;
  right: -24px;
  counter-increment: process-counter;
  content: counter(process-counter, decimal-leading-zero);
  background-color: #716eff;
  color: var(--color-white);
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.4px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 1199.98px) {
  .process__item .item-icon::before {
    width: 40px;
    height: 40px;
    top: -20px;
    right: -20px;
    font-size: 18px;
  }
}
@media only screen and (max-width: 767.98px) {
  .process__item .item-icon::before {
    width: 35px;
    height: 35px;
    top: -18px;
    right: -18px;
    font-size: 16px;
  }
}
.process__item .item-content .item-title {
  line-height: normal;
  letter-spacing: -0.48px;
  margin-bottom: 10px;
}
.process__item .item-content p {
  color: rgba(var(--color-white-rgb), 0.75);
  font-size: 16px;
  font-weight: 500;
  line-height: 168.75%;
  letter-spacing: -0.32px;
}
.process__item:hover .item-icon {
  color: #716eff;
}
.process__item:hover .item-icon::after {
  background-color: rgba(112, 110, 255, 0.25);
  border-color: #716eff;
}

.awesome-features.section {
  background-color: #0a0808;
}
.awesome-features__content {
  padding-inline: 65px;
}
@media only screen and (max-width: 1199.98px) {
  .awesome-features__content {
    padding-inline: 0px;
  }
}
@media only screen and (max-width: 767.98px) {
  .awesome-features__content {
    gap: 35px;
  }
}
.awesome-features__content .divider-line {
  width: 1px;
  height: 100%;
  opacity: 0.24;
  background: #d9d9d9;
}
.awesome-features__content .item-row {
  grid-template-columns: 1fr 1px 1fr;
  gap: 65px;
}
@media only screen and (max-width: 1199.98px) {
  .awesome-features__content .item-row {
    gap: 40px;
  }
}
@media only screen and (max-width: 767.98px) {
  .awesome-features__content .item-row {
    grid-template-columns: 1fr;
    gap: 15px;
  }
}
.awesome-features__content .item-row:last-of-type .awesome-features__item {
  padding-bottom: 65px;
}
@media only screen and (max-width: 1199.98px) {
  .awesome-features__content .item-row:last-of-type .awesome-features__item {
    padding-bottom: 40px;
  }
}
@media only screen and (max-width: 767.98px) {
  .awesome-features__content .item-row:last-of-type .awesome-features__item {
    padding-bottom: 0px;
  }
}
@media only screen and (max-width: 767.98px) {
  .awesome-features__content .item-row:nth-of-type(even) .awesome-features__item:last-child {
    order: -1;
  }
}
.awesome-features__content .item-row:nth-of-type(even) .awesome-features__item .item-content {
  text-align: right;
}
.awesome-features__content .item-row:nth-of-type(even) .awesome-features__item .item-content:before {
  right: -65px;
  left: unset;
  clip-path: polygon(100% 0, 0 50%, 100% 100%);
}
@media only screen and (max-width: 1199.98px) {
  .awesome-features__content .item-row:nth-of-type(even) .awesome-features__item .item-content:before {
    right: -40px;
  }
}
.awesome-features__content .item-row:nth-of-type(even) .awesome-features__item .item-content .item-number {
  margin-left: auto;
}
.awesome-features__item {
  padding-top: 65px;
}
@media only screen and (max-width: 1199.98px) {
  .awesome-features__item {
    padding-top: 40px;
  }
}
@media only screen and (max-width: 767.98px) {
  .awesome-features__item {
    padding-top: 0px;
  }
}
.awesome-features__item .item-thumb {
  padding: 32px;
  overflow: hidden;
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(115, 151, 233, 0.1) 0%, rgba(209, 215, 245, 0.1) 48.08%, rgba(239, 247, 251, 0.1) 100%);
}
@media only screen and (max-width: 991.98px) {
  .awesome-features__item .item-thumb {
    border-radius: 15px;
  }
}
.awesome-features__item .item-content::before {
  width: 20px;
  height: 25px;
  left: -65px;
  top: 0;
  background-image: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
}
@media only screen and (max-width: 1199.98px) {
  .awesome-features__item .item-content::before {
    left: -40px;
  }
}
@media only screen and (max-width: 767.98px) {
  .awesome-features__item .item-content::before {
    content: unset;
  }
}
.awesome-features__item .item-content .item-number {
  width: 46px;
  height: 46px;
  border-radius: 100%;
  background-image: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  margin-bottom: 22px;
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.4px;
}
.awesome-features__item .item-content .item-title {
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.64px;
  margin-bottom: 28px;
}
.awesome-features__item .item-content p {
  color: #b5b5b5;
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 161.111%;
  letter-spacing: -0.36px;
  opacity: 1;
}

.contact__form-area .form-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 700;
  line-height: 76.19%;
  letter-spacing: -1.26px;
  margin-bottom: 32px;
}
.contact__form-area p {
  color: #a1a0a3;
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 155.556%;
  letter-spacing: -0.72px;
  opacity: 1;
}
.contact__form {
  margin-top: 45px;
}
.contact__form .input-group .form-label {
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 155.556%;
  letter-spacing: -0.72px;
  margin-bottom: 13px;
}
.contact__form .input-group input,
.contact__form .input-group textarea {
  width: 100% !important;
  border-radius: 10px !important;
  margin: 0 !important;
  border: 1px solid rgba(var(--color-white-rgb), 0.2);
  color: rgba(var(--color-white-rgb), 0.62);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 175%;
  letter-spacing: -0.64px;
  padding: 15px 24px;
  background-color: transparent;
}
.contact__form .input-group input::placeholder,
.contact__form .input-group textarea::placeholder {
  color: rgba(var(--color-white-rgb), 0.62);
  opacity: 1;
}
.contact__form .button-area {
  margin-top: 32px;
}
.contact__info {
  padding: 42px 32px 32px;
  border-radius: 42px;
  background: #0c0d0d;
  overflow: hidden;
}
@media only screen and (max-width: 767.98px) {
  .contact__info {
    padding: 20px;
    border-radius: 20px;
  }
}
.contact__info .info-list {
  margin-bottom: 32px;
}
.contact__info .info-list .info-item {
  border-bottom: 0.5px solid rgba(var(--color-white-rgb), 0.16);
  padding-bottom: 32px;
}
@media only screen and (max-width: 767.98px) {
  .contact__info .info-list .info-item {
    padding-bottom: 20px;
  }
}
.contact__info .info-list .info-item:not(:first-of-type) {
  padding-top: 32px;
}
@media only screen and (max-width: 767.98px) {
  .contact__info .info-list .info-item:not(:first-of-type) {
    padding-top: 20px;
  }
}
.contact__info .info-item {
  gap: 18px;
}
.contact__info .info-item .item-icon {
  width: 76px;
  height: 76px;
  border: 0.5px solid rgba(var(--color-white-rgb), 0.16);
  border-radius: 100%;
  overflow: hidden;
  font-size: 35px;
}
@media only screen and (max-width: 767.98px) {
  .contact__info .info-item .item-icon {
    width: 50px;
    height: 50px;
    font-size: 20px;
  }
}
.contact__info .info-item .item-content .item-title {
  color: rgba(var(--color-white-rgb), 0.73);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.48px;
  margin-bottom: 10px;
}
.contact__info .info-item .item-content a {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 133.333%;
  letter-spacing: -0.72px;
}
@media only screen and (max-width: 767.98px) {
  .contact__info .info-item .item-content a {
    font-size: 19px;
  }
}
.contact__info .info-thumb {
  border-radius: 22px;
  overflow: hidden;
}
@media only screen and (max-width: 767.98px) {
  .contact__info .info-thumb {
    border-radius: 10px;
  }
}
.contact__map {
  width: 100%;
  height: 578px;
  z-index: 1;
}

.pagination-area__nav .pagination {
  gap: 10px;
}
@media only screen and (max-width: 767.98px) {
  .pagination-area__nav .pagination {
    gap: 6px;
  }
}
.pagination-area__nav .pagination .page-item {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pagination-area__nav .pagination .page-item:first-of-type {
  margin-right: 14px;
}
@media only screen and (max-width: 767.98px) {
  .pagination-area__nav .pagination .page-item:first-of-type {
    margin-right: 8px;
  }
}
.pagination-area__nav .pagination .page-item:last-of-type {
  margin-left: 14px;
}
@media only screen and (max-width: 767.98px) {
  .pagination-area__nav .pagination .page-item:last-of-type {
    margin-left: 8px;
  }
}
.pagination-area__nav .pagination .page-item:first-of-type .page-link, .pagination-area__nav .pagination .page-item:last-of-type .page-link {
  z-index: 2;
}
.pagination-area__nav .pagination .page-item:first-of-type .page-link::before, .pagination-area__nav .pagination .page-item:last-of-type .page-link::before {
  z-index: -1;
  inset: 0;
  background-color: transparent;
  background: linear-gradient(180deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
  color: var(--color-black);
  opacity: 0;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.pagination-area__nav .pagination .page-item:first-of-type .page-link:hover, .pagination-area__nav .pagination .page-item:last-of-type .page-link:hover {
  border-color: transparent;
}
.pagination-area__nav .pagination .page-item:first-of-type .page-link:hover::before, .pagination-area__nav .pagination .page-item:last-of-type .page-link:hover::before {
  opacity: 1;
}
.pagination-area__nav .pagination .page-item .page-link {
  border-radius: 10px;
  border: 1px solid rgba(var(--color-white-rgb), 0.24);
  overflow: hidden;
  background-color: transparent;
  color: var(--color-white);
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.48px;
  padding: 16px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 767.98px) {
  .pagination-area__nav .pagination .page-item .page-link {
    font-size: 14px;
  }
}
@media only screen and (max-width: 575.98px) {
  .pagination-area__nav .pagination .page-item .page-link {
    padding: 10px;
  }
}
.pagination-area__nav .pagination .page-item .page-link:hover {
  background-color: var(--color-white);
  color: var(--color-black);
  border-color: var(--color-white);
}
.pagination-area__nav .pagination .page-item.active .page-link {
  background-color: var(--color-white);
  color: var(--color-black);
  border-color: var(--color-white);
}

.appreciation__thumb {
  overflow: hidden;
  border-radius: 42px;
  margin-left: 22px;
}
@media only screen and (max-width: 1199.98px) {
  .appreciation__thumb {
    margin-left: 0;
  }
}
.appreciation__content {
  max-width: 660px;
  margin-right: 22px;
}
@media only screen and (max-width: 1199.98px) {
  .appreciation__content {
    margin-right: 0;
  }
}
.appreciation__content .section-header {
  margin-bottom: 50px;
}
.appreciation__content .section-header .section-title {
  max-width: 598px;
  margin-bottom: 32px;
}
.appreciation__content .section-header p {
  color: rgba(var(--color-white-rgb), 0.72);
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 144.444%;
  opacity: 1;
}
.appreciation__content .automation {
  border-radius: 12px;
  background: #0b0b0b;
  overflow: hidden;
  padding: 24px 32px;
  margin-bottom: 30px;
}
.appreciation__content .automation .automation-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 700;
  line-height: 108.333%;
  letter-spacing: -0.48px;
  margin-bottom: 14px;
}
.appreciation__content .automation p {
  color: rgba(var(--color-white-rgb), 0.72);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
  opacity: 1;
}
.appreciation__content .lead-management {
  overflow: hidden;
}
.appreciation__content .lead-management .lead-management-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 700;
  line-height: 108.333%;
  letter-spacing: -0.48px;
  margin-bottom: 14px;
}
.appreciation__content .lead-management p {
  color: rgba(var(--color-white-rgb), 0.72);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
  opacity: 1;
}
.appreciation__content .btn-customer {
  column-gap: 32px;
  row-gap: 20px;
  margin-top: 45px;
}
.appreciation__content .btn-customer .customer {
  gap: 16px;
}
.appreciation__content .btn-customer .customer .customer-avatars img {
  width: 46px;
  height: 46px;
  border-radius: 50%;
}
.appreciation__content .btn-customer .customer .customer-avatars img:not(:first-child) {
  margin-left: -18px;
}
.appreciation__content .btn-customer .customer .customer-info .total-customers {
  font-family: "Urbanist", sans-serif;
  font-weight: 700;
  line-height: 108.333%;
  letter-spacing: 1;
}
.appreciation__content .btn-customer .customer .customer-info p {
  color: rgba(var(--color-white-rgb), 0.72);
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
  opacity: 1;
}

.widget {
  border-radius: 24px;
  background: #0c0d0d;
  border: 1px solid rgba(var(--color-white-rgb), 0.1);
  overflow: hidden;
  padding: 42px;
  padding-block-start: 34px;
}
.widget:not(:last-of-type) {
  margin-bottom: 24px;
}
@media only screen and (max-width: 1439.98px) {
  .widget {
    padding: 30px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .widget {
    padding: 25px;
  }
}
.widget .widget-title {
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -0.72px;
  margin-bottom: 32px;
}
.widget__search .search-form .input-group .form-control {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 19px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.57px;
  border: 1px solid rgba(var(--color-white-rgb), 0.14);
  background-color: transparent;
  border-radius: 8px 0 0 8px;
  padding: 17.5px 24px;
}
.widget__search .search-form .input-group .form-control::placeholder {
  color: #b7b7b7;
  opacity: 1;
}
.widget__search .search-form .input-group .form-control:focus, .widget__search .search-form .input-group .form-control:focus-visible, .widget__search .search-form .input-group .form-control:active {
  outline: none;
  box-shadow: none;
  border-color: rgba(var(--color-white-rgb), 0.14);
  color: var(--color-white);
  outline: 0;
}
.widget__search .search-form .input-group .input-group-text {
  border-radius: 0 8px 8px 0;
  background: linear-gradient(180deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
  border: none;
  min-width: 60px;
  font-size: 20px;
}
.widget__categories .categorie-list li {
  color: #b7b7b7;
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.48px;
  z-index: 2;
  border-radius: 10px;
  background: #151515;
  padding: 24px;
  overflow: hidden;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.widget__categories .categorie-list li:not(:last-of-type) {
  margin-bottom: 16px;
}
.widget__categories .categorie-list li::before {
  inset: 0;
  overflow: hidden;
  background: linear-gradient(90deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
  z-index: -1;
  opacity: 0;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.widget__categories .categorie-list li:hover, .widget__categories .categorie-list li.active {
  background-color: transparent;
  font-weight: 600;
  color: #040a10;
}
.widget__categories .categorie-list li:hover::before, .widget__categories .categorie-list li.active::before {
  opacity: 1;
}
.widget__recent-posts .posts-list .post-item {
  gap: 10px;
  padding: 16px;
  border-radius: 16px;
  background: #151515;
}
.widget__recent-posts .posts-list .post-item:not(:last-of-type) {
  margin-bottom: 16px;
}
@media only screen and (max-width: 1439.98px) {
  .widget__recent-posts .posts-list .post-item {
    flex-direction: column;
    align-items: center;
  }
}
@media only screen and (max-width: 991.98px) {
  .widget__recent-posts .posts-list .post-item {
    flex-direction: row;
    align-items: center;
  }
}
@media only screen and (max-width: 575.98px) {
  .widget__recent-posts .posts-list .post-item {
    flex-direction: column;
    align-items: center;
  }
}
.widget__recent-posts .posts-list .post-item .item-thumb {
  border-radius: 8px;
  overflow: hidden;
  max-width: 88px;
}
@media only screen and (max-width: 1439.98px) {
  .widget__recent-posts .posts-list .post-item .item-content {
    text-align: center;
  }
}
@media only screen and (max-width: 991.98px) {
  .widget__recent-posts .posts-list .post-item .item-content {
    text-align: left;
  }
}
@media only screen and (max-width: 575.98px) {
  .widget__recent-posts .posts-list .post-item .item-content {
    text-align: center;
  }
}
.widget__recent-posts .posts-list .post-item .item-content .post-date {
  padding: 8px 14px;
  color: var(--color-white);
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.36px;
  border-radius: 60px;
  border: 1px solid rgba(var(--color-white-rgb), 0.11);
  margin-bottom: 8px;
}
.widget__recent-posts .posts-list .post-item .item-content .post-title {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -0.45px;
}
.widget__tags .tags-group {
  column-gap: 12px;
  row-gap: 16px;
}
.widget__tags .tags-group .tag {
  color: var(--color-white);
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.36px;
  border-radius: 90px;
  background: #181818;
  padding: 12px 16px;
}
.widget__cta .cta-title {
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 109.524%;
  margin-bottom: 80px;
}
.widget__cta p {
  color: rgba(var(--color-white-rgb), 0.7);
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-size: 22px;
  font-weight: 500;
  line-height: 145.455%;
  opacity: 1;
  margin-bottom: 30px;
}

.error.section {
  min-height: 100vh;
  overflow: hidden;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: radial-gradient(ellipse at center, rgba(var(--primary-color-rgb), 0.05) 0%, transparent 70%);
}
.error.section::before {
  width: 800px;
  height: 800px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(var(--primary-color-rgb), 0.15) 0%, rgba(var(--primary-color-2-rgb), 0.08) 50%, transparent 100%);
  top: -400px;
  left: -200px;
  z-index: -1;
  animation: morphOrb1 12s ease-in-out infinite;
}
@media only screen and (max-width: 767.98px) {
  .error.section::before {
    width: 500px;
    height: 500px;
    top: -250px;
  }
}
.error.section::after {
  width: 700px;
  height: 700px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(var(--secondary-color-rgb), 0.12) 0%, rgba(var(--primary-color-rgb), 0.06) 50%, transparent 100%);
  bottom: -300px;
  right: -250px;
  z-index: -1;
  animation: morphOrb2 15s ease-in-out infinite;
}
@media only screen and (max-width: 767.98px) {
  .error.section::after {
    width: 450px;
    height: 450px;
    bottom: -200px;
  }
}
.error__content {
  max-width: 800px;
  margin-inline: auto;
  padding-inline: 20px;
  z-index: 2;
  animation: fadeInUp 0.8s ease-out;
}
.error-image {
  margin-bottom: -35px;
  animation: floatImage 6s ease-in-out infinite;
}
.error-image img {
  max-width: 600px;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 20px 60px rgba(var(--primary-color-rgb), 0.25));
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 1439.98px) {
  .error-image img {
    max-width: 550px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .error-image img {
    max-width: 500px;
  }
}
@media only screen and (max-width: 991.98px) {
  .error-image img {
    max-width: 450px;
  }
}
@media only screen and (max-width: 767.98px) {
  .error-image img {
    max-width: 400px;
  }
}
@media only screen and (max-width: 575.98px) {
  .error-image img {
    max-width: 100%;
  }
}
.error-image::before {
  width: 80%;
  height: 80%;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(var(--primary-color-rgb), 0.3) 0%, rgba(var(--primary-color-2-rgb), 0.15) 50%, transparent 100%);
  filter: blur(40px);
  z-index: -1;
  animation: glowPulse 3s ease-in-out infinite;
}
.error-text {
  font-family: "Urbanist", sans-serif;
  font-size: 22px;
  line-height: 160%;
  letter-spacing: -0.5px;
  color: var(--text-color-main);
  opacity: 0.75;
  margin-bottom: 50px;
  max-width: 600px;
  margin-inline: auto;
  animation: fadeIn 1s ease-out 0.3s both;
}
@media only screen and (max-width: 991.98px) {
  .error-text {
    font-size: 20px;
    margin-bottom: 45px;
  }
}
@media only screen and (max-width: 767.98px) {
  .error-text {
    font-size: 18px;
    margin-bottom: 40px;
    max-width: 500px;
  }
}
@media only screen and (max-width: 575.98px) {
  .error-text {
    font-size: 16px;
    margin-bottom: 35px;
    max-width: 100%;
    line-height: 150%;
  }
}

.team-main__header .title {
  gap: 35px;
  font-family: "Urbanist", sans-serif;
  font-size: 140px;
  font-weight: 400;
  line-height: 110%;
}
@media only screen and (max-width: 1439.98px) {
  .team-main__header .title {
    font-size: 120px;
  }
}
@media only screen and (max-width: 1199.98px) {
  .team-main__header .title {
    font-size: 90px;
  }
}
@media only screen and (max-width: 991.98px) {
  .team-main__header .title {
    font-size: 50px;
    gap: 20px;
  }
}
@media only screen and (max-width: 767.98px) {
  .team-main__header .title {
    font-size: 40px;
  }
}
.team-main__header .title i,
.team-main__header .title svg {
  font-weight: 500;
}
.team-main__item .team-thumb {
  border-radius: 10px;
  overflow: hidden;
  user-select: none;
}
.team-main__item .team-thumb > img {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}
.team-main__item .team-thumb .thumb-shape {
  top: 50%;
  left: 18px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  color: var(--primary-color-2);
  stroke-dasharray: 1500;
  stroke-dashoffset: 1500;
  animation-delay: 3s;
}
@media only screen and (max-width: 767.98px) {
  .team-main__item .team-thumb .thumb-shape svg {
    width: 150px;
  }
}
@media only screen and (max-width: 575.98px) {
  .team-main__item .team-thumb .thumb-shape svg {
    width: 223px;
  }
}
.team-main__item .team-thumb .social {
  gap: 10px;
  top: 0;
  right: 25px;
  height: 100%;
  padding: 25px 17px;
  background: rgba(var(--color-white-rgb), 0.24);
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
  -webkit-transform: translateX(100px);
  -ms-transform: translateX(100px);
  transform: translateX(100px);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 767.98px) {
  .team-main__item .team-thumb .social {
    padding: 10px 8px;
    right: 15px;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}
.team-main__item .team-thumb .social .social-title {
  -webkit-writing-mode: sideways-lr;
  -ms-writing-mode: sideways-lr;
  writing-mode: sideways-lr;
  text-orientation: mixed;
  color: var(--color-white);
  font-size: 16px;
  font-weight: 400;
  line-height: 162.5%;
  letter-spacing: 5.44px;
}
@media only screen and (max-width: 767.98px) {
  .team-main__item .team-thumb .social .social-title {
    font-size: 12px;
  }
}
.team-main__item .team-thumb .social .line {
  height: 44px;
  width: 1px;
  background-color: var(--color-white);
}
.team-main__item .team-thumb .social ul {
  gap: 24px;
}
.team-main__item .team-thumb .social ul li:not(:last-of-type)::before {
  content: "";
  width: 4px;
  height: 4px;
  left: 50%;
  top: -12px;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  border-radius: 100%;
  background-color: rgba(var(--color-white-rgb), 0.7);
}
.team-main__item .team-thumb .social ul li a {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(var(--color-white-rgb), 0.7);
  border-radius: 100%;
  color: rgba(var(--color-white-rgb), 0.7);
  font-size: 14px;
}
@media only screen and (max-width: 767.98px) {
  .team-main__item .team-thumb .social ul li a {
    width: 28px;
    height: 28px;
    font-size: 10px;
  }
}
.team-main__item .team-thumb .social ul li a:hover {
  border-color: var(--primary-color);
  background-color: var(--primary-color);
  color: var(--text-color-main);
}
.team-main__item .team-content .designation {
  font-size: 16px;
  font-weight: 400;
  line-height: 162.5%;
  letter-spacing: 0.32px;
  margin-top: 15px;
}
@media only screen and (max-width: 767.98px) {
  .team-main__item .team-content .designation {
    margin-top: 10px;
  }
}
.team-main__item .team-content .title {
  font-weight: 500;
  line-height: 138.462%;
  margin-top: 5px;
}
.team-main__item .team-content .title a {
  color: inherit;
  font: inherit;
  line-height: inherit;
}
.team-main__item:hover .thumb-shape, .team-main__item.active .thumb-shape {
  animation: draw 2.5s ease forwards;
}
.team-main__item:hover .social, .team-main__item.active .social {
  -webkit-transform: translateX(0px);
  -ms-transform: translateX(0px);
  transform: translateX(0px);
}

.team-details__wrapper {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media only screen and (max-width: 991.98px) {
  .team-details__wrapper {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
.team-details__thumb {
  border-radius: 24px;
  overflow: hidden;
  height: max-content;
}
@media only screen and (min-width: 992px) {
  .team-details__content {
    padding-left: 30px;
  }
}
@media only screen and (min-width: 1200px) {
  .team-details__content {
    padding-left: 60px;
  }
}
@media only screen and (min-width: 1400px) {
  .team-details__content {
    padding-left: 75px;
  }
}
.team-details__content .section-header .section-title {
  text-align: left;
}
.team-details__content .section-header p {
  font-size: 18px;
  font-weight: 400;
  line-height: 155.556%;
  letter-spacing: 0.18px;
  margin-top: 15px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .section-header p {
    margin-top: 10px;
  }
}
.team-details__content .user-infos {
  margin-top: 35px;
  border-bottom: 1px solid rgba(var(--text-color-main-rgb), 0.1);
  padding-bottom: 20px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-infos {
    margin-top: 20px;
  }
}
.team-details__content .user-infos ul li {
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 155.556%;
  letter-spacing: 0.18px;
}
@media only screen and (max-width: 575.98px) {
  .team-details__content .user-infos ul li {
    font-size: 12px;
  }
}
.team-details__content .user-infos ul li span {
  width: 180px;
}
@media only screen and (max-width: 575.98px) {
  .team-details__content .user-infos ul li span {
    width: 115px;
  }
}
.team-details__content .user-infos ul li:not(:last-of-type) {
  margin-bottom: 18px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-infos ul li:not(:last-of-type) {
    margin-bottom: 12px;
  }
}
.team-details__content .social-media-infos {
  margin-top: 40px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .social-media-infos {
    margin-top: 25px;
  }
}
.team-details__content .social-media-infos span {
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 155.556%;
  letter-spacing: 0.18px;
  text-transform: uppercase;
}
.team-details__content .social-media-infos .social-media {
  margin-top: 15px;
}
.team-details__content .user-info {
  margin-top: 35px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-info {
    margin-top: 25px;
  }
}
.team-details__content .user-info .title {
  gap: 6px;
  font-weight: 500;
  line-height: 138.462%;
  margin-bottom: 20px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-info .title {
    margin-bottom: 15px;
  }
}
.team-details__content .user-info .title i,
.team-details__content .user-info .title svg {
  font-size: 16px;
  line-height: 138.462%;
}
.team-details__content .user-info.experience p {
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 155.556%;
  letter-spacing: 0.18px;
}
.team-details__content .user-info.skills .skill-item {
  margin-bottom: 30px;
  opacity: 0;
  transform: translateX(-50px);
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-info.skills .skill-item {
    margin-bottom: 20px;
  }
}
.team-details__content .user-info.skills .skill-item .skill-name {
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 155.556%;
  letter-spacing: 0.18px;
  margin-bottom: 6px;
  color: var(--color-white);
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-info.skills .skill-item .skill-name {
    font-size: 14px;
  }
}
.team-details__content .user-info.skills .skill-item .progress-container {
  position: relative;
  height: 4px;
  background: rgba(var(--primary-color-2-rgb), 0.3);
  overflow: visible;
}
.team-details__content .user-info.skills .skill-item .progress-container .progress-bar {
  height: 100%;
  position: relative;
  overflow: hidden;
  width: 0%;
  background-color: var(--primary-color-2);
}
.team-details__content .user-info.skills .skill-item .progress-container .progress-bar::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.6), transparent);
  animation: shimmer 2s infinite;
}
.team-details__content .user-info.skills .skill-item .progress-container .progress-bar::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(45deg, rgba(255, 255, 255, 0.2), transparent);
}
.team-details__content .user-info.skills .skill-item .progress-container .skill-percentage {
  bottom: calc(100% + 12px);
  right: 0;
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.18px;
  opacity: 0;
  z-index: 10;
  -webkit-transform: translateX(50%);
  -ms-transform: translateX(50%);
  transform: translateX(50%);
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-info.skills .skill-item .progress-container .skill-percentage {
    font-size: 14px;
  }
}
.team-details__content .user-info.career {
  margin-top: 60px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-info.career {
    margin-top: 35px;
  }
}
.team-details__content .user-info.career .career-item {
  gap: 15px;
}
.team-details__content .user-info.career .career-item:not(:last-of-type) {
  margin-bottom: 35px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-info.career .career-item:not(:last-of-type) {
    margin-bottom: 25px;
  }
}
@media only screen and (max-width: 575.98px) {
  .team-details__content .user-info.career .career-item {
    flex-direction: column;
    gap: 5px;
  }
}
.team-details__content .user-info.career .career-item .year {
  font-family: "Urbanist", sans-serif;
  font-weight: 400;
  line-height: 138.462%;
  width: 80px;
}
.team-details__content .user-info.career .career-item p {
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 155.556%;
  letter-spacing: 0.18px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .user-info.career .career-item p {
    font-size: 16px;
  }
}
.team-details__content .contact-section {
  margin-top: 70px;
  background-color: #0c0d0d;
  border-radius: 20px;
  padding: 50px 60px 40px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .contact-section {
    margin-top: 50px;
    padding: 30px 40px 30px;
  }
}
@media only screen and (max-width: 767.98px) {
  .team-details__content .contact-section {
    margin-top: 50px;
    padding: 20px 30px;
  }
}
.team-details__content .contact-section .title {
  font-family: "Urbanist", sans-serif;
  font-weight: 500;
  line-height: 138.462%;
  margin-bottom: 20px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .contact-section .title {
    margin-bottom: 15px;
  }
}
.team-details__content .contact-section p {
  max-width: 546px;
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 155.556%;
  letter-spacing: 0.18px;
}
.team-details__content .contact-section form {
  margin-top: 25px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .contact-section form {
    margin-top: 20px;
  }
}
.team-details__content .contact-section form .form-group {
  border-bottom: 1px solid rgba(var(--text-color-main-rgb), 0.14);
}
.team-details__content .contact-section form .form-group input,
.team-details__content .contact-section form .form-group textarea {
  border: none;
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 155.556%;
  letter-spacing: 0.18px;
  background-color: transparent;
  color: var(--text-color-main);
  resize: none;
  padding-block: 10px;
}
.team-details__content .contact-section form .form-group input::placeholder,
.team-details__content .contact-section form .form-group textarea::placeholder {
  color: var(--text-color-main);
  opacity: 0.74;
}
.team-details__content .contact-section form .form-group input:focus, .team-details__content .contact-section form .form-group input:focus-visible,
.team-details__content .contact-section form .form-group textarea:focus,
.team-details__content .contact-section form .form-group textarea:focus-visible {
  outline: none;
}
.team-details__content .contact-section form .form-group:not(:first-of-type) input,
.team-details__content .contact-section form .form-group:not(:first-of-type) textarea {
  margin-top: 30px;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .contact-section form .form-group:not(:first-of-type) input,
  .team-details__content .contact-section form .form-group:not(:first-of-type) textarea {
    margin-top: 20px;
  }
}
.team-details__content .contact-section form button {
  border-radius: 100%;
  width: 50px;
  height: 50px;
  background-color: var(--color-white);
  color: var(--color-black);
  border: none;
  margin-top: 30px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 991.98px) {
  .team-details__content .contact-section form button {
    margin-top: 20px;
  }
}
.team-details__content .contact-section form button:hover {
  border-radius: 15px;
}

.social-media ul {
  gap: 14px;
}
.social-media ul li a {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(var(--color-white-rgb), 0.1);
  color: var(--color-white);
  border-radius: 100%;
  font-size: 12px;
}
.social-media ul li a:hover {
  background-color: var(--color-white);
  border-color: var(--color-white);
  color: var(--text-color-main);
}
.social-media.v3 ul li a {
  width: 50px;
  height: 50px;
  font-size: 20px;
  color: var(--text-color-main);
  border: 1px solid rgba(var(--text-color-main-rgb), 0.1);
}
@media only screen and (max-width: 991.98px) {
  .social-media.v3 ul li a {
    width: 40px;
    height: 40px;
    font-size: 15px;
  }
}
.social-media.v3 ul li a:hover {
  border-color: var(--color-black);
  color: var(--color-black);
}

.service-main.section {
  overflow: hidden;
  z-index: 1;
  background-color: #0f171d;
}
.service-main__item {
  padding: 1px;
  overflow: hidden;
  border-radius: 24px;
  height: 100%;
  transition: all 1s;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -o-transition: all 1s;
  -ms-transition: all 1s;
}
.service-main__item::before {
  left: 0%;
  top: 0%;
  height: 100%;
  width: 100%;
  opacity: 1;
  background: linear-gradient(115deg, rgba(var(--color-white-rgb), 0.25) 11.62%, rgba(var(--color-white-rgb), 0) 50.7%, rgba(var(--color-white-rgb), 0.25) 92.88%);
  z-index: 1;
  transition: all 1s linear;
  -webkit-transition: all 1s linear;
  -moz-transition: all 1s linear;
  -o-transition: all 1s linear;
  -ms-transition: all 1s linear;
}
.service-main__item .service-box {
  height: 100%;
  padding: 32px 36px;
  overflow: hidden;
  background-color: var(--bg-color-2);
  border-radius: 24px;
  z-index: 1;
  transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
}
.service-main__item .service-box .item-title {
  gap: 15px;
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  line-height: 133.333%;
  letter-spacing: -1.2px;
  margin-bottom: 10px;
}
.service-main__item .service-box p {
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 137.5%;
  letter-spacing: -0.32px;
  opacity: 0.7;
}
.service-main__item:hover {
  background: linear-gradient(115deg, rgba(var(--color-white-rgb), 0) 11.62%, rgba(var(--color-white-rgb), 0) 50.7%, rgba(var(--color-white-rgb), 0) 92.88%);
}
.service-main__item:hover::before {
  -webkit-animation: animate_border 6.5s linear infinite;
  animation: animate_border 6.5s linear infinite;
  opacity: 1;
  left: 50%;
  top: 50%;
  height: 269%;
  width: 115%;
}

.service-details.section {
  background-color: var(--bg-color-2);
}
.service-details__article h2.h2 {
  font-weight: 600;
  line-height: 114.286%;
  margin-bottom: 14px;
  font-family: "Urbanist", sans-serif;
}
@media only screen and (min-width: 992px) {
  .service-details__article h2.h2 {
    margin-bottom: 28px;
  }
}
.service-details__article p {
  margin-bottom: 24px;
  opacity: 0.75;
  font-family: "Urbanist", sans-serif;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article p {
    margin-bottom: 12px;
  }
}
.service-details__article p:has(+ img) {
  margin-bottom: 48px;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article p:has(+ img) {
    margin-bottom: 24px;
  }
}
.service-details__article .blog-thumb {
  overflow: hidden;
  border-radius: 20px;
}
.service-details__article .blog-thumb img {
  width: 100%;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.service-details__article .blog-thumb:hover img {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
.service-details__article h4 {
  font-variant-numeric: lining-nums proportional-nums;
  font-weight: 500;
  line-height: 120.833%;
  margin-top: 60px;
  margin-bottom: 28px;
  font-family: "Urbanist", sans-serif;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article h4 {
    margin-top: 30px;
    margin-bottom: 14px;
  }
}
@media only screen and (max-width: 767.98px) {
  .service-details__article h4 {
    margin-top: 20px;
    margin-bottom: 10px;
  }
}
.service-details__article .process-list {
  margin-bottom: 28px;
  margin-left: 30px;
  padding-left: 15px;
  font-family: "Urbanist", sans-serif;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article .process-list {
    margin-bottom: 14px;
  }
}
.service-details__article .process-list p {
  margin-bottom: 28px;
  font-family: "Urbanist", sans-serif;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article .process-list p {
    margin-bottom: 14px;
  }
}
.service-details__article .process-list li {
  color: rgba(var(--color-white-rgb), 0.8);
  font-family: "Urbanist", sans-serif;
  line-height: 1.5;
}
.service-details__article .process-list li::before {
  content: "\f111";
  left: -15px;
  font: var(--fa-font-sharp-solid);
  font-size: 5px;
  top: 10px;
}
.service-details__article .process-list li:not(:last-child) {
  margin-bottom: 20px;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article .process-list li:not(:last-child) {
    margin-bottom: 10px;
  }
}
.service-details__article-roadmap {
  margin: 60px 0;
  gap: 88px;
  border-top: 1.5px solid rgba(var(--color-white-rgb), 0.12);
  border-bottom: 1.5px solid rgba(var(--color-white-rgb), 0.12);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  font-family: "Urbanist", sans-serif;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article-roadmap {
    margin: 30px 0;
  }
}
@media only screen and (max-width: 1199.98px) {
  .service-details__article-roadmap {
    gap: 30px;
  }
}
@media only screen and (max-width: 991.98px) {
  .service-details__article-roadmap {
    gap: 10px;
  }
}
@media only screen and (max-width: 767.98px) {
  .service-details__article-roadmap {
    gap: 20px;
  }
}
@media only screen and (max-width: 575.98px) {
  .service-details__article-roadmap {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
.service-details__article-roadmap .roadmap__item {
  padding: 40px 0;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article-roadmap .roadmap__item {
    padding: 20px 0;
  }
}
.service-details__article-roadmap .roadmap__item:nth-child(1) .roadmap__icon {
  background-color: #e9f4fd;
}
.service-details__article-roadmap .roadmap__item:nth-child(1) .roadmap__icon svg {
  color: #0a83ec;
}
.service-details__article-roadmap .roadmap__item:nth-child(2) .roadmap__icon {
  background-color: #eeeefd;
}
.service-details__article-roadmap .roadmap__item:nth-child(2) .roadmap__icon svg {
  color: #433eed;
}
.service-details__article-roadmap .roadmap__item:nth-child(3) .roadmap__icon {
  background-color: #e6faf3;
}
.service-details__article-roadmap .roadmap__item:nth-child(3) .roadmap__icon svg {
  color: #00c881;
}
.service-details__article-roadmap .roadmap__item:hover .roadmap__icon svg {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}
.service-details__article-roadmap .roadmap__icon {
  margin: 0 auto;
  margin-bottom: 32px;
  width: 64px;
  height: 64px;
  line-height: 64px;
  text-align: center;
  border-radius: 100%;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
}
@media only screen and (max-width: 991.98px) {
  .service-details__article-roadmap .roadmap__icon {
    margin-bottom: 16px;
  }
}
.service-details__article-roadmap .roadmap__icon svg {
  width: 25px;
  height: 24px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.service-details__article-roadmap .roadmap__content p {
  margin-bottom: 0;
  color: var(--color-white);
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 175%;
  opacity: 0.7;
}
.service-details__article-roadmap .roadmap__title {
  margin-bottom: 10px;
  color: var(--color-white);
  text-align: center;
  font-family: "Urbanist", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: 158.333%;
}
@media only screen and (max-width: 1199.98px) {
  .service-details__article-roadmap .roadmap__title {
    line-height: 1;
  }
}
@media only screen and (max-width: 767.98px) {
  .service-details__article-roadmap .roadmap__title {
    margin-bottom: 5px;
  }
}
.service-details__blockquote {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding: 24px;
}
@media only screen and (max-width: 767.98px) {
  .service-details__blockquote {
    padding: 10px;
  }
}
.service-details__blockquote-wrapper {
  padding: 24px;
  backdrop-filter: blur(5px);
}
@media only screen and (max-width: 767.98px) {
  .service-details__blockquote-wrapper {
    padding: 10px;
  }
}
.service-details__blockquote p {
  font-family: "Urbanist", sans-serif;
  font-size: 28px;
  font-style: italic;
  font-weight: 500;
  line-height: 157.143%;
  opacity: 0.75;
}
@media only screen and (max-width: 767.98px) {
  .service-details__blockquote p {
    font-size: 20px;
  }
}
.service-details__blockquote .quote-author {
  margin-top: 33px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
@media only screen and (max-width: 575.98px) {
  .service-details__blockquote .quote-author {
    flex-direction: column;
  }
}
.service-details__blockquote .author-info-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
}
@media only screen and (max-width: 575.98px) {
  .service-details__blockquote .author-info-container {
    flex-direction: column;
  }
}
.service-details__blockquote .author-avatar {
  width: 64px;
  height: 64px;
  border-radius: 64px;
  -webkit-border-radius: 64px;
  -moz-border-radius: 64px;
  -ms-border-radius: 64px;
  -o-border-radius: 64px;
}
.service-details__blockquote .author-title {
  color: var(--color-white);
  font-family: "Urbanist", sans-serif;
  font-size: 22px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}
.service-details__blockquote .author-designation {
  color: #c6c5fa;
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 177.778%;
  margin-bottom: 0;
}
.service-details__blockquote .quote-icon {
  color: rgba(255, 255, 255, 0.75);
  text-align: right;
}

.choose-us.section {
  background-color: var(--bg-color-2);
}
.choose-us__thumb {
  border-radius: 35px;
  overflow: hidden;
}
.choose-us__thumb img {
  -webkit-filter: brightness(90%) contrast(110%) saturate(80%);
  filter: brightness(90%) contrast(110%) saturate(80%);
  min-height: 250px;
  object-fit: cover;
}
.choose-us__item .item-icon {
  background: #0c0d25;
  width: 100px;
  height: 100px;
  margin: 0 auto 32px;
  border-radius: 50%;
  border: 1px solid rgba(var(--color-white-rgb), 0.25);
}
@media only screen and (max-width: 767.98px) {
  .choose-us__item .item-icon {
    margin: 0 auto 16px;
  }
}
.choose-us__item .item-content .item-title {
  font-weight: 500;
  line-height: 1.6;
  margin-bottom: 6px;
}
.choose-us__item .item-content p {
  font-family: "Urbanist", sans-serif;
  opacity: 0.7;
}

.privacy-policy.section {
  background-color: var(--bg-color-1);
}
.privacy-policy .terms-title {
  margin-bottom: 15px;
  font-family: "Urbanist", sans-serif;
  font-weight: 500;
  line-height: 150%;
  text-transform: capitalize;
}
@media only screen and (min-width: 1400px) {
  .privacy-policy .table-content {
    padding-left: 30px;
  }
}
.privacy-policy .table-content ul li:not(:last-child) {
  margin-bottom: 10px;
}
.privacy-policy .table-content ul li a {
  font-family: "Urbanist", sans-serif;
  font-size: 22px;
  line-height: 150%;
  transition: 0.3s;
  font-weight: 600;
}

.condition-content .terms-inner-desc {
  margin-top: 10px;
}
.condition-content .terms-desc {
  color: var(--text-color-main);
  font-size: 16px;
  font-family: "Inter", sans-serif;
  font-weight: 500;
  line-height: 137.5%;
  letter-spacing: -0.32px;
  opacity: 0.72;
  margin-top: 12px;
  margin-bottom: 10px;
}
.condition-content:not(:last-child) {
  margin-bottom: 30px;
}

.saaslyn-1-btn {
  z-index: 2;
  height: max-content;
  border-radius: 19px;
  opacity: 0.92;
  color: var(--primary-text-color);
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 100%;
  letter-spacing: -0.36px;
  background: linear-gradient(93deg, var(--primary-color) 0.49%, var(--secondary-color) 48.33%, var(--third-color) 100%);
  overflow: hidden;
  padding: 22.5px 69px;
  border-radius: 19px;
  opacity: 0.92;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 991.98px) {
  .saaslyn-1-btn {
    padding: 18px 50px;
  }
}
.saaslyn-1-btn::before {
  z-index: -1;
  inset: 0;
  background: linear-gradient(273deg, var(--primary-color) 0.49%, var(--secondary-color) 48.33%, var(--third-color) 100%);
  opacity: 0;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.saaslyn-1-btn:hover {
  background-color: transparent;
  color: var(--primary-text-color);
  border-radius: 12px;
  transform: skewX(-10deg);
}
.saaslyn-1-btn:hover::before {
  opacity: 1;
}
.saaslyn-1-btn.v2 {
  padding: 18.5px 24.5px;
}
@media only screen and (max-width: 991.98px) {
  .saaslyn-1-btn.v2 {
    padding: 15px 20px;
  }
}

.saaslyn-2-btn {
  z-index: 2;
  height: max-content;
  border-radius: 19px;
  opacity: 0.92;
  color: var(--text-color-main);
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 100%;
  letter-spacing: -0.36px;
  background: transparent;
  overflow: hidden;
  padding: 18.5px 24.5px;
  border-radius: 19px;
  border: 1px solid rgba(var(--primary-color-rgb), 0.5);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 991.98px) {
  .saaslyn-2-btn {
    padding: 15px 20px;
  }
}
.saaslyn-2-btn::before {
  z-index: -1;
  width: 150%;
  height: 150%;
  background: linear-gradient(273deg, var(--primary-color) 0.49%, var(--secondary-color) 48.33%, var(--third-color) 100%);
  -webkit-transform: scaleX(0) skewX(-45deg);
  -ms-transform: scaleX(0) skewX(-45deg);
  transform: scaleX(0) skewX(-45deg);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.saaslyn-2-btn:hover {
  color: var(--primary-text-color);
}
.saaslyn-2-btn:hover::before {
  -webkit-transform: scaleX(1) skewX(-45deg);
  -ms-transform: scaleX(1) skewX(-45deg);
  transform: scaleX(1) skewX(-45deg);
}

.saaslyn-3-btn {
  z-index: 2;
  width: max-content;
  height: max-content;
  border-radius: 40.881px;
  overflow: hidden;
  padding: 15px 42px;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -1.08px;
  background-color: var(--primary-color-2);
  color: var(--color-white);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
@media only screen and (max-width: 991.98px) {
  .saaslyn-3-btn {
    padding: 15px 30px;
  }
}
.saaslyn-3-btn::before {
  z-index: -1;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background-color: rgba(var(--color-white-rgb), 0.58);
  filter: blur(17px);
  left: -19px;
  top: -40px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.saaslyn-3-btn:hover::before {
  left: calc(100% - 49px);
  top: calc(100% - 40px);
}
.saaslyn-3-btn.v2 {
  background-color: transparent;
  border: 1px solid rgba(70, 66, 252, 0.24);
  color: var(--color-black);
}
.saaslyn-3-btn.v2::before {
  background-color: rgba(70, 66, 252, 0.32);
}

.saaslyn-4-btn {
  border: 1px solid transparent;
  gap: 10px;
  height: max-content;
  width: max-content;
  color: var(--color-white);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.32px;
  border-radius: 74px;
  background: #202020;
  padding: 16px 32px;
  z-index: 2;
  overflow: hidden;
}
.saaslyn-4-btn::before {
  z-index: -1;
  inset: 0;
  opacity: 0;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.saaslyn-4-btn:hover::before,
.saaslyn-4-btn .active::before {
  opacity: 1;
}
.saaslyn-4-btn.v2 {
  border-color: rgba(255, 255, 255, 0.29);
}
.saaslyn-4-btn.v2::before {
  opacity: 1;
}
.saaslyn-4-btn.v2:hover::before,
.saaslyn-4-btn.v2 .active::before {
  opacity: 0;
}
.saaslyn-4-btn.v3 {
  background-color: #494953;
}
.saaslyn-4-btn.v3:hover::before, .saaslyn-4-btn.v3.active::before {
  opacity: 1;
}

.saaslyn-5-btn {
  display: flex;
  padding: 12px 17px;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  border-radius: 74px;
  background: rgba(var(--color-white-rgb), 0.08);
  color: var(--color-white);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.32px;
  overflow: hidden;
}
.saaslyn-5-btn:not(.v2)::before {
  z-index: -1;
  inset: 0;
  opacity: 0;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.saaslyn-5-btn:not(.v2):hover::before {
  opacity: 1;
}
.saaslyn-5-btn.v2 {
  z-index: 2;
  background: linear-gradient(135deg, #4642fc 0%, #adbbfe 100%);
  overflow: hidden;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.saaslyn-5-btn.v2::before {
  z-index: -1;
  inset: 0;
  opacity: 0;
  background: linear-gradient(135deg, #adbbfe 0%, #4642fc 100%);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.saaslyn-5-btn.v2:hover {
  background-color: transparent;
}
.saaslyn-5-btn.v2:hover::before {
  opacity: 1;
}

.saaslyn-6-btn {
  z-index: 2;
  width: max-content;
  height: max-content;
  border-radius: 10px;
  color: #080808;
  font-family: "Urbanist", sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.9px;
  padding: 24px;
  white-space: nowrap;
  border: none;
  outline: none;
  background: linear-gradient(180deg, #7397e9 0%, #d1d7f5 48.08%, #eff7fb 100%);
  overflow: hidden;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.saaslyn-6-btn::before {
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, #eff7fb 0%, #d1d7f5 51.92%, #7397e9 100%);
  opacity: 0;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
}
.saaslyn-6-btn:hover {
  background-color: transparent;
}
.saaslyn-6-btn:hover::before {
  opacity: 1;
}

/*-----------------------------------------------------
  BackToTop CSS
-----------------------------------------------------*/
.progress-wrap {
  position: fixed;
  right: 20px;
  bottom: 20px;
  height: 46px;
  width: 46px;
  cursor: pointer;
  border-radius: 50px;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(15px);
  -ms-transform: translateY(15px);
  transform: translateY(15px);
  transition: all 200ms linear;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.3);
}
.progress-wrap::after {
  content: "\f062";
  font: var(--fa-font-solid);
  text-align: center;
  line-height: 46px;
  font-size: 20px;
  color: var(--color-white);
  left: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  z-index: 1;
  border-radius: 50px;
  transition: all 200ms linear;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
}
.progress-wrap svg path {
  fill: var(--primary-color);
}
.progress-wrap svg.progress-circle path {
  fill: var(--color-1);
  stroke: var(--primary-color);
  stroke-width: 5;
  box-sizing: border-box;
  transition: all 200ms linear;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
}
.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
}

/**
 * Hide text while making it readable for screen readers
 * 1. Needed in WebKit-based browsers because of an implementation bug;
 *    See: https://code.google.com/p/chromium/issues/detail?id=457146
 */
.hide-text {
  overflow: hidden;
  padding: 0;
  /* 1 */
  text-indent: 101%;
  white-space: nowrap;
}

/**
 * Hide element while making it readable for screen readers
 * Shamelessly borrowed from HTML5Boilerplate:
 * https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css#L119-L133
 */
.visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.linear {
  transition-timing-function: linear !important;
  -webkit-transition-timing-function: linear !important;
}

.text-initial {
  text-transform: initial;
}

.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.line-clamp-4 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.d-grid {
  display: grid !important;
}

@media only screen and (min-width: 576px) {
  .d-sm-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
}

@media only screen and (min-width: 768px) {
  .d-md-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
}

@media only screen and (min-width: 992px) {
  .d-lg-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
}

@media only screen and (min-width: 1024px) {
  .d-mlg-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
}

@media only screen and (min-width: 1200px) {
  .d-xl-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
}

@media only screen and (min-width: 1600px) {
  .d-xxxl-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
}

@media only screen and (min-width: 1700px) {
  .d-xxxxl-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
}

@media only screen and (min-width: 1800px) {
  .d-5xl-grid {
    display: -ms-grid !important;
    display: grid !important;
  }
}

.saaslyn_screenfix_right {
  margin-right: calc((-100vw + 100%) / 2);
}

.saaslyn_screenfix_left {
  margin-left: calc((-100vw + 100%) / 2);
}

.background-image,
[data-bg-src] {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

/*=======> utility classes start here <=======*/
.login.section {
  background-color: var(--bg-color-1);
}
.login__form-wrap {
  border-radius: 24px;
  border: 1px solid rgba(var(--color-white-rgb), 0.25);
  background: var(--bg-color-2);
  padding: 40px;
  max-width: 731px;
  margin-inline: auto;
  text-align: center;
}
@media only screen and (max-width: 767.98px) {
  .login__form-wrap {
    padding: 25px;
  }
}
.login__form-wrap .common-form-box .form-title {
  font-weight: 600;
  line-height: 120.833%;
  font-family: "Urbanist", sans-serif;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(var(--color-white-rgb), 0.1);
}
@media only screen and (max-width: 767.98px) {
  .login__form-wrap .common-form-box .form-title {
    margin-bottom: 25px;
    padding-bottom: 25px;
  }
}
.login__form-wrap .common-form-box .input-group label {
  font-size: 18px;
  line-height: 1.7;
  margin-bottom: 6px;
}
.login__form-wrap .common-form-box .input-group input,
.login__form-wrap .common-form-box .input-group textarea {
  width: 100%;
  background: #0e0f23;
  border-radius: 8px !important;
  border: 1px solid rgba(var(--color-white-rgb), 0.1);
  padding: 12px 20px;
  transition: border-color 0.3s ease;
}
.login__form-wrap .common-form-box .input-group input::placeholder,
.login__form-wrap .common-form-box .input-group textarea::placeholder {
  color: rgba(var(--color-white-rgb), 0.5);
  font-size: 18px;
}
.login__form-wrap .common-form-box .input-group input:focus,
.login__form-wrap .common-form-box .input-group textarea:focus {
  border-color: var(--primary-color);
  outline: none;
}
.login__form-wrap .common-form-box .form-info-wrap button {
  font-size: 20px;
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  padding: 18px 60px;
}
@media only screen and (max-width: 991.98px) {
  .login__form-wrap .common-form-box .form-info-wrap button {
    padding: 15px 45px;
  }
}
.login__form-wrap .common-form-box .form-info-wrap p {
  font-family: "Urbanist", sans-serif;
}
.login__form-wrap .common-form-box .form-info-wrap p:has(> span, > a) {
  color: rgba(var(--color-white-rgb), 0.5);
}
.login__form-wrap .common-form-box .form-info-wrap p span {
  color: var(--color-white);
}
.login__form-wrap .common-form-box .form-info-wrap p a {
  color: var(--primary-color-2);
}

.sign-up.section {
  background-color: var(--bg-color-1);
}
.sign-up__form-wrap {
  border-radius: 24px;
  border: 1px solid rgba(var(--color-white-rgb), 0.25);
  background: var(--bg-color-2);
  padding: 40px;
  max-width: 731px;
  margin-inline: auto;
  text-align: center;
}
@media only screen and (max-width: 767.98px) {
  .sign-up__form-wrap {
    padding: 25px;
  }
}
.sign-up__form-wrap .common-form-box .form-title {
  font-weight: 600;
  line-height: 120.833%;
  font-family: "Urbanist", sans-serif;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(var(--color-white-rgb), 0.1);
}
@media only screen and (max-width: 767.98px) {
  .sign-up__form-wrap .common-form-box .form-title {
    margin-bottom: 25px;
    padding-bottom: 25px;
  }
}
.sign-up__form-wrap .common-form-box .input-group label {
  font-size: 18px;
  line-height: 1.7;
  margin-bottom: 6px;
}
.sign-up__form-wrap .common-form-box .input-group input,
.sign-up__form-wrap .common-form-box .input-group textarea {
  width: 100%;
  background: #0e0f23;
  border-radius: 8px !important;
  border: 1px solid rgba(var(--color-white-rgb), 0.1);
  padding: 12px 20px;
  transition: border-color 0.3s ease;
}
.sign-up__form-wrap .common-form-box .input-group input::placeholder,
.sign-up__form-wrap .common-form-box .input-group textarea::placeholder {
  color: rgba(var(--color-white-rgb), 0.5);
  font-size: 18px;
}
.sign-up__form-wrap .common-form-box .input-group input:focus,
.sign-up__form-wrap .common-form-box .input-group textarea:focus {
  border-color: var(--primary-color);
  outline: none;
}
.sign-up__form-wrap .common-form-box .form-info-wrap .check-group {
  margin: 0px 0 40px;
}
.sign-up__form-wrap .common-form-box .form-info-wrap .check-group input {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}
.sign-up__form-wrap .common-form-box .form-info-wrap .check-group label {
  position: relative;
  cursor: pointer;
  line-height: 1.2;
  color: rgba(var(--color-white-rgb), 0.7);
}
.sign-up__form-wrap .common-form-box .form-info-wrap .check-group label::before {
  content: "";
  -webkit-appearance: none;
  background-color: transparent;
  border: 1.5px solid rgba(var(--color-white-rgb), 0.5);
  padding: 10px;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  cursor: pointer;
  margin-right: 12px;
  border-radius: 6px;
}
.sign-up__form-wrap .common-form-box .form-info-wrap .check-group label a {
  color: var(--color-white);
  border-bottom: 1px solid;
  text-transform: capitalize;
}
.sign-up__form-wrap .common-form-box .form-info-wrap button {
  font-size: 20px;
  font-family: "Urbanist", sans-serif;
  font-weight: 600;
  padding: 18px 60px;
}
@media only screen and (max-width: 991.98px) {
  .sign-up__form-wrap .common-form-box .form-info-wrap button {
    padding: 15px 45px;
  }
}
.sign-up__form-wrap .common-form-box .form-info-wrap p {
  font-family: "Urbanist", sans-serif;
}
.sign-up__form-wrap .common-form-box .form-info-wrap p:has(> span, > a) {
  color: rgba(var(--color-white-rgb), 0.7);
}
.sign-up__form-wrap .common-form-box .form-info-wrap p.or {
  color: rgba(var(--color-white-rgb), 0.7);
}
.sign-up__form-wrap .common-form-box .form-info-wrap p span {
  color: var(--color-white);
}
.sign-up__form-wrap .common-form-box .form-info-wrap p a {
  color: var(--primary-color-2);
}

/*# sourceMappingURL=style.css.map */

.coaching-network{
    padding:70px 20px;
}

.network-container{
    max-width:1400px;
    margin:auto;
}

/*=========================
TITLE
=========================*/

.section-heading{
    text-align:center;
    margin-bottom:45px;
}

.section-heading span{
    display:inline-block;
    padding:8px 18px;
    background:#e7eeff;
    color:#4f46e5;
    border-radius:50px;
    font-size:13px;
    font-weight:600;
    margin-bottom:14px;
}

.section-heading h2{
    font-size:46px;
    color:#111827;
    margin-bottom:12px;
}

.section-heading p{
    color:#6b7280;
    font-size:14px;
}

/*=========================
MAIN AREA
=========================*/

/* ========================= */
/* STICKY STACK FIX */
/* ========================= */

.sticky-wrapper{
    position:relative;
}

.sticky-card{
    position:relative;
    margin-bottom:120px; /* important */
}

.exam-card {
    padding: 25px 40px;
    position: relative;
    z-index: 2;
    overflow: hidden;
    border-radius: 26px;
}

/* z-index stack */

.sticky-card:nth-child(1){ z-index:1; }
.sticky-card:nth-child(2){ z-index:2; }
.sticky-card:nth-child(3){ z-index:3; }
.sticky-card:nth-child(4){ z-index:4; }
.sticky-card:nth-child(5){ z-index:5; }
.sticky-card:nth-child(6){ z-index:6; }/

.exam-card{
    border-radius:34px;
    padding:60px;
    min-height:560px;
    display:flex;
    align-items:center;
    overflow:hidden;
    position:relative;
    border:1px solid rgba(255,255,255,0.6);

    box-shadow:
    0 15px 50px rgba(15,23,42,0.06);

    transition:0.4s ease;
}

.exam-card:hover{
    transform:translateY(-6px);
}

/* Glow Effect */

.exam-card::before{z-index: -1;
    content:'';
    position:absolute;
    width:260px;
    height:260px;
    border-radius:50%;
    top:-120px;
    right:-120px;
    opacity:.5;
}

/* ========================= */
/* CARD COLORS */

.ssc {
    background: #fff7ed;
}

.ssc::before{
    background:#fed7aa;
}

.railway{
    background:#f8ebec;
}

.railway::before{
    background:#ff9598;
}

.banking{
    background:#dfeff8;
}

.banking::before{
    background:#a9e0ff;
}

.teaching{
    background:#ffebf2;
}

.teaching::before{
    background:#eeadc3;
}

.rajasthan{
    background:#ecfdf3;
}

.rajasthan::before{
    background:#bbf7d0;
}

.upsc{
    background:#fff7ed;
}

.upsc::before{
    background:#fed7aa;
}

/* ========================= */
/* ICON */

.exam-icon{
    width:58px;
    height:58px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    font-weight:700;
    margin-bottom:18px;
    background:#fff;
    box-shadow:0 10px 25px rgba(0,0,0,0.05);
}

/* ========================= */

.content-box h2{
    font-size:36px;
    font-weight:700;
    margin-bottom:12px;
    color:#111827;
}

.feature-list{
    list-style:none;
    padding:0;
    margin:0;
}

.feature-list li{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:18px;
    color:#374151;
    font-size:16px;
}

.feature-list li span{
    width:34px;
    height:34px;
    border-radius:50%;
    background:rgba(255,255,255,0.7);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:14px;
    font-weight:700;
}

/* ========================= */
/* IMAGE */

.image-box{
    text-align:center;
}

.image-box img{
    width:100%;
    border-radius:28px;
    box-shadow:0 20px 50px rgba(0,0,0,0.08);
}

/* ========================= */

@media(max-width:991px){

    .exam-card{
        min-height:auto;
        padding:35px;
    }

    .image-box{
        margin-top:35px;
    }

    .content-box h2{
        font-size:32px;
    }

    .section-title h2{
        font-size:36px;
    }

    .sticky-card{
        transform:none !important;
    }
}

@media(max-width:767px){
  .banner-two::before{display: none;}
  .top-icon {
    width: 72px !important;
    height: 72px !important;
    border: 3px solid #7b4dff !important;
    font-size: 26px !important;
}
.ceature-card::after {
    left: 10% !important;
    width: 80% !important;
}
  .connection-area{margin: 40px 0;}
.banner-two__content .title .line-two {
    display: block;
}
    .exam-section{
        padding:70px 0;
    }

    .exam-card{
        padding:24px;
        border-radius:24px;
    }

    .content-box h2{
        font-size:26px;
    }


    .feature-list li{
        font-size:14px;
    }
}
.footer-subscribe.hero-subscribe {
    max-width: 639px;
    width: 100%;
    background: linear-gradient(90deg, #f7f7ff 0%, #cdcafd 54%, #ffffff 100%);
    margin: 40px auto 24px;
    padding: 1px;
    border-radius: 36px;
    border: 1px solid #ffffff;
}

@media only screen and (max-width: 991.98px) {
  .footer-subscribe.hero-subscribe {
    margin: 20px auto 24px;
  }
}

.footer-subscribe input {font-size: small;
    border-radius: 50px;
    background: #dddddd00;
    padding: 16px 130px 16px 20px;
    color: #fff;
    border: #eee;
}
.footer-subscribe .common-btn {
  right: 4px;
  height: 87%;
}
.footer-subscribe.footer-subscribe-two input {
  border: unset;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  padding: 10px 130px 10px 0px;
  border-radius: unset;
}
.footer-subscribe.footer-subscribe-two button {
  right: 0;
  height: 100%;
  color: var(--primary-green);
}
.footer-subscribe.footer-subscribe-two button:hover svg,
.footer-subscribe.footer-subscribe-two button:hover i {
  animation: 0.3s moving_side alternate;
  transition: all 0.3s;
}
.footer-subscribe .common-btn {
  right: 4px;
  height: 87%;
}
.footer-subscribe.footer-subscribe-two input {
  border: unset;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  padding: 10px 130px 10px 0px;
  border-radius: unset;
}
.footer-subscribe.footer-subscribe-two button {
  right: 0;
  height: 100%;
  color: var(--primary-green);
}
.footer-subscribe.footer-subscribe-two button:hover svg,
.footer-subscribe.footer-subscribe-two button:hover i {
  animation: 0.3s moving_side alternate;
  transition: all 0.3s;
}
.footer-subscribe input:focus {
 color: #000;
  outline: none;     /* Default blue outline hatane ke liye */
}
.common-btn.bg-green-style {
    color: var(--color-white);
    background-color: var(--primary-color-2);
}
.common-btn {
    font-weight: 500;
    letter-spacing: 0.32px;
    display: inline-flex;
    line-height: 1;
    gap: 10px;
    font-size: 18px;
    align-items: center;
    padding: 13px 22px;
    border-radius: 32px;
    color: var(--color-white);
    transition: all 0.4s linear;
    overflow: hidden;
    border: 1px solid transparent;
}
.tag-wrap {
    gap: 12px;
}
.tag-wrap .tag-title {
    font-size: 16px;
}
ul.custom-ul {gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.tag-list li {font-size: small;
    color: #4b4b4b;
    background-color: #ffffff;
    border-radius: 5px;
    padding: 8px 15px;
    transition: all 0.2s;
}
.tag-list li i{
    font-size: smaller;
    color: #4642fc;
}
.process-expert {
    background: #fff;
    border: 1px solid #dfe4ff;
    border-radius: 24px;
    padding: 36px 22px 28px;
    position: relative;
    overflow: visible;
    box-shadow: 0 10px 30px rgba(50,70,130,.05);
}
h4.expert-title {
    font-size: 25px;
}
.step-number{
    width:52px;
    height:52px;
    border-radius:50%;
    background:#f1f3ff;
    border:1px solid #dfe4ff;
    color:#4053ff;
    font-size:18px;
    font-weight:900;
    display:flex;
    align-items:center;
    justify-content:center;
    position:absolute;
    top:-26px;
    left:50%;
    transform:translateX(-50%);
    z-index:20;
}

.expert-title{
    text-align:center;
    font-size:17px;
    line-height:1.25;
    font-weight:900;
    margin-bottom:14px;
    color:#06122f;
}

.expert-title span{
    color:#4053ff;
}

.expert-text{
    text-align:center;
    font-size:12px;
    line-height:1.6;
    color:#32456e;
    margin-bottom:24px;
}

/* connector */

.connector{
    position:absolute;
    top:80px;
    right:-45px;
    width:45px;
    border-top:2px dashed #bcc3ff;
    z-index:10;
}


/* source list */

.source-item{
    display:flex;
    align-items:center;
    gap:14px;
    border:1px solid #dfe4f5;
    border-radius:12px;
    padding:11px 14px;
    margin-bottom:10px;
    background:#fff;
}

.source-icon{
    width:38px;
    height:38px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:16px;
    font-weight:900;
    flex-shrink:0;
}

.green{
    background:#ddf8e8;
    color:#14b45f;
}

.red{
    background:#fff0f0;
    color:#ff3b3b;
}

.orange{
    background:#fff4e8;
    color:#ff922c;
}

.pink{
    background:#ffeef4;
    color:#d81752;
}

.source-info h5{
    font-size:12px;
    font-weight:900;
    margin:0 0 3px;
    color:#06122f;
}

.source-info p{
    margin:0;
    font-size:11px;
    line-height:1.35;
    color:#32456e;
}

/* filter */

.filter-visual{
    text-align:center;
    margin-top:30px;
}

.icon-row{
    display:flex;
    justify-content:center;
    gap:20px;
    margin-bottom:10px;
}

.round-icon{
    width:40px;
    height:40px;
    border-radius:50%;
    border:1px solid #dfe4ff;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    color:#5a60ff;
    font-size:22px;
}

.round-icon.ai{
    background:linear-gradient(135deg,#8f63ff,#7149f5);
    color:#fff;
    font-weight:900;
}

.funnel {
    width: 120px;
    height: 70px;
    margin: auto;
    background: #4642fc;
    clip-path: polygon(0 0,100% 0,65% 50%,55% 100%,45% 100%,35% 50%);
}

.down-arrow{
    font-size:28px;
    color:#625cff;
    margin:2px 0 14px;
}

.reject-item{
    display:flex;
    align-items:center;
    gap:14px;
    border:1px solid #dfe4f5;
    border-radius:10px;
    padding:11px 14px;
    margin-bottom:10px;
    font-size:12px;
    font-weight:900;
    color:#06122f;
}

.reject-item i{
    width:28px;
    height:28px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    flex-shrink:0;
}

.bg-red{
    background:#ff4767;
}

.bg-orange{
    background:#ff9738;
}

.bg-green{
    background:#14c866;
}

/* merge */

.merge-area{
    margin-top:58px;
    height:285px;
    overflow:visible;
    position:relative;
}

.circle-wrap{
    width:200px;
    height:200px;
    border-radius:50%;
    border:1px solid #d7ddff;
    margin:25px auto 0;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
}

.circle-wrap:before,
.circle-wrap:after{
    content:"";
    position:absolute;
    border-radius:50%;
    border:1px solid #d7ddff;
}

.circle-wrap:before{
    inset:24px;
}

.circle-wrap:after{
    inset:48px;
}

.center-note{
    width:64px;
    height:64px;
    border-radius:50%;
    background:#f0f2ff;
    color:#5b61ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    z-index:5;
}

.check{
    width:28px;
    height:28px;
    border-radius:50%;
    background:#4053ff;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    position:absolute;
    right:52px;
    bottom:45px;
    z-index:8;
}

.dot-it{
    width:15px;
    height:15px;
    border-radius:50%;
    background:#4053ff;
    position:absolute;
    z-index:6;
    box-shadow:0 0 0 7px rgba(64,83,255,.08);
}

.d1{
    top:-7px;
    left:50%;
    transform:translateX(-50%);
}

.d2{
    left:-7px;
    top:50%;
    transform:translateY(-50%);
}

.d3{
    right:-7px;
    top:50%;
    transform:translateY(-50%);
}

.d4{
    left:34px;
    bottom:8px;
}

.d5{
    right:34px;
    bottom:8px;
}

.label{
    position:absolute;
    font-size:11px;
    line-height:1.15;
    font-weight:900;
    color:#000;
    z-index:10;
}

.l1{
    top:-50px;
    left:50%;
    transform:translateX(-50%);
    text-align:center;
    width:90px;
}

.l2{
    left:4px;
    top:82px;
    text-align:left;
}

.l3{
    right:4px;
    top:82px;
    text-align:right;
}

.l4{
    left:18px;
    bottom:-35px;
}

.l5{
    right:10px;
    bottom:-35px;
    text-align:left;
}

/* consume */

.time-box{
    border:1px solid #dfe4f5;
    border-radius:14px;
    padding:30px 14px;
    text-align:center;
    margin-top:36px;
}

.time-box i{
    width:58px;
    height:58px;
    border-radius:50%;
    border:5px solid #1bbd5f;
    color:#1bbd5f;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    margin:0 auto 18px;
}

.time-box h3{
    color:#4053ff;
    font-size:26px;
    line-height:1.15;
    font-weight:900;
    margin:0;
}

.time-box p{
    margin-top:8px;
    font-size:13px;
    font-weight:900;
}

.benefit{
    display:flex;
    align-items:center;
    gap:12px;
    border:1px solid #dfe4f5;
    border-radius:12px;
    padding:10px 14px;
    margin-top:12px;
}

.benefit i{
    width:34px;
    height:34px;
    border-radius:10px;
    background:#eef0ff;
    color:#4053ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:16px;
    flex-shrink:0;
}

.benefit h5{
    font-size:12px;
    font-weight:900;
    margin:0 0 3px;
}

.benefit p{
    margin:0;
    font-size:11px;
    color:#32456e;
}

/* responsive */

@media(max-width:1199px){

    .connector{
        display:none;
    }

    .process-expert{
        min-height:auto;
        margin-bottom:35px;
    }
}

@media(max-width:767px){

    .process-section{
        padding:40px 0;
    }

    .process-expert{
        padding:56px 18px 24px;
    }

    .circle-wrap{
        width:180px;
        height:180px;
    }

    .label{
        font-size:10px;
    }

    .l1{
        top:-42px;
    }

    .l2{
        left:0;
    }

    .l3{
        right:0;
    }

    .l4{
        left:12px;
    }

    .l5{
        right:2px;
    }
}
.faq-icon {
    width: 40px;
    min-width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #f1edff;
    color: #6040f5;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.testimonial-section {
    padding: 70px 0;position: relative;
    background: linear-gradient(90deg, #f2f1ff, #fafaff, #f2f1ff);
    overflow: hidden;
}


.testimonialSwiper {
    overflow: hidden !important;
    padding: 45px 0;
}

.testimonialSwiper .swiper-wrapper {
    align-items: stretch; 
}

.swiper-slide {
    height: auto;
    display: flex; 
}
.testimonial-card {
    width: 100%;
    min-height: 330px; 
    background: #fff;
    border: 1px solid #ddd8ff;
    border-radius: 22px;
    padding: 28px;
    position: relative;
    transform: scale(.92);
    opacity: .55;
    transition: transform .5s cubic-bezier(0.4, 0, 0.2, 1), opacity .5s, border-color .5s, box-shadow .5s;
    box-shadow: 0 14px 40px rgba(73, 72, 130, .08);
    display: flex;
    flex-direction: column;
    justify-content: space-between; 
}

.swiper-slide-prev .testimonial-card,
.swiper-slide-next .testimonial-card {
    transform: scale(.95);
    opacity: .80;
}

.swiper-slide-active .testimonial-card {
    transform: scale(1.03); 
    opacity: 1;
    border-color: #cfc8ff;
    box-shadow: 0 24px 65px rgba(108, 95, 255, .18);
}

.card-top-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    width: 100%;
}

.badge-it {
    display: inline-block;
    background: linear-gradient(135deg, #7657ff, #9b72ff);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 9px;
}

.stars {
    color: #f6ab00;
    font-size: 18px;
    letter-spacing: 2px;
}

.quote-icon {
    color: #d9ceff;
    font-size: 44px;
    font-weight: 900;
    line-height: 1;
    margin-top: -10px;
}

.review-text {
    font-size: 16px;
    color: #3a3e5a;
    line-height: 1.7;
    margin-bottom: 20px;
    flex-grow: 1; 
    transition: font-size 0.4s ease;
}

.swiper-slide-active .review-text {
    font-size: 18px;
    color: #1e2238;
}

.user-row {
    display: flex;
    align-items: center;
    gap: 15px;
    border-top: 1px solid #edf0ff;
    padding-top: 18px;
    margin-top: auto; 
}

.user-row img {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    transition: width 0.4s, height 0.4s;
}

.swiper-slide-active .user-row img {
    width: 64px;
    height: 64px;
}

.user-info h4 {
    font-size: 18px;
    color: #111326;
    margin-bottom: 4px;
}

.user-info p {
    color: #5d52ff;
    font-size: 14px;
    font-weight: 700;
}

.recommend {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #ddffea;
    color: #10a24d;
    font-size: 12px;
    font-weight: 700;
    padding: 6px 12px;
    border-radius: 30px;
    margin-top: 8px;
}

.recommend span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #12b85a;
}

.testimonial-section .swiper-button-next,
.testimonial-section .swiper-button-prev {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #fff;
    color: #715cff;
    box-shadow: 0 10px 30px rgba(80, 70, 180, .16);
    z-index: 20;
    transition: all 0.3s ease;
}

.testimonial-section .swiper-button-next:hover,
.testimonial-section .swiper-button-prev:hover {
    background: #715cff;
    color: #fff;
}

.testimonial-section .swiper-button-next:after,
.testimonial-section .swiper-button-prev:after {
    font-size: 16px;
    font-weight: 900;
}

.testimonial-section .swiper-button-prev { left: 5px; }
.testimonial-section .swiper-button-next { right: 5px; }

/* --- Responsive Media Queries --- */

@media (max-width: 1199px) {
    .testimonial-container {
        padding: 0 40px;
    }
}

@media (max-width: 991px) {
    .testimonial-container {
        padding: 0 20px;
    }
    .testimonial-card,
    .swiper-slide-active .testimonial-card,
    .swiper-slide-prev .testimonial-card,
    .swiper-slide-next .testimonial-card {
        transform: scale(1);
        opacity: 1;
        min-height: auto;
        box-shadow: 0 10px 30px rgba(73, 72, 130, .05);
    }

    .review-text,
    .swiper-slide-active .review-text {
        font-size: 16px;
    }

    .user-row img,
    .swiper-slide-active .user-row img {
        width: 58px;
        height: 58px;
    }
}

@media (max-width: 767px) {
    .testimonial-section {
        padding: 50px 0;
    }

    .testimonialSwiper {
        padding: 10px 0 30px 0;
    }

    .testimonial-card {
        padding: 22px;
    }
    .testimonial-section .swiper-button-next,
    .testimonial-section .swiper-button-prev {
        display: none;
    }
}




.ai-strip{margin-bottom: 60px;
    width:100%;
    padding:20px 22px 30px;
    border-radius:18px;
    overflow:hidden;
    position:relative;
    background:
    radial-gradient(circle at top left,rgba(67,86,231,.14),transparent 35%),
    linear-gradient(135deg,#f7f9ff 0%,#eef3ff 45%,#f5f1ff 100%);
    border:1px solid #dbe4ff;
    box-shadow:0 12px 35px rgba(67,86,231,.13);
}

.ai-strip::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(120deg,transparent 20%,rgba(255,255,255,.75) 50%,transparent 80%);
    animation:shine 6s linear infinite;
}

.ai-strip::after{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    right:-80px;
    top:-100px;
    border-radius:50%;
    background:rgba(70,82,230,.12);
    filter:blur(18px);
}

@keyframes shine{
    0%{transform:translateX(-120%);}
    100%{transform:translateX(120%);}
}

.ai-strip-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    position:relative;
    z-index:2;
}

.ai-item{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 14px;
    border-radius:14px;
    min-width:160px;
    background:#ffffff;
    border:1px solid #dfe6ff;
    box-shadow:0 8px 22px rgba(31,45,120,.07);
    transition:.35s ease;
    position:relative;
    overflow:hidden;
}

.ai-item:hover{
    transform:translateY(-5px);
    border-color:#9faaff;
    box-shadow:0 12px 28px rgba(67,86,231,.16);
}

.ai-icon{
    width:48px;
    height:48px;
    min-width:48px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    background:linear-gradient(135deg,#eef3ff,#f6f1ff);
    border:1px solid #dfe6ff;
}

.ai-icon i{
    background:linear-gradient(135deg,#3157d9 0%,#5146df 48%,#8b5cf6 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    filter:drop-shadow(0 4px 10px rgba(67,86,231,.18));
    animation:float 3s ease-in-out infinite;
}

.ai-item:nth-child(2) .ai-icon i{animation-delay:.3s;}
.ai-item:nth-child(3) .ai-icon i{animation-delay:.6s;}
.ai-item:nth-child(4) .ai-icon i{animation-delay:.9s;}
.ai-item:nth-child(5) .ai-icon i{animation-delay:1.2s;}

@keyframes float{
    0%,100%{transform:translateY(0) scale(1);}
    50%{transform:translateY(-5px) scale(1.08);}
}

.ai-text{
    font-size:12px;
    font-weight:800;
    line-height:1.45;
    color:#101936;
    letter-spacing:.2px;
}

.ai-text span{
    display:block;
    font-size:11px;
    font-weight:500;
    color:#66739a;
    margin-top:2px;
}

@media(max-width:991px){
    .ai-strip-row{flex-wrap:wrap;}
    .ai-item{
        width:calc(50% - 7px);
        min-width:auto;
    }
}

@media(max-width:576px){
    .ai-strip{
        padding:16px;
        border-radius:16px;
    }

    .ai-strip-row{gap:12px;}

    .ai-item{
        width:100%;
        padding:12px;
    }

    .ai-icon{
        width:42px;
        height:42px;
        min-width:42px;
        font-size:20px;
    }

    .ai-text{font-size:11px;}
    .ai-text span{font-size:10px;}
}
.mani-hero{margin-top: 70px;}

.result-count{font-size:14px;color:#64748b;font-weight:800;margin-bottom:16px}
.content-stack{display:flex;flex-direction:column;gap:7px}

.article-card{
  background:#fff;border-radius:26px;padding:26px;border:1px solid #e5eaf4;
  box-shadow:0 12px 35px rgba(15,23,42,.06);
}
.article-head{display:flex;gap:16px;align-items:flex-start;margin-bottom:16px}
.icon{
  width:56px;height:56px;border-radius:18px;display:grid;place-items:center;
  color:#fff;font-size:22px;background:linear-gradient(135deg,#ff7a18,#ff2d75);flex-shrink:0;
}
.article-head h2{font-size:24px;margin-bottom:0px}
.article-tags{display:flex;gap:8px;flex-wrap:wrap}
.article-tags span{
  background:#eef2ff;color:#1d4ed8;padding:6px 11px;border-radius:40px;font-size:12px;font-weight:800;
}
.article-card p{color:#475569;font-size:14px;line-height:1.8;margin-bottom:14px}
.article-head p{color:#475569;font-size:15px;line-height:1.8;margin-bottom:14px}
.point-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:15px}
.point{background:#f8fbff;border:1px solid #dbeafe;border-radius:16px;padding:15px}
.point strong{display:block;color:#1d4ed8;margin-bottom:6px}
.point span{color:#64748b;font-size:14px;line-height:1.6}

.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:15px}
.it-step{background:#f8fbff;border:1px solid #dbeafe;border-radius:18px;padding:16px}
.it-step b{
  width:34px;height:34px;background:#2563eb;color:#fff;display:grid;place-items:center;
  border-radius:50%;margin-bottom:10px;
}
.it-step h4{font-size:15px;margin-bottom:7px}
.it-step p{font-size:13px;margin:0}

.no-result{
  display:none;background:#fff;padding:32px;text-align:center;border-radius:22px;
  color:#64748b;font-weight:800;
}

@media(max-width:900px){
  .filter-grid{grid-template-columns:1fr}
  .calendar-box{position:static;width:100%;margin-top:12px}
  .point-grid,.timeline{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .mani-hero {
    padding: 14px 0 !important;
}
  .hero-it h1{font-size:20px !important}
  .point-grid,.timeline{grid-template-columns:1fr}
  .article-card{padding:20px}
  .article-head{flex-direction:column}
}

.current-affairs-section{
    position:relative;
    padding:80px 16px 45px;
    overflow:hidden;
    background:#fbfcff;
}

.current-affairs-section::before,
.current-affairs-section::after{
    content:"";
    position:absolute;
    top:0;
    width:170px;
    height:220px;
    background-image:radial-gradient(#d8daf7 1.2px, transparent 1.2px);
    background-size:12px 12px;
    opacity:.9;
}

.current-affairs-section::before{
    left:0;
}

.current-affairs-section::after{
    right:0;
}

.affairs-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
}

.affair-card{
    background:#fff;
    border:1px solid #edf0fa;
    border-radius:24px;
    padding:20px;
    box-shadow:0 18px 40px rgba(16,24,40,.08);
    transition:.35s ease;
    position:relative;
    overflow:hidden;
}

.affair-card:hover{
    transform:translateY(-8px);
}

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

.card-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:18px;
}

.icon-box{
    width:48px;
    height:48px;
    border-radius:15px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:18px;
}

.illustration{
    width:68px;
    object-fit:contain;
    filter:drop-shadow(0 10px 12px rgba(0,0,0,.10));
}

.affair-card h3{
    font-size:18px;
    font-weight:800;
    color:#111827;
     margin-bottom:5px;
   
}.affair-card p {
    font-size: 11px;
 margin-bottom:20px;
}

.affair-list{
    display:flex;
    flex-direction:column;
    gap:11px;
}

.affair-list a{
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#fff;
    border:1px solid #eef1f7;
    border-radius:10px;
    padding:10px 10px;
    transition:.3s;
    font-size:13px;
    font-weight:600;
    color:#111827;
}

.affair-list a:hover{
    transform:translateX(4px);
}

.list-left{
    display:flex;
    align-items:center;
    gap:12px;
}

.date-icon{
    width:28px;
    height:28px;
    border-radius:9px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
}

.affair-card .arrows{
    width:25px;
    height:25px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
}

.view-all{
    justify-content:center !important;
    gap:10px;
    font-weight:700 !important;
    margin-top:6px;
}

.footer-note{
    width:max-content;
    max-width:100%;
    margin:30px auto 0;
    padding:12px 24px;
    border-radius:999px;
    background:#fff;
    border:1px solid #edf0fa;
    font-size:13px;
    color:#6b7280;
    box-shadow:0 10px 24px rgba(16,24,40,.06);
}

.footer-note i{
    color:#6c4cff;
    margin-right:8px;
}

/* PURPLE */

.affair-card.purple {
    background: linear-gradient(180deg, #8375f629 0%, #ffffff 45%);
}
.purple .icon-box{
    background:#744cff;
    box-shadow:0 10px 22px rgba(116,76,255,.25);
}

.affair-card.purple .date-icon,
.affair-card.purple .arrows,
.affair-card.purple .view-all{
    background:#f4f0ff;
    color:#744cff;
}

.affair-card.purple .affair-list a:hover{
    border-color:#744cff;
}

.affair-card.blue {
    background: linear-gradient(180deg, #d9e4f9 0%, #ffffff 45%);
}
.affair-card.blue .icon-box{
    background:#3478ff;
    box-shadow:0 10px 22px rgba(52,120,255,.22);
}

.affair-card.blue .date-icon,
.affair-card.blue .arrows,
.affair-card.blue .view-all{
    background:#edf4ff;
    color:#3478ff;
}

.affair-card.blue .affair-list a:hover{
    border-color:#3478ff;
}

/* GREEN */

.affair-card.green{
    background:linear-gradient(180deg,#f3fcf6 0%, #ffffff 45%);
}

.affair-card.green .icon-box{
    background:#3da765;
    box-shadow:0 10px 22px rgba(61,167,101,.22);
}

.affair-card.green .date-icon,
.affair-card.green .arrows,
.affair-card.green .view-all{
    background:#edf9f2;
    color:#3da765;
}

.affair-card.green .affair-list a:hover{
    border-color:#3da765;
}

/* ORANGE */

.affair-card.orange{
    background:linear-gradient(180deg,#fff7ef 0%, #ffffff 45%);
}

.affair-card.orange .icon-box{
    background:#ff9d32;
    box-shadow:0 10px 22px rgba(255,157,50,.25);
}

.affair-card.orange .date-icon,
.affair-card.orange arrows,
.affair-card.orange .view-all{
    background:#fff4e8;
    color:#ff9d32;
}

.affair-card.orange .affair-list a:hover{
    border-color:#ff9d32;
}

@media(max-width:1024px){

    .affairs-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .section-top h2{
        font-size:42px;
    }

}
/* =================================
   RESPONSIVE SAME AS DESKTOP
================================= */

@media(max-width:1200px){

    .connection-area{
        position:relative;
        width:100%;
        height:520px;
        min-height:520px;
        overflow:hidden;
    }

    .main-grid{
        position:relative;
        left:50%;
        grid-template-columns:367px 420px 367px;
        transform:translateX(-50%) scale(.82);
        transform-origin:top center;
        margin:0;
    }
}

@media(max-width:992px){

    .connection-area{
        height:425px;
        min-height:425px;
    }

}

@media(max-width:767px){

    .connection-area{
        position:relative;
        width:100%;
        height:345px;
        min-height:345px;
        overflow:hidden;
    }

   

    .side{
        display:flex;
        flex-direction:column;
        gap:16px;
    }

    .center-it{
        order:initial;
        width:420px;
        height:500px;
    }

    .flow-svg{
        display:block !important;
        visibility:visible !important;
    }

    .logo-grid{
        grid-template-columns:repeat(4,1fr);
    }

    .center-it-circle{
        width:175px;
        height:175px;
    }

    .center-it-circle::before{
        width:240px;
        height:240px;
    }

    .center-it-circle small{
        font-size:21px;
    }

    .center-it-circle h2{
        font-size:38px;
    }

    .center-it-circle p{
        font-size:13px;
    }
}

@media(max-width:575px){

    .connection-area{
        height:285px;
        min-height:285px;
    }

}

@media(max-width:400px){

    .connection-area{
        height:245px;
        min-height:245px;
    }

    .main-grid{
        transform:translateX(-50%) scale(.32);
    }
}
/*========================================
CONNECTION AREA
========================================*/

.connection-area{
    position:relative;
    width:100%;
    overflow:hidden;
}

/*========================================
OPTIONAL CENTER LOGO
========================================*/

.center-logo{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:160px;
    height:160px;
    border-radius:50%;
    background:linear-gradient(135deg,#7c7cff,#4f46e5);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:10;
    box-shadow:
        0 25px 60px rgba(79,70,229,.25),
        inset 0 10px 20px rgba(255,255,255,.25);
}

.center-logo::before{
    content:"";
    position:absolute;
    inset:-12px;
    border-radius:50%;
    border:2px dashed rgba(79,70,229,.25);
    animation:rotateCircle 12s linear infinite;
}

.center-logo img{
    width:95px;
    height:auto;
    object-fit:contain;
}

@keyframes rotateCircle{
    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }
}

/*========================================
MAIN DESKTOP GRID
========================================*/

.main-grid{
    max-width:100%;
    margin:0 auto;

    display:grid;
    grid-template-columns:367px 420px 367px;
    justify-content:center;
    align-items:center;

    position:relative;
    transform:none;
}

/*========================================
LEFT AND RIGHT SIDES
========================================*/

.side{
    width:367px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

/*========================================
MAIN BOX
========================================*/

.box-it{
    width:100%;
    background:#ffffff;
    border:1px solid #ececf4;
    border-radius:20px;
    padding:16px;
    box-shadow:0 8px 24px rgba(16,24,40,.05);
    box-sizing:border-box;
}

.box-it-head{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
}

.icon-it{
    width:46px;
    height:46px;
    border-radius:50%;

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

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

    flex-shrink:0;
}

.blue{
    background:#eef5ff;
    color:#5397ff;
}

.green{
    background:#ecfff3;
    color:#36c979;
}

.purple{
    background:#f5f0ff;
    color:#6d5cff;
}

.red{
    background:#fff1f1;
    color:#ff5f75;
}

.orange{
    background:#fff6e8;
    color:#e2a132;
}

.box-it-head h3{
    margin:0 0 2px;
    color:#081533;
    font-size:16px;
    line-height:1.3;
    font-weight:700;
}

.box-it-head p{
    margin:0;
    color:#6c7895;
    font-size:12px;
    line-height:1.4;
    font-weight:600;
}

/*========================================
LOGO GRID
========================================*/

.logo-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
}

.logo-card{
    width:100%;
    height:74px;
    padding:6px;

    border:1px solid #ededf5;
    border-radius:14px;
    background:#ffffff;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    text-align:center;
    box-sizing:border-box;
    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}

.logo-card:hover{
    transform:translateY(-3px);
    border-color:#d8d6ff;
    box-shadow:0 8px 18px rgba(70,66,252,.08);
}

.logo-card img{
    display:block;
    width:auto;
    height:20px;
    max-width:44px;
    object-fit:contain;
    margin-bottom:6px;
}

.logo-card span{
    display:block;
    color:#081533;
    font-size:10px;
    line-height:1.25;
    font-weight:800;
}

.more{
    margin-top:10px;
    color:#707b98;
    font-size:12px;
    line-height:1.4;
    font-weight:800;
    text-align:center;
}

/*========================================
CENTER AREA
========================================*/

.center-it{
    position:relative;
    width:420px;
    height:500px;

    display:flex;
    align-items:center;
    justify-content:center;
}

.center-it-circle{
    position:relative;
    z-index:9;

    width:175px;
    height:175px;
    border-radius:50%;

    background:
        radial-gradient(
            circle at 30% 53%,
            #a79dff 0%,
            #615bee 70%,
            #554ee7 100%
        );

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    color:#ffffff;
    text-align:center;

    box-shadow:0 20px 48px rgba(78,70,229,.34);
}

.center-it-circle::before{
    content:"";
    position:absolute;
    width:240px;
    height:240px;
    border:2px dashed #b9b4ff;
    border-radius:50%;
    pointer-events:none;
    animation:rotateCircle 12s linear infinite;
}

.center-it-circle small{
    position:relative;
    z-index:2;
    color:#ffffff;
    font-size:21px;
    line-height:1.1;
    font-weight:500;
}

.center-it-circle h2{
    position:relative;
    z-index:2;
    margin:2px 0 7px;

    color:#ffffff;
    font-size:38px;
    line-height:1;
    font-weight:900;
}

.center-it-circle p{
    position:relative;
    z-index:2;
    margin:0;

    color:#ffffff;
    font-size:13px;
    line-height:1.5;
    font-weight:600;
}

/*========================================
SVG CONNECTION LINES
========================================*/

.flow-svg{
    position:absolute;
    inset:0;
    z-index:1;

    display:block;
    width:100%;
    height:100%;

    overflow:visible;
    pointer-events:none;
}

.flow-line{
    fill:none;
    stroke-width:1.5;
    stroke-dasharray:7 7;
}

/*========================================
BOTTOM FUNNEL LINE
========================================*/

.funnel-it{
    position:relative;
}

.funnel-it::after{
    content:"";
    position:absolute;
    top:100%;
    left:50%;

    width:2px;
    height:150px;

    transform:translateX(-50%);

    background:
        repeating-linear-gradient(
            to bottom,
            #4642fc 0,
            #4642fc 10px,
            transparent 10px,
            transparent 18px
        );

    border-radius:20px;
    animation:lineFlow 1s linear infinite;
}

@keyframes lineFlow{
    from{
        background-position:0 0;
    }

    to{
        background-position:0 28px;
    }
}

/*========================================
LAPTOP
1200PX से ऊपर original desktop layout
========================================*/

@media(min-width:1200px){

    .connection-area{
        min-height:670px;
        overflow:visible;
    }

    .main-grid{
        position:relative;
        top:auto;
        left:auto;

        width:1154px;
        max-width:100%;

        margin:0 auto;

        transform:none;
    }
}

/*========================================
SMALL LAPTOP / TABLET LANDSCAPE
992PX - 1199PX
========================================*/

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

    .connection-area{
        height:555px;
        min-height:555px;
        overflow:hidden;
    }

    .main-grid{
        position:absolute;
        top:10px;
        left:50%;

        width:1154px;
        max-width:none;

        margin:0;

        transform:translateX(-50%) scale(.82);
        transform-origin:top center;
    }
}

/*========================================
TABLET
768PX - 991PX
========================================*/

@media(min-width:768px) and (max-width:991px){

    .connection-area{
        height:455px;
        min-height:455px;
        overflow:hidden;
    }

    .main-grid{
        position:absolute;
        top:10px;
        left:50%;

        width:1154px;
        max-width:none;

        margin:0;

        transform:translateX(-50%) scale(.66);
        transform-origin:top center;
    }
}

/*========================================
LARGE MOBILE
576PX - 767PX
========================================*/

@media(min-width:576px) and (max-width:767px){

    .connection-area{
        height:380px;
        min-height:380px;
        overflow:hidden;
    }

    .main-grid{
        position:absolute;
        top:10px;
        left:50%;

        width:1154px;
        max-width:none;

        display:grid;
        grid-template-columns:367px 420px 367px;

        margin:0;

        transform:translateX(-50%) scale(.52);
        transform-origin:top center;
    }

    .side{
        width:367px;
        gap:16px;
    }

    .center-it{
        width:420px;
        height:500px;
    }

    .logo-grid{
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .flow-svg{
        display:block;
    }
}

/*========================================
MOBILE
401PX - 575PX
========================================*/

@media(min-width:401px) and (max-width:575px){

    .connection-area{
        height:310px;
        min-height:310px;
        overflow:hidden;
    }

    .main-grid{
        position:absolute;
        top:8px;
        left:50%;

        width:1154px;
        max-width:none;

        display:grid;
        grid-template-columns:367px 420px 367px;

        margin:0;

        transform:translateX(-50%) scale(.40);
        transform-origin:top center;
    }

    .side{
        width:367px;
        gap:16px;
    }

    .center-it{
        width:420px;
        height:500px;
    }

    .logo-grid{
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .flow-svg{
        display:block;
    }
}

/*========================================
SMALL MOBILE
UP TO 400PX
========================================*/

@media(max-width:400px){

    .connection-area{
        height:265px;
        min-height:265px;
        overflow:hidden;
    }

    .main-grid{        height: 140px;
        display:grid;
        grid-template-columns:367px 420px 367px;

        margin:0;

        transform:translateX(-50%) scale(.28);
        transform-origin:top center;
    }

    .side{
        width:367px;
        gap:16px;
    }

    .center-it{
        width:420px;
        height:500px;
    }

    .logo-grid{
        grid-template-columns:repeat(4,minmax(0,1fr));
    }

    .flow-svg{
        display:block;
    }
}
@media(max-width:576px){
.strip-item{padding: 0px !important;}
.strip-item i {
    width: 42px !important;
    height: 42px !important;
    font-size: 16px !important;
    }    
.banner-two__content .customers-info {
    display: block;
}
.banner-two__content .customers-info .info {
        justify-content: center;
    }
        .banner-two.section {
        padding-top: 107px;
    }
    .tag-list li {
    font-size: 9px;}
    .current-affairs-section::before, .current-affairs-section::after{z-index: -1;}
    .filter-colm {
    padding: 10px 9px 145px !important;
}
.ai-filter-container {
    max-width: 100% !important;
}
    .current-affairs-section{
        padding:55px 14px 35px;
    }

    .section-top h2{
        font-size:34px;
    }

    .section-top p{
        font-size:14px;
    }

    .affairs-grid{
        grid-template-columns:1fr;
        gap:18px;
    }

.affair-card {
    position: relative;
    padding: 18px;
    z-index: 9;
}

}



@keyframes bgMove{
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

.ai-filter-container{
    max-width:90%;
    margin:40px auto 0;

}

/* ================= LAYOUT ================= */

.ai-filter-layout{
    display:grid;
    grid-template-columns:210px 1fr 210px;
    gap:20px;
    align-items:center;
}

/* ================= SIDE LIST ================= */

.side-filter-list{
    display:flex;
    flex-direction:column;
    gap:15px;
    position:relative;
    z-index:1;
}

/* ================= FILTER aicard ================= */

.aicard{
    height:44px;
    background:linear-gradient(180deg,#ffffff 0%,#fcfbff 100%);
    border:1px solid #ece6ff;
    border-radius:14px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:0 13px;
    position:relative;
    overflow:visible;

    box-shadow:
    0 10px 25px rgba(110,85,220,.07),
    inset 0 1px 0 rgba(255,255,255,.9);

    animation:aicardFloat 3s ease-in-out infinite;
}

/* floating delay */

.lefts .aicard:nth-child(2),
.right .aicard:nth-child(2){
    animation-delay:.2s;
}

.lefts .aicard:nth-child(3),
.right .aicard:nth-child(3){
    animation-delay:.4s;
}

.lefts .aicard:nth-child(4),
.right .aicard:nth-child(4){
    animation-delay:.6s;
}

.lefts .aicard:nth-child(5),
.right .aicard:nth-child(5){
    animation-delay:.8s;
}

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

.aicard span{
    font-size:13px;
    font-weight:700;
    color:#1a1d38;
}

.aicard b{
    width:22px;
    height:22px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:900;
    flex-shrink:0;
}

/* ================= reds ================= */

.reds b{
    background:linear-gradient(180deg,#fff7f7 0%,#ffe9e9 100%);
    color:#ff4f4f;
}

/* ================= greens ================= */

.greens b{
    background:linear-gradient(180deg,#f7fff9 0%,#e9fff1 100%);
    color:#15b867;
}

/* ================= CONNECT LINES ================= */

.lefts .aicard::after,
.right .aicard::after{
    content:"";
    position:absolute;
    top:50%;
    width:180px;
    height:2px;
    background:repeating-linear-gradient(
        to right,
        #d8d0ff 0 6px,
        transparent 6px 12px
    );
    z-index:-1;

    animation:lineMove 2s linear infinite;
}

@keyframes lineMove{
    from{
        background-position:0 0;
    }
    to{
        background-position:24px 0;
    }
}

.lefts .aicard::after{
    right:-180px;
    transform-origin:left center;
}

.right .aicard::after{
    left:-180px;
    transform-origin:right center;
}

/* lefts rotation */

.lefts .aicard:nth-child(1)::after{
    transform:rotate(22deg);
}

.lefts .aicard:nth-child(2)::after{
    transform:rotate(10deg);
}

.lefts .aicard:nth-child(3)::after{
    transform:rotate(0);
}

.lefts .aicard:nth-child(4)::after{
    transform:rotate(-10deg);
}

.lefts .aicard:nth-child(5)::after{
    transform:rotate(-22deg);
}

/* right rotation */

.right .aicard:nth-child(1)::after{
    transform:rotate(-22deg);
}

.right .aicard:nth-child(2)::after{
    transform:rotate(-10deg);
}

.right .aicard:nth-child(3)::after{
    transform:rotate(0);
}

.right .aicard:nth-child(4)::after{
    transform:rotate(10deg);
}

.right .aicard:nth-child(5)::after{
    transform:rotate(22deg);
}

/* ================= CENTER ================= */

.filter-center{
    position:relative;
    height:315px;
}

/* ================= TOP ICONS ================= */

.top-icons{
    display:flex;
    justify-content:center;
    align-items:flex-start;
    gap:32px;
    position:relative;
    z-index:6;
}

.top-round,
.top-ai{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;

    animation:iconFloat 3s ease-in-out infinite;

    box-shadow:0 14px 35px rgba(120,95,255,.13);
}

.top-round{
    border-radius:50%;
    background:#fff;
    border:1px solid #eee9ff;
    color:#6d4cff;
    font-size:20px;
}

.top-round.pink{
    color:#f05c9c;
}

.top-ai{
    width:44px;
    height:44px;
    border-radius:12px;
    background:linear-gradient(135deg,#9058ff,#d44cff);
    color:#fff;
    font-size:19px;
    font-weight:900;
    animation-delay:.2s;
}

.top-round:last-child{
    animation-delay:.4s;
}

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

/* ================= TOP SVG LINES ================= */

.top-lines{
    position:absolute;
    width:300px;
    height:115px;
    left:50%;
    top:22px;
    transform:translateX(-50%);
    z-index:1;
}

.top-lines path{
    fill:none;
    stroke:#d8d0ff;
    stroke-width:1.6;
    stroke-dasharray:5 8;

    animation:dashMove 2.4s linear infinite;
}

@keyframes dashMove{
    to{
        stroke-dashoffset:-30;
    }
}

/* ================= funnel-it ================= */

.funnel-it{
    width:285px;
    margin:28px auto 0;
    position:relative;
    z-index:3;

    filter:drop-shadow(0 22px 34px rgba(120,95,255,.20));

    animation:funnel-itFloat 4s ease-in-out infinite;
}

@keyframes funnel-itFloat{
    0%,100%{
        transform:translateY(0) scale(1);
    }
    50%{
        transform:translateY(-6px) scale(1.02);
    }
}

.funnel-it svg{
    width:100%;
    display:block;
}

/* ================= dot-itS ================= */

.dot-it{
    position:absolute;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#8c79ff;
    box-shadow:0 0 0 8px rgba(140,120,255,.13);
    z-index:5;

    animation:dot-itMove 2s ease-in-out infinite;
}

.d2{animation-delay:.2s}
.d3{animation-delay:.4s}
.d4{animation-delay:.6s}
.d5{animation-delay:.8s}

@keyframes dot-itMove{
    0%,100%{
        transform:translateY(0);
        opacity:.8;
    }
    50%{
        transform:translateY(-10px);
        opacity:1;
    }
}

.d1{left:64px;top:2px}
.d2{left:115px;top:16px}
.d3{left:145px;top:24px}
.d4{right:95px;top:17px}
.d5{right:50px;top:2px}

/* ================= RESPONSIVE ================= */

@media(max-width:768px){
  .ai-filter-container{position: relative;margin: 20px auto;}
    .ai-filter-layout {
        height: 140px;
        position: absolute;
        left: 50%;
        transform: translateX(-50%) scale(.43);
        transform-origin: top center;
    }


    .side-filter-list{
        flex-direction:row;
        flex-wrap:wrap;
        justify-content:center;
    }

    .aicard{
        width:47%;
    }

    .aicard::after{
        display:none;
    }
}

@media(max-width:520px){

    .aicard{
        width:100%;
    }

    .top-icons{
        gap:18px;
    }

    .top-round{
        width:44px;
        height:44px;
        font-size:18px;
    }

    .top-ai{
        width:42px;
        height:42px;
        font-size:17px;
    }

    .funnel-it{
        width:240px;
    }
}
.patientsCare_outerContainer__UAXGl{
  position:relative !important;
  height:auto !important;padding: 20px 0;
  overflow:visible !important;
}

.sticky-section{
  position:relative !important;
  overflow:hidden !important;
}




.slider{
  transform:translateY(0);
  transition:0.6s ease !important;
}

.right-side img{
  opacity:0 !important;
}

.right-side img.active{
  opacity:1 !important;
  transform:scale(1) !important;
}

.progress-line{
  display:block !important;
}
.bg-glow{
    position:absolute;
    width:450px;
    height:450px;
    border-radius:50%;
    left:42%;
    top:52%;
    transform:translate(-50%,-50%);
    background:rgba(255,155,85,.42);
    filter:blur(150px);
    transition:.8s ease;
    z-index:0;
}

/* ========================= */


/* ========================= */
/* LEFT */
/* ========================= */

.left-side{
    position:relative;
}


.slider-wrap{
    position:relative;
    height:470px;
    overflow:hidden;
}

.slider{
    transition:.9s cubic-bezier(.77,0,.18,1);
}

.slide{
    height:470px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    padding-top:10%;
}

.slide h2{
    font-size:48px;
    line-height:1.09;
    letter-spacing:-1px;
    color:#111;
    margin-bottom:20px;
    font-weight:600;
}

.slide p{
    font-size:16px;
    line-height:1.5;
    color:#222;
    margin-bottom:15px;
}

.slide .slide-btn{
    width:max-content;
    padding:16px 34px;
    border:none;
    border-radius:50px;
    background:#111;
    color:#fff;
    font-size:16px;
    cursor:pointer;
}

/* ========================= */
/* PROGRESS */
/* ========================= */

.progress-line{
    position:absolute;
    left:-28px;
    top:18px;
    width:4px;
    height:300px;
    background:rgba(0,0,0,.12);
    border-radius:50px;
    overflow:hidden;
}

.progress-fill{
    width:100%;
    height:25%;
    background:#111;
    border-radius:50px;
    transition:.9s ease;
}

/* ========================= */
/* RIGHT */
/* ========================= */

.right-side{
    position:relative;
    height:360px;
    border-radius:36px;
    overflow:hidden;
    box-shadow:0 35px 80px rgba(0,0,0,.12);
}

.right-side img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:0;
    transform:scale(1.08);
    transition:.9s ease;
}

.right-side img.active{
    opacity:1;
    transform:scale(1);
}

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

@media(max-width:1100px){

.right-side{
    height:560px;
}

.slide h2{
    font-size:56px;
}

}

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

@media(max-width:991px){

.patientsCare_outerContainer__UAXGl{
    height:auto;
}

.sticky-section{
    position:relative;
    height:auto;
    padding:60px 0;
}

.custom-container{
    height:auto;
}

.bg-glow{
    width:500px;
    height:500px;
    left:50%;
    top:30%;
    filter:blur(120px);
}

.slider-wrap{
    height:auto;
    overflow:visible;
}


.slide{    height: 270px;
    margin-bottom:50px;
}

.slide h2{
    font-size:48px;
    line-height:1.1;
    letter-spacing:-2px;
}

.slide p{
    font-size:18px;
}

.progress-line{
    display:none;
}

.right-side{
    height:450px;
    margin-top:20px;
}

.right-side img{
    opacity:0;
}

.right-side img:first-child{
    opacity:1;
    transform:scale(1);
}

}

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

@media(max-width:600px){

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

.left-side small{
    font-size:15px;
}

.left-side h3{
    font-size:22px;
    margin-bottom:28px;
}

.slide h2{
    font-size:38px;
    letter-spacing:-1px;
}

.slide p{
    font-size:16px;
    line-height:1.6;
}

.slide .slide-btn{
    padding:13px 24px;
    font-size:14px;
}

.right-side{
    height:330px;
    border-radius:22px;
}

.bg-glow{
    width:340px;
    height:340px;
    filter:blur(90px);
}

}


.smart-brief-section{
    max-width:1450px;
    margin:auto;
}

.smart-brief-wrapper{position: relative;
    padding:75px 45px 45px;margin-top: 150px;
    border-radius:32px;
    background:linear-gradient(135deg,#ffffff,#f8f5ff);
    border:1px solid #e6e2ff;
    box-shadow:0 25px 80px rgba(91,53,255,.12);
}

.top-heading{
    text-align:center;
    margin-bottom:42px;
}

.top-icon{
    position:absolute;
    left:50%;
    top:-52px;
    transform:translateX(-50%);

    width:95px;
    height:95px;
    border-radius:50%;

    background:#fff;
    border:5px solid #7b4dff;

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

    color:#6d35ff;
    font-size:34px;

    box-shadow:
    0 15px 40px rgba(123,77,255,.18);

    z-index:5;
}

/* OUTSIDE WAVES */

.top-icon::before,
.top-icon::after{
    content:"";
    position:absolute;
    width:100%;
    height:100%;
    border-radius:50%;
    border:3px solid rgba(123,77,255,.45);

    top:50%;
    left:50%;
    transform:translate(-50%,-50%) scale(1);

    animation:ringWave 2.8s linear infinite;
}

/* Second wave delay */

.top-icon::after{
    animation-delay:1.4s;
}


.top-icon i{
    animation:iconPulse 2s ease-in-out infinite;
}

/* ANIMATION */

@keyframes ringWave{
    0%{
        opacity:.7;
        transform:translate(-50%,-50%) scale(1);
    }

    100%{
        opacity:0;
        transform:translate(-50%,-50%) scale(1.6);
    }
}

@keyframes iconPulse{
    0%,100%{
        transform:scale(1);
    }
    50%{
        transform:scale(1.12);
    }
}

@keyframes floatParticle{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-12px);
    }
}
.top-heading span{
    display:inline-block;
    padding:8px 24px;
    border-radius:40px;
    background:#f0ebff;
    color:#6d35ff;
    font-weight:600;
}

.top-heading h2{
    font-size:44px;
     font-weight: 600;
    line-height: 104.839%;
    letter-spacing: -1.9px;
    margin-top:18px;
    letter-spacing:-2px;
}

.top-heading h2 b{
    background:linear-gradient(90deg,#2563eb,#7c3aed,#ec4899);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.top-heading p{
    line-height:1.55;
    color:#65708b;
    margin-top:15px;
}

.ceature-card{
    height:100%;
    padding:20px 15px 40px;
    border-radius:24px;
    background:rgba(255,255,255,.88);
    border:1px solid #ebe7ff;
    box-shadow:0 18px 45px rgba(76,55,160,.08);
    transition:.35s;
    position:relative;
    overflow:hidden;
}

.ceature-card:hover{
    transform:translateY(-7px);
    box-shadow:0 25px 55px rgba(91,53,255,.14);
}

.ceature-card::after{
    content:"";
    position:absolute;
    left:50px;
    bottom:0;
    width:72px;
    height:5px;
    border-radius:30px;
}

.card-purple::after{background:linear-gradient(90deg,#7c3aed,#8b5cf6);}
.card-cyan::after{background:linear-gradient(90deg,#06b6d4,#22d3ee);}
.card-pink::after{background:linear-gradient(90deg,#ff4b5c,#ff7a59);}
.card-blue::after{background:linear-gradient(90deg,#2563eb,#60a5fa);}
.card-violet::after{background:linear-gradient(90deg,#9333ea,#c084fc);}
.card-orange::after{background:linear-gradient(90deg,#f97316,#fb923c);}

.ceature-icon{
    width:36px;
    height:36px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:22px;
    font-size:18px;
}

.icon-purple{background:#f1ebff;color:#7c3aed;}
.icon-cyan{background:#e8fbff;color:#06b6d4;}
.icon-pink{background:#fff0ef;color:#ff4b5c;}
.icon-blue{background:#edf4ff;color:#2563eb;}
.icon-violet{background:#f6eeff;color:#9333ea;}
.icon-orange{background:#fff2e8;color:#f97316;}

.ceature-card h3{
    font-size:15px;
    font-weight:800;
    margin-bottom:8px;
}

.ceature-card h4{
    font-size:18px;
    font-weight:800;
    margin-bottom:10px;
}

.ceature-card p{
    font-size:12px;
    line-height:1.55;
    color:#68738b;
    margin-bottom:0;
}

.ceature-card a{
    position:absolute;
    right:24px;
    bottom:18px;
    font-size:21px;
}

.story-card{
    height:100%;
    padding:24px;
    border-radius:28px;
    background:#ffffff;
    border:1px solid #ebe7ff;
    box-shadow:0 25px 70px rgba(91,53,255,.14);
    position:relative;
    overflow:hidden;
}

.story-card::before{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    right:-120px;
    top:-120px;
    background:radial-gradient(circle,rgba(124,58,237,.18),transparent 70%);
}

.story-img{
    height:200px;
    border-radius:20px;
    overflow:hidden;
    position:relative;
    margin-bottom:26px;
    background:
    linear-gradient(rgba(76,29,149,.12),rgba(37,99,235,.10)),
    url('https://images.unsplash.com/photo-1524492412937-b28074a5d7da?q=80&w=1200&auto=format&fit=crop');
    background-size:cover;
    background-position:center;
}

.story-img span{
    position:absolute;
    top:18px;
    left:18px;
    background:linear-gradient(90deg,#7c3aed,#2563eb);
    color:#fff;
    padding:10px 22px;
    border-radius:40px;
    font-size:15px;
    font-weight:800;
    display:flex;
    align-items:center;
    gap:8px;
    box-shadow:0 12px 30px rgba(124,58,237,.35);
}

.story-card h2{
    font-size:22px;
    line-height:1.22;
    font-weight:600;
    color:#111827;
    margin-bottom:10px;
    letter-spacing:-.5px;
}

.story-card p{
    font-size:15px;
    line-height:1.65;
    color:#5f6982;
    margin-bottom:24px;
}




.bottom-strip{
    margin-top:30px;
    padding:18px 24px;
    border-radius:22px;
    background:rgba(255,255,255,.85);
    border:1px solid #ebe7ff;
    box-shadow:0 18px 45px rgba(76,55,160,.08);
}

.strip-item{
    display:flex;
    align-items:center;
    gap:14px;
    padding:10px;
    height:100%;
}

.strip-item i{
    width:52px;
    height:52px;
    border-radius:50%;
    background:#f1ebff;
    color:var(--primary-color-2);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    flex:0 0 auto;
}

.strip-item h5{
    margin:0;
    font-size:17px;
    font-weight:800;
    color:#111827;
}

.strip-item p{
    margin:3px 0 0;
    color:#68738b;
    font-size:14px;
}

@media(max-width:1199px){
    .top-heading h2{font-size:54px;}
    .story-card h2{font-size:27px;}
}

@media(max-width:991px){
    .smart-brief-wrapper{padding:30px 18px;}
    .top-heading h2{font-size:44px;}
    .story-card{margin-top:20px;}
}

@media(max-width:767px){
.funnel-it:before { display: none;
}
.funnel-it:after{display: none;}
    .top-heading h2{font-size:34px;}
    .story-img{height:210px;}
    .story-card h2{font-size:25px;}
    .story-card p{font-size:15px;}
    .story-card a{height:56px;font-size:18px;}
}








.filter-colm {margin-top: 40px;
    position: relative;border: 6px solid #fff;
    padding: 10px 26px 60px;
    border-radius: 18px;
    background: linear-gradient(200deg, #ffffff, transparent);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: 0.35s ease;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.filter-colm::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 18px;
    background: linear-gradient(180deg, rgb(228 228 252) 0%, rgba(255, 255, 255, 0) 45%);
    pointer-events: none;
}

.filter-colm::after{
    content:"";
    position:absolute;

    width:70px;
    height:70px;

    left:-18px;
    top:50%;

    transform:translateY(-50%);

    background: radial-gradient(
        circle,
        rgba(128,92,255,0.22) 0%,
        rgba(128,92,255,0) 70%
    );

    filter: blur(12px);

    z-index:0;
}

/* HOVER */

.filter-colm:hover{
    transform: translateY(-4px);

    box-shadow:
        0 18px 45px rgba(120,90,255,0.14),
        inset 0 1px 0 rgba(255,255,255,1);
}
.pipe {
    position: absolute;
    left: 51%;
    top: 99%;
    transform: translateX(-50%);
    width: 34px;
    height: 260px;
    background: linear-gradient(180deg, #5d5af7 0%, #8ea2ff 45%, #e5e5fc 100%);
    border-radius: 0;
    border: 6px solid rgba(255,255,255,.95);
    border-top: 0;
    box-shadow: inset 0 0 18px rgba(255,255,255,.35),
    0 0 35px rgba(80,100,255,.35);
    overflow: hidden;
    z-index: -1;
    border-bottom: none;
}
/* moving water */
.pipe::before{
    content:"";
    position:absolute;
    left:50%;
    top:-140%;
    transform:translateX(-50%);

    width:12px;
    height:120px;

    background:
    linear-gradient(
        to bottom,
        rgba(255,255,255,0),
        rgba(255,255,255,.95) 20%,
        rgba(175,225,255,.95) 50%,
        rgba(255,255,255,.75) 75%,
        rgba(255,255,255,0)
    );

    border-radius:50px;

    filter:
    blur(1px)
    drop-shadow(0 0 12px rgba(255,255,255,.9))
    drop-shadow(0 0 20px rgba(140,190,255,.8));

    animation:waterDrop 3.4s linear infinite;
}

/* soft shine */
.pipe::after{
    content:"";
    position:absolute;
    inset:0;

    background:
    linear-gradient(
        90deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,.22) 45%,
        rgba(255,255,255,.45) 50%,
        rgba(255,255,255,.15) 55%,
        rgba(255,255,255,0) 100%
    );

    mix-blend-mode:screen;
    opacity:.8;
}

/* smooth water motion */
@keyframes waterDrop{

    0%{
        top:-140%;
        opacity:0;
        transform:translateX(-50%) scaleY(.7);
    }

    10%{
        opacity:1;
    }

    45%{
        transform:translateX(-50%) scaleY(1.15);
    }

    100%{
        top:130%;
        opacity:0;
        transform:translateX(-50%) scaleY(.9);
    }
}

    .mani-hero {
    position: relative;
    padding: 40px 0;
    overflow: hidden;
    background: radial-gradient(circle at 12% 18%, rgb(70 66 252 / 3%), transparent 28%), radial-gradient(circle at 86% 20%, rgba(56, 189, 248, .18), transparent 28%), radial-gradient(circle at 72% 88%, rgb(168 85 247 / 9%), transparent 30%), linear-gradient(135deg, #f7f8ff 0%, #eef6ff 42%, #f8f3ff 100%);
}


    .it-badge{
      display:inline-flex;
      align-items:center;
      background:linear-gradient(135deg,#ffffff,#f0f0ff);
      color:#4642fc;
      border:1px solid #dcdcfe;
      padding:8px 16px;
      border-radius:40px;
      font-size:13px;
      font-weight:800;
      margin-bottom:14px;
      box-shadow:0 8px 22px rgba(70,66,252,.08);
    }

    .hero-it h1{
      font-size:33px;
      line-height:1.2;
      color:#101828;
      margin:0 0 14px;
      font-weight:700;
      letter-spacing:-.8px;
    }

    .hero-it p{
      color:#566276;
      line-height:1.7;
      font-size:15px;
      max-width:620px;
      margin:0;
    }

    .hero-it-meta{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      margin-top:22px;
    }

    .hero-it-meta span{
      display:inline-flex;
      align-items:center;
      gap:7px;
      background:rgba(255,255,255,.82);
      border:1px solid #e4e6ff;
      color:#30384a;
      padding:9px 13px;
      border-radius:13px;
      font-size:13px;
      box-shadow:0 8px 20px rgba(70,66,252,.07);
    }

    .hero-it-meta i{
      color:#4642fc;
    }


    .filter-panel {
    background: #fff;
    border-radius: 26px 20px;
    padding:15px 26px;
    border: 1px solid #e5eaf4;
    box-shadow: 0 12px 35px rgba(15, 23, 42, .06);
    width: 70%;
    margin: 0 auto;
    position: relative;
    transform: translatey(-40%);
}

.filter-panel p{margin-bottom: 10px}
.filter-tabs button {margin-bottom: 10px;
    border: none;
    padding: 6px 12px;
    font-size: small;
    border-radius: 8px;
}
.filter-tabs button:nth-child(odd) {
    background: #3fa4ab;
    color: #ffffff;
    border: 1px solid #dfe3ff;
}
.filter-tabs button:nth-child(even) {
    background: #5653fd;
    color: #ffffff;
    border: 1px solid #cffafe;
}

.filter-tabs button:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(70, 66, 252, 0.12);
}

.filter-tabs button.active{
  background: #4642fc;
  color: #ffffff;
  border-color: #4642fc;
  box-shadow: 0 10px 22px rgba(70, 66, 252, 0.25);
}
.article-head {
    border: 1px solid #b9d0eb;
    padding: 12px;
    background: radial-gradient(circle at 12% 18%, rgba(70,66,252,.14), transparent 28%),
        radial-gradient(circle at 86% 20%, rgba(56,189,248,.18), transparent 28%),
        radial-gradient(circle at 72% 88%, rgba(168,85,247,.12), transparent 30%),
        linear-gradient(135deg,#f7f8ff 0%,#eef6ff 42%,#f8f3ff 100%);
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
    border-radius: 11px;
    align-items: center;
}


    .edu-section {
      padding: 35px 0;
      background: #deeff1;
      overflow: hidden;
    }

    .edu-wrap {
      max-width: 1020px;
      margin: auto;
      position: relative;
      display: grid;
      grid-template-columns: 175px 1fr;
      gap: 30px;
      min-height: 505px;
      align-items: start;
    }

    .line-svg {
      position: absolute;
      left: 70px;
      top: 62px;
      width: 250px;
      height: 405px;
      z-index: 1;
      pointer-events: none;
      overflow: visible;
    }

    .line-svg path {
      fill: none;
      stroke: #26313d;
      stroke-width: 2;
      stroke-dasharray: 6 6;
      stroke-linecap: round;
    }

    .line-svg circle {
      fill: #26313d;
    }

    .pencil-side {
      position: relative;
      min-height: 505px;
      z-index: 3;
      display: flex;
      justify-content: center;
    }

    .pencil {
      position: relative;
      width: 82px;
      height: 490px;
      margin-top: 12px;
    }

    .cap-top {
      position: absolute;
      top: 0;
      left: -27px;
      width: 136px;
      height: 42px;
      background: #24303c;
      clip-path: polygon(50% 0, 100% 45%, 50% 80%, 0 45%);
      z-index: 8;
    }

    .cap-base {
      position: absolute;
      top: 25px;
      left: 15px;
      width: 52px;
      height: 43px;
      background: #202a34;
      z-index: 7;
    }

    .cap-base::after {
      content: "";
      position: absolute;
      bottom: -7px;
      left: -12px;
      width: 76px;
      height: 10px;
      background: #1d2731;
    }

    .cap-rope {
      position: absolute;
      top: 17px;
      right: -2px;
      width: 2px;
      height: 62px;
      background: #ff9700;
      z-index: 10;
    }

    .cap-rope::before {
      content: "";
      position: absolute;
      top: -2px;
      right: 0;
      width: 50px;
      height: 2px;
      background: #ff9700;
      transform: rotate(8deg);
      transform-origin: right;
    }

    .cap-rope::after {
      content: "";
      position: absolute;
      bottom: -10px;
      left: -6px;
      width: 13px;
      height: 19px;
      border-radius: 10px;
      background: #ff9700;
    }

    .pencil-body {
      position: absolute;
      top: 72px;
      left: 12px;
      width: 58px;
      height: 310px;
      overflow: hidden;
      box-shadow: inset 10px 0 0 rgba(255, 255, 255, .12);
    }

    .pencil-block {
      height: 77.5px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      color: #fff;
      position: relative;
    }

    .pencil-block:nth-child(1) {
      background: #10b8d4;
    }

    .pencil-block:nth-child(2) {
      background: #58cf00;
    }

    .pencil-block:nth-child(3) {
      background: #ff9400;
    }

    .pencil-block:nth-child(4) {
      background: #fa2517;
    }

    .pencil-block::after {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      width: 17px;
      height: 100%;
      background: rgba(255, 255, 255, .15);
    }

    .wood {
      position: absolute;
      top: 382px;
      left: 12px;
      width: 58px;
      height: 62px;
      background: #ffc1a5;
      clip-path: polygon(0 0, 24% 0, 50% 76%, 76% 0, 100% 0, 50% 100%);
    }

    .wood::before {
      content: "";
      position: absolute;
      left: 14px;
      top: 0;
      width: 13px;
      height: 66px;
      background: rgba(255, 255, 255, .24);
      transform: skewX(-14deg);
    }

    .pencil-tip {
      position: absolute;
      top: 419px;
      left: 30px;
      width: 22px;
      height: 30px;
      background: #26313d;
      clip-path: polygon(0 0, 100% 0, 50% 100%);
    }

    .content-side {
      position: relative;
      z-index: 4;
      padding-top: 15px;
    }
    .edu-item {
      position: relative;
      display: grid;
      grid-template-columns: 72px 1fr;
      align-items: center;
      margin-bottom: 16px;
    }

    .icon-circle {
      width: 70px;
      height: 70px;
      border-radius: 50%;
      border: 4px solid var(--clr);
      background: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--clr);
      font-size: 22px;
      position: relative;
      z-index: 5;
      box-shadow: 0 9px 18px rgba(38, 49, 61, .12);
    }

    .icon-circle::after {
      content: "";
      position: absolute;
      inset: 8px;
      border-radius: 50%;
      border: 2px dashed rgba(38, 49, 61, .13);
    }

    .edu-card {
      min-height: 88px;
      background: #fff;
      border-radius: 8px;
      padding: 16px 34px 15px 78px;
      margin-left: -42px;
      box-shadow: 0 10px 20px rgba(38, 49, 61, .08);
      position: relative;
      transition: .3s ease;
    }

    .edu-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 14px 28px rgba(38, 49, 61, .13);
    }

    .edu-card::after {
      content: "";
      position: absolute;
      right: 0;
      top: 0;
      width: 8px;
      height: 100%;
      border-radius: 0 8px 8px 0;
      background: var(--clr);
    }

    .edu-card h3 {
      margin: 0 0 5px;
      font-size: 18px;
      line-height: 1.1;
      font-weight: 700;
      color: var(--clr);
      text-transform: uppercase;
      letter-spacing: .2px;
    }

    .edu-card p {
      margin: 0;
      color: #56617a;
      font-size: 13px;
      line-height: 1.4;
      max-width: 610px;
    }

    .edu-item:nth-child(1) {
      --clr: #12afd3;
    }

    .edu-item:nth-child(2) {
      --clr: #52c900;
    }

    .edu-item:nth-child(3) {
      --clr: #ff9100;
    }

    .edu-item:nth-child(4) {
      --clr: #fa271c;
    }

    @media (max-width: 991px) {
      .edu-wrap {
        grid-template-columns: 140px 1fr;
        gap: 18px;
        min-height: 455px;
      }

      .pencil-side {
        min-height: 455px;
      }

      .pencil {
        transform: scale(.86);
        transform-origin: top center;
      }

      .line-svg {
        left: 48px;
        top: 65px;
        width: 215px;
        height: 365px;
      }

      .content-side {
        padding-top: 62px;
      }

      .edu-item {
        grid-template-columns: 62px 1fr;
        margin-bottom: 14px;
      }

      .icon-circle {
        width: 60px;
        height: 60px;
        font-size: 25px;
        border-width: 5px;
      }

      .edu-card {
        min-height: 82px;
        margin-left: -36px;
        padding: 14px 26px 13px 26px;
      }

      .edu-card h3 {
        font-size: 18px;
      }

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

    @media (max-width: 767px) {
      .edu-section {
        padding: 30px 0;
      }

      .edu-wrap {
        display: block;
        min-height: auto;
      }

      .pencil-side,
      .line-svg {
        display: none;
      }

      .content-side {
        padding-top: 0;
      }

      .edu-item {
        display: block;
        margin-bottom: 28px;
      }

      .icon-circle {
        margin: 0 auto -30px;
        width: 66px;
        height: 66px;
        font-size: 28px;
      }

      .edu-card {
        margin-left: 0;
        min-height: auto;
        padding: 50px 18px 22px;
        text-align: center;
        border-radius: 12px;
      }

      .edu-card::after {
        width: 100%;
        height: 7px;
        top: auto;
        bottom: 0;
        border-radius: 0 0 12px 12px;
      }

      .edu-card h3 {
        font-size: 20px;
      }

      .edu-card p {
        font-size: 13px;
        margin: auto;
      }
    }

    @media (max-width: 420px) {
      .edu-section {
        padding: 24px 0;
      }

      .edu-item {
        margin-bottom: 24px;
      }

      .edu-card h3 {
        font-size: 18px;
      }

      .edu-card p {
        font-size: 12.5px;
      }

      .icon-circle {
        width: 62px;
        height: 62px;
        font-size: 25px;
      }
    }
    .article-card.bg-2 {
    background: #e4f0fe;
}
.bullet-list {
    display: grid;
    gap: 12px;
    margin-top: 14px;
}
.bullet-list li {
    list-style: none;
    display: flex;
    gap: 12px;
    background: #fbfcfe;
    border: 1px solid #e8edf4;
    border-radius: 16px;
    padding: 14px 15px;
    color: #475569;
    font-size: 15px;
}
.bullet-list li i {
    color: #15803d;
    font-size: 18px;
    flex: 0 0 auto;
    margin-top: 2px;
}
.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 18px;
}
.feature-card {
    border: 1px solid #e4ebf2;
    border-radius: 20px;
    padding: 18px;
    background: linear-gradient(180deg, #fbfdfc, #ffffff);
    min-height: 210px;
    transition: .25s ease;
}
.bg-blue {
    background: #ecf4ff;
    color: #2563eb;
}
.feature-card h3 {
    font-size: 16px;
    color: #12243a;
    margin-bottom: 10px;
}
.feature-card p {
    font-size: 14.5px;
    color: #64748b;
}
.bg-green {
    background: #ebfaef;
    color: #16a34a;
}
.bg-orange {
    background: #fff4e8;
    color: #ea580c;
}
.bg-violet {
    background: #f4edff;
    color: #7c3aed;
}
.mini-columns {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 18px;
    margin-top: 18px;
}
.quote-box {
    padding: 18px;
    border-radius: 20px;
    background: linear-gradient(180deg, #f7fffb, #ffffff);
    border: 1px solid #d6eee0;
}
.quote-box h3 {
    font-size: 16px;
    color: #146c43;
    margin-bottom: 12px;
}
.quote-box p {
    color: #475569;
    font-size: 15px;
}
.sidebar {
    position: sticky;
    top: 18px;
    display: grid;
    gap: 18px;
}
.study-status {
    background: linear-gradient(135deg, #eaf3ff, #f0fbf5);
    border: 1px solid #d7e7eb;
    border-radius: 24px;
    padding: 20px;
}
.study-status h2 {
    font-size: 20px;
    color: #102033;
    margin-bottom: 8px;
}
.study-status p {
    font-size: 14px;
    color: #5c6b7a;
    margin-bottom: 14px;
}
.progress {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: #dfe8f2;
    overflow: hidden;
    margin-bottom: 10px;
}
.progress span {
    display: block;
    height: 100%;
    width: 76%;
    border-radius: 999px;
    background: linear-gradient(90deg, #16a34a, #60a5fa);
}
.status-meta {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 13px;
    font-weight: 700;
    color: #516273;
}
.side-card {
    background: #ffffff;
    border: 1px solid #e4ebf2;
    border-radius: 24px;
    padding: 20px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}
.side-card h2 {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    color: #102033;
    margin-bottom: 14px;
}
.side-card h2 i {
    color: #15803d;
}
.facts-list {
    display: grid;
    gap: 12px;
}
.facts-list li {
    list-style: none;
    display: flex;
    gap: 10px;
    align-items: flex-start;
    border: 1px solid #e8edf4;
    background: #fbfcfe;
    border-radius: 16px;
    padding: 13px 14px;
    font-size: 14px;
    color: #556274;
}
.facts-list li i {
    color: #2563eb;
    margin-top: 2px;
    flex: 0 0 auto;
}
.related-list {
    display: grid;
    gap: 12px;
}
.related-item {
    border: 1px solid #e8edf4;
    background: #fbfcfe;
    border-radius: 16px;
    padding: 14px;
    transition: .25s ease;
}
.related-item:hover {
    border-color: #cde0ff;
    transform: translateX(4px);
    background: #f8fbff;
}
.related-item h3 {
    font-size: 15px;
    color: #102033;
    margin-bottom: 6px;
    line-height: 1.45;
}
.related-item span {
    font-size: 12px;
    color: #64748b;
    font-weight: 700;
}
.feature-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    margin-bottom: 14px;
    font-size: 22px;
}
.quick-points {
    padding: 18px;
    border-radius: 20px;
    background: linear-gradient(180deg, #fffaf2, #ffffff);
    border: 1px solid #f1e5ca;
}
.quick-points h3 {
    font-size: 16px;
    color: #9a680c;
    margin-bottom: 12px;
}
.quick-points ul {
    display: grid;
    gap: 10px;
}
.quick-points li {
    list-style: none;
    display: flex;
    gap: 10px;
    font-size: 14px;
    color: #5f6368;
}
.quick-points li i {
    color: #f59e0b;
    margin-top: 2px;
    font-size: 8px;
    padding-top: 6px;
}
.notes-area {
    min-height: 260px;
    border-radius: 18px;
    border: 1px dashed #c8d7e6;
    padding: 14px;
    color: #94a3b8;
    background: linear-gradient(#ffffff 31px, #edf2f7 32px);
    background-size: 100% 32px;
    font-size: 14px;
}




    .related-box{
      background:#ffffff;
      border:1px solid #e2e4ff;
      border-radius:20px;
      padding:16px;
      box-shadow:0 14px 35px rgba(70,66,252,.10);
    }

    .related-head{
      display:flex;
      align-items:center;
      gap:9px;
      margin-bottom:12px;
    }

    .related-head .head-icon{
      width:31px;
      height:31px;
      border-radius:11px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:#eeedff;
      color:#4642fc;
      font-size:14px;
      box-shadow:0 7px 18px rgba(70,66,252,.16);
    }

    .related-head h3{
      margin:0;
      font-size:18px;
      font-weight:700;
      color:#20283a;
    }

    .related-list{
      display:grid;
      gap:10px;
    }

    .related-card{
      position:relative;
      display:block;
      text-decoration:none;
      background:linear-gradient(135deg,#ffffff 0%,#f8f8ff 100%);
      border:1px solid #e3e5ff;
      border-radius:15px;
      padding:13px 38px 13px 14px;
      overflow:hidden;
      transition:.25s ease;
    }

    .related-card::before{
      content:"";
      position:absolute;
      left:0;
      top:14px;
      bottom:14px;
      width:3px;
      border-radius:0 8px 8px 0;
      background:#4642fc;
      transition:.25s ease;
    }

    .related-card:hover{
      transform:translateY(-3px);
      border-color:#c8c6ff;
      box-shadow:0 12px 25px rgba(70,66,252,.14);
    }

    .related-card:hover::before{
      top:0;
      bottom:0;
    }

    .related-card h4{
      margin:0 0 8px;
      font-size:14px;
      line-height:1.35;
      font-weight:600;
      color:#243044;
    }

    .meta{
      display:flex;
      flex-wrap:wrap;
      gap:6px;
    }

    .meta span{
      display:inline-flex;
      align-items:center;
      gap:5px;
      font-size:11px;
      font-weight:500;
      color:#5f6782;
      background:#f0f1ff;
      border:1px solid #e0e2ff;
      padding:4px 8px;
      border-radius:20px;
    }

   .meta i {
    font-size: 10px;
    color: #a6a4ed;
}
    .arrow{
      position:absolute;
      right:12px;
      top:50%;
      transform:translateY(-50%);
      width:25px;
      height:25px;
      border-radius:50%;
      display:flex;
      align-items:center;
      justify-content:center;
      background:#f0f1ff;
      color:#4642fc;
      font-size:12px;
      transition:.25s ease;
    }

    .related-card:hover .arrow{
      background:#4642fc;
      color:#ffffff;
      transform:translateY(-50%) translateX(2px);
    }

    @media(max-width:480px){
      .related-box{
        width:auto;
        margin:12px;
        padding:14px;
        border-radius:18px;
      }

      .related-head h3{
        font-size:17px;
      }

      .related-card{
        padding:12px 36px 12px 13px;
      }

      .related-card h4{
        font-size:13.5px;
      }
    }
.concept-box {
    background: #eef5fe;
    border: 1.5px solid #c1c0ff;
    border-radius: 8px;
    padding: 18px;
}
.concept-box .cb-title {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color:#b44a00;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.concept-box p, .concept-box li {
    font-size: 14.5px;
    color: #1a3a28;
    margin-bottom: 13px;
    line-height: 22px;
    list-style: circle;
}
.concept-box ul {padding-left: 20px;
}
.exam-info-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 14px;
    margin: 22px 0;
}
.exam-info-card {
    background: linear-gradient(180deg,#ffffff,#fafbff);
    border: 1px solid #e5e7ff;
    border-radius: 18px;
    padding: 17px 10px 10px;
    box-shadow: 0 8px 25px rgba(70,66,252,.07);
    transition: .3s ease;
    position: relative;
    overflow: hidden;
}
.exam-info-card:before {
    content: "";
    position: absolute;
    right: -28px;
    top: -28px;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: rgba(70,66,252,.07);
}
.exam-info-card span {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: #f0efff;
    color: #4642fc;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    font-size: 18px;
    position: relative;
    z-index: 1;
}
.exam-info-card strong {
    display: block;
    font-size: 15px;
    color: #111827;
    margin-bottom: 5px;
    position: relative;
    z-index: 1;
}
.exam-info-card p {
    color: #5b6475;
    font-size: 14px;
    line-height: 1.5;
    position: relative;
    z-index: 1;
}
.exam-highlight {
    background: linear-gradient(135deg,#f6f7ff,#eef2ff);
    border: 1px solid #dfe3ff;
    border-left: 5px solid #4642fc;
    border-radius: 18px;
    padding: 18px 20px;
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin: 22px 0;
}
.exam-highlight i {
    color: #4642fc;
    background: #fff;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    box-shadow: 0 8px 20px rgba(70,66,252,.12);
    flex-shrink: 0;
}
.exam-highlight strong {
    display: block;
    color: #111827;
    font-size: 17px;
    margin-bottom: 5px;
}
.exam-highlight p {
    color: #4b5563;
    font-size: 15px;
    line-height: 1.7;
}
.summary-points {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 12px;
}
.summary-points li {
    background: #fff;
    border: 1px solid #eceeff;
    border-radius: 15px;
    padding: 14px 15px;
    color: #374151;
    font-size: 15px;
    line-height: 1.5;
    display: flex;
    gap: 11px;
    align-items: flex-start;
    box-shadow: 0 6px 20px rgba(70,66,252,.05);
    transition: .3s ease;
}
.summary-points i {
    color: #4642fc;
    background: #f0efff;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    flex-shrink: 0;
    margin-top: 1px;
}
span.heading-span {
    background: linear-gradient(90deg, #6b45f5 0%, #3f7cff 45%, #6b45f5 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.meta-pills {
    margin-top: 22px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.pill {
    border-radius: 15px;
    padding: 10px 20px;
    display: inline-flex;
    align-items: center;
    gap: 13px;
    font-weight: 700;
    font-size: 13px;
    white-space: nowrap;
}
.pill.purple-it {
    background: #e6dfff;
    color: #5f35de;
}
.pill.blue-it {
    background: #d5e9ff;
    color: #1667d9;
}
.pill.green-it {
    background: #ecfbf5;
    color: #078564;
}
.pill.orange-it {
    background: #fff1eb;
    color: #df4e1e;
}
.main-card {
    margin-top: 30px;
    border: 1px solid #edf0f7;
    border-radius: 20px;
    background: #fff;
    padding: 22px;
    box-shadow: 0 10px 35px rgba(40,45,90,.05);
}
.section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 20px;
}

    .head-left{
      display:flex;
      gap:14px;
      align-items:flex-start;
    }

    .head-icon{
      width:48px;
      height:48px;
      border-radius:13px;
      display:grid;
      place-items:center;
      font-size:25px;
      background:#e9fbf5;
      color:#149174;
      flex:0 0 auto;
    }

    .section-head h3{
      font-size:19px;
      font-weight:800;
      margin:3px 0 5px;
      color:#071b3d;
    }

    .section-head p{
      margin:0;
      color:#34415c;
      font-weight:500;
      font-size:13px;
    }

    .count-badge{
      width:36px;
      height:36px;
      border-radius:50%;
      background:#f6f7fb;
      display:grid;
      place-items:center;
      font-weight:800;
      color:#071b3d;
      font-size:14px;
    }

   

    .chart-card .head-icon{
      background:#f2edff;
      color:#5f35de;
    }

    .tab-switch{
      background:#f6f5fd;
      border-radius:25px;
      padding:4px;
      display:flex;
      gap:5px;
    }

    .tab-switch button{
      border:0;
      padding:9px 24px;
      border-radius:22px;
      font-weight:800;
      background:transparent;
      color:#8490a5;
      font-size:13px;
    }

    .tab-switch button.active{
      background:#fff;
      color:#653cef;
      box-shadow:0 4px 14px rgba(90,70,180,.12);
    }

    .question-box{
      min-height:250px;
      border-radius:14px;
      background:#f5f1ff;
      padding:22px;
      position:relative;
      overflow:hidden;
    }

    .question-box strong{
      display:block;
      font-size:50px;
      color:#633bea;
      line-height:1;
      font-weight:800;
    }

    .question-box span{
      display:block;
      font-size:14px;
      font-weight:700;
      margin-top:12px;
    }

    .question-box small{
      display:block;
      margin-top:12px;
      color:#667085;
      font-size:12px;
      font-weight:500;
    }

    .question-box i{
      position:absolute;
      right:20px;
      bottom:18px;
      font-size:70px;
      color:#8d7ad7;
      opacity:.45;
    }

    .chart-area{
      height:250px;
      width:100%;
      position:relative;
    }

    .note-box{justify-content: center;
      margin-top:16px;
      background:#f3f0ff;
      border-radius:12px;
      padding:13px 18px;
      display:flex;
      align-items:center;
      gap:12px;
      color:#34415c;
      font-weight:500;
      font-size:13px;
    }

    .note-box i{
      color:#633bea;
      font-size:24px;
    }

    .tag-row{
      display:flex;
      align-items:center;
      gap:6px;
      margin-top: 10px;
      white-space:nowrap;
      background:#fff;
    }

    .topic-tag{
      display:inline-flex;
      align-items:center;
      gap:8px;
      font-size:12px;
      font-weight:800;
      color:#071b3d;
    }

    .topic-tag i{
      font-size:22px;
    }


    @media(max-width:991px){
      .page-wrap{
        padding:14px 12px 28px;
      }

      .hero-section{
        padding:22px;
      }

      .hero-title{
        font-size:28px;
      }

      .hero-art{
        margin-top:24px;
        height:245px;
      }

      .section-head{
        flex-direction:column;
      }

      .tab-switch{
        width:100%;
      }

      .tab-switch button{
        flex:1;
      }

      .source-total{
        min-height:180px;
      }
    }

    @media(max-width:575px){
      .page-wrap{
        padding:12px;
      }

      .breadcrumb-custom{
        border-radius:16px;
        padding:12px;
        gap:9px;
        font-size:10px;
      }

      .hero-section{
        padding:18px;
        border-radius:16px;
      }

      .hero-title{
        font-size:23px;
      }

      .hero-text{
        font-size:13px;
      }

      .hero-art{
        height:220px;
      }

      .main-card{
        padding:16px;
        border-radius:16px;
      }

      .source-item{
        align-items:flex-start;
        gap:10px;
      }

      .source-item .info{
        align-items:flex-start;
      }

      .chart-area{
        height:230px;
      }

      
    }



.text-clom-head{margin-bottom: 15px;}
.text-clom-head h4{  font-size: 25px;
    font-weight: 700;}

.text-clom-head p{      color: #475569;
    font-size: 14px;
    line-height: 1.8;}

.ca-page {padding: 40px 0;
    background: #eef5fecf;
}
.concept-box h3{font-size: 16px;}
 .timeline-section {
      padding: 30px 0;
    }

    .timeline-wrap {
      position: relative;
      padding-left: 82px;
    }

    .timeline-line {
      position: absolute;
      left: 42px;
      top: 0;
      bottom: 0;
      width: 2px;
      background: #dbe1ff;
    }

    .timeline-item {
      position: relative;
      margin-bottom: 18px;
    }

    .timeline-year {
      position: absolute;
      left: -112px;
      top: 18px;
      width: 58px;
      text-align: right;
      font-size: 12px;
      font-weight: 700;
      color: #4642fc;
    }

    .timeline-dot {
      position: absolute;
      left: -45px;
      top: 20px;
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: #fff;
      border: 3px solid #4642fc;
      z-index: 2;
    }

    .timeline-card {
      background: #fff;
      border: 1px solid #e3e6ff;
      border-radius: 12px;
      padding: 16px 18px;
      box-shadow: 0 8px 22px rgba(70, 66, 252, 0.08);
      transition: 0.3s ease;
    }

    .timeline-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 12px 28px rgba(70, 66, 252, 0.14);
      border-color: #c8ccff;
    }

    .timeline-card h3 {
      font-size: 15px;
      margin: 0 0 8px;
      font-weight: 800;
      color: #4642fc;
      line-height: 1.35;
    }

    .timeline-card p {
      margin: 0;
      font-size: 12px;
      color: #4b5563;
      line-height: 1.65;
    }

  .tag-rows {    position: relative;
    border: 1px solid #edf0f7;
    border-radius: 16px;
    background: #fff;
    padding: 18px;
    box-shadow: 0 8px 24px rgba(40, 45, 90, .04);
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 30px;
    justify-content: space-around;
}

    .tag {
      display: inline-flex;
      align-items: center;
      padding: 4px 9px;
      border-radius: 30px;
      font-size: 10px;
      font-weight: 700;
      border: 1px solid transparent;
    }

    .tag.blue {
      color: #4642fc;
      background: #eef2ff;
      border-color: #dfe3ff;
    }

    .tag.green {
      color: #16a34a;
      background: #ecfdf5;
      border-color: #bbf7d0;
    }

    .tag.red {
      color: #ef4444;
      background: #fff1f2;
      border-color: #fecdd3;
    }

    .tag.orange {
      color: #f97316;
      background: #fff7ed;
      border-color: #fed7aa;
    }

    .tag.purple {
      color: #7c3aed;
      background: #f5f3ff;
      border-color: #ddd6fe;
    }

    .timeline-item.active .timeline-card {
      border-color: #9b8cff;
      background: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%);
      box-shadow: 0 10px 28px rgba(70, 66, 252, 0.15);
    }

    .timeline-item.active .timeline-dot {
      background: #4642fc;
      box-shadow: 0 0 0 5px rgba(70, 66, 252, 0.12);
    }

    @media (max-width: 576px) {
      .timeline-section {
        padding: 20px 10px;
      }

      .timeline-wrap {
        padding-left: 55px;
      }

      .timeline-line {
        left: 28px;
      }

      .timeline-year {
        position: relative;
        left: 0;
        top: 0;
        width: auto;
        text-align: left;
        margin-bottom: 6px;
        font-size: 12px;
      }

      .timeline-dot {
        left: -32px;
        top: 28px;
      }

      .timeline-card {
        padding: 14px;
      }

      .timeline-card h3 {
        font-size: 14px;
      }

      .timeline-card p {
        font-size: 11px;
      }
    }
 .comparison-table thead th {
    background: #eef5fe;
    color: var(--primary-color-2);
    font-size: 14px;
    font-weight: 800;
    padding: 10px 26px;
    border-bottom: 1px solid #ddd8ff;
    white-space: nowrap;
}
.comparison-table {
       background: #ffffff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 8px 28px rgba(70, 66, 252, 0.10);
    border: 1px solid #ececff;
}
.comparison-table td{font-size: small;  padding: 10px 26px;}
.comparison-table th{font-size: small;  padding: 10px 26px;}
.article-card h6 {
    font-size: 19px;
    margin-bottom: 9px;
}

    .climate-card {
      background: #ffffff;
      border-radius: 22px;
      padding: 28px 30px;
      margin-bottom: 18px;
      box-shadow: 0 10px 28px rgba(99, 102, 241, 0.10);
      border: 1px solid transparent;
      transition: all 0.3s ease;
    }


      .content-box p {
           margin: 0;
    font-size: 12px;
    color: #4b5563;
    line-height: 1.65;
      }
    .climate-card:first-child {
      border-color: #b79cff;
      box-shadow: 0 14px 32px rgba(124, 58, 237, 0.16);
    }

    .climate-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 16px 35px rgba(99, 102, 241, 0.16);
    }

    .year-box {
      min-width: 95px;
      text-align: center;
    }

    .year-box h2 {
      margin: 0;
      font-size: 32px;
      line-height: 1;
      font-weight: 700;
      color: var(--primary-color-2);
      
    }

    .year-box span {
      display: block;
      margin-top: 9px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 1px;
      color: #9aa8bf;
    }

    .content-box {
      padding-left: 28px;
      padding-right: 20px;
    }

    .content-box h3 {
      margin: 0 0 5px;
      font-size: 18px;
      color: #1f2937;
      
    }

    .tags {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 6px 16px;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
    }

    .tags-gray {
      color: #94a3b8;
      background: #f1f5f9;
      border: 1px solid #dbe2ee;
    }

    .tags-green {
      color: #10b981;
      background: #e9fbf5;
      border: 1px solid #a7f3d0;
    }

    .tags-orange {
      color: #f59e0b;
      background: #fff7ed;
      border: 1px solid #fed7aa;
    }

    .highlight {
      color: #7c3aed;
      background: #f1e8ff;
      padding: 1px 5px;
      border-radius: 5px;
      font-weight: 600;
    }

    @media (max-width: 991px) {
      .climate-card {
        padding: 24px;
      }

      .content-box {
        padding-left: 18px;
      }

      .year-box h2 {
        font-size: 32px;
      }
    }

    @media (max-width: 767px) {
      .timeline-section {
        padding: 12px;
      }

      .climate-card {
        border-radius: 18px;
        padding: 20px;
      }

      .card-inner {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 15px;
      }

      .year-box {
        min-width: auto;
        text-align: left;
      }

      .year-box h2 {
        font-size: 34px;
      }

      .content-box {
        padding: 0;
      }

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

      .tags {
        margin-top: 4px;
      }
    }

.Pledges-box {
    background: #fff;
    border: 1px solid #e3e6ff;
    border-radius: 12px;
    padding: 22px 24px;
    box-shadow: 0 8px 22px rgba(70, 66, 252, 0.08);
    transition: 0.3s ease;
}
    .Pledges-head {
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 15px;
    }

    .Pledges-icon {
      width: 47px;
      height: 47px;
      border-radius: 10px;
      background: #dbe8ff;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #2563ff;
      font-size: 25px;
      flex: 0 0 auto;
    }

    .Pledges-head h2 {
      margin: 0;
      color:#4642fc;
      font-size: 19px;
      font-weight: 800;
      line-height: 1.2;
      
    }

    .Pledges-head p {
      margin: 5px 0 0;
      color: #53657c;
      font-size: 14px;
      font-weight: 500;
    }

    .pledge-card {
      background: #ffffff;
      border-radius: 8px;
      padding: 17px 15px 18px;
      min-height: 120px;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      box-shadow: 0 10px 22px rgba(33, 71, 168, 0.09);
      border: 1px solid rgba(228, 232, 245, 0.9);
      transition: 0.3s ease;
    }

    .pledge-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 16px 28px rgba(33, 71, 168, 0.14);
    }

    .pledge-card h3 {
      margin: 0 0 5px;
      font-size: 20px;
      line-height: 1;
     color:#4642fc;
      font-weight: 700;
      
    }

    .pledge-card p {
      margin: 0;
      color: #475c78;
      font-size: 13px;
      line-height: 1.25;
      font-weight: 500;
    }

    @media (max-width: 991px) {
      .Pledges-section {
        padding: 15px;
      }

      .Pledges-box {
        padding: 25px 20px;
      }

      .Pledges-head h2 {
        font-size: 21px;
      }
    }

    @media (max-width: 575px) {
      .Pledges-box {
        border-radius: 16px;
        padding: 22px 16px;
      }

      .Pledges-head {
        align-items: flex-start;
      }

      .Pledges-icon {
        width: 42px;
        height: 42px;
        font-size: 22px;
      }

      .Pledges-head h2 {
        font-size: 18px;
      }

      .Pledges-head p {
        font-size: 13px;
      }

      .pledge-card h3 {
        font-size: 25px;
      }
    }

    .info-card{
      background:#fff;
      border:1px solid #e3e7ff;
      border-radius:10px;
      box-shadow:0 8px 22px rgba(76, 66, 252, .08);
      padding:18px 20px;
      margin-bottom:16px;
    }

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

    .card-tag{
      font-size:11px;
      font-weight:700;
      letter-spacing:.9px;
      color:#4642fc;
      text-transform:uppercase;
      background:#f2f1ff;
      padding:4px 9px;
      border-radius:4px;
    }

    .card-note{
      font-size:11px;
      color:#8c93b3;
      font-weight:600;
    }

    .data-row{
      display:grid;
      grid-template-columns:88px 1fr;
      gap:14px;
      padding:11px 0;
      border-bottom:1px solid #e8ebfb;
    }

    .data-row:last-child{
      border-bottom:0;
      padding-bottom:0;
    }

    .big-number{
      color:#4642fc;
      font-size:20px;
      line-height:1;
      font-weight:700;
      white-space:nowrap;
      padding-top:2px;
    }

    .big-number small{
      font-size:14px;
      font-weight:700;
    }

    .row-content h4{
      margin:0 0 4px;
      font-size:14px;
      font-weight:700;
      color:#17224c;
      line-height:1.35;
    }

    .row-content p{
      margin:0 0 7px;
      font-size:11.5px;
      color:#69718f;
      line-height:1.55;
    }

    .mini-source{
      display:inline-flex;
      align-items:center;
      gap:5px;
      font-size:10px;
      font-weight:700;
      color:#7d82a6;
      background:#f8f9ff;
      border:1px solid #dde2ff;
      padding:3px 8px;
      border-radius:3px;
    }

    .mini-source i{
      color:#4642fc;
      font-size:10px;
    }

    .simple-row{
      display:grid;
      grid-template-columns:80px 1fr;
      gap:10px;
      padding:13px 0;
      border-bottom:1px solid #e8ebfb;
    }

    .simple-row:last-child{
      border-bottom:0;
      padding-bottom:0;
    }

    .left-label{
      color:#4642fc;
      font-size:13px;
      font-weight:700;
      white-space:nowrap;
      padding-top:2px;
    }

    .case-body h4{
      margin:0 0 6px;
      font-size:14px;
      font-weight:700;
      color:#17224c;
      line-height:1.35;
    }

    .case-body p{
      margin:0 0 8px;
      font-size:11.5px;
      color:#69718f;
      line-height:1.55;
    }

    .case-study p{
      margin:0 0 11px;
      font-size:12px;
      color:#37415f;
      line-height:1.7;
    }

    .case-study p:last-child{
      margin-bottom:0;
    }

    .case-study strong{
      color:#152049;
    }

    @media(max-width:576px){
      .report-area{
        padding:12px 8px 22px;
      }

      .info-card{
        padding:15px 13px;
        border-radius:9px;
      }

      .card-top{
        align-items:flex-start;
        flex-direction:column;
        gap:6px;
      }

      .data-row,
      .simple-row{
        grid-template-columns:1fr;
        gap:6px;
      }

      .big-number{
        font-size:18px;
      }

      .left-label{
        font-size:13px;
      }

      .row-content h4,
      .case-body h4{
        font-size:13.5px;
      }
    }

    .pyq-tabs {
      border-bottom: none;
      gap: 10px;
      margin-bottom: 14px;
    }

    .pyq-tabs .nav-link {
      border: 0;
      color: #374151;
      background: #fff;
      font-size: 12px;
      font-weight: 700;
      padding: 9px 16px;
      border-radius: 4px;
      box-shadow: 0 4px 14px rgba(0,0,0,0.06);
    }

    .pyq-tabs .nav-link.blue-tab.active {
      background: var(--primary-color-2);
      color: #fff;
    }

    .pyq-tabs .nav-link.purple-tab.active {
      background: #8c22c6;
      color: #fff;
    }

    .section-title-it {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 10px;
      border-bottom: 2px solid #0b63b6;
      padding-bottom: 4px;
    }

    .section-title-it.purple {
      border-bottom-color: #9d35d9;
    }

    .tag-it {
      color: #fff;
      font-size: 11px;
      font-weight: 700;
      padding: 5px 10px;
      border-radius: 2px;
      text-transform: uppercase;
      line-height: 1;
      white-space: nowrap;
    }

    .tag-it.blue {
      background: var(--primary-color-2);
    }

    .tag-it.purple {
      background: #8c22c6;
    }

    .section-title-it span {
      font-size: 11px;
      color: #374151;
      font-weight: 600;
    }

    .pyq-card {
      padding: 14px;
      margin-bottom: 14px;
          background: #fff;
    border: 1px solid #e3e6ff;
    border-radius: 12px;
    box-shadow: 0 8px 22px rgba(70, 66, 252, 0.08);
    }

    .pyq-card.purple-card {
      background: #f8e9ff;
      border-color: #c946ee;
    }

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

    .year {
      background: #ffffff;
      border: 1px solid rgba(0,0,0,0.08);
      font-size: 12px;
      font-weight: 700;
      padding: 6px 12px;
      border-radius: 2px;
      color: #0f3765;
      min-width: 55px;
      text-align: center;
    }

    .purple-card .year {
      color: #8c22c6;
    }

    .paper {
      font-size: 11px;
      color: #374151;
      font-weight: 600;
      text-align: right;
    }

    .question-text {
      font-size: 13px;
      line-height: 1.55;
      color: #111827;
      margin-bottom: 12px;
    }

    .question-text strong {
      color: #0f172a;
    }

    .option-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      margin-bottom: 10px;
    }

  .option-box {
    background: #f0f9ff;
    border: 1px solid #e5e5e5;
    color: #1f2937;
    padding: 8px 10px;
    border-radius: 3px;
    font-size: 12px;
    line-height: 1.45;
    min-height: 42px;
}

    .answer {
      font-size: 12px;
      color: #064b86;
      font-weight: 700;
      margin-top: 8px;
    }

    .mains-question {
    background: #f0f9ff;
      border-radius: 4px;
      padding: 9px 10px;
      margin-top: 10px;
      border-left: 3px solid var(--primary-color-2);
      font-size: 12px;
      line-height: 1.5;
    }

    .mains-question i {
      color: #f59e0b;
      margin-right: 5px;
    }

    @media (max-width: 768px) {
      .card-top {
        align-items: flex-start;
      }

      .paper {
        font-size: 10px;
      }

      .option-grid {
        grid-template-columns: 1fr;
      }

      .question-text {
        font-size: 12px;
      }

      .section-title-it {
        align-items: flex-start;
        flex-wrap: wrap;
      }

      .pyq-tabs .nav-link {
        padding: 8px 12px;
        font-size: 11px;
      }
    }



    .process-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 18px;
    }

    .process-item {
      text-align: center;
      min-width: 120px;
    }

    .icon-boxs {background: #fff;
      width: 48px;
      height: 48px;
      margin: 0 auto 12px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
    }


    .process-item p {
      font-size: 13px;
      color: #1f2937;
      font-weight: 500;
      line-height: 1.3;
    }

  

    /* Responsive */
    @media (max-width: 768px) {
      .process-wrap {
        gap: 12px;
      }

     
      .icon-box {
        width: 52px;
        height: 52px;
        font-size: 23px;
        border-radius: 14px;
      }

      .process-item p {
        font-size: 12px;
      }

      
    }

    @media (max-width: 575px) {
        .process-wrap {
        gap: 14px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

     
    }

    .Modulest-section {
      max-width: 850px;
      margin: auto;
    }

    .Modulest-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 10px 70px;
    }

    .Modulest-item {
      display: flex;
      align-items: flex-start;
      gap: 18px;
    }

    .Modulest-icon {
      width: 38px;
      height: 38px;
      min-width: 38px;
      border-radius: 10px;
      background: #f1efff;
      color: #5a3cff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 15px;
      box-shadow: 0 8px 22px rgba(90, 60, 255, 0.12);
    }

    .Modulest-content h3 {
      font-size: 13px;
      font-weight: 700;
      color: #1f2937;
      margin-bottom: 5px;
      line-height: 1.2;
    }

    .Modulest-content p {
      font-size: 9px;
      color: #4b5563;
      line-height: 1.55;
      font-weight: 500;
    }

    @media (max-width: 768px) {
      .Modulest-grid {
        gap: 28px 35px;
      }

      .Modulest-icon {
        width: 54px;
        height: 54px;
        min-width: 54px;
        font-size: 23px;
      }

      .Modulest-content h3 {
        font-size: 16px;
      }

      .Modulest-content p {
        font-size: 14px;
      }
    }

    @media (max-width: 575px) {

      .Modulest-grid {
        grid-template-columns: 1fr;
        gap: 24px;
      }

      .Modulest-item {
        gap: 15px;
      }

      .Modulest-icon {
        width: 50px;
        height: 50px;
        min-width: 50px;
        font-size: 22px;
      }

      .Modulest-content h3 {
        font-size: 15px;
        margin-bottom: 6px;
      }

      .Modulest-content p {
        font-size: 13px;
      }
    }

    .breadcrumb-wrap {
      padding: 18px 0;
      background: #fff;
      border-bottom: 1px solid #f1f1f5;
    }

    .custom-breadcrumb {
      display: flex;
      align-items: center;
      gap: 14px;
      margin: 0;
      padding: 0;
      list-style: none;
      flex-wrap: wrap;
    }

    .custom-breadcrumb li {
      display: flex;
      align-items: center;
      gap: 14px;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.3px;
      text-transform: uppercase;
      color: #25345d;
      white-space: nowrap;
    }

    .custom-breadcrumb li a {
      color: #25345d;
      text-decoration: none;
      transition: 0.25s ease;
    }

    .custom-breadcrumb li a:hover {
      color: #4642fc;
    }

    .home-icon {
      width: 34px;
      height: 34px;
      border-radius: 10px;
      background: #f1efff;
      color: #5b45f5;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      box-shadow: 0 4px 14px rgba(70, 66, 252, 0.12);
    }

    .breadcrumb-arrow {
      color: #9aa2b8;
      font-size: 12px;
    }

    @media (max-width: 575px) {
      .breadcrumb-wrap {
        padding: 14px 0;
      }

      .custom-breadcrumb {
        gap: 3px;
      }

      .custom-breadcrumb li {
        gap: 2px;
        font-size: 11px;
      }
.hero-it p{font-size: small;}
.source-card i{font-size: 16px !important;margin-bottom: 8px !important; }
.source-card strong{margin-bottom: 8px !important; }
.source-card h3{margin-bottom: 8px !important; }
    .hero-it h1 {
       margin-bottom: 5px !important;
    }
    .pill {
    border-radius: 15px;
    padding: 4px 5px;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-weight: 600;
    font-size: 7px;
    white-space: nowrap;
}
.head-icon{display: none;}
.section-head{gap: 5px;}
      .home-icon {
        width: 30px;
        height: 30px;
        font-size: 14px;
      }
    }


    .source-section {
      padding: 14px 10px;
      background: linear-gradient(180deg, #f4fffb 0%, #f8fbff 100%);
    }

 

    .source-top {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 18px;
    }

    .count-box {
      width: 50px;
      height: 50px;
      border-radius: 14px;
      background: linear-gradient(135deg, #13b97b, #26c48a);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      font-weight: 800;
      box-shadow: 0 8px 22px rgba(19, 185, 123, 0.25);
      flex-shrink: 0;
    }

    .source-title-icon {
      width: 50px;
      height: 50px;
      border-radius: 50%;
      background: #e8fff6;
      color: #22b97c;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 23px;
      border: 1px solid rgba(34, 185, 124, 0.18);
      flex-shrink: 0;
    }

    .source-heading {
      flex: 1;
    }

    .source-heading h2 {
      font-size: 22px;
      font-weight: 800;
      margin: 0 0 4px;
      color: #212344;
    }

    .source-heading p {
      margin: 0;
      font-size: 13px;
      color: #6d7285;
      font-weight: 500;
    }

    .source-badge {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-shrink: 0;
    }

    .total-badge {
      background: #ffffff;
      color: #27b77d;
      font-size: 12px;
      font-weight: 700;
      padding: 9px 14px;
      border-radius: 30px;
      box-shadow: 0 6px 18px rgba(20, 70, 50, 0.08);
      border: 1px solid rgba(39, 183, 125, 0.13);
    }

  

    .source-card {
      height: 100%;    text-align: center;
      background: #ffffff;
      border-radius: 16px;
      padding: 20px 15px 18px;
      border: 1px solid rgba(30, 65, 90, 0.08);
      box-shadow: 0 10px 26px rgba(31, 48, 74, 0.06);
      transition: all 0.3s ease;
      position: relative;
      overflow: hidden;
      cursor: pointer;
    }

    .source-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 16px 36px rgba(31, 48, 74, 0.11);
    }

    .source-card i {
      font-size: 34px;
      margin-bottom: 13px;
      display: inline-block;
    }

    .source-card h3 {
      font-size: 13px;
      line-height: 1.35;
      font-weight: 800;
      color: #272943;
      margin: 0 0 12px;
      min-height: 36px;
    }

    .source-card strong {
      display: block;
      font-size: 21px;
      line-height: 1;
      font-weight: 800;
      margin-bottom: 12px;
    }

    .source-card p {
      font-size: 12px;
      line-height: 1.45;
      color: #60677a;
      margin: 0;
      font-weight: 500;
    }

    .greens i,
    .greens strong {
      color: #24b579;
    }

    .blues i,
    .blues strong {
      color: #336bff;
    }

    .purples i,
    .purples strong {
      color: #6a43ef;
    }

    .oranges i,
    .oranges strong {
      color: #ff6b2c;
    }

    .yellow i,
    .yellow strong {
      color: #ffb640;
    }

    .source-modal .modal-content {
      border: 0;
      border-radius: 22px;
      overflow: hidden;
      box-shadow: 0 22px 60px rgba(25, 35, 60, 0.18);
    }

    .source-modal .modal-header {
      background: linear-gradient(135deg, #f4fffb, #f7f8ff);
      border-bottom: 1px solid rgba(30, 65, 90, 0.08);
      padding: 18px 22px;
    }

    .source-modal .modal-title {
      font-size: 18px;
      font-weight: 800;
      color: #20243a;
    }

    .url-list {
      display: grid;
      gap: 12px;
    }

    .url-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 13px 14px;
      border-radius: 14px;
      background: #f8fafc;
      border: 1px solid rgba(30, 65, 90, 0.08);
      text-decoration: none;
      color: #252942;
      transition: 0.25s ease;
    }

    .url-item:hover {
      background: #eef7ff;
      color: #336bff;
      transform: translateX(4px);
    }

    .url-item i {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      background: #ffffff;
      color: #336bff;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      box-shadow: 0 6px 16px rgba(30, 65, 90, 0.08);
    }

    .url-item span {
      font-size: 14px;
      font-weight: 700;
      word-break: break-word;
    }

    @media (max-width: 991px) {
      .source-top {
        flex-wrap: wrap;
      }

      .source-badge {
        margin-left: auto;
      }
    }

    @media (max-width: 575px) {
      .source-section {
        padding: 18px 8px;
      }

      .source-top {
        gap: 10px;
      }

      .count-box,
      .source-title-icon {
        width: 42px;
        height: 42px;
        border-radius: 12px;
        font-size: 18px;
      }

      .source-title-icon {
        border-radius: 50%;
      }

      .source-heading h2 {
        font-size: 18px;
      }

      .source-heading p {
        font-size: 12px;
      }

      .source-badge {
        width: 100%;
        justify-content: flex-end;
      }

      .source-card {
        padding: 13px 9px;
      }
      .source-card h3 {
    font-size: 12px;
    line-height: 1.15;
    font-weight: 700;
}
.source-card p {
    font-size: 9px;}
    }
    .table-card{    background: #ffffff;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #6366f121;
    margin: 18px 0;
    box-shadow: 0 1px 4px rgba(99, 102, 241, 0.07), 0 4px 16px rgba(99, 102, 241, 0.05);}


      .dimension-card {
      height: 100%;
      min-height: 294px;
      border-radius: 14px;
      padding: 20px 22px;
      box-shadow: 0 6px 18px rgba(28, 44, 88, 0.05);
      transition: 0.3s ease;
      position: relative;
      overflow: hidden;
    }

    .dimension-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 12px 28px rgba(28, 44, 88, 0.09);
    }

    .dimension-card::after {
      content: "";
      width: 90px;
      height: 90px;
      border-radius: 50%;
      position: absolute;
      right: -35px;
      top: -35px;
      opacity: 0.45;
    }

    .image-icon {
      width: 64px;
      height: 64px;
      border-radius: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 18px;
      position: relative;
      z-index: 1;
    }

    .image-icon img {
      width: 48px;
      height: 48px;
      object-fit: contain;
      display: block;
    }

    .dimension-card h4 {
      font-size: 14px;
      font-weight: 800;
      color: #172033;
      margin: 0 0 12px;
      position: relative;
      z-index: 1;
    }

    .dimension-card p {
      font-size: 13px;
      line-height: 1.72;
      margin: 0;
      color: #27364d;
      font-weight: 500;
      position: relative;
      z-index: 1;
    }

    .economic {
      border: 1px solid #ffd9ad;
      background: linear-gradient(145deg, #fffdf8, #fff9f0);
    }

    .economic .image-icon {
      background: #fff1dc;
    }

    .economic::after {
      background: #ffd08c;
    }

    .environment {
      border: 1px solid #bdeee4;
      background: linear-gradient(145deg, #f8fffd, #effbf8);
    }

    .environment .image-icon {
      background: #dcfff7;
    }

    .environment::after {
      background: #9beedd;
    }

    .social {
      border: 1px solid #b8defc;
      background: linear-gradient(145deg, #f7fcff, #eef8ff);
    }

    .social .image-icon {
      background: #dff2ff;
    }

    .social::after {
      background: #a8dfff;
    }

    .security {
      border: 1px solid #ffc6d6;
      background: linear-gradient(145deg, #fff9fb, #fff1f6);
    }

    .security .image-icon {
      background: #ffe4ec;
    }

    .security::after {
      background: #ffb7ca;
    }

    .geopolitical {
      border: 1px solid #cbd0ff;
      background: linear-gradient(145deg, #f9faff, #f3f5ff);
    }

    .geopolitical .image-icon {
      background: #e7e9ff;
    }

    .geopolitical::after {
      background: #b7bdff;
    }

    .ethical {
      border: 1px solid #dccbff;
      background: linear-gradient(145deg, #fbf9ff, #f7f2ff);
    }

    .ethical .image-icon {
      background: #eee4ff;
    }

    .ethical::after {
      background: #d0b7ff;
    }

    @media (max-width: 991px) {
      .analysis-title h2 {
        font-size: 32px;
      }

      .dimension-card {
        min-height: auto;
      }
    }

    @media (max-width: 575px) {
      .analysis-section {
        padding: 18px 12px;
      }

      .analysis-title h2 {
        font-size: 28px;
      }

      .analysis-title p {
        font-size: 12px;
      }

      .dimension-card {
        padding: 18px;
      }

      .image-icon {
        width: 58px;
        height: 58px;
      }

      .image-icon img {
        width: 44px;
        height: 44px;
      }
    }

    .path-card {
      height: 100%;
      background: rgba(255, 255, 255, 0.96);
      border: 1px solid rgba(255, 255, 255, 0.9);
      border-radius: 18px;
      padding: 26px 24px 22px;
      box-shadow: 0 14px 35px rgba(45, 63, 108, 0.08);
      position: relative;
      overflow: hidden;
      transition: all 0.35s ease;
    }

    .path-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(70, 66, 252, 0.08), transparent 45%);
      opacity: 0;
      transition: all 0.35s ease;
      pointer-events: none;
    }

    .path-card::after {
      content: "";
      width: 100px;
      height: 100px;
      border-radius: 50%;
      background: rgba(70, 66, 252, 0.06);
      position: absolute;
      right: -42px;
      top: -42px;
    }

    .path-card:hover {
      transform: translateY(-7px);
      box-shadow: 0 22px 45px rgba(45, 63, 108, 0.14);
      border-color: rgba(70, 66, 252, 0.16);
    }

    .path-card:hover::before {
      opacity: 1;
    }

    .term-badge {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 8px 13px;
      border-radius: 9px;
      font-size: 10px;
      line-height: 1;
      font-weight: 800;
      letter-spacing: 1.4px;
      text-transform: uppercase;
      margin-bottom: 18px;
      position: relative;
      z-index: 2;
    }

    .term-badge i {
      font-size: 10px;
    }

    .short {
      color: #00b982;
      background: #e9fff5;
    }

    .medium {
      color: #ff9b00;
      background: #fff4df;
    }

    .long {
      color: #6c42ff;
      background: #f0ecff;
    }

    .global {
      color: #00a7e8;
      background: #e9f8ff;
    }

    .recommend-list {
      list-style: none;
      padding: 0;
      margin: 0;
      position: relative;
      z-index: 2;
    }

    .recommend-list li {
      display: flex;
      gap: 12px;
      padding: 10px 0;
      border-bottom: 1px solid #edf0f7;
      color: #33405c;
      font-size: 13px;
      line-height: 1.45;
      font-weight: 500;
    }

    .recommend-list li:first-child {
      padding-top: 0;
    }

    .recommend-list li:last-child {
      border-bottom: 0;
      padding-bottom: 0;
    }

    .list-icon {
      width: 18px;
      height: 18px;
      min-width: 18px;
      border-radius: 50%;
      background: linear-gradient(135deg, #7b61ff, #4642fc);
      color: #fff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 8px;
      margin-top: 2px;
      box-shadow: 0 6px 13px rgba(70, 66, 252, 0.22);
    }

    .path-card:hover .list-icon {
      transform: scale(1.06);
    }

    @media (max-width: 991px) {
      .section-title h2 {
        font-size: 38px;
      }

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

    @media (max-width: 575px) {
      .path-ahead-section {
        padding: 32px 0;
      }

      .section-title {
        margin-bottom: 24px;
      }

      .section-title h2 {
        font-size: 34px;
      }

      .section-title p {
        font-size: 13px;
        line-height: 1.5;
      }

      .path-card {
        border-radius: 15px;
        padding: 22px 18px;
      }

      .recommend-list li {
        font-size: 13px;
        gap: 10px;
      }

      .list-icon {
        width: 20px;
        height: 20px;
        min-width: 20px;
        font-size: 8px;
      }
    }

    .climate-section{
      padding:35px 0;
    }

    .infos-cards{
      height:100%;
      border-radius:18px;
      background:#fff;
      overflow:hidden;
      position:relative;
      box-shadow:0 15px 38px rgba(24,32,56,0.08);
      transition:0.3s ease;
    }

    .infos-cards:hover{
      transform:translateY(-5px);
      box-shadow:0 22px 50px rgba(24,32,56,0.13);
    }

    .challenge-cards{
        border: 1px solid #ffd9ad;
    background: linear-gradient(145deg, #fffdf8, #fff9f0);
    }

    .way-cards{    border: 1px solid #b8defc;
    background: linear-gradient(145deg, #f7fcff, #eef8ff);
    }


    .cards-head{
      padding:24px 24px 17px;
      display:flex;
      align-items:center;
      gap:15px;
      border-bottom:1px dashed rgba(0,0,0,0.12);
    }

.titles-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

    .challenge-cards .titles-icon{
      background:linear-gradient(135deg,#fff0f0,#ffffff);
      border:2px solid #ffd0d0;
      color:#e84c4c;
      box-shadow:0 12px 28px rgba(232,76,76,0.14);
    }

    .way-cards .titles-icon{
      background:linear-gradient(135deg,#079654,#18c577);
      color:#fff;
      box-shadow:0 14px 30px rgba(7,150,84,0.24);
    }

    .titles-icon::after{
      content:"";
      position:absolute;
      inset:-7px;
      border-radius:15px;
    }

    .challenge-cards .titles-icon::after{
      border:2px solid rgba(232,76,76,0.13);
    }

    .way-cards .titles-icon::after{
      border:2px solid rgba(7,150,84,0.16);
    }

    .titles-icon i{
      font-size:25px;
      position:relative;
      z-index:1;
    }

  .titles-badge {
    position: absolute;
    right: -9px;
    bottom: -9px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid #fff;
    font-size: 4px;
    z-index: 2;
}

    .challenge-cards .titles-badge{
      background:#e84c4c;
      color:#fff;
    }

    .way-cards .titles-badge{
      background:#fff;
      color:#079654;
      box-shadow:0 6px 16px rgba(0,0,0,0.12);
    }
.way-cards .titles-badge i{font-size: 12px;}
    .cards-head h3{
      margin:0;
      
      font-size:18px;
      font-weight:700;
      text-transform:uppercase;
      letter-spacing:1.3px;
      line-height:1.15;
    }

    .challenge-cards h3{
      color:#e84c4c;
    }

    .way-cards h3{
      color:#078d4f;
    }

  

    .cards-content{
      padding:22px 25px 25px;
    }

    .content-list{
      padding:0;
      margin:0;
      list-style:none;
    }

    .content-list li{
      position:relative;
      padding-left:27px;
      margin-bottom:15px;
      font-size:15px;
      line-height:1.5;
    }

    .content-list li:last-child{
      margin-bottom:0;
    }

    .content-list li::before{
      content:"";
      position:absolute;
      left:4px;
      top:10px;
      width:8px;
      height:8px;
      border-radius:50%;
    }

    .challenge-cards .content-list li::before{
      background:#e84c4c;
      box-shadow:0 0 0 6px rgba(232,76,76,0.10);
    }

    .way-cards .content-list li::before{
      background:#079654;
      box-shadow:0 0 0 6px rgba(7,150,84,0.10);
    }

    .content-list strong{
      font-weight:900;
      color:#262626;
    }

    .content-list em{
      color:#555;
    }

    @media(max-width:991px){
      .climate-section{
        padding:24px 0;
      }

      .cards-head h3{
        font-size:23px;
      }
    }

    @media(max-width:575px){
      .infos-cards{
        border-radius:15px;
      }

      .cards-head{
        padding:21px 17px 15px;
        gap:13px;
      }

      .titles-icon{
        width:52px;
        height:52px;
        min-width:52px;
        border-radius:16px;
      }

      .titles-icon i{
        font-size:13px;
      }

      .titles-badge{
        width:24px;
        height:24px;
        font-size:10px;
        right:-7px;
        bottom:-7px;
      }

      .cards-head h3{
        font-size:18px;
        letter-spacing:0.9px;
      }

      .titles-line{
        width:85px;
        height:3px;
      }

      .cards-content{
        padding:19px 17px 21px;
      }

      .content-list li{
        font-size:14px;
        line-height:1.55;
        padding-left:24px;
      }
    }
    .work-it-strip{
    background:#fff;
    border-radius:20px;
    margin-top:-65px;
    position:relative;
    z-index:5;
    box-shadow:0 8px 25px rgba(0,0,0,.08);

    display:flex;
    align-items:center;
    justify-content:space-between;
    overflow:hidden;
}
.work-it-boxs h4 {
    font-size: 14px;
}
.work-it-boxs p {
    line-height: normal;
    font-size: 10px;
}
.work-it-boxs{
    flex:1;
    text-align:center;
    padding:12px 6px;
    position:relative;
}

.work-it-boxs:not(:last-child)::after{
    content:"";
    position:absolute;
    right:0;
    top:20%;
    width:1px;
    height:60%;
    background:#e5e7eb;
}

.work-it-boxs i{
    font-size:22px;
    margin-bottom:6px;
}

.work-it-boxs .fa-clock{
    color:#6a4cff;
}

.work-it-boxs .fa-arrow-trend-up{
    color:#ff7a21;
}

.circle-score{
    width:44px;
    height:44px;
    border-radius:50%;
    margin:0 auto 6px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
}

.circle-score::after{
    content:"";
    position:absolute;
    inset:5px;
    background:#fff;
    border-radius:50%;
}

.circle-score span{
    position:relative;
    z-index:2;
    font-size:11px;
    font-weight:700;
    color:#111827;
}

.blue-it{
    background:conic-gradient(#3b82f6 88%, #e5e7eb 0);
}

.green-it{
    background:conic-gradient(#10b981 82%, #e5e7eb 0);
}

.stat-label{
    display:block;
    font-size:9px;
    font-weight:700;
    color:#6b7280;
    text-transform:uppercase;
    line-height:1.2;
    letter-spacing:.4px;
    margin-bottom:4px;
}

.stat-value{
    font-size:14px;
    font-weight:800;
    color:#111827;
    line-height:1.2;
    margin:0;
}

.trending-date{
    font-size:12px;
    white-space:nowrap;
}

@media(max-width:768px){
.footer-subscribe .common-btn {
    padding: 9px;
    font-size: 10px;
}
.footer-subscribe .common-btn svg {
    width: 16px;        gap: 2px;
}
    .work-it-strip{
        flex-wrap:wrap;
    }

    .work-it-boxs{
        flex:0 0 50%;
        max-width:50%;
        border-bottom:1px solid #e5e7eb;
    }

    .work-it-boxs:nth-child(2)::after{
        display:none;
    }

    .work-it-boxs:nth-child(4){
        border-bottom:none;
    }

    .work-it-boxs:nth-child(3)::after{
        display:none;
    }
}

        .subjects-section {
            padding: 65px 0px 0px;
        }

        .subjects-layout {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 330px;
            gap: 30px;
            margin: auto;
            align-items: stretch;
        }

        /* =================================
           LEFT MAIN SECTION
        ================================= */

        .subjects-main {
            padding: 38px 45px 35px;
            background: #ffffff;
            border: 1px solid #efeff8;
            border-radius: 28px;
            box-shadow: 0 12px 45px rgba(67, 63, 226, 0.08);
        }

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

        .subject-card {
            position: relative;
            padding: 17px 15px 16px;
            background: #ffffff;
            border: 1px solid #e9eaf2;
            border-radius: 17px;
            text-align: center;
            overflow: hidden;
            transition: all 0.3s ease;
        }

        .subject-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(
                145deg,
                rgba(79, 70, 229, 0.045),
                transparent 50%
            );
            opacity: 0;
            transition: 0.3s ease;
        }

        .subject-card:hover {
            transform: translateY(-6px);
            border-color: rgba(79, 70, 229, 0.25);
            box-shadow: 0 18px 35px rgba(55, 48, 190, 0.1);
        }

        .subject-card:hover::before {
            opacity: 1;
        }

        .icon-articles {
            position: relative;
            z-index: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 47px;
            height: 47px;
            margin: 0 auto 10px;
            border-radius: 50%;
            font-size: 18px;
        }

        .subject-card h3 {
            position: relative;
            z-index: 1;
            margin: 0 0 8px;
            color: #13162a;
            font-size: 14px;
            font-weight: 600;
        }

        .article-count {
            position: relative;
            z-index: 1;
            display: block;line-height: 22px;
            margin-bottom: 11px;
            color: #777d91;
            font-size: 12px;
        }

        .subject-card p {
            position: relative;
            z-index: 1;
            min-height: 43px;
            margin: 0 0 12px;
            color: #71768a;
            font-size: 12px;
            line-height: 1.55;
        }

        .explore-link {
            position: relative;
            z-index: 1;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: #5147f5;
            font-size: 13px;
            font-weight: 600;
            text-decoration: none;
        }

        .explore-link i {
            transition: 0.25s ease;
        }

        .subject-card:hover .explore-link i {
            transform: translateX(4px);
        }

        /* Icon Colors */

        .purple-articles {
            color: #7047e8;
            background: #f0eaff;
        }

        .green-articles {
            color: #27bf77;
            background: #e9fbf2;
        }

        .orange-articles {
            color: #ed8737;
            background: #fff1e5;
        }

        .violet {
            color: #7b45e9;
            background: #f2eaff;
        }

        .leaf-green-articles {
            color: #24bd77;
            background: #e7faf1;
        }

        .history-orange-articles {
            color: #e68b3f;
            background: #fff0e5;
        }

        .pink-articles {
            color: #e85189;
            background: #fff0f6;
        }

        .cyan-articles {
            color: #16b9aa;
            background: #e8fbf8;
        }

        .blue-articles {
            color: #3478e5;
            background: #eaf2ff;
        }

        .star-purple-articles {
            color: #6755ec;
            background: #efedff;
        }

        /* Bottom CTA */

        .subject-cta {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 22px;
            margin-top: 28px;
            padding: 20px 25px;
            background: linear-gradient(90deg, #f5f3ff, #f8f7ff);
            border-radius: 15px;
        }

        .cta-left {
            display: flex;
            align-items: center;
            gap: 17px;
        }

        .cta-icon {
            flex: 0 0 auto;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 53px;
            height: 53px;
            border-radius: 50%;
            color: #5548eb;
            background: #ffffff;
            border: 1px solid #e7e3ff;
            box-shadow: 0 8px 20px rgba(65, 57, 190, 0.08);
            font-size: 22px;
        }

        .cta-text h3 {
            margin: 0 0 4px;
            color: #151831;
            font-size: 16px;
            font-weight: 700;
        }

        .cta-text p {
            margin: 0;
            color: #75798d;
            font-size: 13px;
        }

        .view-articles {
            flex: 0 0 auto;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 11px;
            min-width: 168px;
            padding: 13px 20px;
            border-radius: 9px;
            color: #ffffff;
            background: linear-gradient(135deg, #704df5, #5145ec);
            box-shadow: 0 10px 20px rgba(80, 68, 236, 0.2);
            font-size: 13px;
            font-weight: 600;
            text-decoration: none;
            transition: 0.25s ease;
        }

        .view-articles:hover {
            color: #ffffff;
            transform: translateY(-2px);
        }

        /* =================================
           RIGHT SIDE MOBILE PANEL
        ================================= */

        .subjects-sidebars {
            display: flex;
            flex-direction: column;
            padding: 22px 18px 16px;
            background: #ffffff;
            border: 1px solid #efeff8;
            border-radius: 28px;
            box-shadow: 0 12px 45px rgba(67, 63, 226, 0.08);
        }

        .sidebars-heading {
            margin-bottom: 17px;
            text-align: center;
        }

        .sidebars-label {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            margin-bottom: 10px;
            color: #5147f5;
            font-size: 13px;
            font-weight: 600;
        }

        .sidebars-label::before {
            content: "";
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: #5147f5;
        }

        .sidebars-heading h2 {
            max-width: 230px;
            margin: 0 auto 8px;
            color: #090b14;
            font-size: 27px;
            line-height: 1.05;
            font-weight: 800;
            letter-spacing: -0.8px;
        }

        .sidebars-heading p {
            max-width: 245px;
            margin: auto;
            color: #757b8f;
            font-size: 12px;
            line-height: 1.5;
        }

        .sidebars-list {
            display: flex;
            flex-direction: column;
            gap: 9px;
        }

        .sidebars-item {
            display: grid;
            grid-template-columns: 40px minmax(0, 1fr) 18px;
            align-items: center;
            min-height: 51px;
            padding: 7px 10px;
            background: #ffffff;
            border: 1px solid #e9eaf2;
            border-radius: 10px;
            text-decoration: none;
            transition: 0.25s ease;
        }

        .sidebars-item:hover {
            transform: translateX(3px);
            border-color: rgba(79, 70, 229, 0.28);
            box-shadow: 0 8px 20px rgba(62, 57, 180, 0.08);
        }

        .sidebars-icon {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 34px;
            height: 34px;
            border-radius: 50%;
            font-size: 15px;
        }

        .sidebars-content h3 {
            margin: 0 0 2px;
            color: #16192d;
            font-size: 12px;
            font-weight: 700;
        }

        .sidebars-content span {
            display: block;
            color: #7b8092;
            font-size: 10px;
        }

        .sidebars-arrow {
            color: #6258d9;
            font-size: 10px;
            text-align: right;
        }

        /* sidebars Bottom Card */

        .sidebars-bottom {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-top: auto;
            padding: 15px 12px;
            background: linear-gradient(135deg, #f6f3ff, #faf9ff);
            border-radius: 13px;
        }

        .sidebars-bottom-icon {
            flex: 0 0 auto;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 45px;
            height: 45px;
            border-radius: 50%;
            color: #5147f5;
            background: #ffffff;
            border: 1px solid #e6e2ff;
            font-size: 19px;
        }

        .sidebars-bottom h3 {
            margin: 0 0 4px;
            color: #5147f5;
            font-size: 12px;
            font-weight: 700;
        }

        .sidebars-bottom p {
            margin: 0;
            color: #74798d;
            font-size: 10px;
            line-height: 1.4;
        }

        /* =================================
           RESPONSIVE
        ================================= */

        @media (max-width: 1350px) {
            .subjects-layout {
                grid-template-columns: minmax(0, 1fr) 310px;
                gap: 20px;
            }

            .subjects-main {
                padding: 35px 28px 30px;
            }

            .subject-grid {
                gap: 13px;
            }

            .subject-card {
                padding-left: 10px;
                padding-right: 10px;
            }
        }

        @media (max-width: 1199px) {
            .subjects-layout {
                grid-template-columns: 1fr;
            }

            .subjects-sidebars {
                max-width: 500px;
                width: 100%;
                margin: auto;
            }

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

            .sidebars-bottom {
                margin-top: 18px;
            }
        }

        @media (max-width: 767px) {
           

            .subjects-layout {
                gap: 16px;
            }

            .subjects-main {
                padding: 27px 16px 17px;
                border-radius: 22px;
            }


            .subject-grid {
                display: flex;
                flex-direction: column;
                gap: 7px;
            }

            .subject-card {
                display: grid;
                grid-template-columns: 44px minmax(0, 1fr) 22px;
                grid-template-rows: auto auto;
                align-items: center;
                min-height: auto;
                padding: 10px 12px;
                border-radius: 11px;
                text-align: left;
            }

            .subject-card:hover {
                transform: translateY(-2px);
            }

            .icon-articles {
                grid-column: 1;
                grid-row: 1 / span 2;
                width: 37px;
                height: 37px;
                margin: 0;
                font-size: 16px;
            }

            .subject-card h3 {
                grid-column: 2;
                grid-row: 1;
                margin: 0 0 2px;
                font-size: 13px;
            }

            .article-count {
                grid-column: 2;
                grid-row: 2;
                margin: 0;
                font-size: 10px;
            }

            .subject-card p {
                display: none;
            }

            .explore-link {
                grid-column: 3;
                grid-row: 1 / span 2;
                justify-self: end;
                font-size: 0;
            }

            .explore-link i {
                font-size: 11px;
            }

            .subject-cta {
                margin-top: 14px;
                padding: 13px;
            }

            .cta-left {
                gap: 11px;
            }

            .cta-icon {
                width: 43px;
                height: 43px;
                font-size: 18px;
            }

            .cta-text h3 {
                color: #5147e8;
                font-size: 12px;
            }

            .cta-text p {
                max-width: 210px;
                font-size: 10px;
                line-height: 1.4;
            }

            .view-articles {
                display: none;
            }

            .subjects-sidebars {
                display: none;
            }
        }
        .boder-left {
    border-left: 4px solid #4642fc;
}
span.head-span{
    background: linear-gradient(90deg, #6b45f5 0%, #3f7cff 45%, #6b45f5 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}