*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:#212121;background:#fff;line-height:1.6}

/* === ANIMAZIONI === */
@keyframes lampeggia{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.02)}}
@keyframes pulse-green{0%,100%{box-shadow:0 0 0 0 rgba(76,175,80,.7);background:#25D366}50%{box-shadow:0 0 0 15px rgba(76,175,80,0);background:#1B8E2A}}
@keyframes flash{0%,49%{background:#FFD600;color:#D32F2F}50%,100%{background:#D32F2F;color:#FFD600}}
@keyframes blink-text{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes promo-flash{0%,100%{background:linear-gradient(90deg,#FF6B00,#FF1744);color:white}50%{background:linear-gradient(90deg,#FF1744,#FF6B00);color:#FFD600}}
@keyframes scroll-promo{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}

/* === BANNER FLASH (servizio rapido) === */
.banner-flash{
  background:#FFD600;color:#D32F2F;padding:15px 10px;text-align:center;
  font-weight:bold;font-size:1.1rem;animation:flash 1.2s infinite;
  border-top:3px solid #D32F2F;border-bottom:3px solid #D32F2F;
}
.banner-flash a{color:inherit;text-decoration:none;font-size:1.3rem}

/* === BANNER PROMO (prezzi scontati) === */
.banner-promo{
  background:linear-gradient(90deg,#FF6B00,#FF1744);
  color:white;padding:12px 0;overflow:hidden;
  border-top:2px solid #FFD600;border-bottom:2px solid #FFD600;
  animation:promo-flash 1.5s infinite;
}
.promo-text{
  display:inline-block;font-weight:bold;font-size:1.05rem;
  white-space:nowrap;animation:scroll-promo 18s linear infinite;
  padding-left:100%;
}

/* === STATO APERTURA === */
.stato-apertura{
  display:flex;justify-content:center;align-items:center;gap:10px;
  padding:12px;background:#f5f5f5;border-bottom:1px solid #ddd;
  font-weight:bold;font-size:.95rem;flex-wrap:wrap;
}
.stato-aperto{
  background:#4CAF50;color:white;padding:6px 14px;border-radius:20px;
  animation:lampeggia 2s infinite;
}
.stato-chiuso{background:#9E9E9E;color:white;padding:6px 14px;border-radius:20px}
.orario-info{color:#666;font-size:.85rem}

/* === TICKER === */
.ticker{background:#D32F2F;color:white;padding:10px 0;overflow:hidden;white-space:nowrap;font-weight:bold;font-size:.9rem}
.ticker-track{display:inline-block;animation:tk 30s linear infinite}
.ticker span{padding:0 30px}
@keyframes tk{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

.fp{background:#FFC107;color:#212121;text-align:center;padding:10px;font-weight:bold;font-size:.95rem}
.fp a{color:#D32F2F;text-decoration:none}

/* === HEADER === */
header{background:white;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid #D32F2F;flex-wrap:wrap;gap:10px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:#212121}
.logo .icon{font-size:2rem;color:#FFC107}
.logo .brand{display:flex;flex-direction:column;font-weight:bold;font-size:1.1rem;color:#D32F2F}
.logo .brand span{font-size:.8rem;color:#666;font-weight:normal}
.bt{background:#25D366;color:white;padding:14px 24px;border-radius:8px;text-decoration:none;font-weight:bold;font-size:1rem;animation:pulse-green 1.5s infinite;display:inline-block}

.fpro{background:#212121;color:white;padding:12px;text-align:center;display:flex;justify-content:center;flex-wrap:wrap;gap:10px;font-size:.85rem;align-items:center}
.fpro .t{background:#D32F2F;padding:5px 12px;border-radius:5px;font-weight:bold}
.fpro .st{color:#FFC107}
.fpro a{color:#FFC107;text-decoration:none;font-weight:bold}

nav{background:#f5f5f5;padding:12px;display:flex;justify-content:center;flex-wrap:wrap;gap:5px;border-bottom:1px solid #ddd}
nav a{color:#212121;padding:8px 12px;text-decoration:none;font-weight:bold;font-size:.9rem;border-radius:5px}
nav a:hover{background:#FFC107;color:#212121}

/* === HERO === */
.hero{background:linear-gradient(135deg,#D32F2F,#FFC107);color:white;padding:60px 20px;text-align:center}
.hero h1{font-size:2rem;margin-bottom:15px;text-shadow:2px 2px 4px rgba(0,0,0,.3)}
.hero p{font-size:1.1rem;max-width:800px;margin:0 auto 25px}
.btns{display:flex;justify-content:center;gap:15px;flex-wrap:wrap}
.bw{background:#25D366;color:white;padding:15px 30px;border-radius:8px;text-decoration:none;font-weight:bold;font-size:1.05rem;box-shadow:0 4px 8px rgba(0,0,0,.15);animation:pulse-green 1.5s infinite;display:inline-block}
.bwa{background:#25D366;color:white;padding:15px 30px;border-radius:8px;text-decoration:none;font-weight:bold;font-size:1.05rem;box-shadow:0 4px 8px rgba(0,0,0,.15)}

/* === CONTENT === */
.cont{padding:50px 20px;max-width:1200px;margin:0 auto}
.cont h2{color:#D32F2F;text-align:center;margin-bottom:30px;font-size:1.8rem}

/* === MARCHE PANORAMIC (NUOVO) === */
.marche-panoramic{
  background:linear-gradient(135deg,#1A237E 0%,#1A237E 50%,#D32F2F 50%,#D32F2F 100%);
  background-size:200% 200%;
  padding:60px 20px;
  position:relative;
}
.marche-panoramic::before{
  content:"";position:absolute;top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,.2);pointer-events:none;
}
.marche-panoramic .grid{position:relative;z-index:1;max-width:1200px;margin:0 auto}
.marche-panoramic .cd{
  background:rgba(255,255,255,.95);backdrop-filter:blur(5px);
  border:2px solid rgba(255,255,255,.3);
}
.marche-panoramic .cd h3{color:#D32F2F}

/* === GRID === */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.cd{background:white;padding:20px;border-radius:10px;text-decoration:none;color:#212121;border:2px solid #f0f0f0;transition:all .3s;display:block}
.cd:hover{border-color:#D32F2F;transform:translateY(-3px);box-shadow:0 8px 16px rgba(0,0,0,.1)}
.cd h3{color:#D32F2F;margin-bottom:8px;font-size:1.1rem}
.cd p{color:#666;font-size:.9rem}
.cd.s{border-left:4px solid #FFC107}
.cd.c{text-align:center}
.grid.cm{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.grid.cm .cd{padding:12px}
.grid.cm h3{font-size:1rem;margin:0}

/* === ATTRIBUTI === */
.at{background:#212121;color:white;padding:30px 20px;text-align:center;display:flex;justify-content:center;flex-wrap:wrap;gap:20px}
.af{background:#D32F2F;padding:10px 20px;border-radius:8px;font-weight:bold;font-size:.95rem}

/* === CX (perché sceglierci) === */
.cx{background:#FFC107;padding:40px 20px;text-align:center}
.cx h3{color:#D32F2F;margin-bottom:15px;font-size:1.5rem}
.cx p{max-width:800px;margin:0 auto 20px}
.cx a{background:#25D366;color:white;padding:15px 30px;border-radius:8px;text-decoration:none;font-weight:bold;animation:pulse-green 1.5s infinite;display:inline-block}

/* === CTA === */
.cta{background:linear-gradient(135deg,#212121,#D32F2F);color:white;padding:50px 20px;text-align:center}
.cta h2{font-size:2rem;margin-bottom:15px;color:white}
.cta p{margin-bottom:25px;font-size:1.1rem}
.cta .nu{display:block;font-size:2rem;color:#FFC107;font-weight:bold;margin-bottom:20px;animation:blink-text 1.5s infinite}

/* === FOOTER === */
footer{background:#1a1a1a;color:white;padding:40px 20px;text-align:center}
footer .ft{font-weight:bold;color:#FFC107;font-size:1.2rem;margin-bottom:10px}
footer p{margin:5px 0;font-size:.95rem}
footer a{color:#FFC107;text-decoration:none;font-weight:bold}

.legal{background:#000;color:#999;padding:20px;font-size:.85rem;text-align:center;line-height:1.8}
.legal p{margin:3px 0}

/* === FLOATING BUTTONS === */
.fl{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:10px;z-index:1000}
.fl-t{background:#25D366;color:white;padding:15px;border-radius:50px;text-decoration:none;font-weight:bold;box-shadow:0 4px 12px rgba(0,0,0,.4);animation:pulse-green 1.5s infinite}
.fl-w{background:#25D366;color:white;padding:15px;border-radius:50px;text-decoration:none;font-weight:bold;box-shadow:0 4px 12px rgba(0,0,0,.4)}

@media(max-width:768px){
  .hero h1{font-size:1.5rem}
  .cont h2{font-size:1.5rem}
  .cta h2{font-size:1.5rem}
  .cta .nu{font-size:1.5rem}
  .banner-flash{font-size:.95rem}
  .banner-flash a{font-size:1.1rem}
  .promo-text{font-size:.9rem}
}


/* === BOTTONE MEGA LAMPEGGIANTE === */
@keyframes mega-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(76,175,80,.7);transform:scale(1)}
  50%{box-shadow:0 0 0 25px rgba(76,175,80,0);transform:scale(1.05)}
}
@keyframes mega-color{
  0%,100%{background:#25D366}
  50%{background:#1B5E20}
}
.bw-mega{
  display:inline-block;
  background:#25D366;
  color:white;
  padding:20px 40px;
  border-radius:50px;
  text-decoration:none;
  font-weight:bold;
  font-size:1.3rem;
  box-shadow:0 6px 16px rgba(0,0,0,.3);
  animation:mega-pulse 1.2s infinite, mega-color 2s infinite;
  margin-top:15px;
  border:3px solid #FFD600;
  text-shadow:1px 1px 2px rgba(0,0,0,.3);
}
.bw-mega:hover{transform:scale(1.1)}

@media(max-width:768px){
  .bw-mega{font-size:1rem;padding:15px 25px}
}


/* === TASTI VANTAGGI LAMPEGGIANTI E CLICCABILI === */
@keyframes vantaggio-flash{
  0%,100%{background:#D32F2F;transform:scale(1)}
  50%{background:#FF1744;transform:scale(1.05);box-shadow:0 0 20px rgba(255,23,68,.5)}
}
.at .af{
  background:#D32F2F;
  padding:12px 24px;
  border-radius:8px;
  font-weight:bold;
  font-size:.95rem;
  color:white;
  text-decoration:none;
  display:inline-block;
  animation:vantaggio-flash 1.5s infinite;
  cursor:pointer;
}
.at .af:hover{transform:scale(1.1)}

/* === SIGILLO GARANZIA TONDO LAMPEGGIANTE === */
@keyframes seal-rotate{
  0%{transform:rotate(0deg)}
  100%{transform:rotate(360deg)}
}
@keyframes seal-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,193,7,.7);transform:scale(1)}
  50%{box-shadow:0 0 0 20px rgba(255,193,7,0);transform:scale(1.08)}
}
.garanzia-seal{
  position:relative;
  display:inline-block;
  width:160px;
  height:160px;
  margin:30px auto;
}
.garanzia-seal::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;bottom:0;
  background:radial-gradient(circle,#FFD600 0%,#FF9800 60%,#D32F2F 100%);
  border-radius:50%;
  animation:seal-pulse 1.5s infinite;
  box-shadow:0 6px 16px rgba(0,0,0,.3);
}
.garanzia-seal-content{
  position:relative;
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:white;
  font-weight:bold;
  text-align:center;
  text-shadow:1px 1px 3px rgba(0,0,0,.5);
}
.garanzia-seal-content .icon{
  font-size:2rem;
  margin-bottom:5px;
}
.garanzia-seal-content .num{
  font-size:2.5rem;
  line-height:1;
  color:#FFFFFF;
}
.garanzia-seal-content .label{
  font-size:.85rem;
  margin-top:5px;
}
.garanzia-seal-stars{
  position:absolute;
  top:0;left:0;right:0;bottom:0;
  animation:seal-rotate 8s linear infinite;
  pointer-events:none;
}
.garanzia-section{
  background:#212121;
  padding:40px 20px;
  text-align:center;
  color:white;
}
.garanzia-section h3{
  color:#FFC107;
  font-size:1.4rem;
  margin-bottom:10px;
}
.garanzia-section p{
  max-width:600px;
  margin:10px auto 20px;
  color:#ccc;
}


/* === SFONDO PANORAMICO SERVIZI === */
.servizi-panoramic{
  background:linear-gradient(135deg,#1976D2 0%,#1976D2 50%,#0277BD 50%,#0277BD 100%);
  background-size:200% 200%;
  padding:60px 20px;
  position:relative;
}
.servizi-panoramic::before{
  content:"";position:absolute;top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,.15);pointer-events:none;
}
.servizi-panoramic h2{color:white !important;text-align:center;font-size:2rem;margin-bottom:30px;text-shadow:2px 2px 4px rgba(0,0,0,.5);position:relative;z-index:1}
.servizi-panoramic > p{position:relative;z-index:1;color:white;text-align:center}
.servizi-panoramic .grid{position:relative;z-index:1;max-width:1200px;margin:0 auto}
.servizi-panoramic .cd{
  background:rgba(255,255,255,.95);backdrop-filter:blur(5px);
  border:2px solid rgba(255,255,255,.3);
}
.servizi-panoramic .cd h3{color:#1976D2}