.truncate {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1; /* Number of lines to show */
  overflow: hidden;
  text-overflow: ellipsis;
}




.quote-with-image-container{
    display: flex;
  
    flex-direction: row;
    align-items: flex-start;
    gap: 90px;
      padding: 148px 0px 164px;
    max-width: 1094px;
      margin-left: auto;
    margin-right: auto;
}
.quote-with-image-container .quote-container{
  flex: 0 0 70%;
}


.quote-with-image-container .image-container{
  flex 0 0 30%;
  }
.quote-container span{
  color: var(--Black, #000);

font-size: inherit;
font-style: normal;
font-weight: 300;
line-height: 150%; /* 36px */
letter-spacing: 0.029px;
}

.quote-author-container .quote-author-name{
color: var(--Black, #000);

font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 120%; /* 19.2px */
letter-spacing: 0.019px;
}

.quote-author-container .quote-author-info{
color: var(--Black, #000);

font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 21px */
letter-spacing: 0.017px;
}

.quote-container {
    width: 800px;
}

.author-container{
  display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
}

.image-container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}
.button--secondary.quote-button{
    border-color: #666;
}
.button--secondary.quote-button .button_text{
    color: #333;
}
@media(min-width: 781px) and (max-width: 1023px){
  .quote-with-image-container {
        align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 0px;
    padding: var(--Size-size-32, 32px) 0 var(--Size-size-48, 48px) 10px;
    max-width: 500px;
    
  }
  
  .quote-container{
    max-width: 500px;
  }
  
}

@media(min-width: 1024px) and (max-width: 1240px){
  .quote-with-image-container{
    max-width: 90vw;
  }
  .quote-container {
    width: 600px;
  }

    
}


@media(max-width: 780px){
  .quote-with-image_image{
    width: 80px;
    height: 80px;
    max-width: unset;
  }
  .quote-with-image-container {
    
        display: flex;

    padding: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }
  .quote-container span {
    color: var(--Black, #000);

font-size: 1.25rem!important;
font-style: normal;
font-weight: 300;
line-height: 150%; /* 24px */
letter-spacing: 0.019px;
  }
  
  
  .quote-container{
    font-size: 1.25rem;
      }
  .image-container .button-wrapper{
    flex-direction: column;
    
  }
  .quote-container{
      width: 90vw;
  }
  .image-container{
    flex-direction: column-reverse;
  }
  .author-container{
    flex-direction: row;
    gap: 10px;
  }
}

@media and (max-width: 475px){
  .quote-with-image-container{
  padding: var(--Size-size-32,32px) 24px var(--Size-size-48,48px) 24px;
  }
  .quote-container{
  font-size: 16px;
  }
}
.quote-with-image-button-wrapper{
display: flex;
flex-direction: column;
align-items: flex-start;
gap: var(--Size-size-16, 16px);
}
.button--secondary svg{
  fill: #000;
}





.button--primary {
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(51 51 51 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.button--primary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
  transform: translateX(0);
}

.button--primary:hover .button_text{
  transform: translateX(0);
}
.button--primary:hover .svg_arrow_main{
  opacity: 1;
  fill: #fff;
}

.svg_arrow_main{
    transition: opacity .25s cubic-bezier(.4,0,.2,1);
    flex-shrink: 0;
    transform: translateX(.5rem);
    opacity: 0; 
}

.button-quote:hover .svg_arrow_main {
    fill: #fff;
    opacity: 1;
}
.button--secondary:hover .svg_arrow_main {
    fill: #000;
    opacity: 1;
}
.button-quote:hover .button_text_quote{
    transform: translateX(0) !important;
}

.button_text_quote{
  
  min-width: max-content;
  box-sizing: border-box;
    display: inline-block;
    transform: translateX(.55rem);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}

.button_text_quote{
  
  min-width: max-content;
  box-sizing: border-box;
    display: inline-block;
    transform: translateX(.55rem);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}

