@media screen and (max-width: 1024px) {

    nav img {width: 6%; height: 10vh;}
    nav ul li a {font-size: 32px;}
    nav button {width: 15%;margin-right: 10px;}
    .hero-text h1 {font-size: 28px;}
    .hero-text h2 {font-size: 24px;}
    .hero-text button {width: 35%;}
    .boxTestoChiSiamo p {width: 90%;font-size: 24px;}
    .boxTestoChiSiamo button {width: 30%;height: 45px;font-size: 16px;}
    .boxServizi {width: 30%;border: none;gap: 20px;margin-top: 5vh;margin-bottom: 5vh;height: 50vh;}
    .boxServizi h3, .boxServizi p {position: absolute;width: 90%;z-index: 2;padding: 5px;}
    .boxServizi h3 {top: 45%;font-size: 20px;}
    .boxServizi p {top: 65%;font-size: 16px;}
    .boxRecensione {font-size: 18px;}
    .gallery-grid img {height: 40vh;}
    .boxCall {text-align: center;}
    .boxCall button {padding: 10px;width: 25%;}
    
}

@media screen and (max-width: 768px) {

    nav img {width: 10%; height: 10vh;}
    nav ul {gap: 10px;}
    nav ul li a {font-size: 20px;}
    nav button {width: 20%;margin-right: 0px;}
    .hero-text {top: 25%;left: 5%;width: 60%;}
    .hero-text h1 {font-size: 28px;}
    .hero-text h2 {font-size: 24px;}
    .hero-text button {width: 40%;}
    #sezioneChiSiamo h2 {font-size: 28px;padding: 20px 10px;}
    .containerChiSiamo {flex-direction: column;align-items: center;margin-bottom: 5vh;}
    .boxTestoChiSiamo, .boxFotoChiSiamo {width: 100%;height: auto;padding: 20px 0;}
    .boxTestoChiSiamo {order: 2;}
    .boxTestoChiSiamo p {width: 90%;font-size: 18px;margin: 0 auto;}
    .boxTestoChiSiamo button {width: 20%;height: 45px;font-size: 16px;}
    .boxImmagineChiSiamo {width: 300px;height: 350px;}
    .boxImmagineChiSiamo img {width: 100%;height: auto;}
    #sezioneServizi h2 {font-size: 28px;padding: 0 10px;}
    .pServizi {font-size: 18px;padding: 0 10px;}
    .containerServizi {flex-direction: column;align-items: center;height: auto;gap: 40px;}
    .boxServizi {width: 70%;height: 350px;margin: 20px 0;position: relative;}
    .boxServizi img {height: 100%;object-fit: cover;}
    .boxServizi h3, .boxServizi p {position: absolute;width: 90%;z-index: 2;padding: 5px;}
    .boxServizi h3 {top: 45%;font-size: 20px;}
    .boxServizi p {top: 65%;font-size: 16px;}
    .boxServizi:hover {transform: none;}
    .containerRecensioni {flex-direction: column;align-items: center;}
    .boxRecensione {width: 90%;height: auto;font-size: 18px;margin-bottom: 30px;}
    .boxRecensione p {width: 90%;margin: 20px auto 0;}
    .boxRecensione h4 {margin-top: 20px;font-size: 20px;}
    .gallery-grid {grid-template-columns: repeat(2, 1fr);}
    .boxCall {text-align: center;}
    .boxCall h2 {font-size: 26px;}
    .boxCall p {font-size: 16px;}
    .boxCall button {padding: 10px;width: 40%;}
    footer {flex-direction: column;align-items: center;text-align: center;}
    .footerUp {flex-direction: column;height: auto;align-items: center;gap: 30px;padding: 20px 0;}
    .footerUp img {height: 200px;}
    .footerUp h3 {font-size: 24px;margin-top: 10px;}
    .footerUp ul {padding: 0;gap: 10px;}
    .footerUp ul li a {font-size: 16px;}
    .footerUp ul:nth-of-type(2) li {font-size: 14px;margin: 0;}
    .footerUp ul:nth-of-type(2) {gap: 5px;align-items: center;}
    .footerDown {flex-direction: column;align-items: center;height: auto;padding: 20px 0;gap: 20px;}
    .footerDownLeft {align-items: center;gap: 10px;}
    .footerDownLeft p {font-size: 14px;text-align: center;}
    .boxSocial {display: flex;justify-content: center;gap: 10px;flex-wrap: wrap;}
    .boxSocial img {width: 30px;height: 30px;}
    .footerDownRight {margin: 0;display: flex;flex-direction: column;align-items: center;gap: 10px;}
    .footerDownRight input {width: 80%;font-size: 14px;}
    .footerDownRight button {font-size: 14px;padding: 8px 16px;}
    
}

@media screen and (max-width: 480px) {

    nav {flex-direction: row;justify-content: space-between;align-items: center;}
    nav img {width: 12%;}
    nav ul {display: none;text-align: center;flex-direction: column;background-color: #000;position: absolute;top: 60px;right: 0;width: 100%;z-index: 999;padding: 20px 0;}
    nav ul.show {display: flex;}
    .hamburger {display: flex;}
    nav button {display: none;}
    .hero-text {top: 26%;left: 2%;width: 60%;}
    .hero-text h1 {font-size: 24px;}
    .hero-text h2 {font-size: 18px;}
    .hero-text button {width: 50%;}
    .hero img {width: 100%;height: 90vh;object-fit: cover;object-position: 75% center;}
    #sezioneChiSiamo h2 {font-size: 28px;padding: 20px 10px;}
    .containerChiSiamo {flex-direction: column;align-items: center;margin-bottom: 5vh;}
    .boxTestoChiSiamo, .boxFotoChiSiamo {width: 100%;height: auto;padding: 20px 0;}
    .boxTestoChiSiamo {order: 2;}
    .boxTestoChiSiamo p {width: 90%;font-size: 18px;margin: 0 auto;}
    .boxTestoChiSiamo button {width: 40%;height: 45px;font-size: 16px;}
    .boxImmagineChiSiamo {width: 200px;height: 250px;}
    .boxImmagineChiSiamo img {width: 100%;height: auto;}
    #sezioneServizi h2 {font-size: 28px;padding: 0 10px;}
    .pServizi {font-size: 18px;padding: 0 10px;}
    .containerServizi {flex-direction: column;align-items: center;height: auto;gap: 40px;}
    .boxServizi {width: 90%;height: 350px;margin: 20px 0;position: relative;}
    .boxServizi img {height: 100%;object-fit: cover;}
    .boxServizi h3, .boxServizi p {position: absolute;width: 90%;z-index: 2;padding: 5px;}
    .boxServizi h3 {top: 45%;font-size: 20px;}
    .boxServizi p {top: 65%;font-size: 16px;}
    .boxServizi:hover {transform: none;}
    .containerRecensioni {flex-direction: column;align-items: center;}
    .boxRecensione {width: 90%;height: auto;font-size: 18px;margin-bottom: 30px;}
    .boxRecensione p {width: 90%;margin: 20px auto 0;}
    .boxRecensione h4 {margin-top: 20px;font-size: 20px;}
    .gallery-grid {grid-template-columns: repeat(1, 1fr);}
    #sezioneCall img {object-fit: cover;}
    .boxCall {text-align: center;}
    .boxCall h2 {font-size: 26px;}
    .boxCall p {font-size: 16px;}
    .boxCall button {padding: 10px;width: 65%;}
    footer {flex-direction: column;align-items: center;text-align: center;}
    .footerUp {flex-direction: column;height: auto;align-items: center;gap: 30px;padding: 20px 0;}
    .footerUp img {height: 100px;}
    .footerUp h3 {font-size: 24px;margin-top: 10px;}
    .footerUp ul {padding: 0;gap: 10px;}
    .footerUp ul li a {font-size: 16px;}
    .footerUp ul:nth-of-type(2) li {font-size: 14px;margin: 0;}
    .footerUp ul:nth-of-type(2) {gap: 5px;align-items: center;}
    .footerDown {flex-direction: column;align-items: center;height: auto;padding: 20px 0;gap: 20px;}
    .footerDownLeft {align-items: center;gap: 10px;}
    .footerDownLeft p {font-size: 14px;text-align: center;}
    .boxSocial {display: flex;justify-content: center;gap: 10px;flex-wrap: wrap;}
    .boxSocial img {width: 30px;height: 30px;}
    .footerDownRight {margin: 0;display: flex;flex-direction: column;align-items: center;gap: 10px;}
    .footerDownRight input {width: 80%;font-size: 14px;}
    .footerDownRight button {font-size: 14px;padding: 8px 16px;}

}