/* ===================================================
   CsSky — theme.css v1.0.0
   CS Media Group
   =================================================== */

/* ============================================================
   DESIGN TOKENS — LIGHT (default)
   ============================================================ */
:root,
[data-theme="light"] {
  --bg-base:       #f0f5fa;
  --bg-surface:    #e4ecf5;
  --bg-card:       #ffffff;
  --bg-card2:      rgba(255,255,255,0.93);
  --bg-nav:        rgba(240,245,250,0.93);
  --border:        rgba(30,80,140,0.11);
  --border-hover:  rgba(0,120,200,0.38);
  --text-primary:  #0d1e35;
  --text-secondary:#2d5070;
  --text-muted:    #6888a8;
  --accent:        var(--accent-override, #0088cc);
  --accent-dim:    rgba(0,136,204,0.08);
  --accent-border: rgba(0,136,204,0.24);
  --green:         #1a8a50;
  --red:           #cc2222;
  --snow-bg:       rgba(228,236,245,0.8);
  --nav-border:    rgba(30,80,140,0.10);
  --hero-overlay:  linear-gradient(0deg,rgba(7,13,24,0.95) 0%,rgba(7,13,24,0.45) 45%,rgba(7,13,24,0.08) 100%);
  --hero-top:      linear-gradient(180deg,rgba(7,13,24,0.5) 0%,transparent 30%);
  --switch-bg:     #c8ddf0;
  --shadow-card:   0 2px 12px rgba(0,60,120,0.08);
  --tag-bg:        var(--accent-override, #0088cc);
  --tag-text:      #ffffff;
}

/* ============================================================
   DESIGN TOKENS — DARK
   ============================================================ */
[data-theme="dark"] {
  --bg-base:       #070d18;
  --bg-surface:    #0d1a2e;
  --bg-card:       #0f1e35;
  --bg-card2:      rgba(13,26,46,0.9);
  --bg-nav:        rgba(7,13,24,0.90);
  --border:        rgba(168,216,240,0.11);
  --border-hover:  rgba(0,200,255,0.35);
  --text-primary:  #f0f6fc;
  --text-secondary:#9ab5ce;
  --text-muted:    #5a7a96;
  --accent:        var(--accent-override, #00c8ff);
  --accent-dim:    rgba(0,200,255,0.10);
  --accent-border: rgba(0,200,255,0.26);
  --green:         #4bc88a;
  --red:           #e84b4b;
  --snow-bg:       rgba(5,10,20,0.55);
  --nav-border:    rgba(168,216,240,0.10);
  --hero-overlay:  linear-gradient(0deg,rgba(7,13,24,0.97) 0%,rgba(7,13,24,0.55) 45%,rgba(7,13,24,0.15) 100%);
  --hero-top:      linear-gradient(180deg,rgba(7,13,24,0.7) 0%,transparent 30%);
  --switch-bg:     #1a2f50;
  --shadow-card:   0 2px 16px rgba(0,0,0,0.3);
  --tag-bg:        var(--accent-override, #00c8ff);
  --tag-text:      #070d18;
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }

body {
  background: var(--bg-base);
  color: var(--text-primary);
  font-family: 'Barlow', sans-serif;
  font-weight: 400;
  overflow-x: hidden;
  transition: background .3s, color .3s;
  line-height: 1.5;
}

a { text-decoration: none; color: inherit; }
img { max-width:100%; height:auto; display:block; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
ul, ol { list-style: none; }

/* ============================================================
   SNOW CANVAS
   ============================================================ */
#cssky-snow {
  position: fixed; inset:0;
  pointer-events: none;
  z-index: 0;
  transition: opacity .5s;
}

/* ============================================================
   NAVBAR
   ============================================================ */
.cssky-nav {
  position: fixed;
  top:0; left:0; right:0;
  z-index: 200;
  height: 66px;
  display: flex;
  align-items: center;
  padding: 0 2.5rem;
  gap: 0;
  backdrop-filter: blur(24px) saturate(1.5);
  background: var(--bg-nav);
  border-bottom: 1px solid var(--nav-border);
  transition: background .3s, border-color .3s, transform .3s;
}

.cssky-nav.scrolled { box-shadow: 0 2px 20px rgba(0,0,0,.15); }
.cssky-nav.hidden   { transform: translateY(-100%); }

.nav-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-right: 2rem;
  flex-shrink: 0;
  min-width: 0;
  max-width: 260px;
  height: 100%;
  color: var(--text-primary);
  transition: color .3s;
  text-decoration: none;
}

/* Testo logo (nessun logo immagine caricato) */
.nav-logo-text {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px;
  letter-spacing: 4px;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---- LOGO IMMAGINE: adattivo a QUALSIASI dimensione ----
   height impostata inline dal Customizer (cssky_logo_height),
   width auto mantiene le proporzioni, object-fit evita distorsioni.
   max-width impedisce che loghi molto larghi rompano la navbar. */
.nav-logo img,
.nav-logo .custom-logo,
.cssky-logo-img {
  height: 40px;          /* sovrascritta inline dal Customizer */
  width: auto;
  max-width: 100%;
  max-height: 52px;      /* mai più alta della navbar (66px) */
  object-fit: contain;
  object-position: left center;
  display: block;
  flex-shrink: 1;
}

/* Il link non deve avere padding che schiaccia il logo */
.nav-logo.has-img-logo { gap: 0; }

.nav-links {
  display: flex; height: 66px; flex: 1;
}

.nav-links li {
  position: relative;
}

.nav-links li a {
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding: 0 13px;
  height: 66px;
  display: flex; align-items: center; gap: 5px;
  border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s;
  white-space: nowrap;
}

.nav-links li a:hover              { color: var(--text-primary); }
.nav-links li a.current-menu-item,
.nav-links li.current-menu-item > a { color: var(--accent); border-bottom-color: var(--accent); }

/* Freccia per voci con sottomenu */
.nav-links li.menu-item-has-children > a::after {
  content: '▾';
  font-size: 9px;
  opacity: .55;
  transition: transform .2s, opacity .2s;
  line-height: 1;
}
.nav-links li.menu-item-has-children:hover > a::after {
  transform: rotate(180deg);
  opacity: 1;
}

/* ===== DROPDOWN SUBMENU ===== */
.nav-links ul.sub-menu {
  position: absolute;
  top: calc(100% + 0px);
  left: 0;
  min-width: 220px;
  background: var(--bg-nav);
  border: 1px solid var(--border);
  border-top: 2px solid var(--accent);
  border-radius: 0 0 10px 10px;
  backdrop-filter: blur(24px) saturate(1.5);
  box-shadow: 0 12px 32px rgba(0,0,0,.18);
  padding: 6px 0;
  z-index: 300;
  /* Nascosto di default */
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s;
  /* NON display:none → permette la transizione */
  pointer-events: none;
  height: auto;
}

/* Apri al hover del li padre */
.nav-links li.menu-item-has-children:hover > ul.sub-menu,
.nav-links li.menu-item-has-children:focus-within > ul.sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

/* Voci del submenu */
.nav-links ul.sub-menu li {
  position: relative;
}

.nav-links ul.sub-menu li a {
  height: auto;
  padding: 10px 20px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .8px;
  border-bottom: none;
  color: var(--text-secondary);
  display: flex; align-items: center; gap: 8px;
  transition: background .15s, color .15s, padding-left .15s;
}

.nav-links ul.sub-menu li a:hover {
  background: var(--accent-dim);
  color: var(--accent);
  padding-left: 26px;
}

/* Separatore leggero tra voci */
.nav-links ul.sub-menu li + li {
  border-top: 1px solid var(--border);
}

/* Sub-sub menu (3° livello — shift a destra) */
.nav-links ul.sub-menu ul.sub-menu {
  top: -6px;
  left: 100%;
  border-top: 2px solid var(--accent);
  border-radius: 0 10px 10px 10px;
}

.nav-right { display:flex; align-items:center; gap:18px; flex-shrink:0; margin-left:auto; }

/* Theme switch */
.theme-switch {
  display: flex; align-items: center; gap: 7px;
  padding: 4px; border-radius: 8px;
  transition: background .2s;
}
.theme-switch:hover { background: var(--accent-dim); }

.switch-track {
  width: 44px; height: 24px;
  background: var(--switch-bg);
  border-radius: 12px;
  position: relative;
  transition: background .3s;
  border: 1px solid var(--border);
  flex-shrink: 0;
}

.switch-knob {
  position: absolute;
  top: 3px;
  width: 16px; height: 16px;
  background: var(--accent);
  border-radius: 50%;
  transition: left .3s cubic-bezier(.4,0,.2,1), background .3s;
}

[data-theme="dark"]  .switch-knob { left: 3px; }
[data-theme="light"] .switch-knob { left: 23px; }

/* Icone SVG del toggle — l'icona attiva si illumina */
.switch-icon {
  display: flex; align-items: center; justify-content: center;
  line-height: 1;
  color: var(--text-muted);
  opacity: .45;
  transition: color .25s, opacity .25s;
}
[data-theme="dark"]  .switch-icon-moon { color: var(--accent); opacity: 1; }
[data-theme="light"] .switch-icon-sun  { color: var(--accent); opacity: 1; }
.switch-icon svg { display: block; }

/* Nav search button */
.nav-search-btn {
  display: flex; align-items: center; justify-content: center;
  width: 34px; height: 34px;
  border-radius: 8px;
  color: var(--text-muted);
  transition: color .2s, background .2s;
}
.nav-search-btn:hover { color: var(--accent); background: var(--accent-dim); }

/* Forum btn */
.nav-forum-btn {
  background: var(--accent);
  color: var(--tag-text);
  padding: 8px 18px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  transition: opacity .2s;
  flex-shrink: 0;
}
.nav-forum-btn:hover { opacity: .82; }

/* Voci extra menu mobile — nascoste su desktop */
.nav-mobile-extra { display: none; }

/* Hamburger */
.nav-hamburger {
  display: none;
  flex-direction: column; gap: 5px;
  padding: 8px;
  margin-left: auto;
}
.nav-hamburger span {
  display: block; width: 22px; height: 2px;
  background: var(--text-primary);
  border-radius: 2px;
  transition: all .3s;
}
.nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Search overlay */
.cssky-search-overlay {
  position: fixed; inset:0;
  background: rgba(7,13,24,.85);
  backdrop-filter: blur(20px);
  z-index: 500;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding-top: 120px;
}

.search-overlay-inner {
  width: 100%; max-width: 680px;
  padding: 0 1.5rem;
  position: relative;
}

/* Form ricerca globale */
.cssky-search-form {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--bg-card);
  border: 1px solid var(--border-hover);
  border-radius: 12px;
  padding: 6px 6px 6px 18px;
  transition: border-color .2s;
}
.cssky-search-form:focus-within { border-color: var(--accent); }

.search-form-icon { color: var(--text-muted); flex-shrink: 0; }

.cssky-search-form input {
  flex: 1;
  min-width: 0;
  padding: 14px 4px;
  font-size: 17px;
  font-family: 'Barlow', sans-serif;
  border: none;
  background: transparent;
  color: var(--text-primary);
  outline: none;
}
.cssky-search-form input::placeholder { color: var(--text-muted); }

.search-form-submit {
  flex-shrink: 0;
  background: var(--accent);
  color: var(--tag-text);
  border: none;
  border-radius: 8px;
  padding: 12px 24px;
  font-size: 13px; font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase;
  cursor: pointer;
  transition: opacity .2s;
}
.search-form-submit:hover { opacity: .88; }

@media (max-width: 600px) {
  .cssky-search-overlay { padding-top: 90px; }
  .cssky-search-form input { font-size: 15px; }
  .search-form-submit { padding: 12px 16px; font-size: 11px; }
  .cssky-search-form input::placeholder { font-size: 13px; }
}

.search-results-list {
  margin-top: 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  max-height: 400px;
  overflow-y: auto;
}

.search-result-item {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  transition: background .15s;
  cursor: pointer;
}
.search-result-item:last-child { border-bottom: none; }
.search-result-item:hover { background: var(--accent-dim); }

.sri-icon { font-size: 20px; flex-shrink:0; }
.sri-name { font-weight: 700; font-size: 15px; flex: 1; }
.sri-sub  { font-size: 12px; color: var(--text-muted); }
.sri-fav  { color: var(--accent); font-size: 14px; }
.search-no-results { padding: 16px; color: var(--text-muted); font-size: 14px; }

.search-close {
  position: absolute; top: 0; right: calc(1.5rem - 10px);
  width: 40px; height: 40px;
  color: rgba(255,255,255,.6);
  font-size: 20px;
  transform: translateY(50%);
  transition: color .2s;
}
.search-close:hover { color: #fff; }

/* ============================================================
   HERO
   ============================================================ */
.cssky-hero {
  position: relative;
  height: 100vh;
  min-height: 700px;
  overflow: hidden;
  margin-top: 66px;
}

.hero-slides { position: absolute; inset:0; }

.hero-slide {
  position: absolute; inset:0;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.hero-slide.active { opacity: 1; }

.hero-slide img {
  width:100%; height:100%;
  object-fit: cover;
  transform: scale(1.04);
  transition: transform 8s ease;
}
.hero-slide.active img { transform: scale(1); }

.hero-slide-nothumb {
  width:100%; height:100%;
  background: linear-gradient(135deg, var(--bg-surface), var(--bg-base));
}

.hero-overlay   { position:absolute; inset:0; background: var(--hero-overlay); }
.hero-top-fade  { position:absolute; inset:0; background: var(--hero-top); }

.hero-center {
  position: absolute;
  top: 80px;
  bottom: 185px;   /* = altezza news bar (170px) + 15px margine */
  left: 5%;
  right: 10%;
  z-index: 10;
  max-width: 660px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding-bottom: 10px;
}

.hero-live-badge {
  display: inline-flex; align-items:center; gap: 8px;
  background: rgba(0,200,255,0.13);
  border: 1px solid var(--accent-border);
  border-radius: 4px;
  padding: 5px 12px;
  font-size: 10px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 1.1rem;
  transition: color .3s, border-color .3s;
}

.live-dot {
  width:6px; height:6px;
  background: var(--accent);
  border-radius: 50%;
  animation: pulse 2s infinite;
  flex-shrink:0;
}
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.35;transform:scale(.7);} }

.hero-eyebrow {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 600; letter-spacing: 3px; text-transform: uppercase;
  color: var(--accent); margin-bottom: .5rem;
  opacity:0; transform:translateY(10px);
  transition: opacity .6s .2s, transform .6s .2s;
}
.hero-slide.active .hero-eyebrow { opacity:1; transform:translateY(0); }

.hero-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(32px, 4.2vw, 62px);
  letter-spacing: 3px; line-height: 1.02; color: #fff;
  margin-bottom: .7rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex-shrink: 1;   /* può rimpicciolirsi se non c'è spazio */
  opacity:0; transform:translateY(16px);
  transition: opacity .7s .35s, transform .7s .35s;
}
.hero-slide.active .hero-title { opacity:1; transform:translateY(0); }

.hero-excerpt {
  font-size: 13px; font-weight: 300;
  color: rgba(240,246,252,.7); line-height:1.6;
  margin-bottom: 1.2rem; max-width: 420px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex-shrink: 0;
  opacity:0; transform:translateY(10px);
  transition: opacity .6s .5s, transform .6s .5s;
}
.hero-slide.active .hero-excerpt { opacity:1; transform:translateY(0); }

.hero-read-btn {
  display: inline-flex; align-items:center; gap:8px;
  background: var(--accent); color: var(--tag-text);
  padding: 11px 22px; border-radius: 6px;
  font-size: 12px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  opacity:0; transition: opacity .5s .65s, transform .2s;
  flex-shrink: 0;
  width: fit-content;
}
.hero-slide.active .hero-read-btn { opacity:1; }
.hero-read-btn:hover { transform: scale(1.03); }

/* Hero dots */
.hero-dots {
  position: absolute; right: 2.5rem; bottom: 185px; z-index:20;
  display:flex; flex-direction:column; gap:6px;
}
.hero-dot {
  width:3px; height:22px;
  background: rgba(255,255,255,.2);
  border-radius: 2px; cursor:pointer;
  position:relative; overflow:hidden;
  transition: background .3s;
}
.hero-dot.active { background: rgba(255,255,255,.15); }
.hero-dot-fill {
  position:absolute; top:0; left:0; right:0;
  background: var(--accent); border-radius:2px;
  height:0%;
}
.hero-dot.active .hero-dot-fill { animation: dotFill 6s linear forwards; }
@keyframes dotFill { from{height:0%} to{height:100%} }

/* Hero news bar — SEMPRE su una sola riga, flex non grid */
.hero-news-bar {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  z-index: 20;
  display: flex;       /* flex = tutti in riga, mai a capo */
  height: 170px;       /* altezza fissa, corrisponde a bottom su hero-center */
}

.hero-news-thumb {
  flex: 1;             /* larghezza uguale per tutti */
  min-width: 0;        /* si può restringere sotto min-content */
  position: relative;
  overflow: hidden;
  cursor: pointer;
  border-top: 1px solid rgba(255,255,255,.1);
}
.hero-news-thumb:not(:last-child) { border-right: 1px solid rgba(255,255,255,.1); }
.hero-news-thumb.current-slide { border-top-color: var(--accent); }
.hero-news-thumb.current-slide::after {
  content:''; position:absolute; top:0; left:0; right:0;
  height:3px; background: var(--accent);
}

.hero-news-thumb img {
  width:100%; height:100%; object-fit:cover; opacity:.5;
  transition: opacity .3s, transform .4s;
}
.hero-news-thumb:hover img { opacity:.75; transform:scale(1.04); }

.hero-news-overlay {
  position:absolute; inset:0;
  background: linear-gradient(0deg, rgba(7,13,24,.88) 0%, rgba(7,13,24,.3) 100%);
  padding: 10px 14px; display:flex; flex-direction:column; justify-content:flex-end;
}

.hero-news-tag   { font-size:9px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase; color:var(--accent); margin-bottom:3px; }
.hero-news-title { font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:700; line-height:1.2; color:#fff; margin-bottom:3px; }
.hero-news-date  { font-size:10px; color:rgba(255,255,255,.4); }

/* ============================================================
   METEO STRIP
   ============================================================ */
.cssky-meteo-strip {
  position:relative; z-index:50;
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border);
  transition: background .3s, border-color .3s;
}

.meteo-hdr {
  display:flex; align-items:center; justify-content:space-between;
  padding: 9px 2.5rem;
  border-bottom: 1px solid var(--border);
  gap: 16px; flex-wrap:wrap;
}

.meteo-hdr-left  { display:flex; align-items:center; gap:12px; }
.meteo-hdr-right { display:flex; align-items:center; gap:16px; flex:1; justify-content:flex-end; flex-wrap:wrap; }

.meteo-hdr-label {
  display:flex; align-items:center; gap:8px;
  font-size: 10px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--accent); transition: color .3s;
}

.meteo-api-warn { color:var(--red); font-size:9px; }

.meteo-hdr-date { font-size:11px; color:var(--text-muted); white-space:nowrap; transition:color .3s; }

/* Search */
.meteo-search-wrap {
  position:relative; display:flex; align-items:center;
}

.meteo-search-input {
  height: 30px; padding: 0 32px 0 12px;
  font-size: 12px; font-family:'Barlow',sans-serif;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-card);
  color: var(--text-primary);
  outline:none; width:200px;
  transition: border-color .2s, background .3s;
}
.meteo-search-input:focus { border-color: var(--accent); }

.meteo-search-clear {
  position:absolute; right:8px;
  display:flex; align-items:center; justify-content:center;
  color: var(--text-muted); font-size:11px; line-height:1;
  transition:color .2s;
}
.meteo-search-clear:hover { color: var(--text-primary); }

/* Region tabs */
.meteo-tabs {
  display:flex; gap:0;
  border-bottom: 1px solid var(--border);
  overflow-x:auto; padding: 0 2.5rem;
  scrollbar-width:none;
}
.meteo-tabs::-webkit-scrollbar { display:none; }

.meteo-tab {
  padding: 9px 18px;
  font-size: 11px; font-weight:700; letter-spacing:1px; text-transform:uppercase;
  color: var(--text-muted);
  border-bottom: 2px solid transparent;
  white-space:nowrap; flex-shrink:0;
  transition: color .2s, border-color .2s;
}
.meteo-tab:hover  { color: var(--text-primary); }
.meteo-tab.active { color: var(--accent); border-bottom-color: var(--accent); }
.meteo-tab-favorites { color: var(--accent); }

.tab-count {
  display:inline-flex; align-items:center; justify-content:center;
  background: var(--accent-dim);
  color: var(--accent);
  border-radius: 10px;
  font-size: 9px; font-weight: 700;
  padding: 1px 6px; margin-left:4px;
  transition: background .3s;
}

/* Grid */
.meteo-grid.js-meteo-grid {
  display: grid;
  grid-template-columns: repeat(var(--strip-cols, 5), 1fr);
  transition: background .3s;
}

.meteo-card {
  padding: 16px 20px;
  border-right: 1px solid var(--border);
  position: relative; cursor:pointer;
  transition: background .2s;
  background: var(--bg-surface);
  overflow:hidden;
}
.meteo-card:last-child { border-right:none; }
.meteo-card:hover { background: var(--accent-dim); }

.m-snow-badge {
  position:absolute; top:9px; right:10px;
  background: var(--accent-dim);
  border: 1px solid var(--accent-border);
  color: var(--accent);
  font-size: 9px; font-weight:700; padding: 3px 7px; border-radius:3px;
  transition: background .3s, color .3s, border-color .3s;
}

.m-fav-btn {
  position:absolute; top:8px; left:10px;
  font-size: 14px; color: var(--text-muted);
  transition: color .2s, transform .2s;
  line-height:1;
  z-index:2;
}
.m-fav-btn:hover, .m-fav-btn.active { color: var(--accent); transform:scale(1.2); }

.m-resort {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight:700; letter-spacing:.5px; text-transform:uppercase;
  color: var(--text-primary); margin-bottom:2px;
  transition: color .3s; padding-left:20px;
}

.m-sub { font-size:10px; color:var(--text-muted); margin-bottom:10px; transition:color .3s; }

.m-main { display:flex; align-items:center; gap:10px; margin-bottom:7px; }
.m-icon { font-size:28px; line-height:1; }
.m-temp {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 38px; letter-spacing:1px; color:var(--text-primary); line-height:1;
  transition:color .3s;
}
.m-temp .u { font-size:18px; color:var(--text-muted); }

.m-details { display:flex; gap:10px; flex-wrap:wrap; }
.m-d {
  font-size:11px; color:var(--text-muted); display:flex; align-items:center; gap:4px;
  transition:color .3s;
}
.m-d .v  { color:var(--text-primary); font-weight:600; transition:color .3s; }
.m-d-desc { font-style:italic; font-size:10px; }

.m-debug   { font-size:9px; color:var(--text-muted); margin-top:6px; font-family:monospace; }
.m-nodata  { font-size:12px; color:var(--text-muted); margin-top:10px; }

.m-card-link { position:absolute; inset:0; z-index:1; }

.meteo-no-results {
  padding: 20px 2.5rem;
  font-size: 13px; color:var(--text-muted);
}
.meteo-no-results .btn-link {
  color:var(--accent); font-weight:600; text-decoration:underline;
  background:none; border:none; cursor:pointer;
}

/* ============================================================
   SECTIONS — COMMONS
   ============================================================ */
.sf-section { position:relative; z-index:10; transition:background .3s; }

.section-inner {
  max-width: 1400px; margin:0 auto;
  padding: 4.5rem 2.5rem;
}

.section-hdr {
  display:flex; justify-content:space-between; align-items:flex-end;
  margin-bottom: 2.2rem;
}

.section-lbl {
  font-size: 10px; font-weight:700; letter-spacing:3px; text-transform:uppercase;
  color: var(--accent); margin-bottom:5px; transition:color .3s;
}

.section-ttl {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(32px, 3.5vw, 50px);
  letter-spacing:2px; color:var(--text-primary); transition:color .3s;
}

.see-all {
  font-size:12px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase;
  color:var(--accent); display:flex; align-items:center; gap:5px;
  border-bottom: 1px solid transparent;
  transition: border-color .2s, color .3s;
  white-space:nowrap;
}
.see-all:hover { border-bottom-color: var(--accent); }

.snow-bg { background: var(--snow-bg); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }

/* Reveal */
.reveal { opacity:0; transform:translateY(20px); transition: opacity .55s ease, transform .55s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* ============================================================
   NEWS GRID
   ============================================================ */
.news-grid {
  display:grid;
  grid-template-columns: 1.9fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 2px;
  border-radius: 14px; overflow:hidden;
  border: 1px solid var(--border);
  background: var(--border);
  transition: border-color .3s;
}

/* ---- GRIGLIA ARCHIVI: uniforme, non il mosaico della homepage ----
   In homepage la griglia è pensata per 5 card (mosaico con featured
   che occupa 2 righe). Negli archivi ci sono decine di articoli:
   serve una griglia regolare che si estende su tutte le righe. */
.cssky-archive .news-grid {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  grid-template-rows: none;
  gap: 14px;
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: visible;
}
.cssky-archive .nc {
  border-radius: 12px;
  overflow: hidden;
  min-height: 240px;
}
/* Negli archivi il primo articolo non occupa due righe */
.cssky-archive .nc.featured {
  grid-row: auto;
  grid-column: auto;
  min-height: 240px;
}
.cssky-archive .nc.featured .nc-title { font-size: 17px; }

.nc {
  position:relative; overflow:hidden; cursor:pointer;
  background: var(--bg-card); transition: background .3s;
  /* Altezza minima garantita: la card non collassa mai,
     anche senza immagine in evidenza */
  min-height: 210px;
  display: flex;
}
.nc.featured { grid-row: 1 / 3; min-height: 420px; }

.nc img {
  width:100%; height:100%; object-fit:cover;
  transition: transform .5s, opacity .3s;
  position: absolute; inset: 0;
}
.nc.featured img         { opacity:.65; }
.nc:not(.featured) img   { opacity:.65; }
.nc:hover img            { transform:scale(1.04); opacity:.82; }

/* Placeholder quando manca l'immagine in evidenza */
.nc-noimg {
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 30% 20%, rgba(0,200,255,.16), transparent 55%),
    linear-gradient(135deg, #12253f 0%, #0a1526 100%);
}
.nc-noimg::after {
  /* trama diagonale sottile */
  content:'';
  position:absolute; inset:0;
  background-image: repeating-linear-gradient(
    45deg, rgba(255,255,255,.03) 0 2px, transparent 2px 9px);
}

.nc-overlay {
  position:absolute; inset:0; z-index: 1;
  background: linear-gradient(0deg, rgba(7,13,24,.92) 0%, rgba(7,13,24,.22) 55%, transparent 100%);
  display:flex; flex-direction:column; justify-content:flex-end; padding:1.3rem 1.5rem;
}
/* Senza immagine il gradiente deve essere più leggero (lo sfondo è già scuro) */
.nc:has(.nc-noimg) .nc-overlay {
  background: linear-gradient(0deg, rgba(7,13,24,.75) 0%, rgba(7,13,24,.12) 60%, transparent 100%);
}

.nc-tag {
  display:inline-block;
  background: var(--tag-bg); color:var(--tag-text);
  font-size:9px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase;
  padding: 4px 10px; border-radius:3px; margin-bottom:8px; width:fit-content;
  transition: background .3s, color .3s;
}

.nc-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight:700; line-height:1.15; color:#fff; margin-bottom:6px;
}
.nc.featured .nc-title    { font-size:26px; }
.nc:not(.featured) .nc-title { font-size:16px; }

.nc-meta { font-size:11px; color:rgba(255,255,255,.42); display:flex; gap:10px; }

.nc-link-overlay { position:absolute; inset:0; z-index:2; }

/* Badge play sulle copertine estratte da video */
.nc-play {
  position: absolute;
  top: 12px; right: 12px;
  z-index: 3;
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: rgba(7,13,24,.62);
  border: 1px solid rgba(255,255,255,.25);
  color: #fff;
  backdrop-filter: blur(6px);
  padding-left: 2px;
  transition: background .2s, transform .2s, border-color .2s;
  pointer-events: none;
}
.nc:hover .nc-play {
  background: var(--accent);
  border-color: var(--accent);
  transform: scale(1.08);
}
.nc.featured .nc-play { width: 44px; height: 44px; top: 16px; right: 16px; }
.nc.featured .nc-play svg { width: 24px; height: 24px; }

/* ============================================================
   SNOW CONDITIONS
   ============================================================ */
.cond-grid {
  display:grid;
  grid-template-columns: repeat(var(--snow-cols, 6), 1fr);
  gap:12px;
}

.cc {
  background: var(--bg-card);
  border: 1px solid var(--border); border-radius:12px;
  padding: 18px 15px; text-align:center; cursor:pointer;
  position:relative; overflow:hidden;
  transition: border-color .2s, transform .2s, background .3s;
}
.cc:hover { border-color:var(--border-hover); transform:translateY(-3px); }

.cc-resort {
  font-family:'Barlow Condensed',sans-serif;
  font-size:13px; font-weight:700; letter-spacing:.5px; text-transform:uppercase;
  color:var(--text-primary); margin-bottom:10px; transition:color .3s;
}

.cc-depth {
  font-family:'Bebas Neue',sans-serif;
  font-size:42px; letter-spacing:2px; color:var(--accent); line-height:1;
  transition:color .3s;
}

.cc-unit {
  font-size:10px; color:var(--text-muted); letter-spacing:1px;
  text-transform:uppercase; margin-bottom:10px; transition:color .3s;
}

.cc-bar-wrap { height:3px; background:var(--border); border-radius:2px; overflow:hidden; margin-bottom:7px; transition:background .3s; }
.cc-bar-fill { height:100%; background:linear-gradient(90deg, var(--accent), #80e4ff); border-radius:2px; }

.cc-piste {
  font-size:11px; color:var(--text-muted);
  display:flex; justify-content:space-between; transition:color .3s;
}
.open { color:var(--green); font-weight:600; }

.cc-link { position:absolute; inset:0; }

/* ============================================================
   WEBCAM
   ============================================================ */
.wc-tabs {
  display:flex; gap:0; border-bottom:1px solid var(--border);
  margin-bottom:1.8rem; overflow-x:auto; scrollbar-width:none;
}
.wc-tabs::-webkit-scrollbar { display:none; }

.wc-tab {
  padding:10px 20px;
  font-size:11px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase;
  color:var(--text-muted); border-bottom:2px solid transparent;
  white-space:nowrap; flex-shrink:0; transition:all .2s;
}
.wc-tab.active { color:var(--accent); border-bottom-color:var(--accent); }

.wc-grid {
  display:grid;
  grid-template-columns: repeat(var(--wc-cols, 4), 1fr);
  gap:12px;
}

.wc-card {
  background:var(--bg-card);
  border:1px solid var(--border); border-radius:12px; overflow:hidden; cursor:pointer;
  transition: border-color .2s, transform .2s, background .3s;
}
.wc-card:hover { border-color:var(--border-hover); transform:translateY(-3px); }

.wc-preview { height:155px; position:relative; overflow:hidden; }
.wc-preview img { width:100%; height:100%; object-fit:cover; opacity:.85; transition: opacity .3s, transform .4s; }
.wc-card:hover .wc-preview img { opacity:1; transform:scale(1.04); }

.wc-nothumb {
  width:100%; height:100%;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:5px;
  text-align:center; padding:12px;
  color: rgba(255,255,255,.75);
  background:
    radial-gradient(circle at 35% 25%, rgba(0,200,255,.14), transparent 58%),
    linear-gradient(135deg, #12253f 0%, #0a1526 100%);
  position: relative; overflow: hidden;
}
.wc-nothumb::after {
  content:''; position:absolute; inset:0;
  background-image: repeating-linear-gradient(
    45deg, rgba(255,255,255,.03) 0 2px, transparent 2px 9px);
}
.wc-nothumb-txt {
  font-family:'Barlow Condensed',sans-serif;
  font-size:13px; font-weight:700; line-height:1.2;
  color: rgba(255,255,255,.9);
  position: relative; z-index: 1;
}
.wc-nothumb-sub {
  font-size:10px; letter-spacing:.5px;
  color: rgba(255,255,255,.45);
  position: relative; z-index: 1;
}

.wc-live {
  position:absolute; top:9px; right:9px;
  display:flex; align-items:center; gap:5px;
  background:rgba(0,0,0,.65); padding:3px 7px; border-radius:4px;
  font-size:9px; font-weight:700; letter-spacing:1px; color:#ff4040;
  backdrop-filter:blur(4px);
}

.wc-time-stamp {
  position:absolute; bottom:7px; left:8px;
  font-size:10px; font-family:monospace; color:rgba(255,255,255,.72);
  background:rgba(0,0,0,.52); padding:2px 6px; border-radius:3px;
}

.wc-info { padding:11px 13px; }
.wc-name { font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:700; color:var(--text-primary); margin-bottom:2px; transition:color .3s; }
.wc-sub  { font-size:11px; color:var(--text-muted); display:flex; justify-content:space-between; transition:color .3s; }
.wc-alt  { color:var(--accent); font-weight:600; transition:color .3s; }

.wc-no-cams { padding:24px; text-align:center; color:var(--text-muted); font-size:14px; }
.wc-no-cams a { color:var(--accent); text-decoration:underline; }

/* Iframe webcam */
.wc-iframe-wrap { background: #000; }
.wc-iframe {
  width: 100%; height: 100%;
  border: none; display: block;
  pointer-events: none; /* evita scroll accidentale sull'iframe */
}
.wc-iframe-wrap:hover .wc-iframe { pointer-events: auto; }

/* Source badge */
.wc-source {
  font-size: 9px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  color: var(--text-muted); border: 1px solid var(--border);
  padding: 1px 5px; border-radius: 3px;
  transition: color .3s, border-color .3s;
}

/* ============================================================
   WEBCAM PLACEHOLDER — nessuna webcam configurata
   ============================================================ */
.wc-placeholder {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 3rem 2rem;
  text-align: center;
  background: var(--bg-card);
  transition: background .3s, border-color .3s;
}

.wc-placeholder-inner { max-width: 700px; margin: 0 auto; }
.wc-placeholder-icon  { font-size: 48px; margin-bottom: 1rem; opacity: .5; }
.wc-placeholder-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px; font-weight: 700; letter-spacing: 1px;
  color: var(--text-primary); margin-bottom: .5rem;
  transition: color .3s;
}
.wc-placeholder-text {
  font-size: 14px; color: var(--text-muted); line-height: 1.7; margin-bottom: 1.8rem;
  transition: color .3s;
}
.wc-admin-link {
  color: var(--accent); font-weight: 600; text-decoration: underline; font-size: 13px;
}

.wc-placeholder-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.wc-ph-card {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px 12px;
  transition: background .3s, border-color .3s;
}
.wc-ph-icon   { font-size: 22px; margin-bottom: 6px; opacity: .4; }
.wc-ph-name   { font-family: 'Barlow Condensed', sans-serif; font-size: 13px; font-weight: 700; color: var(--text-primary); margin-bottom: 4px; transition: color .3s; }
.wc-ph-coming { font-size: 10px; color: var(--text-muted); font-style: italic; transition: color .3s; }

@media (max-width: 768px) {
  .wc-placeholder-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .wc-placeholder-grid { grid-template-columns: repeat(2, 1fr); }
  .wc-placeholder { padding: 2rem 1rem; }
}

/* ============================================================
   LOCALITÀ — card testuali (no foto)
   ============================================================ */
.region-pills { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:1.8rem; margin-top:1.2rem; }

.rp {
  padding:7px 16px; border:1px solid var(--border); border-radius:100px;
  font-size:11px; font-weight:600; letter-spacing:.5px; color:var(--text-muted);
  transition:all .2s; cursor:pointer;
}
.rp.active, .rp:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-dim); }

.loc-grid {
  display:grid;
  grid-template-columns: repeat(var(--loc-cols, 5), 1fr);
  gap:10px;
}

.loc-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 18px 16px 16px;
  cursor: pointer;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: border-color .2s, transform .2s, background .3s, box-shadow .2s;
  overflow: hidden;
}
.loc-card::before {
  /* Barra accento in alto */
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--accent);
  opacity: 0;
  transition: opacity .2s;
}
.loc-card:hover {
  border-color: var(--border-hover);
  transform: translateY(-3px);
  box-shadow: var(--shadow-card);
}
.loc-card:hover::before { opacity: 1; }

.loc-region-tag {
  font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: var(--accent); margin-bottom: 2px;
  transition: color .3s;
}

.loc-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px; font-weight: 700; line-height: 1.1;
  color: var(--text-primary);
  transition: color .3s;
}

.loc-temp-row {
  display: flex; align-items: center; gap: 8px;
  margin: 4px 0;
}
.loc-temp-big {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 34px; line-height: 1;
  color: var(--accent);
  transition: color .3s;
}
.loc-wmo-icon { font-size: 22px; line-height: 1; }

.loc-divider {
  height: 1px; background: var(--border);
  margin: 4px 0;
  transition: background .3s;
}

.loc-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 10px;
}
.loc-stat {
  font-size: 11px; color: var(--text-muted);
  display: flex; flex-direction: column; gap: 1px;
  transition: color .3s;
}
.loc-stat strong {
  font-size: 13px; font-weight: 700;
  color: var(--text-primary);
  transition: color .3s;
}

.loc-link { position: absolute; inset: 0; z-index: 2; }

/* ============================================================
   STICKY WIDGET
   ============================================================ */
.cssky-sticky-widget {
  position:fixed; bottom:24px; right:24px; z-index:300;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:14px;
  padding: 14px 18px 12px;
  min-width:140px;
  box-shadow: 0 8px 32px rgba(0,0,0,.2);
  transition: background .3s, border-color .3s;
}

.sticky-close {
  position:absolute; top:8px; right:10px;
  font-size:12px; color:var(--text-muted); line-height:1;
  transition:color .2s;
}
.sticky-close:hover { color:var(--text-primary); }

.sticky-header { display:flex; align-items:center; gap:6px; margin-bottom:6px; }
.sticky-label  { font-size:10px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--text-muted); }
.sticky-name   { font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:700; color:var(--text-primary); transition:color .3s; }
.sticky-temp   { font-family:'Bebas Neue',sans-serif; font-size:32px; color:var(--accent); line-height:1; transition:color .3s; }
.sticky-icon-weather { font-size:20px; margin-bottom:6px; }
.sticky-change {
  font-size:10px; font-weight:600; color:var(--accent); letter-spacing:.5px;
  transition:color .2s; display:block;
}


/* ============================================================
   ICONE SVG — allineamento inline
   ============================================================ */
.cssky-ico {
  display: inline-block;
  vertical-align: -0.15em;
  flex-shrink: 0;
}
.section-lbl .cssky-ico { vertical-align: -0.2em; margin-right: 2px; }
.m-icon .cssky-ico,
.wmo-ico { vertical-align: middle; color: var(--accent); }
.m-d .cssky-ico { opacity: .75; }
.m-fav-btn .cssky-ico { vertical-align: middle; }
.m-fav-btn.active .cssky-ico { fill: currentColor; }
.wc-placeholder-icon .cssky-ico { opacity: .4; }
.wc-ph-icon .cssky-ico  { opacity: .45; }
.wc-nothumb .cssky-ico  { opacity: .4; }
.loc-wmo-icon .cssky-ico { color: var(--accent); vertical-align: middle; }
.sri-icon .cssky-ico    { color: var(--accent); }
.sri-fav .cssky-ico     { fill: currentColor; }

/* ============================================================
   BANNER FORUM — card staccata e pulsante
   ============================================================ */
.cssky-forum-banner {
  position: relative;
  z-index: 20;
  background: transparent;
  border: none;
  padding: 2.2rem 2.5rem;
  max-width: 1400px;
  margin: 0 auto;
}

.fb-inner {
  max-width: 100%;
  margin: 0;
  padding: 22px 26px;
  display: flex;
  align-items: center;
  gap: 20px;
  background: var(--bg-card);
  border: 1px solid var(--accent-border);
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
  position: relative;
  overflow: hidden;
  transition: background .3s, border-color .3s, box-shadow .3s, transform .25s;
}
.fb-inner::before {
  /* barra accento laterale */
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--accent);
}
.fb-inner:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(0,0,0,.12);
}

.fb-icon {
  width: 52px; height: 52px;
  flex-shrink: 0;
  border-radius: 14px;
  background: var(--accent-dim);
  border: 1px solid var(--accent-border);
  color: var(--accent);
  display: flex; align-items: center; justify-content: center;
  transition: background .3s, border-color .3s, color .3s;
  position: relative;
}
/* Anello che pulsa attorno all'icona */
.fb-icon::after {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 18px;
  border: 2px solid var(--accent);
  opacity: 0;
  animation: fbPulse 2.6s ease-out infinite;
  pointer-events: none;
}
@keyframes fbPulse {
  0%   { transform: scale(.92); opacity: .55; }
  70%  { transform: scale(1.18); opacity: 0; }
  100% { transform: scale(1.18); opacity: 0; }
}

.fb-text { flex: 1; min-width: 0; }

.fb-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 21px; font-weight: 700; letter-spacing: .3px;
  color: var(--text-primary);
  line-height: 1.15; margin-bottom: 4px;
  transition: color .3s;
}

.fb-desc {
  font-size: 13px; color: var(--text-muted); line-height: 1.5;
  transition: color .3s;
}

.fb-btn {
  flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--accent); color: var(--tag-text);
  padding: 13px 26px; border-radius: 8px;
  font-size: 12px; font-weight: 700;
  letter-spacing: 1.3px; text-transform: uppercase;
  white-space: nowrap;
  position: relative;
  transition: transform .2s, box-shadow .25s;
  animation: fbBtnGlow 2.6s ease-in-out infinite;
}
@keyframes fbBtnGlow {
  0%, 100% { box-shadow: 0 0 0 0 var(--accent-border); }
  50%      { box-shadow: 0 0 0 7px transparent; }
}
.fb-btn:hover {
  transform: translateY(-1px) scale(1.02);
  animation-play-state: paused;
  box-shadow: 0 6px 18px var(--accent-border);
}

/* Rispetta chi preferisce meno animazioni */
@media (prefers-reduced-motion: reduce) {
  .fb-icon::after, .fb-btn { animation: none; }
}

@media (max-width: 768px) {
  .cssky-forum-banner { padding: 1.5rem 1.2rem; }
  .fb-inner  { padding: 18px; flex-wrap: wrap; gap: 14px; border-radius: 14px; }
  .fb-icon   { width: 42px; height: 42px; border-radius: 12px; }
  .fb-title  { font-size: 17px; }
  .fb-desc   { font-size: 12px; }
  .fb-btn    { width: 100%; justify-content: center; }
}

/* ============================================================
   DAL FORUM — sezione homepage
   ============================================================ */
.cssky-forum-section { background: var(--snow-bg); }

.cssky-forum-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.cssky-forum-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 15px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  transition: border-color .2s, transform .2s, background .3s;
  position: relative;
  overflow: hidden;
}
.cssky-forum-card:hover {
  border-color: var(--border-hover);
  transform: translateY(-2px);
}
.cssky-forum-card:hover .cfc-title { color: var(--accent); }
.cssky-forum-card:hover .cfc-arrow { opacity: 1; transform: translateX(0); }

.cfc-avatar {
  width: 40px; height: 40px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 18px; letter-spacing: 0;
  color: #fff;
  flex-shrink: 0;
}

.cfc-body  { flex: 1; min-width: 0; }

.cfc-cat {
  font-size: 9px; font-weight: 700; letter-spacing: 1.8px;
  text-transform: uppercase; color: var(--accent);
  margin-bottom: 3px;
  transition: color .3s;
  /* tronca se troppo lungo */
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.cfc-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 15px; font-weight: 700; line-height: 1.2;
  color: var(--text-primary);
  margin-bottom: 5px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color .25s;
}

.cfc-meta {
  font-size: 11px; color: var(--text-muted);
  display: flex; align-items: center; gap: 3px;
  transition: color .3s;
}
.cfc-author { font-weight: 700; color: var(--accent); transition: color .3s; }

.cfc-arrow {
  color: var(--accent); font-size: 14px; flex-shrink: 0;
  opacity: 0; transform: translateX(-5px);
  transition: opacity .2s, transform .2s;
}

.cssky-forum-cta {
  margin-top: 1.8rem;
  display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap;
}
.cssky-forum-note {
  font-size: 12px; color: var(--text-muted); transition: color .3s;
}

@media (max-width: 768px) {
  .cssky-forum-grid { grid-template-columns: 1fr; }
  .cssky-forum-cta  { flex-direction: column; align-items: flex-start; gap: .75rem; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.cssky-footer {
  background:var(--bg-surface);
  border-top:1px solid var(--border);
  transition:background .3s;
  position:relative; z-index:10;
}

.footer-inner {
  max-width:1400px; margin:0 auto;
  padding: 3.5rem 2.5rem 2rem;
  display:grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap:3rem;
  border-bottom:1px solid var(--border);
  align-items: start;
}

/* Colonna brand — stack verticale pulito */
.footer-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  min-width: 0;
}

/* Reset: .footer-logo eredita .nav-logo che ha height:100% → si allunga
   nella cella del grid e spinge la descrizione fuori. */
.footer-logo {
  height: auto !important;
  max-width: 220px;
  margin-right: 0;
  align-items: flex-start;
  flex-shrink: 0;
}
.footer-logo-text {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 22px; letter-spacing: 3.5px;
  color: var(--text-primary); line-height: 1;
  transition: color .3s;
}
.footer-logo img {
  max-height: 46px;
  max-width: 200px;
  height: auto;
  width: auto;
}

/* Social footer */
.footer-social { display: flex; gap: 8px; margin-top: 1rem; }
.fsoc {
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-muted);
  transition: color .2s, border-color .2s, background .2s;
}
.fsoc:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-dim);
}

.footer-desc {
  font-size:13px; color:var(--text-muted); line-height:1.7;
  max-width:280px; margin-top:1rem; transition:color .3s;
}

.footer-debug { font-size:11px; color:var(--text-muted); margin-top:.5rem; font-family:monospace; }

.footer-col h4 {
  font-family:'Barlow Condensed',sans-serif;
  font-size:11px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase;
  color:var(--accent); margin-bottom:.9rem; transition:color .3s;
}
.footer-col ul  { display:flex; flex-direction:column; gap:8px; }
.footer-col a   { color:var(--text-muted); font-size:13px; transition:color .2s; }
.footer-col a:hover { color:var(--text-primary); }

.footer-btm {
  max-width:1400px; margin:0 auto;
  padding:1.5rem 2.5rem;
  display:flex; justify-content:space-between; align-items:center;
  font-size:12px; color:var(--text-muted); flex-wrap:wrap; gap:10px;
  transition:color .3s;
}

.footer-api-badges { display:flex; gap:10px; flex-wrap:wrap; }

.api-badge {
  font-size:10px; font-weight:700; letter-spacing:1px; text-transform:uppercase;
  color:var(--accent); border:1px solid var(--accent-border);
  padding:3px 8px; border-radius:3px;
  transition:color .3s, border-color .3s;
}

/* ============================================================
   BREADCRUMBS
   ============================================================ */
.cssky-breadcrumbs {
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border);
  transition: background .3s, border-color .3s;
}
/* Se il breadcrumb è il primo elemento dopo la navbar fissa,
   serve lo spazio per non finirci sotto */
.site-main > .cssky-breadcrumbs:first-child { margin-top: 66px; }
/* Dentro .cssky-archive il margine è già sul contenitore */
.cssky-archive > .cssky-breadcrumbs:first-child { margin-top: 0; }
/* Nel single, il breadcrumb viene dopo la hero: nessun margine extra */
.single-hero + .cssky-breadcrumbs { margin-top: 0; }

.cssky-breadcrumbs .section-inner {
  padding-top: .85rem;
  padding-bottom: .85rem;
}

.cssky-breadcrumbs .bc-list {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  list-style: none;
  margin: 0; padding: 0;
  font-size: 12.5px;
  overflow: hidden;            /* la parte finale troppo lunga viene troncata */
  min-width: 0;
}

.cssky-breadcrumbs .bc-list > li {
  display: inline-flex !important;
  align-items: center;
  margin: 0; padding: 0;
  list-style: none;
  float: none;
}
.cssky-breadcrumbs .bc-list > li::before,
.cssky-breadcrumbs .bc-list > li::marker { content: none !important; }

/* Le voci intermedie non si restringono, l'ultima sì (viene troncata) */
.cssky-breadcrumbs .bc-item { flex-shrink: 0; }
.cssky-breadcrumbs .bc-item.bc-current { flex-shrink: 1; min-width: 0; }

.bc-item a {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--text-muted);
  text-decoration: none;
  padding: 3px 2px;
  transition: color .2s;
  white-space: nowrap;
}
.bc-item a:hover { color: var(--accent); }
/* spazio tra icona casetta e testo, e allineamento icona */
.bc-item:first-child a svg,
.bc-item:first-child span svg { margin-right: 4px; vertical-align: -1px; }

.bc-item.bc-current span {
  display: block;
  color: var(--text-primary);
  font-weight: 600;
  /* Occupa lo spazio rimasto e tronca con i puntini se troppo lungo */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.bc-item:first-child svg { flex-shrink: 0; }

.bc-sep-li {
  display: inline-flex; align-items: center;
  color: var(--text-muted); opacity: .5;
  flex-shrink: 0;
}
.bc-sep { display: block; }

@media (max-width: 600px) {
  .cssky-breadcrumbs .bc-list { font-size: 11.5px; }
  /* Su mobile nascondi la label "Home", lascia solo l'icona */
  .bc-home-txt { display: none; }
}

/* ============================================================
   ARCHIVIO — categoria, tag, autore, data
   ============================================================ */
.cssky-archive { margin-top: 66px; }
.cssky-archive .section-inner { padding-top: 3rem; }

.archive-hdr { align-items: flex-start; margin-bottom: 1.5rem; }

.archive-count {
  font-size: 12px; color: var(--text-muted);
  margin-top: .4rem; letter-spacing: .3px;
  transition: color .3s;
}

.archive-desc {
  font-size: 14px; color: var(--text-secondary);
  line-height: 1.7; max-width: 760px;
  margin-bottom: 2rem;
  padding-left: 14px;
  border-left: 3px solid var(--accent);
  transition: color .3s, border-color .3s;
}

.archive-empty {
  padding: 4rem 0; text-align: center;
}
.archive-empty p {
  font-size: 15px; color: var(--text-muted); margin-bottom: 1.5rem;
  transition: color .3s;
}

/* ---- PAGINAZIONE ---- */
.cssky-pagination {
  display: flex; justify-content: center; align-items: center;
  gap: 6px; flex-wrap: wrap;
  margin-top: 2.5rem;
}
.cssky-pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 38px; height: 38px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 13px; font-weight: 600;
  color: var(--text-secondary);
  background: var(--bg-card);
  transition: color .2s, border-color .2s, background .2s, transform .15s;
  text-decoration: none;
}
.cssky-pagination .page-numbers:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-dim);
  transform: translateY(-1px);
}
.cssky-pagination .page-numbers.current {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--tag-text);
}
.cssky-pagination .page-numbers.dots {
  border-color: transparent;
  background: transparent;
  min-width: 24px; padding: 0 4px;
  color: var(--text-muted);
}
.cssky-pagination .page-numbers.dots:hover {
  transform: none; background: transparent; color: var(--text-muted);
}
.cssky-pagination .prev,
.cssky-pagination .next {
  font-weight: 700; letter-spacing: .5px;
  padding: 0 16px;
}

@media (max-width: 768px) {
  .cssky-pagination .page-numbers { min-width: 34px; height: 34px; font-size: 12px; padding: 0 9px; }
  .cssky-pagination .prev, .cssky-pagination .next { padding: 0 12px; font-size: 11px; }
  .archive-desc { font-size: 13px; }
}

/* Form ricerca nella pagina risultati */
.search-again { margin-bottom: 2rem; }
.search-again form { display: flex; gap: 8px; max-width: 520px; }
.search-again input {
  flex: 1;
  height: 42px; padding: 0 14px;
  font-family: 'Barlow', sans-serif; font-size: 14px;
  border: 1px solid var(--border); border-radius: 8px;
  background: var(--bg-card); color: var(--text-primary);
  outline: none; transition: border-color .2s;
}
.search-again input:focus { border-color: var(--accent); }
.search-again button {
  height: 42px; padding: 0 22px;
  background: var(--accent); color: var(--tag-text);
  border-radius: 8px;
  font-size: 12px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;
  transition: opacity .2s;
}
.search-again button:hover { opacity: .85; }

/* ============================================================
   SINGLE POST / ARCHIVE
   ============================================================ */
.site-main { margin-top:66px; min-height:60vh; }

.entry-header {
  padding: 3rem 2.5rem 1.5rem;
  max-width: 900px;
  margin: 0 auto;
  box-sizing: border-box;
  width: 100%;
}
.entry-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(32px, 4vw, 52px);
  letter-spacing: 2px;
  color: var(--text-primary);
  /* Evita che parole lunghe escano dal contenitore */
  overflow-wrap: break-word;
  word-wrap: break-word;
  hyphens: auto;
  max-width: 100%;
  line-height: 1.05;
}
.entry-meta {
  font-size: 13px;
  color: var(--text-muted);
  margin-top: .75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding-bottom: .9rem;
  border-bottom: 1px solid var(--border);
  transition: color .3s, border-color .3s;
}
.em-left {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}
.em-sep { opacity: .45; }

/* Badge visualizzazioni allineato a destra */
.em-views {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-left: auto;
  padding: 6px 15px;
  background: var(--accent);
  border: none;
  border-radius: 999px;
  color: var(--tag-text);
  font-size: 12px;
  white-space: nowrap;
  box-shadow: 0 2px 8px var(--accent-border);
  transition: background .3s, transform .2s;
}
.em-views:hover { transform: translateY(-1px); }
.em-views svg { flex-shrink: 0; opacity: .9; }
.em-views strong {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 17px;
  letter-spacing: .5px;
  line-height: 1;
}
.em-views-label {
  font-size: 10px;
  letter-spacing: .8px;
  text-transform: uppercase;
  opacity: .85;
  font-weight: 600;
}

@media (max-width: 600px) {
  .entry-meta { font-size: 12px; gap: .6rem; }
  .em-views { padding: 4px 10px; }
  .em-views-label { display: none; }
}

.entry-content {
  max-width:900px; margin:0 auto; padding:0 2.5rem 4rem;
  font-size:16px; line-height:1.75; color:var(--text-secondary);
}
.entry-content p   { margin-bottom:1.2rem; }
.entry-content h2,
.entry-content h3  {
  font-family:'Bebas Neue',sans-serif;
  letter-spacing:2px;
  color:var(--text-primary);
  margin: 2rem 0 .75rem;
  /* Evita che il titolo finisca sotto la navbar fissa quando
     si arriva da un'ancora o si ripristina lo scroll */
  scroll-margin-top: 86px;
}
body.admin-bar .entry-content h2,
body.admin-bar .entry-content h3 { scroll-margin-top: 118px; }

/* Stesso accorgimento per tutti gli elementi con id (ancore) */
.entry-content [id] { scroll-margin-top: 86px; }
/* Immagini nel contenuto: larghezza piena ma proporzioni intatte.
   Senza height:auto l'attributo height dell'HTML resta fisso mentre
   la larghezza cambia → immagine schiacciata/tagliata. */
.entry-content img {
  border-radius: 8px;
  margin: 1.5rem 0;
  max-width: 100%;
  width: auto;
  height: auto;
  display: block;
}
/* Le immagini a piena larghezza (blocchi WP, allineamenti) */
.entry-content figure { margin: 1.5rem 0; max-width: 100%; }
.entry-content figure img { width: 100%; height: auto; }
.entry-content .wp-block-image img { width: 100%; height: auto; }
.entry-content .alignwide img,
.entry-content .alignfull img { width: 100%; height: auto; }

/* Didascalie */
.entry-content figcaption {
  font-size: 13px;
  color: var(--text-muted);
  text-align: center;
  margin-top: .6rem;
  line-height: 1.5;
}

/* Immagini allineate a lato: non forzarle a tutta larghezza */
.entry-content .alignleft  { float: left;  margin: .5rem 1.5rem 1rem 0; max-width: 50%; }
.entry-content .alignright { float: right; margin: .5rem 0 1rem 1.5rem; max-width: 50%; }
.entry-content .aligncenter { margin-left: auto; margin-right: auto; }
.entry-content .alignleft img,
.entry-content .alignright img { width: 100%; height: auto; }
.entry-content a   { color:var(--accent); text-decoration:underline; }

/* ============================================================
   CPT IMPORTATI — Dati tecnici, Voto, Posizione
   ============================================================ */
.sf-datatable-wrap { margin: 2.5rem 0 1.5rem; }

.sf-datatable-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 24px; letter-spacing: 2px;
  color: var(--text-primary);
  margin-bottom: 1rem;
  transition: color .3s;
}

.sf-datatable {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: border-color .3s;
}
.sf-datatable tr { border-bottom: 1px solid var(--border); transition: border-color .3s; }
.sf-datatable tr:last-child { border-bottom: none; }
.sf-datatable tr:nth-child(even) { background: var(--bg-card); transition: background .3s; }

.sf-datatable th,
.sf-datatable td {
  padding: 13px 18px;
  text-align: left;
  font-size: 14px;
  vertical-align: middle;
}
.sf-datatable th {
  width: 45%;
  font-weight: 600;
  color: var(--text-muted);
  font-size: 12px; letter-spacing: .6px; text-transform: uppercase;
  transition: color .3s;
}
.sf-datatable td {
  color: var(--text-primary);
  font-weight: 600;
  transition: color .3s;
}

/* ---- BOX VOTO ---- */
.sf-rating {
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  margin: 1.5rem 0;
  padding: 1.3rem 1.5rem;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  transition: background .3s, border-color .3s;
}

.sf-rating-score { flex: 1; min-width: 200px; }

.sf-rating-num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 40px; line-height: 1;
  color: var(--accent);
  margin-bottom: 8px;
}
.sf-rating-max { font-size: 20px; color: var(--text-muted); }

.sf-rating-bar {
  height: 8px;
  background: var(--bg-surface);
  border-radius: 99px;
  overflow: hidden;
  margin-bottom: 6px;
}
.sf-rating-bar span {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--accent), #4dd4ff);
  border-radius: 99px;
}
.sf-rating-count { font-size: 12px; color: var(--text-muted); }

.sf-views {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 13px; color: var(--text-muted);
  white-space: nowrap;
}

/* ---- POSIZIONE ---- */
.sf-position {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 1rem 0;
  padding: 10px 18px;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-secondary);
  font-size: 13px; font-weight: 600;
  text-decoration: none !important;
  transition: color .2s, border-color .2s, background .2s;
}
.sf-position:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-dim);
}
.sf-position svg { flex-shrink: 0; }

/* ---- TAG HEADER (badge multipli in cima all'articolo) ---- */
.sf-header-tags {
  display: flex; align-items: center; gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

/* ---- BADGE DIFFICOLTÀ PISTA ---- */
.sf-slope-badge {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 4px 12px;
  border-radius: 3px;
  font-size: 9px; font-weight: 700;
  letter-spacing: 1.8px; text-transform: uppercase;
  background: var(--bg-card);
  border: 1px solid var(--border);
  color: var(--text-primary);
  transition: background .3s, border-color .3s, color .3s;
}
.sf-slope-dot {
  width: 10px; height: 10px; border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 0 0 2px var(--bg-base);
}
/* La pista nera in dark mode ha bisogno di un contorno per essere visibile */
[data-theme="dark"] .sf-slope-nera .sf-slope-dot {
  box-shadow: 0 0 0 1px rgba(255,255,255,.5);
}

/* ---- CONTATTI (negozio, noleggio) ---- */
.sf-contatti { margin: 2.5rem 0 1.5rem; }
.sf-contatti-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column;
  border: 1px solid var(--border); border-radius: 12px; overflow: hidden;
  transition: border-color .3s;
}
.sf-contatti-list li {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 18px;
  border-bottom: 1px solid var(--border);
  font-size: 14px; color: var(--text-primary);
  transition: border-color .3s, background .3s;
}
.sf-contatti-list li:last-child { border-bottom: none; }
.sf-contatti-list li:nth-child(even) { background: var(--bg-card); }
.sf-contatti-list li svg { color: var(--accent); flex-shrink: 0; }
.sf-contatti-list a { color: var(--text-primary); text-decoration: none; transition: color .2s; }
.sf-contatti-list a:hover { color: var(--accent); }

/* ---- CTA BUTTON (Amazon, offerte) ---- */
.sf-cta-btn {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 1.5rem 0;
  padding: 13px 26px;
  background: var(--accent); color: var(--tag-text);
  border-radius: 8px;
  font-size: 13px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  text-decoration: none !important;
  transition: transform .2s, opacity .2s;
}
.sf-cta-btn:hover { transform: translateY(-1px); opacity: .9; }

/* ---- WEBCAM FRAME (archivio storico) ---- */
.sf-webcam-frame {
  position: relative; width: 100%;
  border-radius: 12px; overflow: hidden;
  margin: 0 0 1.5rem; background: #0a1526;
  aspect-ratio: 16 / 9;
}
.sf-webcam-frame img,
.sf-webcam-frame iframe {
  width: 100%; height: 100%;
  object-fit: cover; display: block; border: none;
}
.sf-webcam-live {
  position: absolute; top: 12px; left: 12px;
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(7,13,24,.72); color: #fff;
  padding: 4px 10px; border-radius: 5px;
  font-size: 10px; font-weight: 700; letter-spacing: 1px;
  backdrop-filter: blur(6px);
}
.sf-webcam-off {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; color: rgba(255,255,255,.6); font-size: 13px;
}

/* ============================================================
   INDICE REGIONI (archivio CPT geo)
   ============================================================ */
.sf-geo-group { margin-bottom: 2.5rem; }

.sf-geo-state {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 20px; letter-spacing: 2px;
  color: var(--accent);
  margin-bottom: 1rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--border);
  transition: color .3s, border-color .3s;
}

.cssky-archive .sf-geo-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}

.cssky-archive .sf-geo-card {
  display: flex !important;
  align-items: center;
  gap: 12px;
  padding: 18px 20px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  text-decoration: none !important;
  transition: border-color .2s, transform .2s, background .3s;
  position: relative;
  width: auto;
}
.cssky-archive .sf-geo-card:hover {
  border-color: var(--accent);
  transform: translateY(-2px);
}

.sf-geo-name {
  flex: 1;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 17px; font-weight: 700;
  color: var(--text-primary);
  line-height: 1.2;
  transition: color .3s;
}
.sf-geo-card:hover .sf-geo-name { color: var(--accent); }

.sf-geo-count {
  display: flex; flex-direction: column; align-items: flex-end;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px; line-height: 1;
  color: var(--accent);
  flex-shrink: 0;
}
.sf-geo-unit {
  font-family: 'Barlow', sans-serif;
  font-size: 10px; font-weight: 600;
  letter-spacing: .5px; text-transform: uppercase;
  color: var(--text-muted);
  margin-top: 2px;
}

.sf-geo-arrow {
  color: var(--text-muted);
  font-size: 16px;
  flex-shrink: 0;
  opacity: 0; transform: translateX(-4px);
  transition: opacity .2s, transform .2s, color .2s;
}
.sf-geo-card:hover .sf-geo-arrow { opacity: 1; transform: translateX(0); color: var(--accent); }

@media (max-width: 600px) {
  .cssky-archive .sf-geo-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .sf-datatable th, .sf-datatable td { padding: 11px 14px; font-size: 13px; }
  .sf-rating { gap: 1.2rem; padding: 1.1rem 1.2rem; }
  .sf-rating-num { font-size: 34px; }
}


/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1300px) {
  .cond-grid { --snow-cols: 3 !important; }
  .loc-grid  { --loc-cols:  3 !important; }
  .wc-grid   { --wc-cols:   2 !important; }
  .footer-inner { grid-template-columns: 1fr 1fr; }
}

@media (max-width:1024px) {
  .meteo-grid.js-meteo-grid { --strip-cols: 3 !important; }
  .news-grid { grid-template-columns: 1fr; }
  .nc.featured { grid-row:auto; min-height: 240px; }
  .nc { min-height: 240px; }
  .hero-news-bar { display:none; }
  .hero-center   { bottom:100px; }
  .hero-dots     { right:1.5rem; }
}

@media (max-width:768px) {
  .cssky-nav { padding:0 1.2rem; }
  .nav-links { display:none; }
  .nav-links.mobile-open {
    display:flex; flex-direction:column;
    height: auto !important;        /* CRITICO: resetta height:66px del desktop */
    position:absolute; top:66px; left:0; right:0;
    background:var(--bg-nav); border-bottom:1px solid var(--border);
    padding:.5rem 0; z-index:200;
    backdrop-filter:blur(24px);
    max-height: calc(100vh - 66px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* CRITICO: senza flex-shrink:0 le voci vengono compresse
     dal flex column per rientrare nel max-height → si vedeva
     solo la prima voce, le altre schiacciate a filo */
  .nav-links.mobile-open > li,
  .nav-links.mobile-open .nav-mobile-extra {
    flex-shrink: 0;
    flex-grow: 0;
    width: 100%;
  }
  .nav-links.mobile-open li { position: relative; }
  .nav-links.mobile-open li a {
    height:44px; min-height:44px; padding: 0 1.5rem;
    display: flex; align-items: center;
    border-bottom: 1px solid var(--border);
  }
  /* Freccia mobile — togglable via JS */
  .nav-links.mobile-open li.menu-item-has-children > a::after {
    margin-left: auto;
    transform: none;
  }
  .nav-links.mobile-open li.menu-item-has-children.open > a::after {
    transform: rotate(180deg);
  }
  /* Submenu mobile — accordion */
  .nav-links.mobile-open ul.sub-menu {
    position: static;
    opacity: 1; visibility: visible; transform: none;
    pointer-events: auto;
    box-shadow: none;
    border: none; border-top: none;
    border-radius: 0;
    display: none;
    padding: 0;
    background: var(--bg-surface);
  }
  .nav-links.mobile-open li.menu-item-has-children.open > ul.sub-menu {
    display: block;
  }
  .nav-links.mobile-open ul.sub-menu li a {
    padding-left: 2.5rem;
    font-size: 11px;
    background: var(--bg-surface);
  }
  .nav-hamburger { display:flex; }
  .nav-search-btn { display:none; }
  /* forum btn: ora visibile su mobile — regola sotto nel breakpoint 768px */
  .section-inner  { padding:3rem 1.2rem; }
  .meteo-hdr      { padding:8px 1.2rem; }
  .meteo-tabs     { padding:0 1.2rem; }
  .cond-grid { --snow-cols: 2 !important; }
  .loc-grid  { --loc-cols:  2 !important; }
  .wc-grid   { --wc-cols:   1 !important; }
  .footer-inner   { grid-template-columns: 1fr; padding:2rem 1.2rem; }
  .footer-btm     { flex-direction:column; align-items:flex-start; padding:1.2rem; }
  .cssky-sticky-widget { bottom:12px; right:12px; }
  .hero-center    { left:1.2rem; right:1.2rem; bottom:130px; }
  .hero-dots      { display:none; }
  .hero-news-bar  { height:120px; }
  .hero-news-title { font-size:11px; }
  .hero-news-tag  { display:none; }
  .hero-news-date { display:none; }
  /* Forum button — resta visibile nell'header su mobile, compatto */
  .nav-right .nav-forum-btn {
    display: flex;
    padding: 7px 12px;
    font-size: 10px;
    letter-spacing: .8px;
    border-radius: 6px;
  }

  /* La ricerca viene spostata dentro .nav-links via JS come riga del menu */
  .nav-links.mobile-open .nav-mobile-extra {
    display: flex;
    flex-direction: column;
    border-top: 2px solid var(--accent-border);
    margin-top: .3rem;
  }
  .nav-links.mobile-open .nav-mobile-search {
    display: flex; align-items: center; gap: 10px;
    height: 46px; min-height: 46px; padding: 0 1.5rem;
    font-size: 13px; font-weight: 600;
    letter-spacing: .5px;
    color: var(--text-secondary);
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--border);
    width: 100%;
    text-align: left;
    cursor: pointer;
    transition: color .2s, background .2s;
  }
  .nav-links.mobile-open .nav-mobile-search:hover { background: var(--accent-dim); }
  .nav-links.mobile-open .nav-mobile-search svg { flex-shrink: 0; }
}

@media (max-width:480px) {
  .meteo-grid.js-meteo-grid { --strip-cols: 2 !important; }
  .cond-grid  { --snow-cols: 2 !important; }
  .loc-grid   { --loc-cols:  2 !important; }
  .section-hdr { flex-direction:column; align-items:flex-start; gap:.5rem; }
  .meteo-search-input { width:140px; }
}

/* ============================================================
   PUBBLICITÀ
   ============================================================ */
.cssky-ad {
  position: relative;
  margin: 2rem auto;
  text-align: center;
  max-width: 100%;
}
.cssky-ad img { max-width: 100%; height: auto; display: block; margin: 0 auto; border-radius: 6px; }

/* Etichetta "Pubblicità" (trasparenza verso l'utente, buona norma) */
.cssky-ad-label {
  display: block;
  font-size: 9px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--text-muted);
  opacity: .6;
  margin-bottom: 6px;
}

/* Leaderboard sotto l'header: sfondo tenue, centrata */
.cssky-ad-leaderboard {
  margin: 0 auto;
  padding: 14px 1rem;
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border);
}

/* In-article: staccata dal testo */
.cssky-ad-in_article { margin: 2.5rem auto; }

/* Sotto la hero: centrata con padding */
.cssky-ad-after_hero {
  max-width: 1400px;
  margin: 0 auto;
  padding: 1.5rem 2.5rem 0;
}

/* Prima/dopo contenuto */
.cssky-ad-before_content { margin: 0 auto 2rem; }
.cssky-ad-after_content  { margin: 2.5rem auto 0; }

/* Footer ad */
.cssky-ad-footer {
  padding: 1.5rem 1rem;
  background: var(--bg-surface);
  border-top: 1px solid var(--border);
}

/* ---- BACKGROUND TAKEOVER ---- */
/* Il contenuto del sito sta sopra lo sfondo pubblicitario */
body.cssky-has-takeover .cssky-nav,
body.cssky-has-takeover main,
body.cssky-has-takeover .cssky-footer,
body.cssky-has-takeover .cssky-breadcrumbs {
  position: relative;
  z-index: 2;
}
/* Due fasce laterali cliccabili; il centro (dove sta il sito) resta libero */
.cssky-takeover-link {
  display: none;
}
@media (min-width: 1340px) {
  .cssky-takeover-link {
    display: block;
    position: fixed;
    top: 0; bottom: 0;
    width: calc((100vw - 1300px) / 2);
    z-index: 1;
    cursor: pointer;
  }
  .cssky-takeover-link.tk-left  { left: 0; }
  .cssky-takeover-link.tk-right { right: 0; }
}

/* ============================================================
   INDICE SOTTOCATEGORIE (archivio categoria)
   ============================================================ */
.cssky-subcats {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 0 0 2rem;
}
.subcat-chip {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 999px;
  text-decoration: none;
  transition: border-color .2s, background .2s, transform .15s;
}
.subcat-chip:hover { border-color: var(--accent); transform: translateY(-1px); }
.subcat-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: .3px;
  color: var(--text-primary);
  transition: color .3s;
}
.subcat-chip:hover .subcat-name { color: var(--accent); }
.subcat-count {
  font-size: 11px; font-weight: 700;
  color: var(--tag-text);
  background: var(--accent);
  padding: 1px 8px; border-radius: 999px;
  min-width: 20px; text-align: center;
}

/* ============================================================
   SINGLE — layout a due colonne con sidebar
   ============================================================ */
.single-wrap {
  max-width: 900px;
  margin: 0 auto;
}
.single-wrap.has-sidebar {
  max-width: 1240px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 3rem;
  padding: 2rem 2.5rem 0;
  align-items: start;
}
.single-wrap.has-sidebar .entry-header,
.single-wrap.has-sidebar .entry-content {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
.single-comments { padding: 2rem 0 4rem; }
.single-wrap:not(.has-sidebar) .single-comments { max-width: 900px; margin: 0 auto; padding: 0 2.5rem 4rem; }

/* Sidebar sticky su desktop */
.cssky-sidebar {
  position: sticky;
  top: 100px;
  display: flex; flex-direction: column; gap: 2rem;
}
.sidebar-block {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.3rem;
  transition: background .3s, border-color .3s;
}
.sidebar-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 19px; letter-spacing: 1.5px;
  color: var(--text-primary);
  margin-bottom: 1rem;
  padding-bottom: .6rem;
  border-bottom: 2px solid var(--accent);
  transition: color .3s;
}

/* Più letti */
.sidebar-popular { list-style: none; margin: 0; padding: 0; counter-reset: pop; }
.sidebar-popular li { margin-bottom: 12px; }
.sidebar-popular li:last-child { margin-bottom: 0; }
.sidebar-popular a { display: flex; align-items: flex-start; gap: 12px; text-decoration: none; }
.sp-rank {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 24px; line-height: 1;
  color: var(--accent);
  flex-shrink: 0; min-width: 24px;
}
.sp-title {
  font-size: 13px; line-height: 1.4; font-weight: 600;
  color: var(--text-secondary);
  transition: color .2s;
}
.sidebar-popular a:hover .sp-title { color: var(--accent); }

/* Altri della categoria */
.sidebar-related { list-style: none; margin: 0; padding: 0; }
.sidebar-related li { margin-bottom: 14px; }
.sidebar-related li:last-child { margin-bottom: 0; }
.sidebar-related a { display: flex; gap: 12px; text-decoration: none; align-items: center; }
.sr-thumb {
  width: 64px; height: 48px; flex-shrink: 0;
  border-radius: 6px;
  background-size: cover; background-position: center;
  background-color: var(--bg-surface);
}
.sr-noimg {
  background-image:
    radial-gradient(circle at 40% 30%, rgba(0,200,255,.18), transparent 60%),
    linear-gradient(135deg, #12253f, #0a1526);
}
.sr-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sr-title {
  font-size: 13px; line-height: 1.35; font-weight: 600;
  color: var(--text-secondary);
  transition: color .2s;
}
.sidebar-related a:hover .sr-title { color: var(--accent); }
.sr-date { font-size: 11px; color: var(--text-muted); }

.sidebar-ad-block { padding: 0; background: transparent; border: none; }

@media (max-width: 1024px) {
  .single-wrap.has-sidebar {
    grid-template-columns: 1fr;
    max-width: 900px;
    gap: 2rem;
  }
  .cssky-sidebar { position: static; }
}

/* ============================================================
   COMPATIBILITÀ ADMIN BAR WORDPRESS
   Quando l'utente è loggato, WP aggiunge .admin-bar al body e
   una barra fissa in alto (32px desktop, 46px mobile). La navbar
   fixed del tema va spostata sotto per non finirci sotto.
   ============================================================ */
body.admin-bar .cssky-nav { top: 32px; }

/* Gli elementi che partono da top:66px devono scalare di +32px */
body.admin-bar .single-hero { margin-top: 98px !important; }
body.admin-bar .bc-nav-spacer { height: 98px !important; }
body.admin-bar .cssky-archive { margin-top: 98px; }
body.admin-bar .site-main > .cssky-breadcrumbs:first-child { margin-top: 98px; }

/* Menu mobile aperto: parte sotto navbar + admin bar */
body.admin-bar .nav-links.mobile-open { top: 98px; }

/* Sidebar sticky: offset aumentato */
body.admin-bar .cssky-sidebar { top: 132px; }

/* Search overlay: non coprire la admin bar */
body.admin-bar .cssky-search-overlay { padding-top: 32px; }

@media screen and (max-width: 782px) {
  /* Su mobile la admin bar WP è alta 46px */
  body.admin-bar .cssky-nav { top: 46px; }
  body.admin-bar .single-hero { margin-top: 112px !important; }
  body.admin-bar .bc-nav-spacer { height: 112px !important; }
  body.admin-bar .cssky-archive { margin-top: 112px; }
  body.admin-bar .site-main > .cssky-breadcrumbs:first-child { margin-top: 112px; }
  body.admin-bar .nav-links.mobile-open { top: 112px; }
}

/* La admin bar WP su mobile diventa fixed solo quando scrolli;
   sopra i 600px del tema teniamo conto dell'altezza piena */
@media screen and (max-width: 600px) {
  body.admin-bar .cssky-search-overlay { padding-top: 46px; }
}

/* ============================================================
   HERO VIDEO (homepage)
   ============================================================ */
.cssky-hero-video {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: var(--hv-height, 70vh);
  min-height: 380px;
  margin-top: 66px;
  overflow: hidden;
  background: #0a1526;
}
body.admin-bar .cssky-hero-video { margin-top: 98px; }

.hv-media {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.hv-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(0deg, var(--bg-base) 0%, rgba(7,13,24,.35) 45%, rgba(7,13,24,.15) 100%);
}

/* Il contenuto è un box interno centrato: niente left/right:0 + max-width
   insieme (combinazione che su schermi stretti spinge fuori il testo). */
.hv-content {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 100%;
  max-width: 1400px;
  padding: 0 2.5rem 4rem;
  z-index: 2;
  box-sizing: border-box;
}
.hv-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(38px, 6vw, 82px);
  line-height: .95;
  letter-spacing: 2px;
  color: #fff;
  margin: 0 0 1rem;
  text-shadow: 0 2px 24px rgba(0,0,0,.4);
  max-width: 900px;
  overflow-wrap: break-word;
  hyphens: auto;
}
.hv-sub {
  font-size: clamp(15px, 1.6vw, 19px);
  color: rgba(255,255,255,.9);
  max-width: 620px;
  line-height: 1.6;
  margin: 0 0 1.6rem;
  text-shadow: 0 1px 12px rgba(0,0,0,.5);
  overflow-wrap: break-word;
}
.hv-btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--accent); color: var(--tag-text);
  padding: 14px 32px; border-radius: 8px;
  font-size: 13px; font-weight: 700;
  letter-spacing: 1.2px; text-transform: uppercase;
  text-decoration: none;
  transition: transform .2s, opacity .2s;
}
.hv-btn:hover { transform: translateY(-2px); opacity: .92; }

@media (max-width: 768px) {
  .cssky-hero-video {
    height: 55vh;
    min-height: 300px;
  }
  .hv-content { padding: 0 1.2rem 2rem; }
  .hv-title {
    font-size: clamp(26px, 8vw, 40px);
    letter-spacing: 1px;
    margin-bottom: .7rem;
  }
  .hv-sub {
    font-size: 14px;
    margin-bottom: 1.1rem;
  }
  .hv-btn { padding: 12px 22px; font-size: 12px; }
}

@media (max-width: 480px) {
  .cssky-hero-video { height: 50vh; min-height: 260px; }
  .hv-title { font-size: clamp(22px, 7.5vw, 32px); }
  .hv-sub { font-size: 13px; }
  .hv-btn { width: 100%; justify-content: center; }
}
/* Rispetta chi preferisce meno animazioni: mostra solo il poster */
@media (prefers-reduced-motion: reduce) {
  .hv-media { display: none; }
  .cssky-hero-video {
    background-size: cover;
    background-position: center;
  }
}

/* ============================================================
   HERO CATEGORIA (compatta)
   ============================================================ */
.cat-hero {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 14px;
  margin-bottom: 2rem;
}

.ch-main { position: relative; border-radius: 14px; overflow: hidden; min-height: 320px; }
.ch-main-link { display: block; width: 100%; height: 100%; position: relative; text-decoration: none; }
.ch-main img {
  width: 100%; height: 100%; min-height: 320px;
  object-fit: cover; display: block;
  transition: transform .5s;
}
.ch-main:hover img { transform: scale(1.03); }
.ch-main-overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  gap: 6px;
  padding: 1.5rem;
  background: linear-gradient(0deg, rgba(7,13,24,.92) 0%, rgba(7,13,24,.25) 55%, transparent 100%);
}
.ch-main-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(20px, 2.4vw, 30px);
  font-weight: 700; line-height: 1.15;
  color: #fff;
}
.ch-main-meta { font-size: 12px; color: rgba(255,255,255,.65); }

.ch-side { display: flex; flex-direction: column; gap: 14px; }

.ch-item {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  flex: 1;
  min-height: 0;
  transition: border-color .2s, transform .2s, box-shadow .2s;
}
.ch-item:hover {
  border-color: var(--accent);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,.10);
}
.ch-item a {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
}

/* Immagine grande in alto, occupa lo spazio disponibile */
.ch-item-media {
  position: relative;
  display: block;
  flex: 1;
  min-height: 120px;
  overflow: hidden;
  background: var(--bg-surface);
}
.ch-item-media img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s;
}
.ch-item:hover .ch-item-media img { transform: scale(1.05); }

.ch-item-tag {
  position: absolute; top: 10px; left: 10px;
  background: var(--tag-bg); color: var(--tag-text);
  font-size: 9px; font-weight: 700;
  letter-spacing: 1.5px; text-transform: uppercase;
  padding: 4px 9px; border-radius: 3px;
}

/* Testo compatto sotto l'immagine */
.ch-item-text {
  display: flex; flex-direction: column; gap: 5px;
  padding: 12px 14px 14px;
  flex-shrink: 0;
}
.ch-item-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px; font-weight: 700; line-height: 1.25;
  color: var(--text-primary);
  transition: color .2s;
}
.ch-item:hover .ch-item-title { color: var(--accent); }
.ch-item-date { font-size: 11px; color: var(--text-muted); }

/* Placeholder senza immagine */
.ch-noimg {
  display: block; width: 100%; height: 100%;
  background-image:
    radial-gradient(circle at 35% 30%, rgba(0,200,255,.18), transparent 60%),
    linear-gradient(135deg, #12253f, #0a1526);
}

@media (max-width: 860px) {
  .cat-hero { grid-template-columns: 1fr; }
  .ch-main, .ch-main img { min-height: 240px; }
  /* Su mobile le card laterali tornano orizzontali per risparmiare spazio */
  .ch-side { flex-direction: row; }
  .ch-item { flex: 1 1 0; }
  .ch-item-media { min-height: 100px; }
}
@media (max-width: 560px) {
  .ch-side { flex-direction: column; }
}

/* ============================================================
   SINGLE ARTICOLO — ottimizzazioni mobile
   ============================================================ */
@media (max-width: 768px) {
  /* Padding laterale ridotto e più spazio in fondo, così l'ultimo
     paragrafo non finisce sotto la barra del browser mobile */
  .entry-content {
    padding: 0 1.2rem 5rem;
    font-size: 16px;
    line-height: 1.7;
  }
  .entry-header {
    padding: 2rem 1.2rem 1.2rem;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }
  .entry-title {
    font-size: clamp(22px, 6.5vw, 32px);
    letter-spacing: .5px;
    line-height: 1.1;
    overflow-wrap: break-word;
    hyphens: auto;
  }

  /* Riga meta: su mobile va a capo con le views sotto */
  .entry-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: .7rem;
  }
  .em-views { margin-left: 0; }

  /* Titoli interni: più aria sopra, meno sotto */
  .entry-content h2,
  .entry-content h3 {
    margin: 2.2rem 0 .6rem;
    scroll-margin-top: 80px;
  }

  /* Immagini: piena larghezza con proporzioni intatte */
  .entry-content img {
    border-radius: 10px;
    width: 100%;
    height: auto;
  }
  .entry-content figure {
    border-radius: 10px;
    margin: 1.5rem 0;
    width: 100% !important;
    max-width: 100%;
  }
  /* Su mobile gli allineamenti laterali diventano piena larghezza */
  .entry-content .alignleft,
  .entry-content .alignright {
    float: none;
    max-width: 100%;
    margin: 1.5rem 0;
  }
  /* Le gallery WP a più colonne si riducono a 2 su mobile */
  .entry-content .wp-block-gallery.has-nested-images figure.wp-block-image {
    width: calc(50% - 8px) !important;
  }

  /* Il wrap del single non deve avere padding doppio */
  .single-wrap { padding: 0; }
  .single-wrap.has-sidebar { padding: 1rem 0 0; }
  .single-comments { padding: 1rem 1.2rem 3rem; }
  .single-wrap:not(.has-sidebar) .single-comments { padding: 1rem 1.2rem 3rem; }
}

/* Hero del single: altezza responsive.
   Su mobile un'immagine troppo alta spinge il titolo sotto la piega,
   340px è un buon equilibrio tra impatto e leggibilità. */
@media (max-width: 768px) {
  .single-hero { height: 340px !important; }
}
@media (max-width: 480px) {
  .single-hero { height: 300px !important; }
}

/* ============================================================
   SINGLE — protezione anti-sfondamento globale su mobile
   ============================================================ */
@media (max-width: 768px) {
  /* Nessun elemento del single può superare la larghezza schermo */
  .single-wrap,
  .single-main,
  .entry-header,
  .entry-content,
  .entry-meta {
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Contenuti larghi (tabelle, pre) restano dentro */
  .entry-content table {
    display: block;
    overflow-x: auto;
    max-width: 100%;
  }
  .entry-content pre {
    overflow-x: auto;
    max-width: 100%;
    white-space: pre-wrap;
    word-wrap: break-word;
  }
  /* Video e iframe: gestiti dalle regole globali più sotto */

  /* Link lunghi non sfondano */
  .entry-content a { overflow-wrap: break-word; }

  /* Blockquote e liste con padding contenuto */
  .entry-content blockquote {
    margin: 1.5rem 0;
    padding-left: 1rem;
    max-width: 100%;
  }
  .entry-content ul,
  .entry-content ol { padding-left: 1.3rem; }
}

/* ============================================================
   VIDEO ED EMBED NEL CONTENUTO — sempre dentro il container
   Valido su TUTTE le risoluzioni (prima era solo mobile,
   quindi su desktop i video YouTube sfondavano la colonna).
   ============================================================ */

/* Wrapper degli embed WordPress */
.entry-content .wp-block-embed,
.entry-content .wp-block-embed__wrapper,
.entry-content figure.wp-block-embed {
  max-width: 100%;
  width: 100%;
  margin: 1.8rem auto;
  box-sizing: border-box;
}

/* Rapporto 16:9 per tutti gli embed video, centrati */
.entry-content .wp-block-embed__wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 10px;
  overflow: hidden;
  background: #0a1526;
}
.entry-content .wp-block-embed__wrapper > iframe,
.entry-content .wp-block-embed__wrapper > video,
.entry-content .wp-block-embed__wrapper > embed,
.entry-content .wp-block-embed__wrapper > object {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  border: 0;
}

/* Iframe "nudi" nel contenuto (oEmbed automatico, incolla URL) */
.entry-content iframe {
  max-width: 100%;
  display: block;
  margin: 1.8rem auto;
  border: 0;
  border-radius: 10px;
}
/* Video: proporzione corretta e larghezza piena della colonna */
.entry-content iframe[src*="youtube"],
.entry-content iframe[src*="youtu.be"],
.entry-content iframe[src*="vimeo"],
.entry-content iframe[src*="dailymotion"],
.entry-content iframe[src*="facebook.com/plugins/video"] {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
}

/* Video HTML5 nel contenuto */
.entry-content video {
  max-width: 100%;
  width: 100%;
  height: auto;
  display: block;
  margin: 1.8rem auto;
  border-radius: 10px;
}

/* Embed che WordPress avvolge in figure senza wrapper */
.entry-content figure > iframe { margin: 0; }

/* Contenitore del testo: impedisce qualsiasi sfondamento */
.entry-content { overflow-wrap: break-word; }
.entry-content > * { max-width: 100%; }