/* --- REGOLA FONDAMENTALE PER LA RESPONSIVITÀ DI TUTTE LE IMMAGINI --- */
img{max-width:100%;height:auto;display:block;margin:0 auto}

/* --- CLASSI DI UTILITÀ PER LA PULIZIA HTML --- */
.spacer{height:30px}.spacer-small{height:10px}.logo-footer{text-align:center;margin:20px auto}.recensioni{text-align:center;font-size:1.5em;margin:0}

/* --- ELEMENTI GLOBALI --- */
body{background-image:url("free digital scrapbook paper_red and white stripes.jpg");background-repeat:repeat;background-attachment:fixed;font-family:'Bebas Neue',sans-serif}

#container{max-width:1200px;margin:0 auto;background-color:white;box-shadow:0 0 20px rgba(0,0,0,0.3);padding:0 15px}

#generale-titolo{text-align:center;font-size:2em;margin-top:20px;font-family:'Permanent Marker',cursive}

/* --- MENU PRINCIPALE AGGIORNATO (Navigazione Flexbox e Desktop) --- */
#menu{margin:0;padding:0;background-color:#FFDF71;display:flex;justify-content:center;flex-wrap:wrap;width:100%;position:relative}

#nav-links{padding:0;margin:0;list-style:none;display:flex;flex-wrap:wrap;gap:2px}

#menu li{position:relative;list-style:none;margin:0;padding:0;min-width:150px;height:60px;display:flex;justify-content:center;align-items:center;text-align:center;line-height:1.2;background-color:#FFDF71;color:black;border:1px solid white;box-sizing:border-box;flex-grow:1}

#menu li a{text-decoration:none;color:black;display:block;width:100%;height:100%;line-height:60px;padding:0 10px}

#menu li a:hover{background-color:red}

/* --- Menu a tendina (Sotto-menu visibili solo su PC) --- */
#nav-links ul{position:absolute;top:60px;left:0;visibility:hidden;opacity:0;transition:opacity 0.3s ease;width:250px;text-align:left;background-color:#FFDF71;z-index:100;display:block;margin:0;padding:0}

#nav-links li:hover>ul{visibility:visible;opacity:1}

/* --- ICONA HAMBURGER (NASCERE SU DESKTOP) --- */
#menu-icon{display:none}

/* --- MEDIA QUERIES: REGOLE PER SCHERMI PICCOLI (MOBILE/TABLET) --- */
@media (max-width:800px){
    #menu-icon{display:block;background:none;border:none;cursor:pointer;padding:10px;position:absolute;top:10px;right:10px;z-index:200}
    #menu-icon .bar{display:block;width:25px;height:3px;margin:5px auto;background-color:black;transition:all 0.3s ease-in-out}
    #nav-links{flex-direction:column;width:100%;max-height:0;overflow:hidden;position:static;background-color:#FFDF71;transition:max-height 0.5s ease-in-out;z-index:150;gap:0}
    #nav-links.open{max-height:1000px;padding-top:50px;overflow-y:auto}
    #menu li{width:100%;min-width:100%;border-left:none;border-right:none;flex-grow:0;height:auto;padding-top:5px;padding-bottom:5px;display:block}
    #menu li a{line-height:1.2;padding:10px;text-align:left}
    #nav-links ul{position:static;visibility:visible;opacity:1;width:100%;background-color:#ffe8a1;padding:0;box-shadow:none;border:none;display:block}
    #nav-links ul li{width:100%;height:auto;border:none;background-color:#ffe8a1;text-align:left;line-height:1.5;padding-left:20px}
    #nav-links ul li a{padding-left:10px}
    #nav-links li:hover>ul{all:unset}
}

/* --- FOOTER (Stile migliorato) --- */
footer{max-width:1200px;margin:20px auto 0 auto;padding:20px 0;text-align:center;background-color:#f7f7f7;color:#333;font-size:0.9em;border-top:3px solid #FFDF71;font-family:Arial,sans-serif}

/* --- BLOCCHI DI CONTENUTO --- */
#generale{border-radius:25px;width:90%;max-width:900px;height:auto;margin:20px auto;background-color:#ffffff;font-size:1.2em;opacity:0.9}

/* --- STILI PER SERVIZI PREMIUM --- */
#servizi-premium{background:#f9f9f9;padding:20px;margin:20px 0;border-radius:10px}
.servizio-card{text-align:center;padding:10px;background:#fff;border-radius:10px;box-shadow:0 2px 5px rgba(0,0,0,0.1);transition:transform 0.3s}
.servizio-card:hover{transform:scale(1.05)}

/* --- CTA BUTTON --- */
.cta-button{display:inline-block;background:#8a2be2;color:white;padding:10px 20px;text-decoration:none;border-radius:5px;font-family:'Bebas Neue',sans-serif}

/* --- STILI PER IMG LOGHI --- */
.logo-footer-small img{filter:grayscale(20%)}

/* --- RESPONSIVE VIDEO --- */
.video-responsive-wrapper{display:flex;justify-content:center;align-items:center;margin:20px auto;width:100%;max-width:800px}
.video-responsive-wrapper iframe{width:100%!important;aspect-ratio:16/9;border-radius:8px;box-shadow:0 4px 15px rgba(0,0,0,0.5)}

#disponibilita { padding: 30px 5%; background: rgba(0,0,0,0.3); }
.seo-link { position: absolute; left: -9999px; top: -9999px; opacity: 0; height: 0; width: 0; overflow: hidden; }