/* MOBILE OPTIMIZATION */
@media (max-width: 768px) {
    header {
        height: auto;
        padding: 30% 5% 10% 5%;
    }

    header .content-container {
        position: relative;
        left: 0;
    }

    header .content-container .content-text {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    header .content-container h1 {
        flex: none;
        font-size: 4rem;
        line-height: 4rem;
    }

    header .content-container h2 {
        text-align: left;
        margin-top: 0rem;
    }

    .works-list .work-list-container .work-item {
        opacity: .8;
        gap: 30px;
    }

    .works-list .work-list-container .work-item h3 {
        font-size: 1.5rem;
        line-height: 1.7rem;
    }

    .works-list .work-list-container .item-details {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 20px;
    }

    .works-list .work-list-container .item-details .area {
        font-weight: 400;
    }

    .works-list .work-list-container .item-details .action {
        display: none;
    }
}