@media screen and (min-width:768px){.sec-one>div{margin-left:auto;}.sec-one img{height:350px;width:50%;margin-left:2rem;}}@media screen and (max-width:768px){body{margin-bottom:0;}header{justify-content:center;margin-bottom:1rem;padding:0 3%;}header .logo-link{left:3%;top:0;}header nav{margin:10px auto;position:relative;left:47px;}header button.sign-up-btn{margin:auto 0;}header nav a{width:auto;padding:0 10px;}section{flex-direction:column;padding:0 3%;}.sec-one{margin-top:3rem;align-items:center;text-align:center;margin-bottom:1rem;padding:0 3%;position:relative;width:100%;overflow:visible;}.sec-one>div{width:100%;align-items:center;}.sec-one div h3{font-size:30px;text-align:center;}.sec-one .btns-case{justify-content:center;}.sec-one>img{position:absolute;right:1px;top:50px;z-index:-1;max-width:380px;height:auto;opacity:.5;width:100%;}.sec-two{flex-direction:column;align-items:center;text-align:center;}.sec-two img{margin-bottom:20px;width:100%;max-width:300px;height:auto;}.sec-two div{width:100%;margin-left:0;}.sec-three .items{align-items:center;gap:3rem;flex-wrap:wrap;}.sec-four .posts{align-items:center;gap:3rem;flex-wrap:wrap;}.contact-section{flex-direction:row;padding:0 8%;gap:3rem;}.contact-section form{width:60%;}.contact-section input,    .contact-section textarea,    .contact-section form button{width:100%;}footer{padding:0 5%;}footer a{height:32px;width:32px;}footer p{margin-top:10px;font-size:15px;}}@media screen and (max-width:650px){.sec-one{overflow:visible;}.sec-one>img{right:10px;opacity:.3;}footer{padding:0 4%;}footer a{height:25px;width:25px;}footer p{margin-top:10px;font-size:12px;}}@media screen and (max-width:550px){header{padding:0 2%;}header .logo-link{left:1%;}header button.sign-up-btn{width:80px;height:30px;}header nav{font-size:12px;}header nav a{height:28px;margin:5px 3px;}section{padding:0 7%;}.contact-section{flex-direction:column;padding:0 2%;align-items:center;}.contact-section form{width:70%;}footer{flex-direction:column;padding-bottom:3rem;}footer div.links-case{flex-direction:row;margin-bottom:5px;}}@media screen and (max-width:500px){header nav{height:0;padding:0;width:0;overflow:hidden;visibility:hidden;flex-direction:column;background-color:#6f4436;z-index:2;transform:translateY(-100%);transition:transform 0.5s;border-radius:5px 5px 5px 0;}.show-header-nav{width:80%;height:auto;visibility:visible;position:absolute;overflow:visible;transform:translateY(30%);}.close-nav{position:absolute;border-radius:5px;bottom:-34px;height:38px;width:38px;display:block;background-color:#6f4436;border:none;font-weight:800;color:rgb(233, 254, 183);}header{margin-top:0;}header .logo-link{position:relative;}.drop-menu-btn{background:transparent;border-style:none;fill:var(--btnbrown);display:block;height:38px;width:38px;margin:auto 0;border-radius:5px;}header button.sign-up-btn{width:100px;height:33px;margin-left:auto;margin-right:10px;}section.sec-one .btns-case{margin-top:1rem;}section.sec-one .btns-case button{height:48px;}}

.references {
    margin-top: 20px;
    text-align: center;
    width: 100%;
    font-family: "Inter", sans-serif;
}

.references h4 {
    color: #523728;
    font-size: 16px;
    margin-bottom: 8px;
}

.references .credits {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.references .credits p {
    color: #1B0B0BBF;
    font-size: 14px;
}

.references .credits a {
    color: #BB6939;
    text-decoration: none;
    transition: color 0.3s ease;
}

.references .credits a:hover {
    color: #d47e48;
}

/* Add this to your existing media query for screens max-width: 550px */
@media screen and (max-width: 550px) {
    .references {
        margin-top: 15px;
    }
    
    .references .credits {
        flex-direction: column;
        gap: 10px;
    }
}