/* ==========================================================
   FVGTECH.IT - NAV & FOOTER CSS
   v. 1.09 - 30 May 2026
   Built with PioneerAIO, framework by Gabriele Gobbo · https://www.pioneeraio.it
   ========================================================== */

/* FvgTech - Nav & Footer CSS
   Incluso via SSI in tutte le pagine statiche.
   Modifica qui per aggiornare nav e footer su tutte le pagine. */

.topnav{position:sticky;top:0;z-index:1000;background:#5965ca;background-color:#5965ca;border-bottom:none;box-shadow:0 2px 8px rgba(0,0,0,0.15);-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.topnav-inner{display:flex;align-items:center;justify-content:space-between;padding:0 2rem}
.topnav-logo{font-size:1.1rem;font-weight:800;color:#fff;text-decoration:none;letter-spacing:-0.01em;padding:0.9rem 0;flex-shrink:0;text-transform:none;white-space:nowrap}
.topnav-links{display:flex;align-items:center;gap:0}
.topnav .topnav-links a{color:rgba(255,255,255,0.85);text-decoration:none;padding:1rem 0.7rem;font-size:0.82rem!important;font-weight:700!important;letter-spacing:0.02em;text-transform:uppercase;transition:all 0.2s;white-space:nowrap;border-bottom:3px solid transparent}
.topnav-links a:hover{color:#fff;border-bottom-color:rgba(255,255,255,0.6)}
.topnav-links a.active{color:#fff;border-bottom:3px solid #fff}
.topnav-mobile{display:none;align-items:center;justify-content:space-between;padding:0 1.2rem;position:relative}
.topnav-brand{font-size:1.1rem;font-weight:800;color:#fff;text-decoration:none;letter-spacing:-0.01em;padding:0.9rem 0}
.topnav-hamburger{background:none;border:none;cursor:pointer;padding:0.6rem;display:flex;flex-direction:column;gap:5px;border-radius:6px;transition:background 0.2s}
.topnav-hamburger:hover{background:#f0f0f0}
.topnav-hamburger span{display:block;width:26px;height:3px;background:#fff;border-radius:3px;transition:all 0.3s}
.topnav-hamburger.open span{background:#5965ca}
.topnav-hamburger.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.topnav-hamburger.open span:nth-child(2){opacity:0}
.topnav-hamburger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.topnav-dropdown{display:none;flex-direction:column;background:#fff;position:absolute;top:100%;left:0;right:0;box-shadow:0 8px 24px rgba(0,0,0,0.12);opacity:0;transform:translateY(-8px);transition:opacity 0.2s ease,transform 0.2s ease;z-index:999}
.topnav-dropdown.open{display:flex;opacity:1;transform:translateY(0)}
.topnav-dropdown a{color:#444;text-decoration:none;padding:0.9rem 1.5rem;font-size:0.9rem;font-weight:600;text-transform:uppercase;letter-spacing:0.02em;border-bottom:1px solid #f0f0f0;transition:background 0.2s;display:flex;align-items:center;gap:0.9rem}
.topnav-dropdown a i{width:18px;text-align:center;color:#5965ca;font-size:1rem}
.topnav-dropdown a:hover{background:#f8f9fa;color:#2c9ed8}
.topnav-dropdown a:hover i{color:#2c9ed8}
.topnav-dropdown a.active{color:#d91d8e;border-left:4px solid #d91d8e;padding-left:calc(1.5rem - 4px)}
.dropdown-app-btns{display:flex;gap:0.8rem;padding:1rem 1.5rem;border-top:2px solid #f0f0f0;background:#f8f9fa}
.dropdown-app-btn{display:flex;align-items:center;gap:0.6rem;background:#000;color:#fff;border:none;border-radius:8px;padding:0.5rem 1rem;text-decoration:none;flex:1;justify-content:center}
.dropdown-app-btn:hover{background:#222}
.dropdown-app-btn i{font-size:1.2rem;color:#fff}
.dropdown-app-btn div{display:flex;flex-direction:column;line-height:1.2}
.dropdown-app-btn small{font-size:0.6rem;color:rgba(255,255,255,0.7);text-transform:uppercase;letter-spacing:0.04em}
.dropdown-app-btn span{font-size:0.8rem;font-weight:700;color:#fff}
@media(max-width:950px){.topnav-inner{display:none}.topnav-mobile{display:flex}}

/* SOTTOMENU DESKTOP */
.topnav-item{position:relative;display:inline-flex;align-items:center}
.topnav-item > a{cursor:pointer}
.topnav-sub{
  display:none;position:absolute;top:100%;left:0;
  background:#1e3a8a;min-width:210px;
  box-shadow:0 8px 24px rgba(0,0,0,0.25);
  border-top:3px solid #5965ca;
  border-radius:0 0 8px 8px;
  min-width:0;width:max-content;
  z-index:1001;
  flex-direction:column;
}
.topnav-item:hover .topnav-sub{display:flex}
.topnav-sub a{
  color:rgba(255,255,255,0.85);text-decoration:none;
  padding:0.65rem 1rem;font-size:0.8rem;
  font-weight:600;text-transform:uppercase;
  letter-spacing:0.02em;
  border-bottom:1px solid rgba(255,255,255,0.08);
  transition:background 0.15s;white-space:nowrap;
}
.topnav-sub a:hover{background:rgba(255,255,255,0.12);color:#fff}
.topnav-sub a:last-child{border-radius:0 0 8px 8px;border-bottom:none}

/* VOCE ATTIVA GIALLA */
.topnav-links a.active{color:#f8ca14!important;border-bottom-color:#f8ca14!important}

/* GRUPPI MOBILE */
.mob-group{border-bottom:1px solid #f0f0f0}
.mob-group-title{
  display:flex;align-items:center;gap:0.8rem;
  padding:0.9rem 1.5rem;
  font-size:0.9rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.02em;
  color:#5965ca;background:#f4f7fc;
}
.mob-group-title i{width:18px;text-align:center;font-size:1rem}
.mob-sub{
  color:#444!important;font-size:0.85rem!important;
  padding:0.65rem 1.5rem 0.65rem 2.8rem!important;
  font-weight:500!important;text-transform:none!important;
  letter-spacing:0!important;border-bottom:1px solid #f8f8f8!important;
}
.mob-sub:last-child{border-bottom:none!important}

/* HAMBURGER X SEMPRE VISIBILE */
.topnav-hamburger span{background:#fff}
.topnav-hamburger.open span{background:#fff}

.footer{background:#1a1a1a;color:#fff;padding:4rem 2rem 2rem}
.footer-nav{display:flex;justify-content:center;gap:4rem;margin-bottom:3rem;flex-wrap:wrap}
.footer-column{text-align:center;min-width:180px}
.footer-column h4{color:#f8ca14;font-size:1.1rem;margin-bottom:1rem;font-weight:700}
.footer-column ul{list-style:none}
.footer-column ul li{margin-bottom:0.7rem}
.footer-column a{color:rgba(255,255,255,0.8);text-decoration:none;transition:color 0.3s}
.footer-column a:hover{color:#2c9ed8}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.1);padding-top:2rem;text-align:center;color:rgba(255,255,255,0.25)!important;font-size:0.85rem;max-width:900px;margin:0 auto}
.footer-bottom p{color:rgba(255,255,255,0.25)!important;font-size:inherit}

.footer-social-row{border-top:1px solid rgba(255,255,255,0.1);border-bottom:1px solid rgba(255,255,255,0.1);padding-top:1.8rem;padding-bottom:1.8rem;margin-top:1rem;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0.6rem}
.social-btn{width:38px;height:38px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1rem;text-decoration:none;transition:transform 0.2s,opacity 0.2s;color:#fff}
.social-btn:hover{transform:translateY(-3px);opacity:0.85}
.s-yt{background:#ff0000}
.s-fb{background:#1877f2}
.s-ig{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.s-li{background:#0a66c2}
.s-tw{background:#000;border:1px solid rgba(255,255,255,0.2)}
.s-pi{background:#e60023}
.s-sp{background:#1db954}
.s-ap{background:#9933cc}
.s-am{background:#ff9900}

.app-btn{display:flex;align-items:center;gap:0.6rem;background:#000;color:#fff;border:1px solid rgba(255,255,255,0.2);border-radius:8px;padding:0 0.9rem;text-decoration:none;transition:all 0.2s;height:38px}
.app-btn:hover{background:#222;transform:translateY(-2px)}
.app-btn i{font-size:1.2rem}
.app-btn-text{display:flex;flex-direction:column;line-height:1.2}
.app-btn-text small{font-size:0.6rem;opacity:0.7;text-transform:uppercase;letter-spacing:0.04em}
.app-btn-text span{font-size:0.8rem;font-weight:700}

@media(max-width:900px){
  .footer-nav{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
  .footer-column{text-align:center}
}
@media(max-width:480px){
  .footer-nav{grid-template-columns:1fr}
}