/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* >>>>>>>>>>   Responsive At 768px  >>>>>>>>>>> */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media (max-width:768px) {
    p {
        font-size: 14px;
        line-height: 22px;
    }

    h1 {
        font-size: 28px;
    }

    h1.title-light {
        font-size: 22px;
        font-weight: 500;
    }

    h2 {
        font-size: 21px;
    }

    h4 {
        font-size: 16px;
    }

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

    .title-tiny {
        font-size: 10px;
    }

    .text-small {
        font-size: 12px;
    }

    .font-medium {
        font-size: 17px;
    }

    .btn {
        padding: 6px 12px;
        font-size: 14px;
    }

    .divider-line {
        margin: 70px auto;
    }

    /* Hero Content  */
    .hero-section {
        padding: 10vh 0 30vh;
        min-height: unset;
    }

    .hero-content {
        margin: 0 auto;
        text-align: center;
        gap: 16px;
    }

    .hero-content p {
        margin: 0 auto;
    }

    .hero-content>h1 {
        font-size: 57px;
        line-height: 64px;
    }

    .hero-content>h1>span::before {
        bottom: -30px;
    }

    .hero-content span {
        line-height: 22px;
    }

    .desc-items {
        flex-direction: column;
        gap: 50px;
    }

    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
    /*     START :: About Container     */
    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
    .about-container {
        flex-direction: column;
        text-align: center;
    }

    .about-container .about-content {
        margin: 0 auto;
        width: 100%;
    }

    .about-container .about-video {
        width: 100%;
        margin: 0 auto;
    }

    .products-industry-container .industry-cards {
        display: flex;
        width: 100%;
        gap: 30px;
        max-width: 100%;
        overflow: auto;
        padding: 10px 4px 30px 4px;
        margin-top: 30px;
    }

    .products-industry-container .industry-cards .card {
        width: 90%;
        margin: 0 auto;
        min-width: 240px;
    }

    .industry-cards-desc-container {
        margin: 20px 0 0;
    }

    .folivora-info-section .folivora-info-container .info-boxes {
        margin-top: 29px;
    }
	.folivora-management-section .folivora-management-container .management-boxes {
        margin-top: 29px;
    }
	
  .management-head .title-btn-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .management-head .btn {
    margin: 24px 0 0 0;
    align-self: stretch;
    width: 100%;
  }
  /* Move the button after the description */
  .management-head .btn {
    order: 2;
  }
  .management-head .title-group {
    order: 1;
  }
  .management-head > p {
    order: 3;
  }

    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
    /*     START :: Product Container     */
    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
    .product-card {
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    .product-card .icon-box {
        width: 100%;
        margin: 0 auto;
        display: flex;
        justify-content: center;
    }

    .product-card .product-content {
        width: 100%;
    }

    .icon-box-container {
        display: flex;
        flex-direction: column;
    }

    .icon-box-container .services-box {
        width: 100%;
        margin: 0 auto;
        text-align: center;
    }

    .icon-box-container .services-box .icon-title {
        display: flex;
        justify-content: center;
    }

    .icon-box-container .services-box .services-list {
        text-align: start;
    }

    .indus-product-head {
        margin-bottom: 20px;
    }

    .goto-btns .overview-link {
        font-size: 14px;
    }

    .industry-links .solution-link {
        color: var(--primary);
        font-size: 14px;
    }

    .goto-btns {
        display: flex;
        align-items: center;
        flex-direction: column;
        gap: 10px;
    }

    /* ########################### */
    /* ########################### */
    /* ########################### */
    /* ########################### */
    /* START ::    Services Page   */
    /* ########################### */
    .industry-container .industry-content .industry-list ul li {
        font-size: 14px;
        font-weight: 600;
    }

    .industry-container .industry-content a {
        margin-top: 45px;
        text-align: center;
    }

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

    .publication-container .article-cards {
        padding: 0 20px;
        gap: 30px;
    }

    .publication-container .article-cards .article-card {
        padding: 24px;
    }

    .publication-container .article-cards .article-card .article-btn {
        flex-direction: column;
        gap: 10px;
    }

    .folivora-sticky-anim-section ._label {
        font-size: 18px;
        padding: 8px 20px;
    }
	.folivora-sticky-anim-section-deployment ._label {
        font-size: 18px;
        padding: 8px 20px;
    }

    .folivora-sticky-anim-section ._label span {
        font-size: 22px;
    }
	.folivora-sticky-anim-section-deployment ._label span {
        font-size: 22px;
    }

    .form-container {
        padding-bottom: 70px;
    }
    
    .ecosystem-wrapper {
        gap: 2rem;
        padding: 1.5rem 0;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .folivora-services-bg {
        background: #131313;
        padding-bottom: 3rem;
    } 

    .gif-container {
        margin: 0 auto;
        position: relative;
        width: 85vw;
        max-width: 340px;
        height: auto;
        aspect-ratio: 4 / 3;
    }
    
    .gif-top-left {
        order: 1;
    }
    
    .gif-top-right {
        order: 2;
    }
    
    .gif-bottom-left {
        order: 3;
    }
    
    .gif-bottom-right {
        order: 4;
    }

}