:root {
  --kp-spacer-0: 0;
  --kp-spacer-1: .25rem;
  --kp-spacer-2: .5rem;
  --kp-spacer-3: .75rem;
  --kp-spacer-4: 1rem;
  --kp-spacer-5: 1.25rem;
  --kp-spacer-6: 1.5rem;
  --kp-spacer-32: 2rem;
  --kp-gap-52: 3.25rem;
  --kp-para-small: 14px;
  --kp-para-default: 16px;
  --kp-para-medium: 18px;
  --kp-para-extra-medium: 20px;
  --kp-para-large: 24px;
  --kp-radius-1: .25rem;
  --kp-radius-2: .5rem;
  --kp-radius-3: .75rem;
  --kp-radius-4: 1rem;
  --kp-padding-4:4px;
  --kp-padding-8:8px;
  --kp-padding-10:10px;
  --kp-padding-12:12px;
  --kp-padding-16:16px;
  --kp-padding-20:20px;
  --kp-padding-24:24px;
  --kp-padding-28:28px;
  --kp-padding-32:32px;
  --kp-white-color:#ffffff;
  --kp-black-color:#000000;
  --kp-primary-color:#FF8D07;
  --kp-secondary-color:#0072F5;
  --kp-gray-100:#cccccc;
  --kp-text-color:#1e1e1e;
  --header-bg-color: transparent;
  --header-onscroll-bg-color: rgba(0, 0, 0, 0.6);
  --header-link-color: #bababa;
  --header-sub-nav-bg-clr:#ffffff;
  --header-sub-nav-link-clr:#1e1e1e;
  --header-menu-nav-link-active-text-color:linear-gradient(90deg, #12D8FA 0%, #1FA2FF 100%);
  --header-sub-nav-border-top-clr:#d2d2d2;
  --header-sub-nav-link-text-clr:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --header-sub-nav-link-hover-clr:#0072F5;
  --header-subnav-arrow-bg-clr:#ffffff;
  --header-nav-arrow-filter:brightness(0) saturate(100%) invert(44%) sepia(66%) saturate(886%) hue-rotate(186deg) brightness(98%) contrast(95%);
  --header-subnav-arrow-border-clr:#dddddd;
  --header-subnav-arrow-border-bottom-clr:#ffffff;
  --header-link-hover-color:#FF8D07;
  --header-link-active-color: #FF8D07;
  --header-font-family: DM Sans, sans-serif;
  --header-font-size: 18px;
  --header-mobile-font-size: 16px;
  --header-padding: 20px;
  --header-onscroll-padding:4px;
  --header-menu-border-color: linear-gradient(90deg, #261E5A, #4088F4, #261E5A);
  --header-mobile-menu-baricon-clr:#ffffff;
  --header-mobile-menu-bg-clr:#000000;
  --header-mobile-border-clr:#d2d2d2;
  --header-menu-text-gradient-clr:linear-gradient(90deg, #12D8FA 0%, #1FA2FF 100%);
  --header-shadow-clr:0px 4px 4px 0px rgba(0, 0, 0, 0.15);
  --trynow-btn-bg-clr:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --trynow-btn-text-clr:#ffffff;
  --trynow-btn-text-hover-clr:#0077e4;
  --trynow-btn-shadow:0 0 0 0 rgba(5, 186, 218, 0.4);
  --header-mobile-bg-color: #000000;
  --header-mobile-menu-padding:8px;
  --header-mobile-inner-nav-link-clr:rgba(255, 255, 255, 0.8);
  --header-mobile-inner-nav-link-font-size:18px;
  --header-mobile-nav-link-clr:#ffffff;
  --header-mobile-nav-link-font-size:24px;
  --hero-heading-font-family: DM Sans, sans-serif;
  --hero-heading-font-size: 52px;
  --hero-sub-heading-font-size: 24px;
  --hero-text-font-size: 24px;
  --hero-sc-text-font-size: 16px;
  --hero-section-title-color: #ffffff;
  --hero-section-text-color: #f4f4f4;
  --hero-heading-font-weight: 600;
  --hero-text-line-height: 1.875rem;
  --hero-bottom-text-panel-padding: 20px;
  --hero-heading-mobile-font-size:32px;
  --aboutus-heading-font-size: 40px;
  --aboutus-text-font-size: 20px;
  --aboutus-para-text-color: #6c6c6c;
  --aboutus-heading-font-weight: 600;
  --aboutus-text-line-height: 1.875rem;
  --aboutus-image-bg-color: #ffffff;
  --aboutus-image-box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  --aboutus-heading-mobile-font-size: 32px;
  --aboutus-panel-item-bg-color: #ffffff;
  --aboutus-panel-item-bg-hover-color:#0a1737;
  --aboutus-panel-border-clr:#cccccc;
  --aboutus-panel-title-color:#0072F5;
  --features-heading-color: #ffffff;
  --features-heading-font-size: 40px;
  --features-heading-font-weight: 600;
  --features-card-title-font-size: 20px;
  --features-card-title-text-color: #1e1e1e;
  --features-card-desc-text-color: #6c6c6c;
  --features-card-desc-font-size: 20px;
  --features-title-font-weight: 600;
  --features-text-font-size: 20px;
  --features-text-line-height: 1.875rem;
  --features-card-bg-color: #ffffff;
  --features-card-list-padding: 20px;
  --features-card-padding: 52px 20px;
  --features-heading-mobile-font-size:32px;
  --industries-heading-color: #000000;
  --industries-heading-font-size: 40px;
  --industries-heading-font-weight: 600;
  --industries-card-title-color: #1e1e1e;
  --industries-card-title-font-size: 32px;
  --industries-card-text-color: #ffffff;
  --industries-card-text-font-size:18px;
  --industries-card-hover-color: 18px;
  --industries-card-hover-bg-color: rgba(0, 0, 0, 0.5);
  --industries-card-padding:24px;
  --industries-card-title-padding:20px;
  --industries-sec-padding-bottom:52px;
  --industries-heading-padding-bottom:40px;
  --industries-heading-mobile-font-size:32px;
  --footer-background-color: #1E1E1E;
  --footer-border-top-color:rgba(255, 255, 255, 0.2);
  --footer-title-text-color: #ffffff;
  --footer-title-font-size: 20px;
  --footer-text-color: rgba(255, 255, 255, 0.72);
  --footer-text-font-size: 14px;
  --footer-link-hover-color: linear-gradient(168deg, #7FC0FB 25.86%, #4088F4 126.85%);
  --footer-padding: 40px;
  --footer-social-icon-bg-color: rgba(255, 255, 255, 0.2);
  --footer-facbook-icon-hover-bg-color: #1877F2;
  --footer-twitter-icon-hover-bg-color: #1DA1F2;
  --footer-linkedin-icon-hover-bg-color: #0A66C2;
  --footer-youtube-icon-hover-bg-color: #FF0000;
  --footer-copyright-bg-color: #000000;
  --footer-copyright-text-color: rgba(255, 255, 255, 0.72);
  --footer-copyright-link-hover-color: #FF8D07;
  --footer-copyright-text-font-size: 14px;
  --footer-copyright-sec-padding:16px;
  --footer-mobile-padding: 32px;
  --font-family:DM Sans, sans-serif;
  --font-size:16px;
  --link-color:#0072F5;
  --section-title-color:#1e1e1e;
  --section-heading-mobile-font-size:32px;
  --card-title-hover-clr:#4088F4;
  --slick-dots-active-color:#ffffff;
  --slick-dots-active-color-primary:#0072F5;
  --key-features-card-title-color:#1e1e1e;
  --key-features-card-title-font-size:24px;
  --key-features-card-bg-clr:#ffffff;
  --key-features-card-para-text-clr:#6c6c6c;
  --key-features-card-text-font-size:16px;
  --key-features-card-border-radius:12px;
  --key-features-card-padding-x:32px;
  --key-features-card-padding-y:20px;
  --key-features-sec-padding:52px;
  --key-features-title-mobile-font-size:20px;
  --advantage-sec-heading-title-color:#ffffff;
  --advantage-card-title-color:#1e1e1e;
  --advantage-card-title-font-size:20px;
  --advantage-card-bg-clr:#ffffff;
  --advantage-card-para-text-clr:#6c6c6c;
  --advantage-card-text-font-size:18px;
  --advantage-card-border-radius:12px;
  --advantage-card-padding-x:32px;
  --advantage-card-padding-y:20px;
  --advantage-grid-list-padding:40px;
  --ai-intelligent-search-grid-title-clr:#ffffff;
  --ai-intelligent-search-grid-title-font-size:20px;
  --ai-intelligent-search-grid-para-clr:rgba(255, 255, 255, 0.5019607843);
  --additional-capability-card-title-clr:#1e1e1e;
  --additional-capability-card-title-font-size:40px;
  --additional-capability-card-sub-title-clr:#0072F5;
  --additional-capability-card-sub-title-font-size:20px;
  --additional-capability-card-para-font-size:16px;
  --additional-capability-card-para-text-clr:#6c6c6c;
  --additional-capability-card-bg-clr:#ffffff;
  --additional-capability-title-mobile-font-size:32px;
  --automotive-section-top-padding:52px;
  --automotive-image-media-list-title-text-clr:#ffffff;
  --automotive-image-media-list-title-font-size:24px;
  --automotive-image-media-title-pd:12px;
  --automotive-image-media-desc-text-clr:#6c6c6c;
  --automotive-image-media-desc-font-size:18px;
  --automotive-sub-title-text-clr:#0072F5;
  --contact-para-text-clr:#6c6c6c;
  --contact-h3-title-text-clr:#ffffff;
  --contact-para-text-font-size:18px;
  --contact-form-title-text-font-size:32px;
  --contact-form-para-text-color:#6c6c6c;
  --contact-form-address-title-color:#ffffff;
  --contact-form-address-title-mobile-font-size:16px;
  --contact-form-address-title-font-size:20px;
  --contact-form-ph-number-font-size:20px;
  --contact-form-ph-number-mobile-font-size:18px;
  --contact-location-para-text-color:#ffffff;
  --contact-location-para-text-font-size:18px;
  --contact-form-bg-color:#ffffff;
  --contact-form-input-field-text-color:#ffffff;
  --contact-form-input-border-color:#bdbdbd;
  --contact-form-error-field-text-color:#FF0000;
  --contact-form-input-focus-color:#0072F5;
  --contact-form-input-font-size:16px;
  --contact-form-input-text-font-size:24px;
  --contact-form-padding:32px;
  --contact-form-input-padding:20px;
  --contact-form-captcha-font-size:24px;
  --contact-form-btn-hover-clr:#0077e4;
  --contact-form-btn-text-clr:#ffffff;
  --contact-form-validation-text-clr:#ffffff;
  --contact-form-btn-font-size:24px;
  --contact-form-btn-clr:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --contact-form-title-border:rgba(255, 255, 255, 0.5);
  --contact-form-title-bg-color:rgba(255, 255, 255, 0.05);
  --contact-form-label-font-size:72px;
  --contact-form-label-mobile-font-size:32px;
  --contact-form-input-mobile-font-size:20px;
  --contact-form-input-placeholder-text-clr:rgba(255, 255, 255, 0.5);
  --breadcrumb-text-color:#667085;
  --breadcrumb-text-hover-color:#0072F5;
  --breadcrumb-text-font-size:14px;
  --article-list-item-bg-color:#ffffff;
  --article-title-text-color:#ffffff;
  --article-title-text-font-size:16px;
  --article-publish-date-text-color:#000000;
  --article-publish-date-text-font-size:20px;
  --article-publish-month-text-color:#000000;
  --article-publish-month-text-font-size:14px;
  --article-detail-author-bio-text-color:#1e1e1e;
  --article-detail-author-bio-text-font-size:20px;
  --article-detail-author-link-color:#4088F4;
  --article-detail-author-bg-color:#ffffff;
  --article-detail-title-text-color:#1e1e1e;
  --article-detail-title-text-font-size:40px;
  --article-detail-author-text-color:#6c6c6c;
  --article-detail-author-text-font-size:18px;
  --article-detail-publish-date-text-color:#6c6c6c;
  --article-detail-publish-date-font-size:18px;
  --article-readme-btn-hover-bg-clr:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --article-readme-btn-text-clr:#1e1e1e;
  --article-readme-btn-hover-text-clr:#ffffff;
  --article-readme-btn-font-size:16px;
  --article-detail-section-title-color:#1e1e1e;
  --article-detail-section-title-font-size:24px;
  --article-detail-section-sub-title-font-size:20px;
  --article-detail-section-para-color:#344054;
  --article-detail-section-para-font-size:20px;
  --article-table-border-color:#cccccc;
  --article-table-thead-text-color:#1e1e1e;
  --infographic-list-item-bg-color:#ffffff;
  --infographic-list-item-border-color:#ffffff;
  --infographic-list-item-title-color:#ffffff;
  --infographic-list-item-title-hover-color:#0072F5;
  --infographic-list-item-title-bg-color:rgba(0, 0, 0, 0.5);
  --infographic-list-item-title-font-size:18px;
  --infographic-list-item-publish-date-font-size:20px;
  --infographic-list-item-publish-date-color:#4f4f4f;
  --infographic-list-item-month-color:#4f4f4f;
  --infographic-list-item-month-font-size:14px;
  --infographic-separator-border-color:#cccccc;
  --infographic-details-title-color:#1e1e1e;
  --infographic-details-title-font-size:40px;
  --infographic-details-title-mobile-font-size:24px;
  --infographic-details-submit-btn-bgcolor:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --infographic-details-submit-btn-hover-bgcolor:#0072F5;
  --infographic-details-submit-btn-text-clr:#ffffff;
  --casestudy-list-item-bg-color:#ffffff;
  --casestudy-list-item-border-color:#ffffff;
  --casestudy-list-item-title-color:#ffffff;
  --casestudy-list-item-title-hover-color:#0072F5;
  --casestudy-list-item-title-bg-color:rgba(0, 0, 0, 0.5);
  --casestudy-list-item-title-font-size:18px;
  --casestudy-list-item-publish-date-font-size:20px;
  --casestudy-list-item-publish-date-color:#4f4f4f;
  --casestudy-list-item-month-color:#4f4f4f;
  --casestudy-list-item-month-font-size:14px;
  --casestudy-details-title-mobile-font-size:24px;
  --casestudy-details-title-color:#1e1e1e;
  --casestudy-details-title-font-size:40px;
  --casestudy-details-title-mobile-font-size:24px;
  --casestudy-details-submit-btn-bgcolor:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --casestudy-details-submit-btn-hover-bgcolor:#0072F5;
  --casestudy-details-submit-btn-text-clr:#ffffff;
  --casestudy-detail-author-text-color:#6c6c6c;
  --casestudy-detail-author-text-font-size:18px;
  --casestudy-readme-btn-hover-bg-clr:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --casestudy-readme-btn-text-clr:#1e1e1e;
  --casestudy-readme-btn-hover-text-clr:#ffffff;
  --casestudy-readme-btn-font-size:16px;
  --casestudy-detail-section-title-color:#1e1e1e;
  --casestudy-detail-section-title-font-size:24px;
  --casestudy-detail-section-sub-title-font-size:20px;
  --casestudy-detail-section-para-color:#344054;
  --casestudy-detail-section-para-font-size:20px;
  --casestudy-detail-author-bio-text-color:#1e1e1e;
  --casestudy-detail-author-bio-text-font-size:20px;
  --events-card-title-color:#1e1e1e;
  --events-card-title-font-size:24px;
  --events-card-sub-title-color:#4f4f4f;
  --events-card-sub-title-font-size:16px;
  --events-card-btn-text-color:#ffffff;
  --events-card-btn-bg-color:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --events-card-btn-text-font-size:14px;
  --events-card-btn-bg-hover-color:linear-gradient(90deg, #261E5A, #4088F4, #261E5A);
  --events-card-separator-color:#000000;
  --events-card-para-text-color:#1e1e1e;
  --events-card-para-text-font-size:14px;
  --events-card-date-text-color:#1e1e1e;
  --events-detail-breadcrumb-link-color:#0072F5;
  --events-detail-title-text-color:#1e1e1e;
  --events-detail-title-text-font-size:32px;
  --events-detail-date-text-color:#1e1e1e;
  --events-detail-date-border-color:#0072F5;
  --event-detail-author-bg-color:rgba(255, 255, 255, 0.1);
  --event-detail-author-border-color:#ffffff;
  --event-detail-author-cnt-text-color:#ffffff;
  --event-detail-author-btn-bg-color:#ffffff;
  --event-detail-author-btn-text-font-size:20px;
  --trynow-slider-title-text-color:#ffffff;
  --trynow-slider-title-text-font-size:20px;
  --trynow-border-color:#cccccc;
  --trynow-features-figcaption-font-size:18px;
  --trynow-features-figcaption-text-color:#ffffff;
  --trynow-features-desc-text-color:#ffffff;
  --trynow-features-desc-text-font-size:14px;
  --trynow-error-message:#FF0000;
  --trynow-form-title-color:#1e1e1e;
  --trynow-form-title-font-size:52px;
  --trynow-form-success-label-color:#6c6c6c;
  --trynow-form-input-field-border:#bdbdbd;
  --trynow-form-input-border:#cccccc;
  --trynow-form-input-color:#6c6c6c;
  --trynow-form-input-focus-color:#0072F5;
  --trynow-form-control-font-size:16px;
  --trynow-form-submit-btn-bg-color:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --trynow-form-submit-btn-text-color:#ffffff;
  --trynow-form-terms-para-font-size:16px;
  --trynow-form-terms-title-font-size:20px;
  --trynow-form-terms-para-text-color:#4f4f4f;
  --trynow-slider-slick-btn-color:#000000;
  --trynow-modal-wrapper-bg-color:#ffffff;
  --ebooks-list-item-bg-color:#ffffff;
  --ebooks-list-item-border-color:#ffffff;
  --ebooks-list-item-title-color:#ffffff;
  --ebooks-list-item-title-hover-color:#0072F5;
  --ebooks-list-item-title-bg-color:rgba(0, 0, 0, 0.5);
  --ebooks-list-item-title-font-size:18px;
  --ebooks-list-item-publish-date-font-size:20px;
  --ebooks-list-item-publish-date-color:#4f4f4f;
  --ebooks-list-item-month-color:#4f4f4f;
  --ebooks-list-item-month-font-size:14px;
  --ebooks-separator-border-color:#cccccc;
  --ebooks-details-title-color:#1e1e1e;
  --ebooks-details-title-font-size:32px;
  --ebooks-details-title-mobile-font-size:24px;
  --ebooks-details-submit-btn-bgcolor:linear-gradient(90deg, #0072F5 0%, #0053F5 100%);
  --ebooks-details-submit-btn-hover-bgcolor:#0072F5;
  --ebooks-details-submit-btn-text-clr:#ffffff;
  --ebooks-details-form-para-text-clr:#ffffff;
  --ebooks-error-msg-clr:#FF0000;
  --ebook-detail-form-border-focus-clr:#0072F5;
  --ebook-detail-form-border-clr:#cccccc;
  --ebooks-form-input-border-clr:#bdbdbd;
  --ebooks-form-success-label-clr:#ffffff;
  --kp-inner-page-title-text-font-size:32px;
  --kp-inner-page-heading-title-text-font-size:20px;
  --kp-inner-page-title-text-color:#0072F5;
  --kp-inner-page-para-text-color:#4f4f4f;
  --kp-inner-page-para-text-font-size:18px;
  --kp-inner-page-card-text-color:#6c6c6c;
  --kp-inner-page-card-text-font-size:24px;
  --kp-inner-page-card-bg-color:#ffffff;
  --kp-ai-agents-how-it-works-sub-title-font-size:20px;
  --kp-ai-agents-how-it-works-sub-title-color:#1e1e1e;
  --kp-ai-agents-system-integration-title-color:#ffffff;
  --ai-agents-section-top-padding:52px;
  --ai-benefit-title-text-font-size:40px;
  --ai-agents-section-bg-color:#ededed;
  --ai-agents-card-bg-color:#ffffff;
  --ai-agents-conclusion-text-font-size:18px;
  --ai-agents-title-text-mobile-font-size:24px;
  --ai-agents-card-border-color:#cccccc;
  --btn-bg-gradient-color:linear-gradient(277deg, #009BF5 -2.54%, #003DF5 52.16%);
  --btn-bg-gradient-hover-color:linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%), linear-gradient(277deg, #009BF5 -2.54%, #003DF5 52.16%);
  --btn-text-color:#ffffff;
  --btn-hover-text-color:#ffffff;
  --btn-shadow-color:0px -1px 4px 0px rgba(0, 0, 0, 0.25) inset, 0px 12px 20px 0px rgba(0, 0, 0, 0.25);
  --btn-padding:12px 24px;
  --btn-font-size:24px;
  --btn-font-weight:500;
  --btn-border-color:#0072F5;
}

.h2-title {
  font-size: var(--aboutus-heading-font-size);
  font-weight: 700;
  color: var(--section-title-color);
  text-align: center;
  text-transform: uppercase;
}

@media only screen and (max-width: 540px) {
  .h2-title {
    font-size: var(--section-heading-mobile-font-size);
  }
}
@media (min-width: 767px) and (max-width: 1024px) {
  .h2-title {
    font-size: var(--section-heading-mobile-font-size);
  }
}
.banner-section {
  height: 652px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;
  position: relative;
}
.banner-section .hero-panel .hero-content {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
  padding-top: 12rem;
}
.banner-section .hero-panel .hero-content .h1-title {
  font-size: var(--hero-heading-font-size);
  font-weight: var(--hero-heading-font-weight);
  color: var(--hero-section-title-color);
}
.banner-section .hero-panel .hero-content .sub-title {
  color: var(--hero-section-text-color);
  font-size: var(--kp-para-large);
  font-weight: var(--hero-heading-font-weight);
}
.banner-section .hero-panel .hero-content .para {
  color: var(--hero-section-text-color);
  font-size: var(--kp-para-large);
  line-height: var(--hero-text-line-height);
}
.banner-section .banner-bottom-content {
  color: var(--hero-section-text-color);
  background: rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: var(--hero-bottom-text-panel-padding);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0px;
}
.banner-section .banner-bottom-content .para {
  text-align: center;
  line-height: 30px;
  width: min(740px, 100%);
  font-size: var(--kp-para-medium);
  color: rgba(255, 255, 255, 0.72);
}
.banner-section .banner-bottom-content .para.salesforce-para {
  width: min(857px, 100%);
}
@media only screen and (max-width: 540px) {
  .banner-section {
    padding: 24px;
    height: 600px;
  }
  .banner-section.additional-capabilities-sec {
    height: calc(100dvh - 20px);
  }
  .banner-section .hero-panel .hero-content .h1-title {
    font-size: var(--hero-heading-mobile-font-size);
    text-align: center;
  }
  .banner-section .hero-panel .hero-content .h1-title br {
    display: none;
  }
  .banner-section .hero-panel .hero-content .para {
    text-align: center;
  }
  .banner-section .banner-bottom-content .para {
    line-height: 1.5;
    font-size: 14px;
    opacity: 0.72;
  }
}
@media (min-width: 767px) and (max-width: 1024px) {
  .banner-section {
    padding: 24px;
  }
  .banner-section .hero-panel .hero-content .h1-title {
    font-size: var(--hero-heading-mobile-font-size);
  }
}

.banner-section.infographics-list {
  background-image: image-set(url(../images/contactus-bg-1x.webp) 1x, url(../images/contactus-bg-2x.webp) 2x);
  height: 225px;
}
.banner-section .hero-panel .hero-content {
  padding-top: 7rem;
}
.banner-section .hero-panel .hero-content .h1-title {
  text-align: center;
}

.infographic-info {
  position: relative;
  padding: 52px 0px;
}
.infographic-info .main-content .infographic-list-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr));
  grid-gap: 32px 60px;
}
.infographic-info .main-content .infographic-list-info .infographic-list-item {
  background: var(--infographic-list-item-bg-color);
  box-shadow: 2px 0px 10px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  position: relative;
  border: 20px solid var(--infographic-list-item-border-color);
}
.infographic-info .main-content .infographic-list-info .infographic-list-item .infographic-img {
  cursor: pointer;
}
.infographic-info .main-content .infographic-list-info .infographic-list-item .infographic-title {
  background: var(--infographic-list-item-title-bg-color);
  font-weight: 600;
  backdrop-filter: blur(20px);
  color: var(--infographic-list-item-title-color);
  font-size: var(--infographic-list-item-title-font-size);
  padding: 12px;
  position: absolute;
  z-index: 2;
  bottom: 0px;
  width: 100%;
}
.infographic-info .main-content .infographic-list-info .infographic-list-item .infographic-title .link-color {
  color: var(--infographic-list-item-title-color);
}
.infographic-info .main-content .infographic-list-info .infographic-list-item .infographic-title .link-color:hover {
  color: var(--infographic-list-item-title-hover-color);
}
.infographic-info .main-content .infographic-list-info .infographic-list-item .date-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: linear-gradient(244.89deg, rgba(255, 255, 255, 0.84) 37.47%, rgba(255, 255, 255, 0.44) 84.59%);
  box-shadow: 0px 6.23657px 8.31543px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(14.552px);
  border-radius: 8px;
  padding: 8px;
  position: absolute;
  top: 0;
  margin: 10px;
}
.infographic-info .main-content .infographic-list-info .infographic-list-item .date-info .publish-date {
  font-size: var(--infographic-list-item-publish-date-font-size);
  color: var(--infographic-list-item-publish-date-color);
  font-weight: bold;
  line-height: inherit;
}
.infographic-info .main-content .infographic-list-info .infographic-list-item .date-info .month {
  font-size: var(--infographic-list-item-month-font-size);
  color: var(--infographic-list-item-month-color);
  line-height: inherit;
}
.infographic-info .main-content .infographic-banner {
  margin-bottom: 42px;
  text-align: center;
}
.infographic-info .main-content .infographic-banner .infographic-banner-img {
  max-width: 100%;
  width: 100%;
}
.infographic-info .main-content .infographic-banner .separator {
  border-bottom: 1px solid var(--infographic-separator-border-color);
  margin-top: 1rem;
  margin-bottom: 1rem;
}

@media (min-width: 768px) and (max-width: 1024px) {
  .main .infographic-info .km-container .main-content .infographic-list-info {
    grid-gap: 32px 20px;
    padding: 0px 20px;
  }
  .main .infographic-info .km-container .main-content .infographic-list-info .infographic-list-item {
    max-width: 340px;
    margin: 0 auto;
  }
  .main .infographic-info .km-container .main-content .infographic-list-info .infographic-list-item .infographic-title {
    height: auto;
  }
  .main .infographic-info .km-container .main-content .infographic-banner {
    text-align: center;
  }
}
@media only screen and (max-width: 540px) {
  .main .infographic-info {
    padding: 20px;
  }
  .main .infographic-info .navigation-menu .breadcrumb {
    display: flex;
    flex-direction: row;
  }
  .main .infographic-info .main-content {
    margin: 32px 0px;
  }
  .main .infographic-info .main-content .infographic-list-info {
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
    position: relative;
  }
  .main .infographic-info .main-content .infographic-list-info .infographic-list-item {
    margin: 0px auto;
  }
  .main .infographic-info .main-content .infographic-list-info .infographic-list-item .infographic-title .link-color {
    color: var(--infographic-list-item-title-color);
  }
  .main .infographic-info .main-content .infographic-banner .infographic-baner-img {
    max-width: 100%;
    height: 30vh;
  }
  .main .infographic-info .main-content .infographic-details {
    padding: 18px 0px;
    max-width: 100%;
  }
  .main .infographic-info .main-content .infographic-details .heading .title {
    font-size: var(--infographic-details-title-font-size);
  }
  .main .infographic-info .main-content .infographic-details .heading .author-info {
    display: flex;
    gap: 12px;
  }
  .main .infographic-info .main-content .infographic-details .heading .author-info .author-name {
    font-size: var(--infographic-list-item-month-font-size);
  }
  .main .infographic-info .main-content .infographic-details .heading .author-info .publish-date {
    font-size: var(--infographic-list-item-month-font-size);
  }
  .main .infographic-info .main-content .infographic-details .separator {
    border-bottom: 1px solid var(--infographic-separator-border-color);
    margin-top: 16px;
    margin-bottom: 16px;
  }
}