@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap');

:root {
  --accent: #E51C9B;
  --transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

* {margin: 0;box-sizing: border-box;}
body {overflow-x: hidden; background-color: #000000;}
html {scroll-behavior: smooth;}

/* BOTTONI CONTATTI */

.iconawh {position: fixed;display: flex;bottom: 60px;right: 20px;font-size: 2.5em;cursor: pointer;z-index: 1000;}
.iconaig {position: fixed;display: flex;bottom: 10px;right: 20px;font-size: 2.5em;cursor: pointer;z-index: 1000;}
.iconawh:hover, .iconaig:hover {transform: scale(1.1);}

/* FINE BOTTONI CONTATTI */

/* MODAL FOTO */

.modal-foto {z-index: 1000;top: 0;left: 0;align-items: center;text-align: center;justify-content: center;}
.modal-foto {display: none;position: fixed;width: 100%;height: 100%;background-color: rgb(248, 248, 248, 0.8);}

.modal-foto img {margin-top: 2%;width: 35%;height: 60%;}
.modal-foto span {position: absolute;top: 20px;right: 30px;color: black;font-size: 40px;cursor: pointer;}

.modal-foto .prev, .modal-foto .next {border-radius: 50%;transition: 0.2s all;background-color: rgba(0, 0, 0, 0.5);}
.modal-foto .prev, .modal-foto .next {position: absolute;top: 50%;cursor: pointer;border: none;color: white;padding: 10px;}

.modal-foto .prev:hover, .modal-foto .next:hover {background-color: rgba(0, 0, 0, 0.7);}
.modal-foto .prev {left: 340px;}
.modal-foto .next {right: 340px;}
.next:disabled, .prev:disabled {display: none;}

/* FINE MODAL FOTO */

/* NAVBAR */

 .hamburger {display: none;flex-direction: column;cursor: pointer;gap: 5px;margin-right: 20px;}
 .hamburger span {width: 25px;height: 3px;background: #E51C9B;border-radius: 3px;}
 nav img {width: 4%; height: 10vh;}
 nav {position: fixed;top: 0; width: 100%;display: flex; justify-content: space-between; align-items: center;}
 nav {padding: 10px;z-index: 1000;height: 10vh;background: rgba(10, 10, 10, 0.7) !important;}
 nav {backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);border-bottom: 1px solid rgba(109, 95, 146, 0.4);}
 nav ul {list-style: none;display: flex;flex-direction: row;gap: 20px;}
 nav ul li a {text-decoration: none;font-size: 18px;line-height: 10vh;color: #E51C9B;letter-spacing: 1px;text-transform: uppercase; font-family: 'Montserrat', sans-serif;}
 nav ul li a {transition: var(--transition);}
 nav button {background-color:#E51C9B; width: 8%; height: 7vh; margin-right: 20px;cursor:pointer;}
 nav button {border-radius: 10px; border: none;transition: all 0.3s ease;}
 nav button:hover{transform: scale(1.1);}
 nav button a {text-decoration: none;color: black;font-size: 18px;font-family: Georgia, serif;}
 .title-important {display: flex;flex-direction: column;align-items: center;justify-content: center;letter-spacing: 5px;}
 .title-important {font-weight: 300; margin-top: 50px;text-transform: uppercase;color: var(--accent);}
 .title-important::after {content: '';width: 110px;height: 3px;background: var(--accent);margin-top: 2px;margin-bottom: 10px;}

/* FINE NAVBAR */

/* HERO */

 .hero {position: relative;}
 .hero::before {top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);z-index: 1;}
 .hero::before {content: "";position: absolute;}
 .hero img {width: 100%;height: 90vh;}
 .hero-text {position: absolute;top: 35%;left: 5%;width: 45%;z-index: 2;}
 .hero-text h1 {font-family: 'Playfair Display', serif;font-size: 3.2rem;line-height: 1.1;margin: 20px 0;color: #ffffff;}
 .hero-text h1 em {font-size: 2.4rem; font-weight: 400;font-style: italic;color: var(--accent);}
 .hero-text button {width: auto;padding: 12px 25px;background-color: var(--accent);border: none;margin-top: 20px;}
 .hero-text button {cursor: pointer;border-radius: 10px;transition: all 0.3s ease;}
 .hero-text button:hover {transform: scale(1.05);}
 .hero-text button a {text-decoration: none;color: #000;font-size: 16px;font-weight: 600;}

/* FINE HERO */

/* SEZIONE FOTO */
#sezioneGallery {width: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;}
#sezioneGallery h2 {text-align: center;color: #E51C9B;text-transform: uppercase;font-size: 42px;}
#sezioneGallery h2 {font-family: 'PlayFair Display',sans-serif;margin-bottom: 3vh;margin-top: 3vh;}
#sezioneGallery p {color: #fff;margin-bottom: 3vh;text-transform: uppercase;font-family: 'PlayFair Display',sans-serif;}
#sezioneGallery p {font-size: 24px; width: 100%;text-align: center;}
.grid-container {grid-template-columns: repeat(4, 1fr);gap: 5px;width: 95%;max-width: 1000px;margin-bottom: 3vh;}
.grid-container {display: grid;margin-top: 3vh;}

.grid-item {box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);transition: transform 0.3s ease, box-shadow 0.3s ease;}
.grid-item {position: relative;overflow: hidden;border-radius: 10px;height: 300px;cursor: pointer;}

.grid-item:hover {transform: scale(1.05);box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);}

.grid-item:nth-child(1) {grid-column: span 2;grid-row: span 1;}
.grid-item:nth-child(2) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(3) {grid-column: span 1;grid-row: span 1;}

.grid-item:nth-child(4) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(5) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(6) {grid-column: span 2;grid-row: span 1;}

.grid-item:nth-child(7) {grid-column: span 2;grid-row: span 1;}
.grid-item:nth-child(8) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(9) {grid-column: span 1;grid-row: span 1;}

.grid-item:nth-child(10) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(11) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(12) {grid-column: span 2;grid-row: span 1;}

.grid-item:nth-child(13) {grid-column: span 2;grid-row: span 1;}
.grid-item:nth-child(14) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(15) {grid-column: span 1;grid-row: span 1;}

.grid-item:nth-child(16) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(17) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(18) {grid-column: span 2;grid-row: span 1;}

.grid-item:nth-child(19) {grid-column: span 2;grid-row: span 1;}
.grid-item:nth-child(20) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(21) {grid-column: span 1;grid-row: span 1;}

.grid-item:nth-child(22) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(23) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(24) {grid-column: span 2;grid-row: span 1;}

.grid-item:nth-child(25) {grid-column: span 2;grid-row: span 1;}
.grid-item:nth-child(26) {grid-column: span 1;grid-row: span 1;}
.grid-item:nth-child(27) {grid-column: span 1;grid-row: span 1;}

.grid-item img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.5s ease;}
.grid-item:hover img {transform: scale(1.1);}

/* FINE SEZIONE FOTO */

/* CALL FINALE */

#sezioneCall {width: 100%;height: 100vh;display: flex;flex-direction: column;justify-content: center;align-items: center;}
#sezioneCall img {width: 100%;height: 100%;filter: brightness(20%);}
.boxCall {position: absolute;align-items: center;display: flex;flex-direction: column;gap: 20px;}
.boxCall h2 {color: #E51C9B;width: 90%;font-size: 36px;font-family: 'Lato',sans-serif;}
.boxCall p {font-family: 'Lato',sans-serif;color: white;font-size: 26px;}
.boxCall button {padding: 10px;width: 15%;border-radius: 10px;border: none;transition: all 0.3s ease;cursor: pointer;}
.boxCall button:hover {transform: scale(1.1);}
.boxCall button:nth-of-type(1) {background-color: rgb(0, 128, 0, 0.6);}
.boxCall button:nth-of-type(2) {background-color: rgb(229, 28, 155, 0.6);}
.boxCall button a {text-decoration: none;color: #000000;font-family: 'Lato',sans-serif;font-size: 16px;}


/* FINE CALL FINALE */

/* Footer */
footer {color: #FFFFFF;padding: 60px 0 20px 0;background: var(--gray);}
.footer-container {max-width: 1200px;margin: 0 auto;display: flex;flex-wrap: wrap;justify-content: space-between;padding: 0 20px;}
.footer-section {flex: 1;min-width: 250px;margin-bottom: 30px;}
.footer-section h3, .footer-section h4 {color: #E51C9B;margin-bottom: 20px;text-transform: uppercase;}
.footer-section p {color: #FFFFFF;line-height: 1.6;font-size: 0.9rem;}
.footer-section ul {list-style: none;padding: 0;}
.footer-section ul li {margin-bottom: 10px;}
.footer-section ul li a {color: #ffffff;text-decoration: none;transition: color 0.3s;font-size: 0.9rem;}
.footer-section ul li a:hover {color: #E51C9B;}
.social-icons, .payment-methods {display: flex;gap: 15px;margin-top: 15px;font-size: 1.5rem;}
.social-icons a {color: #ffffff;transition: transform 0.3s;}
.social-icons a:hover {transform: scale(1.2);color: #E51C9B;}
.payment-methods i {color: #ffffff;}
.footer-bottom {text-align: center;border-top: 1px solid #fdfdfd;padding-top: 20px;margin-top: 40px;}
.footer-bottom p {color: #ffffff;font-size: 0.8rem;margin: 5px 0;}

/* FINE FOOTER */