@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:wght@400;500;600&display=swap');
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --blu:    #1e3a6e;
  --blu-l:  #eef2f9;
  --oro:    #fbbf24;
  --g0:     #fafaf9;
  --g1:     #f8f7f4;
  --g2:     #e7e5e4;
  --g3:     #d6d3d1;
  --g5:     #a8a29e;
  --g7:     #44403c;
  --g9:     #1c1917;
  --r:      10px;
  --shadow: 0 1px 3px rgba(0,0,0,.07);
}
html { scroll-behavior: smooth; }
body { font-family: 'DM Sans', sans-serif; background: var(--g1); color: var(--g9); min-height: 100vh; display: flex; flex-direction: column; }
a { color: var(--blu); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }

/* HEADER */
.site-header { background: #fff; border-bottom: 1px solid var(--g2); position: sticky; top: 0; z-index: 1000; box-shadow: var(--shadow); }
.header-inner { max-width: 1100px; margin: 0 auto; padding: 0 24px; height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.logo { display: flex; align-items: center; text-decoration: none; flex-shrink: 0; }
.logo-ms { font-family: 'DM Serif Display', serif; font-size: 24px; color: #111827; letter-spacing: -.3px; }
.logo-ms span { color: #dc2626; }
.logo-partner { font-family: 'DM Serif Display', serif; font-size: 22px; font-weight: 400; color: #111827; margin-left: 12px; padding-left: 12px; border-left: 1px solid var(--g3); text-decoration: none; white-space: nowrap; transition: color .15s; }
.logo-partner:hover { color: var(--blu); text-decoration: none; }
.site-nav { display: flex; align-items: center; gap: 2px; }
.site-nav a { padding: 6px 13px; border-radius: 20px; font-size: 13px; font-weight: 500; color: var(--g7); text-decoration: none; transition: background .15s, color .15s; white-space: nowrap; }
.site-nav a:hover { background: var(--g1); color: var(--g9); text-decoration: none; }
.site-nav a.active { background: var(--blu); color: #fff; }
.site-nav .btn-stazioni { background: var(--blu); color: #fff; margin-left: 6px; font-weight: 600; font-size: 12px; padding: 5px 11px; }
.site-nav .btn-stazioni:hover { background: #152d58; color: #fff; }
.nav-toggle { display: none; background: none; border: none; cursor: pointer; padding: 4px; color: var(--g7); }
.nav-toggle svg { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 2; }

.hero { background: linear-gradient(180deg, #1a2d5a 0%, #1e3a6e 60%, #2a4a8a 100%); padding: 28px 24px 20px; overflow: hidden; position: relative; }
.hero-bg, .hero-overlay { display: none; }

/* Nuvole animate */
.hero-clouds { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.cloud { position: absolute; background: rgba(255,255,255,.07); border-radius: 50px; animation: driftCloud linear infinite; }
.cloud::before, .cloud::after { content: ''; position: absolute; background: rgba(255,255,255,.07); border-radius: 50%; }
.cloud-1 { width: 280px; height: 60px; top: 20%; animation-duration: 28s; animation-delay: 0s; }
.cloud-1::before { width: 120px; height: 80px; top: -30px; left: 40px; }
.cloud-1::after  { width: 90px;  height: 60px; top: -20px; left: 130px; }
.cloud-2 { width: 200px; height: 45px; top: 55%; animation-duration: 38s; animation-delay: -10s; opacity: .6; }
.cloud-2::before { width: 90px; height: 60px; top: -25px; left: 30px; }
.cloud-2::after  { width: 70px; height: 50px; top: -15px; left: 100px; }
.cloud-3 { width: 160px; height: 35px; top: 75%; animation-duration: 22s; animation-delay: -5s; opacity: .4; }
.cloud-3::before { width: 70px; height: 50px; top: -20px; left: 20px; }
.cloud-3::after  { width: 55px; height: 40px; top: -12px; left: 80px; }
.cloud-4 { width: 240px; height: 50px; top: 10%; animation-duration: 45s; animation-delay: -20s; opacity: .5; }
.cloud-4::before { width: 100px; height: 70px; top: -28px; left: 50px; }
.cloud-4::after  { width: 80px;  height: 55px; top: -18px; left: 140px; }

@keyframes driftCloud {
  from { transform: translateX(-350px); }
  to   { transform: translateX(110vw); }
}
.hero-inner { position: relative; z-index: 2; padding: 0; width: 100%; max-width: 1100px; margin: 0 auto; display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; }
.hero-left { flex-shrink: 0; }
.hero-center { flex: 1; text-align: center; }
.hero-title { font-family: 'DM Serif Display', serif; font-size: 38px; letter-spacing: -.5px; background: linear-gradient(135deg, #ffd700 0%, #fff 40%, #ffd700 70%, #fff 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; filter: drop-shadow(0 0 8px rgba(255,215,0,.5)) drop-shadow(0 2px 4px rgba(0,0,0,.3)); }
.hero-logo-wrap { display: flex; align-items: center; }
.hero-logo-img { max-height: 70px; width: auto; background: #fff; border-radius: 12px; padding: 6px 14px; display: block; flex-shrink: 0; }
.hero-text { display: none; }
.hero-btns { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; margin-left: 20px; }
.btn-primary { background: #fff; color: #1e3a6e; padding: 7px 16px; border-radius: 24px; font-size: 12px; font-weight: 700; border: none; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.btn-primary:hover { opacity: .9; text-decoration: none; color: #1e3a6e; }
.btn-outline { background: transparent; color: #fff; padding: 7px 16px; border-radius: 24px; font-size: 12px; font-weight: 600; border: 1.5px solid rgba(255,255,255,.7); cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.btn-outline:hover { background: rgba(255,255,255,.15); text-decoration: none; color: #fff; }

/* STATS BAR */
.stats-bar { background: #fff; border-bottom: 1px solid var(--g2); }
.stats-inner { max-width: 1100px; margin: 0 auto; display: flex; }
.stat-item { flex: 1; padding: 13px 16px; border-right: 1px solid var(--g2); text-align: center; }
.stat-item:last-child { border-right: none; }
.stat-val { font-size: 20px; font-weight: 700; color: var(--blu); }
.stat-lbl { font-size: 10px; color: var(--g5); margin-top: 2px; }
.live-dot { display: inline-block; width: 7px; height: 7px; background: #16a34a; border-radius: 50%; animation: pulse 2s infinite; margin-right: 3px; vertical-align: middle; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.25} }

/* LAYOUT */
.site-main { flex: 1; }
.container { max-width: 1100px; margin: 0 auto; padding: 32px 24px; }
.page-grid { display: grid; grid-template-columns: 1fr 320px; gap: 24px; align-items: start; }

/* ARTICOLI */
.article-card { background: #fff; border: 1px solid var(--g2); border-radius: var(--r); overflow: hidden; margin-bottom: 20px; box-shadow: var(--shadow); }
.article-card:last-child { margin-bottom: 0; }
.article-stripe { height: 3px; background: var(--blu); }
.article-body { padding: 22px 24px; }
.article-cat { font-size: 10px; font-weight: 700; color: var(--blu); text-transform: uppercase; letter-spacing: .6px; margin-bottom: 8px; }
.article-title { font-family: 'DM Serif Display', serif; font-size: 20px; color: var(--g9); line-height: 1.35; margin-bottom: 8px; }
.article-meta { font-size: 11px; color: var(--g5); margin-bottom: 14px; }
.article-text { font-size: 14px; color: var(--g7); line-height: 1.75; }
.article-text p { margin-bottom: 12px; }
.article-text p:last-child { margin-bottom: 0; }
.article-text strong { font-weight: 600; color: var(--g9); }
.article-text a { color: var(--blu); }
.article-footer { padding: 14px 24px; border-top: 1px solid var(--g2); background: var(--g0); }
.read-more { font-size: 13px; font-weight: 600; color: var(--blu); }

/* SIDEBAR */
.sidebar { display: flex; flex-direction: column; gap: 16px; }
.sb-widget { background: #fff; border: 1px solid var(--g2); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); }
.sb-widget-title { padding: 11px 16px; font-size: 10px; font-weight: 700; color: var(--g7); text-transform: uppercase; letter-spacing: .5px; border-bottom: 1px solid var(--g2); background: var(--g0); }
.sb-widget-body { padding: 12px 16px; }
.meteo-row { display: flex; justify-content: space-between; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--g2); font-size: 13px; }
.meteo-row:last-child { border-bottom: none; }
.meteo-row .lbl { color: var(--g5); }
.meteo-row .val { font-weight: 600; color: var(--g9); }
.meteo-row .val.hi { color: #dc2626; }
.meteo-row .val.lo { color: var(--blu); }
.quick-link { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--g2); color: var(--g7); font-size: 13px; font-weight: 500; text-decoration: none; }
.quick-link:last-child { border-bottom: none; }
.quick-link:hover { color: var(--blu); text-decoration: none; }
.quick-link .icon { width: 30px; height: 30px; border-radius: 7px; background: var(--blu-l); display: flex; align-items: center; justify-content: center; font-size: 15px; flex-shrink: 0; }
.quick-link .arrow { margin-left: auto; color: var(--g3); }

/* PAGE HERO */
.page-hero { background: var(--blu); padding: 36px 24px; }
.page-hero-inner { max-width: 1100px; margin: 0 auto; }
.page-hero h1 { font-family: 'DM Serif Display', serif; font-size: 28px; color: #fff; margin-bottom: 6px; }
.page-hero p { font-size: 14px; color: rgba(255,255,255,.75); }
.breadcrumb { font-size: 12px; color: rgba(255,255,255,.6); margin-bottom: 8px; display: flex; gap: 6px; align-items: center; }
.breadcrumb a { color: rgba(255,255,255,.7); }
.breadcrumb a:hover { color: #fff; }

/* BENUCCI */
.benucci-wrap { max-width: 780px; }
.benucci-intro { background: #fff; border: 1px solid var(--g2); border-radius: var(--r); padding: 32px; box-shadow: var(--shadow); }
.benucci-intro .quote { font-family: 'DM Serif Display', serif; font-size: 22px; color: var(--blu); font-style: italic; margin-bottom: 20px; padding-left: 20px; border-left: 3px solid var(--blu); border-radius: 0; line-height: 1.4; }
.benucci-intro p { font-size: 15px; color: var(--g7); line-height: 1.8; margin-bottom: 14px; }
.benucci-photo { border-radius: 10px; margin-bottom: 24px; border: 3px solid var(--g2); }

/* CONTATTI */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.contact-card { background: #fff; border: 1px solid var(--g2); border-radius: var(--r); padding: 24px; box-shadow: var(--shadow); }
.contact-card .icon { font-size: 28px; margin-bottom: 12px; }
.contact-card h3 { font-size: 15px; font-weight: 600; color: var(--g9); margin-bottom: 6px; }
.contact-card p { font-size: 13px; color: var(--g7); line-height: 1.6; }

/* FOOTER */
.site-footer { background: #1e3a6e; padding: 40px 24px 24px; margin-top: auto; }
.footer-inner { max-width: 1100px; margin: 0 auto; }
.footer-top { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 32px; padding-bottom: 28px; border-bottom: 1px solid rgba(255,255,255,.15); margin-bottom: 24px; }
.footer-brand strong { color: #fff; font-size: 15px; display: block; margin-bottom: 6px; }
.footer-brand p { font-size: 12px; color: #93c5fd; line-height: 1.6; }
.footer-col h4 { font-size: 11px; font-weight: 600; color: #93c5fd; text-transform: uppercase; letter-spacing: .5px; margin-bottom: 12px; }
.footer-col a { display: block; font-size: 13px; color: #bfdbfe; text-decoration: none; margin-bottom: 7px; }
.footer-col a:hover { color: #fff; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: #93c5fd; }
.footer-badge { background: #fff; color: #1e3a6e; font-size: 11px; padding: 4px 10px; border-radius: 12px; font-weight: 700; }

/* RESPONSIVE */
@media (max-width: 768px) {
  .header-inner { height: 56px; padding: 0 16px; }
  .logo-ms { font-size: 20px; }
  .logo-partner { display: none; }
  .site-nav { display: none; flex-direction: column; position: absolute; top: 56px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--g2); padding: 12px 16px; gap: 4px; box-shadow: 0 4px 12px rgba(0,0,0,.1); z-index: 999; }
  .site-nav.open { display: flex; }
  .site-nav a { border-radius: 8px; padding: 10px 16px; color: var(--g7); font-size: 14px; }
  .site-nav .btn-stazioni { margin-left: 0; margin-top: 4px; text-align: center; justify-content: center; border-radius: 8px; }
  .nav-toggle { display: block; }

  /* HERO mobile */
  .hero { padding: 14px 16px; }
  .hero-inner { flex-direction: column; gap: 10px; }
  .hero-center { order: -1; }
  .hero-title { font-size: 18px; }
  .hero-logo-img { max-height: 55px; }
  .hero-text { display: none; }

  .page-grid { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: 1fr; gap: 20px; }
  .stats-inner { flex-wrap: wrap; }
  .stat-item { min-width: 50%; border-bottom: 1px solid var(--g2); }
  .contact-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}

/* ===== Banner Cookie ===== */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:3000;background:#fff;border-top:3px solid var(--blu);box-shadow:0 -4px 24px rgba(0,0,0,.16);transform:translateY(110%);transition:transform .35s cubic-bezier(.16,1,.3,1);}
.cookie-banner.show{transform:translateY(0);}
.cookie-inner{max-width:1100px;margin:0 auto;padding:18px 24px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.cookie-text{flex:1;min-width:280px;}
.cookie-text strong{display:block;font-size:15px;color:var(--g9);margin-bottom:4px;}
.cookie-text p{font-size:13px;line-height:1.5;color:var(--g7);margin:0;}
.cookie-text a{color:var(--blu);font-weight:600;text-decoration:underline;}
.cookie-actions{display:flex;gap:10px;flex-shrink:0;}
.ck-btn{padding:10px 20px;border-radius:24px;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;cursor:pointer;border:1px solid var(--g3);transition:all .15s;white-space:nowrap;}
.ck-necessary{background:#fff;color:var(--g7);}
.ck-necessary:hover{background:var(--g1);border-color:var(--g5);}
.ck-all{background:var(--blu);color:#fff;border-color:var(--blu);}
.ck-all:hover{background:#152d58;}
@media(max-width:640px){
  .cookie-inner{padding:16px;gap:14px;}
  .cookie-actions{width:100%;}
  .ck-btn{flex:1;text-align:center;}
}

/* Placeholder contenuti di terze parti bloccati */
.cookie-placeholder{padding:20px 16px;text-align:center;background:var(--blu-l);border:1px dashed var(--g3);border-radius:var(--r);margin:0;}
.cookie-placeholder p{font-size:12px;line-height:1.5;color:var(--g7);margin:0 0 10px;}
.ck-activate{padding:8px 16px;border-radius:20px;border:none;background:var(--blu);color:#fff;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:background .15s;}
.ck-activate:hover{background:#152d58;}

/* ===== Pagina legale (Privacy & Cookie) ===== */
.legal-doc{max-width:820px;margin:32px auto;background:#fff;border:1px solid var(--g2);border-radius:var(--r);box-shadow:var(--shadow);padding:36px 40px;}
.legal-doc h2{font-family:'DM Serif Display',serif;font-size:21px;color:var(--blu);margin:28px 0 10px;}
.legal-doc h2:first-of-type{margin-top:0;}
.legal-doc h3{font-size:15px;font-weight:600;color:var(--g9);margin:18px 0 6px;}
.legal-doc p{font-size:14px;line-height:1.65;color:var(--g7);margin:0 0 12px;}
.legal-doc ul{margin:0 0 14px;padding-left:22px;}
.legal-doc li{font-size:14px;line-height:1.6;color:var(--g7);margin-bottom:6px;}
.legal-doc a{color:var(--blu);text-decoration:underline;}
.legal-updated{font-size:13px!important;color:var(--g5)!important;border-bottom:1px solid var(--g2);padding-bottom:14px;}
.legal-note{margin-top:24px;padding-top:16px;border-top:1px solid var(--g2);font-size:12.5px!important;color:var(--g5)!important;}
.legal-table{width:100%;border-collapse:collapse;margin:8px 0 16px;font-size:13px;}
.legal-table th{background:var(--blu-l);color:var(--g9);text-align:left;padding:9px 12px;font-weight:600;border:1px solid var(--g2);}
.legal-table td{padding:9px 12px;border:1px solid var(--g2);color:var(--g7);vertical-align:top;line-height:1.5;}
@media(max-width:640px){
  .legal-doc{padding:24px 18px;margin:18px auto;}
  .legal-table{font-size:12px;}
  .legal-table th,.legal-table td{padding:7px 8px;}
}

/* ===== Video embed responsive (YouTube disarmato) ===== */
.video-embed{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;margin:0 0 8px;background:#000;}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.video-embed .cookie-placeholder{position:absolute;inset:0;margin:0;border-radius:0;}

/* ===== Grafici interattivi (Chart.js) ===== */
.grafico-box{background:#fff;border:1px solid var(--g2);border-radius:var(--r);padding:16px 18px;margin:0 0 18px;box-shadow:var(--shadow);}
.grafico-titolo{font-size:14px;font-weight:600;color:var(--g9);margin-bottom:12px;}
.grafico-canvas{position:relative;height:280px;}
.grafico-canvas-alto{height:360px;}
@media(max-width:640px){
  .grafico-box{padding:12px;}
  .grafico-canvas{height:240px;}
  .grafico-canvas-alto{height:320px;}
}
