/* Media Queries */
@media screen and (max-width: 768px) {
    /* Universal Tags */
    :root{
        --white: #fafafa;
        --header-text: #A7ED1D;
        --button-hv: #6ed80b;
        --serif: "Tinos", serif;
        --section-break: #9FB195;
        --secondary-text: #171219;
        --sans-serif: "Montserrat", sans-serif;
        --shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 8px 20px rgba(0, 0, 0, 0.1);
    }    
    *, body{
        overflow-x: hidden;
    }
    /* Hero-section */
    .hero-section{
        height: 360px;
        margin-top: 60px;
    }
    .hero-section .text{
        margin: 4px;
        text-align: left;
        padding: 14px 28px;
        width: max-content;
        color: var(--secondary-text);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    .hero-section h1{
        font-size: 1.5rem;
        margin-bottom: 1rem;
        font-family: var(--sans-serif);
    }
    .hero-section p {
        margin: 0 auto;
        font-size: 22px;
        /* max-width: 600px; */
    }
    /* Portfolio */
    .portfolio{
        padding: 60px;
    }
    .portfolio .portfolio-container{
        display: flex;
        flex-direction: column;
    }
    .portfolio .portfolio-container .portfolio-box{
        width: 100%;
    }
    /* Case Study Items */
    .case-studies .cta{
        left: 0%;
        bottom: 60%;
        position: relative;
    }
    .case-study-item{
        padding: 25px;
        display: block;
        max-width: 100%;
    }
        /* Footer */
    .footer .footer-container{
        flex-direction: column;
    }
    .footer .footer-container .box{
        border: none;
        width: 100%;
        border-bottom: 1px solid var(--button-hv);
    }

        
}