/* Collaborative Approach Section */

.collaborative-approach-section {
    padding: 0 120px;
}

.collaborative-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 48px;
}

/* Section */
.collaborative-section {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Title Styles */
.collaborative-title {
    font-family: 'IvyOra Display', serif;
    font-style: italic;
    font-weight: 500;
    font-size: 32px;
    line-height: 1.15;
    color: #ed6a59;
    margin: 0;
}

.collaborative-title-bold {
    font-family: 'IvyOra Display', serif;
    font-style: normal;
    font-weight: 700;
}

.collaborative-subtitle {
    font-family: 'IvyOra Display', serif;
    font-weight: 700;
    font-size: 32px;
    line-height: 1.2;
    color: #005b68;
    margin: 0;
    max-width: 686px;
    align-self: flex-end;
}

/* Content Wrapper */
.collaborative-content-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 32px 40px;
    align-items: flex-start;
}

/* Text Content */
.collaborative-text-content {
    flex: 1 1 500px;
    min-width: 500px;
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #403936;
}

.collaborative-text-content p {
    margin: 0 0 16px 0;
}

.collaborative-text-content p:last-child {
    margin-bottom: 0;
}

.collaborative-text-content p.text-bold,
.collaborative-text-content .text-bold,
.footer-text p.text-bold,
.footer-text .text-bold {
    font-weight: 700 !important;
}

.collaborative-text-content ul {
    margin: 0 0 16px 0;
    padding-left: 24px;
}

.collaborative-text-content li {
    margin-bottom: 8px;
}

.collaborative-text-content li:last-child {
    margin-bottom: 0;
}

/* Image Grid */
.collaborative-image-grid {
    position: relative;
    flex-shrink: 0;
    width: 471.82px;
    height: 356.76px;
    transform: scaleY(-1);
}

.grid-image {
    position: absolute;
    border-radius: 8px;
    overflow: hidden;
}

.grid-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scaleY(-1);
}

/* First Grid Layout (Orange decorative) */
.collaborative-section:first-child .grid-image-1 {
    left: 52.24px;
    top: 223.81px;
    width: 171.713px;
    height: 114.189px;
}

.collaborative-section:first-child .grid-image-1 img {
    object-position: center;
}

.collaborative-section:first-child .grid-image-2 {
    left: 0;
    top: 30.76px;
    width: 192.281px;
    height: 161.741px;
}

.collaborative-section:first-child .grid-image-3 {
    left: 245px;
    top: 172.27px;
    width: 226.821px;
    height: 151.214px;
}

.collaborative-section:first-child .grid-image-4 {
    left: 255.55px;
    top: 0;
    width: 153.114px;
    height: 102.127px;
}

.collaborative-section:first-child .decorative-box-1 {
    left: 209.59px;
    top: 111.97px;
    width: 110.061px;
    height: 52.638px;
    background-color: #ed6a59;
}

.collaborative-section:first-child .decorative-box-2 {
    left: 209.59px;
    top: 24.88px;
    width: 29.669px;
    height: 29.669px;
    background-color: #ed6a59;
}

/* Second Grid Layout (Green decorative) */
.collaborative-section-reverse .grid-image-1 {
    left: 55.13px;
    top: 236.23px;
    width: 181.239px;
    height: 120.524px;
}

.collaborative-section-reverse .grid-image-2 {
    left: 0;
    top: 32.47px;
    width: 202.948px;
    height: 170.714px;
}

.collaborative-section-reverse .grid-image-3 {
    left: 258.6px;
    top: 181.82px;
    width: 239.404px;
    height: 159.602px;
}

.collaborative-section-reverse .grid-image-4 {
    left: 269.72px;
    top: 0;
    width: 161.608px;
    height: 107.792px;
}

.collaborative-section-reverse .decorative-box-1 {
    left: 221.22px;
    top: 118.19px;
    width: 116.166px;
    height: 55.558px;
    background-color: #005b68;
}

.collaborative-section-reverse .decorative-box-2 {
    left: 221.22px;
    top: 26.26px;
    width: 31.314px;
    height: 31.314px;
    background-color: #005b68;
}

.decorative-box {
    position: absolute;
    border-radius: 8px;
    transform: scaleY(-1);
}

/* Footer Section */
.collaborative-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 32px 40px;
    align-items: center;
}

.collaborative-footer-reverse {
    /* flex-direction: row-reverse; */
}

.footer-decorative-shape {
    flex-shrink: 0;
    width: 417px;
    height: 126px;
    background-color: #ed6a59;
    border-top-left-radius: 193.56px;
    border-bottom-left-radius: 193.56px;
}

.footer-decorative-green {
    background-color: #005b68;
    transform: scaleX(-1);
}

.footer-text {
    flex: 1 1 500px;
    min-width: 500px;
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #403936;
}

.footer-text p {
    margin: 0 0 16px 0;
}

.footer-text p:last-child {
    margin-bottom: 0;
}

/* Responsive - Below 1200px */
@media (max-width: 1199px) {
    .collaborative-approach-section {
        padding: 0 40px;
    }

    .collaborative-text-content {
        min-width: 0;
        flex: 1 1 100%;
    }

    .footer-text {
        min-width: 0;
        flex: 1 1 100%;
    }

    .collaborative-image-grid {
        margin: 0 auto;
    }

    .collaborative-subtitle {
        align-self: flex-start;
    }
}

/* Mobile Responsive - Below 768px */
@media (max-width: 767px) {
    .collaborative-approach-section {
        padding: 0 16px;
    }

    .collaborative-container {
        gap: 40px;
    }

    .collaborative-section {
        gap: 40px;
    }

    .collaborative-title {
        font-size: 24px;
    }

    .collaborative-subtitle {
        font-size: 24px;
    }

    .collaborative-content-wrapper {
        gap: 40px;
    }

    .collaborative-text-content {
        width: 100%;
        max-width: 327px;
    }

    .collaborative-image-grid {
        width: 327px;
        height: 247.59px;
        margin: 0 auto;
    }

    /* First Grid Mobile */
    .collaborative-section:first-child .grid-image-1 {
        left: 36.2px;
        top: 155.11px;
        width: 119.006px;
        height: 79.139px;
    }

    .collaborative-section:first-child .grid-image-2 {
        left: 0;
        top: 21.32px;
        width: 133.261px;
        height: 112.095px;
    }

    .collaborative-section:first-child .grid-image-3 {
        left: 169.8px;
        top: 119.39px;
        width: 157.199px;
        height: 104.799px;
    }

    .collaborative-section:first-child .grid-image-4 {
        left: 177.11px;
        top: 0;
        width: 106.116px;
        height: 70.779px;
    }

    .collaborative-section:first-child .decorative-box-1 {
        left: 145.26px;
        top: 77.6px;
        width: 76.278px;
        height: 36.481px;
    }

    .collaborative-section:first-child .decorative-box-2 {
        left: 145.26px;
        top: 17.25px;
        width: 20.562px;
        height: 20.562px;
    }

    /* Second Grid Mobile */
    .collaborative-section-reverse .grid-image-1 {
        left: 36.2px;
        top: 155.11px;
        width: 119.006px;
        height: 79.139px;
    }

    .collaborative-section-reverse .grid-image-2 {
        left: 0;
        top: 21.32px;
        width: 133.261px;
        height: 112.096px;
    }

    .collaborative-section-reverse .grid-image-3 {
        left: 169.8px;
        top: 119.39px;
        width: 157.199px;
        height: 104.8px;
    }

    .collaborative-section-reverse .grid-image-4 {
        left: 177.11px;
        top: 0;
        width: 106.116px;
        height: 70.78px;
    }

    .collaborative-section-reverse .decorative-box-1 {
        left: 145.26px;
        top: 77.6px;
        width: 76.278px;
        height: 36.481px;
    }

    .collaborative-section-reverse .decorative-box-2 {
        left: 145.26px;
        top: 17.24px;
        width: 20.562px;
        height: 20.562px;
    }

    .footer-decorative-shape {
        width: 111.65px;
        height: 66px;
        border-top-left-radius: 106.458px;
        border-bottom-left-radius: 106.458px;
    }

    .footer-text {
        width: 100%;
        max-width: 327px;
    }

    .collaborative-footer {
        gap: 16px;
    }
}