/* ============================================
   RESPONSIVE DESIGN - MOBILE
   ============================================ */

/* Mobile: 768px and down */
@media (max-width: 768px) {
   .image-section-header {
      flex-direction: column;
      align-items: center;
      padding: 2rem 1rem;
      gap: 1rem;
   }

   .image-section-header>div:first-child,
   .image-section-header>div:last-child {
      flex: none;
      width: 100%;
      max-width: 100%;
      padding: 30px;
   }

   .image-section-header>div:first-child img {
      width: 100%;
      height: auto;
      display: block;
   }

   .image-section-header>div:last-child img {
      max-width: 220px;
      width: 60%;
      height: auto;
   }

   .image-section-header .image-cta {
      max-width: 220px;
      width: 60%;
      margin-top: 0.5rem;
   }

   .tagline-content h1 {
      text-align: center !important;
   }

   .tagline-content {
      margin-top: auto;
      text-align: center !important;
   }

   .header-logo {
      display: none;
   }
   
   .header{
       padding: 9em 0 3em 0;
   }
   
   .carousel-content-title{
        text-align: center;
        padding-left: 0px;
        padding-top:1.5em;
        padding-bottom:0.5em;
   }
   

   .image-section-header>div:last-child {
      flex-direction: row;
   }

   .ea-carousel-container {
      flex-direction: column;
      gap: 24px;
      padding: 16px;
      align-items: center;
   }

   .ea-carousel-content {
      width: 100%;
      gap: 12px;
   }

   .ea-carousel-image {
      height: auto;
   }

   .tour-outer-container {
      width: auto;
   }

   .tour-tagline {
      margin-bottom: 1em;
   }

   .tour-section {
      padding: 0px;
      width: auto !important;
   }

   .tour-outer-container .column {
      display: flex !important;
      gap: 0.5em;
      margin-bottom: 1em;
   }

   .tour-body {
      padding: 4em 1.5em;
      border-radius: 0px;
   }

   .newsfeed p.tagline {
      text-align: center;
      max-width: 400px;
   }

   .integration-logos-div {
      gap: 20px;
      justify-content: center;
      padding: 10px;
   }

   .integration-logos {
      max-width: 70px;
   }

   a[data-variant="navybutton"] {
      padding: 1em;
   }

   .ea-content-item {
      padding: 16px;
      border-left-width: 3px;
      border-radius: 8px;
      background-color: #F8FAFC;
      margin-bottom: 8px;
      flex: none;
   }

   .ea-content-item.active {
      background-color: #F0F4FF;
   }

   .tour-outer-container .column {
      display: flex !important;
      gap: 0.5em;
   }

   .leaders {
      display: none;
      position: unset;
   }

   .leaders h4 {
      display: block;
      margin: auto;
      text-align: center;
      padding: unset;
      border: unset;
      background: unset;
   }

   .trusted-logos-container {
      margin-left: 0px;
   }

   .master-container .solutions {
      background: unset;
   }

   .master-container .solutions h2 {
      padding: unset;
   }

   .headshots {
      flex-direction: unset !important;
   }

   .view-stories {
      max-width: unset;
      margin: 2em;
      box-sizing: border-box;
   }

   .salesforce-video .column {
      padding: 2em;
   }

   .salesforce-video .container {
      padding: 0 0 2em 0;
      width: 100%;
   }

   .salesforce-video .thumbnail {
      margin: 0;
   }

   #app-container {
      gap: 2em;
   }

   .integrations-label {
      display: none;
   }

   .quotes-inner {
      flex-direction: column;
      text-align: center;
      gap: 15px;
   }

   .buttons {
      justify-content: center;
   }

   img.person-to-person-logos {
      width: 270px !important;
   }

   .testimonial.active {
      padding: 10px;
   }

   .partner-directory-inner-container-partner {
      justify-content: center;
      flex-direction: column;
      
   }
}

/* Extra Small Mobile: 580px and down */
@media (max-width: 580px) {
   .image-section-header>div:last-child {
      flex-direction: column;
   }

   .testimonial-content {
      display: block;
   }

   .client .logo {
      margin-top: 1em;
   }

   h3.partner-title.main-head br {
      display: none;
   }
}