/* ================================================================
   InfoComuni.it — Main Stylesheet
   Mobile-first, WCAG 2.1 AA compliant, Universal Design
   ================================================================ */

/* -------- Design tokens -------- */
:root {
  /* Colori brand */
  --ic-blue: #1a2744;
  --ic-blue-dark: #0a1f3d;
  --ic-blue-light: #243358;
  --ic-accent: #f0c040;
  --ic-accent-dark: #d9a830;
  --ic-link: #0a3a8a;          /* 8.9:1 su #fff */
  --ic-link-visited: #5a2b8a;  /* 8.8:1 su #fff */

  /* Neutri - valori verificati WCAG AA (>=4.5:1 su bg/surface) */
  --ic-bg: #ffffff;
  --ic-surface: #f6f9fc;
  --ic-surface-2: #eef3f9;
  --ic-border: #d3dce6;
  --ic-border-strong: #a9b7c7;
  --ic-text: #0f1a30;          /* 15.8:1 su #fff */
  --ic-text-2: #334155;        /* 9.5:1 su #fff  - body secondario */
  --ic-text-3: #475569;        /* 7.2:1 su #fff  - muted, era 64748b 4.7:1 */

  /* Semantici */
  --ic-success: #059669;
  --ic-warning: #d97706;
  --ic-danger: #dc2626;
  --ic-info: #0284c7;

  /* Spacing (scala 4px) */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;

  /* Typography */
  --f-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --f-size-xs: 12px;
  --f-size-sm: 14px;
  --f-size-md: 16px;
  --f-size-lg: 18px;
  --f-size-xl: 22px;
  --f-size-2xl: 28px;
  --f-size-3xl: 36px;
  --f-lh-tight: 1.2;
  --f-lh-normal: 1.5;
  --f-lh-relaxed: 1.7;

  /* Radii */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-xl: 24px;
  --r-full: 9999px;

  /* Shadows */
  --sh-sm: 0 1px 2px rgba(10, 22, 40, 0.06);
  --sh-md: 0 4px 12px rgba(10, 22, 40, 0.1);
  --sh-lg: 0 12px 32px rgba(10, 22, 40, 0.14);

  /* Transitions */
  --tr: 200ms ease;

  /* Layout */
  --container-max: 1200px;
  --header-h: 64px;
}

/* -------- Dark mode (deep navy palette) -------- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) {
    --ic-bg: #0a1f3d;
    --ic-bg-deep: #06152b;
    --ic-surface: #162d54;         /* leggermente piu chiaro per contrasto */
    --ic-surface-2: #1e3a6b;
    --ic-border: #355488;
    --ic-border-strong: #5577aa;
    --ic-text: #f8fbff;            /* 15.6:1 su surface */
    --ic-text-2: #dbe4f0;          /* 11.2:1 su surface */
    --ic-text-3: #b8c5d9;          /* 7.1:1 su surface, era 94a3b8 5.4:1 */
    --ic-link: #9ec7ff;            /* 8.2:1 su surface, era 7cb3ff 6.2:1 */
    --ic-link-visited: #d4c2ff;    /* 8.4:1 su surface */
    --ic-accent: #FFCC33;          /* 10.5:1 su surface */
  }
}
:root.force-dark {
  --ic-bg: #0a1f3d;
  --ic-bg-deep: #06152b;
  --ic-surface: #162d54;
  --ic-surface-2: #1e3a6b;
  --ic-border: #355488;
  --ic-border-strong: #5577aa;
  --ic-text: #f8fbff;
  --ic-text-2: #dbe4f0;
  --ic-text-3: #b8c5d9;
  --ic-link: #9ec7ff;
  --ic-link-visited: #d4c2ff;
  --ic-accent: #FFCC33;
}

/* -------- Reset & base -------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  -moz-tab-size: 4;
  tab-size: 4;
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
body {
  margin: 0;
  font-family: var(--f-sans);
  font-size: var(--f-size-md);
  line-height: var(--f-lh-normal);
  color: var(--ic-text);
  background: #06152b;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main {
  flex: 1;
}
img,
picture,
video,
svg {
  max-width: 100%;
  height: auto;
  display: block;
}
h1,
h2,
h3,
h4 {
  margin: 0 0 var(--sp-3);
  line-height: var(--f-lh-tight);
  color: var(--ic-text);
}
h1 {
  font-size: var(--f-size-3xl);
  font-weight: 800;
  letter-spacing: -0.02em;
}
h2 {
  font-size: var(--f-size-2xl);
  font-weight: 700;
}
h3 {
  font-size: var(--f-size-xl);
  font-weight: 700;
}
h4 {
  font-size: var(--f-size-lg);
  font-weight: 600;
}
p {
  margin: 0 0 var(--sp-4);
}
a {
  color: var(--ic-link);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color var(--tr);
}
a:hover {
  text-decoration: none;
}
a:visited {
  color: var(--ic-link-visited);
}
button {
  font: inherit;
  cursor: pointer;
  border: 0;
  background: transparent;
  color: inherit;
}
:focus-visible {
  outline: 3px solid var(--ic-accent);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}

/* -------- Accessibility: skip link -------- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--ic-blue);
  color: #fff;
  padding: var(--sp-3) var(--sp-4);
  z-index: 10000;
  border-radius: 0 0 var(--r-md) 0;
}
.skip-link:focus {
  left: 0;
}

/* -------- Layout -------- */
.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--sp-4);
}
@media (min-width: 768px) {
  .container {
    padding-inline: var(--sp-5);
  }
}

.section {
  padding-block: var(--sp-6);
}
@media (min-width: 768px) {
  .section {
    padding-block: var(--sp-7);
  }
}

/* -------- Header -------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--ic-blue-dark);
  color: #fff;
  box-shadow: var(--sh-sm);
}
.site-header a {
  color: #fff;
}
.site-header__inner {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  min-height: var(--header-h);
  padding-block: var(--sp-2);
}
.site-header__brand {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  text-decoration: none;
  color: #fff;
  flex-shrink: 0;
}
.site-header__logo {
  height: 36px;
  width: auto;
}
.site-header__nav {
  display: none;
  gap: var(--sp-3);
  margin-left: auto;
}
@media (min-width: 900px) {
  .site-header__nav {
    display: flex;
  }
}
.site-header__nav a {
  padding: var(--sp-2) var(--sp-3);
  border-radius: var(--r-md);
  text-decoration: none;
  font-weight: 600;
  font-size: var(--f-size-sm);
  transition: background var(--tr);
}
.site-header__nav a:hover,
.site-header__nav a[aria-current="page"] {
  background: var(--ic-blue-light);
}
.site-header__utils {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin-left: auto;
}
@media (min-width: 900px) {
  .site-header__utils {
    margin-left: 0;
  }
}
.icon-btn {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-full);
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  transition: background var(--tr);
}
.icon-btn:hover {
  background: rgba(255, 255, 255, 0.24);
}
.icon-btn svg {
  width: 20px;
  height: 20px;
}

/* Hamburger (mobile) */
.site-header__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--r-full);
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}
@media (min-width: 900px) {
  .site-header__toggle {
    display: none;
  }
}
.site-header__toggle svg {
  width: 22px;
  height: 22px;
}

/* Mobile nav drawer */
.mobile-nav {
  display: none;
  position: fixed;
  inset: var(--header-h) 0 0 0;
  background: var(--ic-blue-dark);
  padding: var(--sp-5);
  z-index: 99;
  flex-direction: column;
  gap: var(--sp-2);
  overflow-y: auto;
}
.mobile-nav[aria-hidden="false"] {
  display: flex;
}
.mobile-nav a {
  color: #fff;
  text-decoration: none;
  padding: var(--sp-4);
  border-radius: var(--r-md);
  font-weight: 600;
  font-size: var(--f-size-lg);
}
.mobile-nav a:hover,
.mobile-nav a[aria-current="page"] {
  background: var(--ic-blue-light);
}
@media (min-width: 900px) {
  .mobile-nav {
    display: none !important;
  }
}

/* -------- Hero -------- */
.hero {
  background: linear-gradient(
      135deg,
      rgba(10, 22, 40, 0.78),
      rgba(26, 39, 68, 0.6)
    ),
    url("/assets/img/hero-puglia.jpg") center/cover no-repeat;
  color: #fff;
  padding-block: var(--sp-7) var(--sp-6);
  text-align: center;
}
.hero h1 {
  color: #fff;
  font-size: clamp(var(--f-size-2xl), 6vw, 48px);
  margin-bottom: var(--sp-3);
}
.hero p {
  font-size: var(--f-size-lg);
  max-width: 640px;
  margin-inline: auto;
  color: rgba(255, 255, 255, 0.92);
  margin-bottom: var(--sp-5);
}
.hero .search-form {
  max-width: 560px;
  margin-inline: auto;
}

/* -------- Search -------- */
.search-form {
  display: flex;
  gap: var(--sp-2);
  background: #fff;
  padding: var(--sp-2);
  border-radius: var(--r-full);
  box-shadow: var(--sh-lg);
}
.search-form input {
  flex: 1;
  border: 0;
  background: transparent;
  padding: var(--sp-3) var(--sp-4);
  font-size: var(--f-size-md);
  color: var(--ic-text);
  min-height: 44px;
  border-radius: var(--r-full);
}
.search-form input:focus {
  outline: none;
}
.search-form button {
  background: var(--ic-blue);
  color: #fff;
  padding: 0 var(--sp-5);
  border-radius: var(--r-full);
  font-weight: 600;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  transition: background var(--tr);
}
.search-form button:hover {
  background: var(--ic-blue-light);
}
.search-results {
  max-width: 560px;
  margin: var(--sp-3) auto 0;
  background: var(--ic-bg);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-lg);
  max-height: 50vh;
  overflow-y: auto;
  text-align: left;
}
.search-results[hidden] {
  display: none;
}
.search-results a {
  display: block;
  padding: var(--sp-3) var(--sp-4);
  text-decoration: none;
  color: var(--ic-text);
  border-bottom: 1px solid var(--ic-border);
}
.search-results a:last-child {
  border-bottom: 0;
}
.search-results a:hover,
.search-results a:focus {
  background: var(--ic-surface);
}
.search-results .result-prov {
  color: var(--ic-text-3);
  font-size: var(--f-size-sm);
  margin-left: var(--sp-2);
}

/* -------- Province grid -------- */
.prov-grid {
  display: grid;
  gap: var(--sp-3);
  grid-template-columns: repeat(2, 1fr);
  margin-top: var(--sp-5);
}
@media (min-width: 600px) {
  .prov-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 900px) {
  .prov-grid {
    grid-template-columns: repeat(6, 1fr);
  }
}
.prov-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-4);
  background: var(--ic-surface);
  border: 1px solid var(--ic-border);
  border-radius: var(--r-lg);
  text-decoration: none;
  color: var(--ic-text);
  min-height: 90px;
  transition: transform var(--tr), box-shadow var(--tr), border-color var(--tr);
}
.prov-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
  border-color: var(--ic-accent);
}
.prov-card__name {
  font-weight: 700;
  font-size: var(--f-size-md);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.prov-card__count {
  font-size: var(--f-size-sm);
  color: var(--ic-text-3);
}

/* -------- Cards grid generic -------- */
.cards-grid {
  display: grid;
  gap: var(--sp-4);
  grid-template-columns: 1fr;
  margin-top: var(--sp-5);
}
@media (min-width: 600px) {
  .cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 900px) {
  .cards-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.card {
  background: var(--ic-surface);
  border: 1px solid var(--ic-border);
  border-radius: var(--r-lg);
  padding: var(--sp-5);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  transition: transform var(--tr), box-shadow var(--tr);
}
.card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
}
.card h3 {
  margin: 0;
}
.card__meta {
  font-size: var(--f-size-sm);
  color: var(--ic-text-3);
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
}
.badge {
  display: inline-block;
  padding: 2px var(--sp-2);
  border-radius: var(--r-sm);
  background: var(--ic-accent);
  color: var(--ic-blue);
  font-size: var(--f-size-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.badge--info {
  background: var(--ic-info);
  color: #fff;
}
.badge--success {
  background: var(--ic-success);
  color: #fff;
}
.badge--warning {
  background: var(--ic-warning);
  color: #fff;
}

/* -------- Comune page -------- */
.page-header {
  background: var(--ic-blue);
  color: #fff;
  padding-block: var(--sp-6);
}
.page-header h1 {
  color: #fff;
}
.page-header p {
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
}
.page-header .breadcrumb {
  font-size: var(--f-size-sm);
  margin-bottom: var(--sp-3);
  opacity: 0.85;
}
.page-header .breadcrumb a {
  color: #fff;
}

.comune-meta {
  display: grid;
  gap: var(--sp-3);
  grid-template-columns: repeat(2, 1fr);
  margin-top: var(--sp-4);
}
@media (min-width: 600px) {
  .comune-meta {
    grid-template-columns: repeat(4, 1fr);
  }
}
.comune-meta__item {
  background: rgba(255, 255, 255, 0.08);
  padding: var(--sp-3) var(--sp-4);
  border-radius: var(--r-md);
}
.comune-meta__label {
  font-size: var(--f-size-xs);
  text-transform: uppercase;
  opacity: 0.7;
  letter-spacing: 0.05em;
}
.comune-meta__value {
  font-size: var(--f-size-lg);
  font-weight: 600;
  margin-top: 2px;
}

.comune-section {
  padding-block: var(--sp-6);
  border-top: 1px solid var(--ic-border);
}
.comune-section:first-of-type {
  border-top: 0;
}
.comune-section h2 {
  margin-bottom: var(--sp-4);
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}

.info-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: var(--sp-3);
}
.info-list li {
  padding: var(--sp-4);
  background: var(--ic-surface);
  border: 1px solid var(--ic-border);
  border-radius: var(--r-md);
}
.info-list .item-title {
  font-weight: 700;
  margin-bottom: var(--sp-1);
}
.info-list .item-meta {
  color: var(--ic-text-3);
  font-size: var(--f-size-sm);
}
.info-list a {
  color: var(--ic-link);
}

/* -------- Footer -------- */
.site-footer {
  background: linear-gradient(180deg,#04101f 0%,#020812 100%);
  color: #cbd5e1;
  padding: 0;
  margin-top: 0;
  border-top: 1px solid rgba(124,179,255,.14);
}
.site-footer a {
  color: #fff;
}
.site-footer__grid {
  display: grid;
  gap: var(--sp-5);
  grid-template-columns: 1fr;
}
@media (min-width: 600px) {
  .site-footer__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.site-footer h4 {
  color: #fff;
  margin-bottom: var(--sp-3);
  font-size: var(--f-size-md);
}
.site-footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: var(--sp-2);
}
.site-footer__bottom {
  margin-top: var(--sp-5);
  padding-top: var(--sp-4);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  text-align: center;
  font-size: var(--f-size-sm);
}

/* -------- High-contrast mode (a11y toggle) -------- */
:root.high-contrast {
  --ic-bg: #ffffff;
  --ic-text: #000000;
  --ic-text-2: #000000;
  --ic-border: #000000;
  --ic-link: #0000ee;
  --ic-accent: #ffcc00;
}
:root.high-contrast a {
  text-decoration: underline;
}
:root.high-contrast button,
:root.high-contrast .card,
:root.high-contrast .info-list li {
  border: 2px solid #000 !important;
}

/* -------- Larger text (a11y toggle) -------- */
:root.larger-text {
  font-size: 19px;
}

/* -------- Utilities -------- */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.text-center {
  text-align: center;
}
.mt-3 {
  margin-top: var(--sp-3);
}
.mt-5 {
  margin-top: var(--sp-5);
}

/* -------- WhatsApp floating button -------- */
.whatsapp-fab {
  position: fixed;
  right: var(--sp-4);
  bottom: var(--sp-4);
  width: 56px;
  height: 56px;
  border-radius: var(--r-full);
  background: #25d366;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--sh-lg);
  z-index: 50;
  text-decoration: none;
  transition: transform var(--tr);
}
.whatsapp-fab:hover {
  transform: scale(1.08);
}
.whatsapp-fab svg {
  width: 28px;
  height: 28px;
}

/* -------- Loading states -------- */
.is-loading {
  opacity: 0.5;
  pointer-events: none;
}
.spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid var(--ic-border);
  border-top-color: var(--ic-blue);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* ================================================================
   MINI-SITO COMUNE — v2 (Tab nav, Pro lock, Flipbook embed)
   ================================================================ */

/* Hero del mini-sito */
.comune-hero {
  background: linear-gradient(135deg, var(--ic-blue-dark) 0%, var(--ic-blue) 50%, var(--ic-blue-light) 100%);
  color: #fff;
  padding: var(--sp-7) 0 var(--sp-6);
  position: relative;
  overflow: hidden;
}
.comune-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(240,192,64,0.15) 0%, transparent 40%),
    radial-gradient(circle at 80% 80%, rgba(240,192,64,0.10) 0%, transparent 40%);
  pointer-events: none;
}
.comune-hero .container { position: relative; z-index: 1; }
.comune-hero .breadcrumb { color: rgba(255,255,255,0.85); margin-bottom: var(--sp-4); }
.comune-hero .breadcrumb a { color: var(--ic-accent); text-decoration: underline; }
.comune-hero h1 {
  font-size: clamp(28px, 5vw, 44px);
  line-height: var(--f-lh-tight);
  margin: 0 0 var(--sp-2);
  letter-spacing: -0.02em;
}
.comune-hero__subtitle {
  font-size: var(--f-size-lg);
  opacity: 0.92;
  margin: 0 0 var(--sp-5);
  max-width: 720px;
}
.comune-hero__badges {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
  margin-bottom: var(--sp-5);
}
.comune-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: var(--r-full);
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  font-size: .78rem;
  color: #b0bcc9;
  backdrop-filter: blur(8px);
}
.comune-hero__badge--pro {
  background: rgba(255,204,51,.1);
  color: #FFCC33;
  border-color: rgba(255,204,51,.25);
  font-weight: 700;
  font-size: .7rem;
  letter-spacing: .06em;
}
.comune-hero__badge--base {
  background: rgba(255,255,255,.03);
}

/* Meta cards nel hero */
.comune-hero__meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--sp-3);
  max-width: 900px;
}
.comune-hero__meta-item {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  backdrop-filter: blur(10px);
  transition: border-color .2s, background .2s;
}
.comune-hero__meta-item:hover {
  border-color: rgba(255,255,255,.15);
  background: rgba(255,255,255,.06);
}
.comune-hero__meta-label {
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #8896ab;
  opacity: 1;
  font-weight: 600;
  margin-bottom: 4px;
}
.comune-hero__meta-value {
  font-size: var(--f-size-md);
  font-weight: 600;
}
.comune-hero__meta-value a { color: var(--ic-accent); }

/* Tab navigation sticky del mini-sito */
.comune-tabs {
  position: sticky;
  top: var(--header-h);
  z-index: 20;
  background: var(--ic-bg);
  border-bottom: 1px solid var(--ic-border);
  box-shadow: var(--sh-sm);
}
.comune-tabs__scroll {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  padding: 6px 0 0;
}
.comune-tabs__btn {
  flex: 0 1 auto;
  background: transparent;
  border: none;
  padding: 10px 14px;
  font-size: var(--f-size-sm);
  font-weight: 500;
  color: var(--ic-text-2);
  cursor: pointer;
  border-bottom: 3px solid transparent;
  transition: color var(--tr), border-color var(--tr), background var(--tr);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  font-family: inherit;
  border-radius: 6px 6px 0 0;
}
.comune-tabs__btn:hover {
  color: var(--ic-blue);
  background: rgba(255,204,51,.06);
}
.comune-tabs__btn[aria-selected="true"] {
  color: var(--ic-blue);
  border-bottom-color: var(--ic-accent);
  background: rgba(255,204,51,.08);
}
.comune-tabs__btn .tab-lock {
  font-size: 10px;
  padding: 2px 6px;
  border-radius: var(--r-full);
  background: var(--ic-accent);
  color: var(--ic-blue-dark);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Pannelli tab */
.comune-panel {
  display: none;
  padding: var(--sp-6) 0;
  animation: panel-fade 200ms ease;
}
.comune-panel.is-active { display: block; }
@keyframes panel-fade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}
.comune-panel h2 {
  font-size: var(--f-size-2xl);
  margin: 0 0 var(--sp-4);
  color: var(--ic-blue);
}
.comune-panel h2 .section-icon { margin-right: 8px; }
.comune-panel__lead {
  font-size: var(--f-size-lg);
  color: var(--ic-text-2);
  max-width: 720px;
  margin: 0 0 var(--sp-5);
}

/* Lock overlay per sezioni Pro */
.pro-lock {
  position: relative;
  border: 2px dashed var(--ic-border-strong);
  border-radius: var(--r-lg);
  padding: var(--sp-7) var(--sp-5);
  text-align: center;
  background: linear-gradient(180deg, var(--ic-surface) 0%, var(--ic-surface-2) 100%);
  min-height: 320px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-4);
}
.pro-lock__icon {
  width: 72px;
  height: 72px;
  border-radius: var(--r-full);
  background: var(--ic-accent);
  color: var(--ic-blue-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  box-shadow: var(--sh-md);
}
.pro-lock__title {
  font-size: var(--f-size-xl);
  font-weight: 700;
  color: var(--ic-blue);
  margin: 0;
}
.pro-lock__text {
  max-width: 520px;
  color: var(--ic-text-2);
  line-height: var(--f-lh-relaxed);
  margin: 0;
}
.pro-lock__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--ic-blue);
  color: #fff;
  border-radius: var(--r-full);
  text-decoration: none;
  font-weight: 600;
  transition: transform var(--tr), background var(--tr);
}
.pro-lock__cta:hover {
  background: var(--ic-blue-dark);
  transform: translateY(-1px);
}
.pro-lock__cta--accent {
  background: var(--ic-accent);
  color: var(--ic-blue-dark);
}
.pro-lock__cta--accent:hover { background: var(--ic-accent-dark); }

/* Overlay su sezioni preview-bloccate */
.pro-preview {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid var(--ic-border);
}
.pro-preview__content {
  filter: blur(4px) saturate(0.6);
  opacity: 0.45;
  pointer-events: none;
  user-select: none;
  padding: var(--sp-5);
  min-height: 240px;
}
.pro-preview__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--sp-5);
  background: linear-gradient(180deg, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0.95) 40%, rgba(255,255,255,0.98) 100%);
  backdrop-filter: blur(2px);
}

/* Flipbook frame */
.flipbook-frame {
  width: 100%;
  aspect-ratio: 16 / 10;
  border: none;
  border-radius: var(--r-lg);
  box-shadow: var(--sh-lg);
  background: var(--ic-surface);
  display: block;
}
.flipbook-caption {
  font-size: var(--f-size-sm);
  color: var(--ic-text-3);
  margin-top: var(--sp-3);
  text-align: center;
}
.flipbook-actions {
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
  margin-top: var(--sp-4);
  justify-content: center;
}
.btn-primary,
.btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: var(--r-full);
  font-weight: 600;
  text-decoration: none;
  font-size: var(--f-size-sm);
  transition: all var(--tr);
  border: 2px solid transparent;
  cursor: pointer;
}
.btn-primary {
  background: var(--ic-blue);
  color: #fff;
}
.btn-primary:hover { background: var(--ic-blue-dark); }
.btn-outline {
  background: transparent;
  color: var(--ic-blue);
  border-color: var(--ic-blue);
}
.btn-outline:hover {
  background: var(--ic-blue);
  color: #fff;
}

/* CTA Consulenze EPICA */
.epica-cta {
  background: linear-gradient(135deg, var(--ic-blue) 0%, var(--ic-blue-light) 100%);
  color: #fff;
  border-radius: var(--r-lg);
  padding: var(--sp-6);
  box-shadow: var(--sh-lg);
}
.epica-cta h3 {
  margin: 0 0 var(--sp-3);
  font-size: var(--f-size-xl);
}
.epica-cta p {
  color: rgba(255,255,255,0.9);
  line-height: var(--f-lh-relaxed);
  margin: 0 0 var(--sp-4);
}
.epica-cta__services {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--sp-3);
  margin: var(--sp-5) 0;
}
.epica-cta__service {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: var(--r-md);
  padding: var(--sp-4);
}
.epica-cta__service h4 {
  margin: 0 0 8px;
  font-size: var(--f-size-md);
  color: var(--ic-accent);
}
.epica-cta__service p {
  font-size: var(--f-size-sm);
  margin: 0;
}
.epica-cta__buttons {
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
}
.epica-cta .btn-primary {
  background: var(--ic-accent);
  color: var(--ic-blue-dark);
}
.epica-cta .btn-primary:hover { background: var(--ic-accent-dark); }
.epica-cta .btn-outline {
  color: #fff;
  border-color: rgba(255,255,255,0.5);
}
.epica-cta .btn-outline:hover {
  background: #fff;
  color: var(--ic-blue);
}

/* News card locali */
.news-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--sp-4);
}
.news-card {
  background: var(--ic-bg);
  border: 1px solid var(--ic-border);
  border-radius: var(--r-lg);
  padding: var(--sp-5);
  transition: transform var(--tr), box-shadow var(--tr);
  display: flex;
  flex-direction: column;
}
.news-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
}
.news-card__date {
  font-size: var(--f-size-xs);
  color: var(--ic-text-3);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 8px;
}
.news-card__title {
  font-size: var(--f-size-lg);
  font-weight: 700;
  color: var(--ic-blue);
  margin: 0 0 var(--sp-2);
  line-height: var(--f-lh-tight);
}
.news-card__excerpt {
  font-size: var(--f-size-sm);
  color: var(--ic-text-2);
  line-height: var(--f-lh-relaxed);
  margin: 0 0 var(--sp-3);
  flex: 1;
}
.news-card__badge {
  display: inline-block;
  font-size: var(--f-size-xs);
  padding: 3px 10px;
  border-radius: var(--r-full);
  background: var(--ic-surface-2);
  color: var(--ic-text-2);
  margin-bottom: 8px;
  align-self: flex-start;
}

/* Overview quick grid */
.overview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--sp-4);
}
.overview-card {
  background: var(--ic-surface);
  border: 1px solid var(--ic-border);
  border-radius: var(--r-lg);
  padding: var(--sp-5);
  text-decoration: none;
  color: inherit;
  transition: all var(--tr);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.overview-card:hover {
  background: var(--ic-bg);
  border-color: var(--ic-blue);
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
}
.overview-card__icon {
  font-size: 28px;
}
.overview-card__title {
  font-weight: 700;
  color: var(--ic-blue);
  font-size: var(--f-size-md);
}
.overview-card__desc {
  font-size: var(--f-size-sm);
  color: var(--ic-text-2);
  margin: 0;
}

/* Mobile adjustments */
@media (max-width: 640px) {
  .comune-hero { padding: var(--sp-6) 0 var(--sp-5); }
  .comune-hero__meta { grid-template-columns: repeat(2, 1fr); }
  .comune-tabs__btn { padding: 7px 10px; font-size: 12px; gap: 4px; }
  .comune-tabs__btn span { font-size: 11px; }
  .comune-panel { padding: var(--sp-5) 0; }
  .flipbook-frame { aspect-ratio: 4 / 5; }
}

/* Dark mode overrides per mini-sito */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .pro-preview__overlay {
    background: linear-gradient(180deg, rgba(10,22,40,0.4) 0%, rgba(10,22,40,0.95) 40%, rgba(10,22,40,0.98) 100%);
  }
  :root:not(.force-light) .comune-tabs {
    background: var(--ic-bg);
  }
}

/* ============================================================
   v2 — Puglia layout switcher, Comune header, Hero map overlay
   ============================================================ */

/* ----- Puglia switcher (nella main header) ----- */
.puglia-switch { position: relative; }
.puglia-switch__btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .45rem .75rem;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  color: #fff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease;
}
.puglia-switch__btn:hover,
.puglia-switch__btn[aria-expanded="true"] {
  background: rgba(246,185,59,.22);
  border-color: #f6b93b;
}
.puglia-switch__dot {
  width: .55rem; height: .55rem; border-radius: 50%;
  background: #f6b93b; box-shadow: 0 0 0 3px rgba(246,185,59,.25);
  display: inline-block;
}
.puglia-switch__chevron {
  width: 1rem; height: 1rem;
  transition: transform .18s ease;
}
.puglia-switch__btn[aria-expanded="true"] .puglia-switch__chevron { transform: rotate(180deg); }

.puglia-menu {
  position: absolute;
  top: calc(100% + .6rem);
  right: 0;
  min-width: 260px;
  background: #0a1f3d;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  padding: .5rem;
  box-shadow: 0 20px 50px rgba(0,0,0,.45);
  z-index: 100;
  display: flex;
  flex-direction: column;
  gap: .25rem;
}
.puglia-menu[hidden] { display: none; }
.puglia-menu__item {
  display: flex; align-items: center; gap: .85rem;
  padding: .75rem .85rem;
  background: transparent;
  border: 0; border-radius: 10px;
  color: #fff; text-align: left;
  font: inherit; cursor: pointer;
  transition: background .15s ease;
}
.puglia-menu__item:hover,
.puglia-menu__item:focus-visible { background: rgba(246,185,59,.15); outline: none; }
.puglia-menu__item.is-active {
  background: rgba(246,185,59,.2);
  box-shadow: inset 3px 0 0 #f6b93b;
}
.puglia-menu__icon {
  font-size: 1.25rem; color: #f6b93b;
  width: 1.5rem; text-align: center;
}
.puglia-menu__text { display: flex; flex-direction: column; }
.puglia-menu__text strong { font-size: .95rem; }
.puglia-menu__text em { font-style: normal; font-size: .8rem; opacity: .7; }

/* ----- Layout modes (body class applied by JS) ----- */
body.layout-mobile {
  max-width: 420px;
  margin: 0 auto;
  box-shadow: 0 0 40px rgba(0,0,0,.25);
  min-height: 100vh;
}
body.layout-mobile .site-header__nav,
body.layout-mobile .comune-header__nav { display: none; }
body.layout-mobile .site-header__toggle { display: inline-flex; }
body.layout-mobile .container { padding-left: 1rem; padding-right: 1rem; }

body.layout-desktop { max-width: none; }

body.layout-kiosk {
  font-size: 1.15rem;
}
body.layout-kiosk .site-header,
body.layout-kiosk .comune-header { padding: .5rem 0; }
body.layout-kiosk .container { max-width: 1400px; }
body.layout-kiosk h1 { font-size: clamp(2.2rem, 4vw, 3.2rem); }
body.layout-kiosk .ms-hero-btn { padding: 1rem 1.5rem; font-size: 1.05rem; }
body.layout-kiosk .comune-tabs__btn { padding: 1rem 1.25rem; font-size: 1.05rem; }

/* ----- Comune header (esclusivo mini-sito) ----- */
body.minisite-comune .site-header { display: none; } /* fallback, non dovrebbe esserci */
.comune-header {
  background: linear-gradient(135deg, #0a1f3d 0%, #102a43 60%, #1a3a5c 100%);
  color: #fff;
  border-bottom: 2px solid #f6b93b;
  position: sticky;
  top: 0;
  z-index: 50;
}
.comune-header__inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .85rem 0;
  flex-wrap: wrap;
}
.comune-header__brand {
  display: flex;
  align-items: center;
  gap: .85rem;
  color: inherit;
  text-decoration: none;
}
.comune-header__logo { height: 32px; width: auto; }
/* L'header comune ha SEMPRE sfondo scuro: forza logo bianco qualunque sia lo schema */
header.comune-header .comune-header__logo--light {
  display: inline-block !important;
  /* safety net: se per qualsiasi motivo il file non è bianco, lo forziamo a bianco puro */
  filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0,0,0,.35));
}
header.comune-header .comune-header__logo--dark { display: none !important; }
/* Forza colori testo header sempre chiari (sfondo sempre dark gradient) */
header.comune-header,
header.comune-header .comune-header__brand,
header.comune-header .comune-header__comune-name {
  color: #ffffff !important;
}
header.comune-header .comune-header__comune-label {
  color: #f6b93b !important;
  opacity: 1 !important;
}
.comune-header__divider {
  width: 1px; height: 28px;
  background: rgba(255,255,255,.25);
  display: inline-block;
}
.comune-header__comune { display: flex; flex-direction: column; line-height: 1.15; }
.comune-header__comune-label {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  opacity: .7;
}
.comune-header__comune-name { font-size: 1.05rem; }
.comune-header__nav {
  display: flex; gap: .25rem;
  margin-left: auto;
  flex-wrap: wrap;
}
.comune-header__nav a {
  color: rgba(255,255,255,.85);
  text-decoration: none;
  padding: .45rem .7rem;
  border-radius: 8px;
  font-size: .9rem;
  transition: background .15s ease, color .15s ease;
}
.comune-header__nav a:hover { background: rgba(255,255,255,.1); color: #fff; }
.comune-header__utils { display: flex; align-items: center; gap: .5rem; }
.comune-header__back {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .4rem .75rem;
  background: rgba(246,185,59,.15);
  color: #f6b93b;
  text-decoration: none;
  border-radius: 8px;
  font-size: .85rem;
  font-weight: 600;
}
.comune-header__back:hover { background: rgba(246,185,59,.25); }

/* Nasconde il main header globale sui mini-siti comune (body.minisite-comune) */
body.minisite-comune > .skip-link + header.site-header,
body.minisite-comune > header.site-header { display: none !important; }
body.minisite-comune > nav.mobile-nav { display: none !important; }

/* ----- Hero comune con mappa Leaflet in trasparenza (WCAG AA) -----
   Strategy:
   1) map in background, dimmed + blurred for legibility
   2) strong multi-stop scrim overlay (sides transparent, center/left darker)
   3) content inside solid semi-opaque blur card to guarantee AA contrast
------------------------------------------------------------------- */
/* ================================================================
   BANNER COMUNI — Layout orizzontale, sfumatura integrale sulla mappa
   ================================================================ */
.comune-hero--map {
  position: relative;
  overflow: hidden;
  min-height: auto;
  background-color: #0e1b2e;
  padding: 0;
}

/* Mappa: colori naturali desaturati, dettaglio alto */
.comune-hero--map .comune-hero__map {
  position: absolute; inset: 0; z-index: 0;
  filter: saturate(.65) contrast(1.1) brightness(.9);
}

/* Sfumatura integrale: si fonde con la mappa, scura uniforme */
.comune-hero--map .comune-hero__overlay {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to bottom, rgba(10,20,40,.55) 0%, rgba(10,20,40,.35) 50%, rgba(10,20,40,.6) 100%);
  pointer-events: none;
}

.comune-hero--map .leaflet-tile-pane {
  filter: saturate(.6) contrast(1.05) brightness(.88);
}

/* Marker gold con glow */
.comune-hero--map .leaflet-marker-pane svg,
.comune-hero--map .leaflet-overlay-pane svg {
  filter: drop-shadow(0 0 8px rgba(255,204,51,.9)) drop-shadow(0 0 18px rgba(255,204,51,.5));
}

/* ---- Content: NESSUN BOX, disteso orizzontale full-width ---- */
.comune-hero--map .comune-hero__content {
  position: relative;
  z-index: 2;
  padding: 1.4rem 2rem 1.2rem;
  background: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-radius: 0;
  border: none;
  box-shadow: none;
  max-width: 100%;
  margin: 0;
}

.comune-hero--map .leaflet-container { background: #111822; }

/* Light theme */
html.force-light .comune-hero--map .comune-hero__map {
  filter: saturate(.5) contrast(1.05) brightness(1.1);
}
html.force-light .comune-hero--map .leaflet-tile-pane {
  filter: saturate(.5) contrast(1.0) brightness(1.15);
}
html.force-light .comune-hero--map .leaflet-container { background: #e0e0e0; }
html.force-light .comune-hero--map .comune-hero__overlay {
  background:
    linear-gradient(to bottom, rgba(10,20,40,.5) 0%, rgba(10,20,40,.3) 50%, rgba(10,20,40,.55) 100%);
}

/* ---- Testi ---- */
.comune-hero--map h1 {
  color: #fff;
  text-shadow: 0 2px 10px rgba(0,0,0,.6);
  font-weight: 800;
  margin-bottom: 2px;
}
.comune-hero--map .comune-hero__subtitle {
  color: rgba(255,255,255,.8);
  text-shadow: 0 1px 6px rgba(0,0,0,.5);
  font-weight: 500;
  font-size: .88rem;
  margin-bottom: 12px;
}
.comune-hero--map .breadcrumb,
.comune-hero--map .breadcrumb a,
.comune-hero--map .breadcrumb span {
  color: rgba(255,255,255,.75) !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.5);
}
.comune-hero--map .breadcrumb a { color: #ffd966 !important; }

/* ---- Badges: glass compatti ---- */
.comune-hero--map .comune-hero__badge {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.15);
  color: #e2e8f0;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 4px 10px;
  font-size: .72rem;
}
.comune-hero--map .comune-hero__badge--pro {
  background: rgba(255,204,51,.15);
  color: #FFCC33;
  border-color: rgba(255,204,51,.35);
}
.comune-hero--map .comune-hero__badges {
  margin-bottom: 8px;
}

/* ---- Meta cards: riga unica 4 colonne, glass con bordi grigi ---- */
.comune-hero--map .comune-hero__meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  max-width: 100%;
}
.comune-hero--map .comune-hero__meta-item {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 4px 14px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 10px;
  padding: 10px 14px;
  transition: all .25s ease;
}
.comune-hero--map .comune-hero__meta-item:hover {
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.08);
}
.comune-hero--map .comune-hero__meta-label {
  color: rgba(255,255,255,.5);
  font-weight: 700;
  font-size: .62rem;
  letter-spacing: .08em;
  margin-bottom: 2px;
}
.comune-hero--map .comune-hero__meta-value {
  color: #f1f5f9;
  font-weight: 700;
  font-size: .9rem;
}
.comune-hero--map .comune-hero__meta-value a { color: #f1f5f9; }
.comune-hero--map .comune-hero__meta-value a:hover { color: #FFCC33; }

/* ---- Bottoni contatto: riga unica, glass con bordi grigi ---- */
.comune-hero--map .ms-hero-buttons {
  margin-top: 12px;
}
.comune-hero--map .ms-hero-btn {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  color: #e8ecf1 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.03);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 10px;
  transition: all .25s ease;
}
.comune-hero--map .ms-hero-btn:hover {
  background: rgba(255,255,255,.1) !important;
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
  transform: translateY(-1px);
}
.comune-hero--map .ms-hero-btn i { color: #FFCC33 !important; }

.comune-hero--map .ms-btn-phone,
.comune-hero--map .ms-btn-pec,
.comune-hero--map .ms-btn-web {
  border-color: rgba(255,255,255,.18) !important;
}
.comune-hero--map .ms-btn-phone i,
.comune-hero--map .ms-btn-pec i,
.comune-hero--map .ms-btn-web i { color: #FFCC33; }
.comune-hero--map .ms-btn-phone:hover,
.comune-hero--map .ms-btn-pec:hover,
.comune-hero--map .ms-btn-web:hover {
  background: rgba(255,255,255,.1) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.28) !important;
}

/* Focus ring */
.comune-hero--map a:focus-visible,
.comune-hero--map .ms-hero-btn:focus-visible {
  outline: 3px solid #ffd966;
  outline-offset: 3px;
}

/* Responsive: meta 2 colonne su mobile */
@media (max-width: 640px) {
  .comune-hero--map .comune-hero__meta {
    grid-template-columns: repeat(2, 1fr);
  }
  .comune-hero--map .comune-hero__content {
    padding: 1.2rem 1rem 1rem;
  }
}

/* 3 bottoni contatto rapido */
.ms-hero-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.ms-hero-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 700;
  font-size: .78rem;
  border: 1px solid transparent;
  transition: all .2s ease;
}
.ms-hero-btn:hover { transform: translateY(-1px); }
.ms-hero-btn i { font-size: .82rem; }
/* v27.2 Base buttons: unified minimalist grey */
.ms-btn-phone {
  background: rgba(255,255,255,.04);
  color: #e2e8f0;
  border-color: rgba(255,255,255,.1);
}
.ms-btn-phone i { color: #FFCC33 !important; }
.ms-btn-phone:hover { background: rgba(255,255,255,.08); border-color: rgba(255,204,51,.25); }
.ms-btn-pec {
  background: rgba(255,255,255,.04);
  color: #e2e8f0;
  border-color: rgba(255,255,255,.1);
}
.ms-btn-pec i { color: #FFCC33 !important; }
.ms-btn-pec:hover { background: rgba(255,255,255,.08); border-color: rgba(255,204,51,.25); }
.ms-btn-web {
  background: rgba(255,255,255,.04);
  color: #e2e8f0;
  border-color: rgba(255,255,255,.1);
}
.ms-btn-web i { color: #FFCC33 !important; }
.ms-btn-web:hover { background: rgba(255,255,255,.08); border-color: rgba(255,204,51,.25); }

@media (max-width: 640px) {
  .ms-hero-buttons { flex-direction: column; align-items: stretch; }
  .ms-hero-btn { justify-content: center; }
  .puglia-switch__label { display: none; }
  .comune-header__nav { display: none; }
}

/* Theme-aware logo swap nella main header */
.site-header__logo--dark { display: none; }

/* ============================================================
   Provincia accordion (dropdown con lista comuni inline)
   ============================================================ */
.prov-acc-group {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  max-width: 900px;
  margin: 0 auto;
}
.prov-acc {
  background: var(--ic-surface, #fff);
  border: 1px solid var(--ic-border, rgba(0,0,0,.1));
  border-radius: 14px;
  overflow: hidden;
  transition: box-shadow .2s ease, border-color .2s ease;
}
.prov-acc:hover { border-color: var(--ic-blue, #1e3a8a); }
.prov-acc[open] {
  box-shadow: 0 10px 30px rgba(10,22,40,.12);
  border-color: #f6b93b;
}
.prov-acc__summary {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 1.5rem;
  cursor: pointer;
  list-style: none;
  font-weight: 600;
  user-select: none;
  transition: background .15s ease;
}
.prov-acc__summary::-webkit-details-marker { display: none; }
.prov-acc__summary:hover { background: rgba(246,185,59,.08); }
.prov-acc__summary:focus-visible {
  outline: 3px solid #f6b93b;
  outline-offset: -3px;
}
.prov-acc__name {
  font-size: 1.25rem;
  color: var(--ic-text, #0a1f3d);
  flex: 1;
}
.prov-acc__count {
  font-size: .85rem;
  font-weight: 500;
  padding: .25rem .7rem;
  background: rgba(30,58,138,.1);
  color: var(--ic-blue, #1e3a8a);
  border-radius: 999px;
}
.prov-acc__chevron {
  width: 1.25rem;
  height: 1.25rem;
  color: var(--ic-text-muted, #64748b);
  transition: transform .25s ease;
  flex-shrink: 0;
}
.prov-acc[open] .prov-acc__chevron { transform: rotate(180deg); }

.prov-acc__body {
  border-top: 1px solid var(--ic-border, rgba(0,0,0,.08));
  padding: 1.25rem 1.5rem 1.5rem;
  background: rgba(246,185,59,.04);
}
.prov-acc__links {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: .5rem;
}
.prov-acc__link {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .5rem;
  padding: .6rem .85rem;
  background: var(--ic-surface, #fff);
  border: 1px solid var(--ic-border, rgba(0,0,0,.08));
  border-radius: 8px;
  text-decoration: none;
  color: var(--ic-text, #0a1f3d);
  font-size: .9rem;
  transition: all .15s ease;
}
.prov-acc__link:hover {
  background: var(--ic-blue, #1e3a8a);
  color: #fff;
  border-color: var(--ic-blue, #1e3a8a);
  transform: translateY(-1px);
}
.prov-acc__link-name { font-weight: 600; }
.prov-acc__link-cap {
  font-size: .7rem;
  font-family: var(--font-mono, monospace);
  opacity: .6;
}
.prov-acc__link:hover .prov-acc__link-cap { opacity: .9; }

/* Target: apre automaticamente la provincia quando si arriva via anchor #bari */
.prov-acc:target { border-color: #f6b93b; box-shadow: 0 10px 30px rgba(246,185,59,.25); }

@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .prov-acc { background: #0f1e34; border-color: rgba(255,255,255,.1); }
  :root:not(.force-light) .prov-acc__name { color: #fff; }
  :root:not(.force-light) .prov-acc__count { background: rgba(246,185,59,.2); color: #f6b93b; }
  :root:not(.force-light) .prov-acc__body { background: rgba(246,185,59,.06); border-top-color: rgba(255,255,255,.08); }
  :root:not(.force-light) .prov-acc__link { background: #102a43; border-color: rgba(255,255,255,.1); color: #fff; }
}

@media (max-width: 640px) {
  .prov-acc__summary { padding: .9rem 1rem; }
  .prov-acc__body { padding: 1rem; }
  .prov-acc__links { grid-template-columns: 1fr 1fr; }
  .prov-acc__name { font-size: 1.1rem; }
}

/* ============================================================
   HOME HERO — schema di riferimento (infocomuni_search)
   Gradiente blu + headline + search + pillole provincia
   ============================================================ */
.hero {
  background: linear-gradient(180deg,#1e4a8c 0%,#163a72 25%,#0e2a55 55%,#0a1f3d 80%,#020812 100%);
  color: #fff;
  padding: 64px 24px 64px;
  text-align: center;
  position: relative;
  /* overflow visible per non clippare i dropdown province (v20 fix) */
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
}
.hero--dark { padding: 34px 24px 30px; }
/* Banner province con mappa satellitare Puglia */
.hero--puglia-map {
  padding: 48px 24px 40px;
  min-height: 420px;
  overflow: hidden;
}
.hero-content--compact { max-width: 1200px; margin: 0 auto; }
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 15% 0%, rgba(184,134,11,.08) 0%, transparent 55%),
    radial-gradient(circle at 85% 100%, rgba(255,255,255,.03) 0%, transparent 50%);
  pointer-events: none;
}
/* Immagine satellitare notturna Puglia come sfondo del banner */
.hero__map-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('../img/hero-puglia-night.jpg') center 40% / cover no-repeat;
  background-color: #060e1e;
  filter: brightness(1.05) contrast(1.1);
}
/* Gradient overlay: sfuma bordi per integrazione con lo sfondo scuro */
.hero--puglia-map::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(to bottom, rgba(6,14,30,.6) 0%, transparent 25%, transparent 70%, rgba(6,14,30,.85) 100%),
    linear-gradient(to right, rgba(6,14,30,.5) 0%, transparent 15%, transparent 85%, rgba(6,14,30,.5) 100%);
  pointer-events: none;
}
/* Titolo PUGLIA in giallo bold centrato con ombra nera */
.hero__puglia-title {
  font-size: 3.5rem;
  font-weight: 900;
  letter-spacing: 0.3em;
  color: #FFCC33;
  text-shadow:
    0 2px 6px rgba(0,0,0,1),
    0 4px 20px rgba(0,0,0,.85),
    0 0 50px rgba(255,204,51,.15);
  text-align: center;
  margin: 0 auto 1.5rem;
  position: relative;
  z-index: 2;
  width: 100%;
  display: block;
}
.hero-puglia-bg--hidden { display: none; }
@media (max-width: 640px) {
  .hero--puglia-map { padding: 36px 16px 30px; min-height: 340px; }
  .hero__puglia-title { font-size: 2.2rem; letter-spacing: 0.15em; margin-bottom: 1rem; }
}
.hero-content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1100px;
}
.hero h1 {
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 900;
  letter-spacing: -1px;
  line-height: 1.1;
  margin: 0 0 16px;
  color: #fff;
}
.hero h1 span { color: #FFCC33; }
.hero-sub {
  font-size: clamp(1.1rem, 2.5vw, 1.55rem);
  font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
  font-style: italic;
  font-weight: 600;
  margin: 0 auto 32px;
  max-width: 600px;
  color: rgba(255,255,255,.92);
  position: relative;
  display: inline-block;
  padding: 0 4px 6px;
  border-bottom: 3px solid #FFCC33;
}

/* ----- Search box ----- */
.search-box {
  position: relative;
  max-width: 620px;
  margin: 0 auto 32px;
}
.search-box input {
  width: 100%;
  padding: 18px 56px 18px 28px;
  font-size: 1rem;
  border: 1.5px solid rgba(255,255,255,.25);
  border-radius: 55px;
  box-shadow: 0 8px 32px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
  font-family: inherit;
  outline: none;
  color: #fff;
  background: rgba(255,255,255,.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: all .3s ease;
}
.search-box input::placeholder { color: rgba(255,255,255,.5); }
.search-box input:focus {
  border-color: #FFCC33;
  background: rgba(255,255,255,.12);
  box-shadow: 0 8px 32px rgba(255,204,51,.25), inset 0 1px 0 rgba(255,255,255,.1);
}
.search-box .search-icon { color: rgba(255,255,255,.5); }
.search-box .search-icon {
  position: absolute;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  color: #64748b;
  font-size: 1.1rem;
  pointer-events: none;
}
.search-results-dd {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 20px 50px rgba(0,0,0,.35);
  max-height: 380px;
  overflow-y: auto;
  z-index: 30;
  text-align: left;
}
.search-results-dd[hidden] { display: none; }
.search-results-dd .sr-item {
  display: block;
  padding: .8rem 1.2rem;
  color: #0a1f3d;
  text-decoration: none;
  border-bottom: 1px solid rgba(0,0,0,.05);
  font-weight: 500;
}
.search-results-dd .sr-item:hover,
.search-results-dd .sr-item:focus {
  background: #f6f9ff;
  color: #1e3a8a;
}
.search-results-dd .sr-item strong { color: #1e3a8a; }
.search-results-dd .sr-item small {
  display: block;
  font-size: .75rem;
  color: #64748b;
  font-weight: 400;
  margin-top: 2px;
}
.search-results-dd .sr-empty {
  padding: 1.2rem;
  color: #64748b;
  text-align: center;
  font-size: .9rem;
}

/* ----- Province pills ----- */
.prov-pills {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  max-width: 820px;
  margin: 0 auto 24px;
}
.prov-pill-wrap {
  position: relative;
}
.prov-pill-wrap > summary.prov-pill {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: rgba(255,255,255,.08);
  border: 1.5px solid rgba(255,255,255,.18);
  color: #fff;
  padding: 0 14px;
  border-radius: 14px;
  font-size: .82rem;
  font-weight: 800;
  cursor: pointer;
  transition: all .3s cubic-bezier(.25,.46,.45,.94);
  letter-spacing: .6px;
  text-transform: uppercase;
  text-align: center;
  width: 100%;
  height: 56px;
  min-height: 56px;
  max-height: 56px;
  white-space: nowrap;
  box-shadow: 0 4px 16px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.prov-pill::-webkit-details-marker { display: none; }
.prov-pill small {
  font-size: .7rem;
  opacity: .75;
  font-weight: 700;
  text-transform: none;
}
.prov-pill__chev {
  width: .9rem;
  height: .9rem;
  transition: transform .2s ease;
}
.prov-pill-wrap[open] > summary.prov-pill,
.prov-pill-wrap > summary.prov-pill:hover {
  background: linear-gradient(135deg, #FFCC33, #d4a017);
  color: #1a1205;
  border-color: rgba(255,204,51,.6);
  box-shadow: 0 8px 28px rgba(255,204,51,.35), 0 0 0 1px rgba(255,204,51,.2);
  transform: translateY(-3px);
}
.prov-pill-wrap[open] > summary.prov-pill .prov-pill__chev {
  transform: rotate(180deg);
}

/* Dropdown panel */
.prov-pill-wrap .prov-dd {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 280px;
  max-width: 360px;
  max-height: 440px;
  overflow-y: auto;
  background: rgba(10,20,42,.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  color: #e2e8f0;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 24px 60px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.05);
  padding: 14px;
  z-index: 40;
  text-align: left;
}
.prov-pill-wrap[open] .prov-dd {
  animation: prov-dd-in .18s ease-out;
}
@keyframes prov-dd-in {
  from { opacity: 0; transform: translate(-50%, -6px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}
.prov-dd-cap {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  background: linear-gradient(135deg, #FFCC33 0%, #ffd966 100%);
  border-radius: 12px;
  text-decoration: none;
  color: #0a1f3d !important;
  margin-bottom: 8px;
  transition: transform .18s ease, box-shadow .18s ease;
  border: none;
  cursor: pointer;
  position: relative;
}
.prov-dd-cap::after {
  content: '\f054';
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
  font-size: .7rem;
  color: #0a1f3d;
  opacity: .45;
  margin-left: auto;
  flex-shrink: 0;
  transition: transform .2s ease, opacity .2s ease;
}
.prov-dd-cap:hover::after {
  transform: translateX(3px);
  opacity: .8;
}
.prov-dd-cap * { color: #0a1f3d !important; }
.prov-dd-cap .prov-dd-cap-label {
  color: #0a1f3d !important;
  opacity: 0.85;
  font-weight: 700;
}
.prov-dd-cap:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(255,204,51,.45);
}
.prov-dd-cap + .prov-dd-cap { margin-top: 0; }
.prov-dd-cap-icon {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: rgba(10,31,61,.12);
  color: #0a1f3d !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .95rem;
  flex-shrink: 0;
}
.prov-dd-cap-name {
  font-weight: 800;
  font-size: .95rem;
}
.prov-dd-cap-label {
  font-size: .68rem;
  opacity: .7;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.prov-dd-sep {
  height: 1px;
  background: rgba(255,255,255,.1);
  margin: 10px 2px;
}
.prov-dd-title {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: #FFCC33;
  margin: 6px 4px 8px;
  font-weight: 700;
}
.prov-dd-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
}
.prov-dd-item {
  display: block;
  padding: .55rem .7rem;
  background: transparent;
  border: 0;
  border-radius: 8px;
  text-align: left;
  font: inherit;
  font-size: .82rem;
  color: #cbd5e1;
  text-decoration: none;
  cursor: pointer;
  transition: all .2s ease;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.prov-dd-item:hover,
.prov-dd-item:focus-visible {
  background: rgba(255,204,51,.1);
  color: #FFCC33;
  outline: none;
}

/* ----- Hero stats ----- */
.hero-stats {
  display: flex;
  gap: 8px 20px;
  justify-content: center;
  font-size: .8rem;
  opacity: .9;
  flex-wrap: wrap;
  margin-top: 24px;
  color: rgba(255,255,255,.75);
}
.hero-stats span {
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  background: rgba(255,255,255,.06);
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.08);
}
.hero-stats i { color: #FFCC33; }

/* ----- Responsive ----- */
@media (max-width: 900px) {
  .prov-pills { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 560px) {
  .hero { padding: 44px 16px 40px; }
  .prov-pills { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .prov-pill-wrap .prov-dd {
    position: fixed;
    left: 16px;
    right: 16px;
    top: auto;
    bottom: 16px;
    transform: none;
    max-width: none;
    max-height: 70vh;
  }
  .prov-pill-wrap[open] .prov-dd {
    animation: none;
  }
  .search-box input { padding: 14px 50px 14px 22px; font-size: .95rem; }
  .hero-stats { gap: 12px; font-size: .75rem; }
}

/* Dark-mode: il hero è già scuro, nulla da forzare */

/* ============================================================
   HOME v3 — Eventi + Calendario + Meteo
   ============================================================ */
.home-sec-head { text-align: center; margin-bottom: 28px; }
.home-sec-head h2 {
  font-size: 1.9rem; font-weight: 800; color: var(--ic-text-1);
  margin: 0 0 6px; letter-spacing: -.01em;
}
.home-sec-head p { color: var(--ic-text-3); margin: 0; font-size: .98rem; }

.home-events { background: var(--ic-surface); }
.home-events-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 28px;
  align-items: start;
}
@media (max-width: 860px) { .home-events-grid { grid-template-columns: 1fr; } }

/* lista eventi */
.home-events-list {
  background: var(--ic-bg);
  border: 1px solid var(--ic-border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.home-events-list__head {
  display: flex; align-items: center; gap: 8px;
  padding: 14px 18px;
  background: var(--ic-surface);
  border-bottom: 1px solid var(--ic-border);
  font-weight: 700; font-size: .8rem; text-transform: uppercase;
  color: var(--ic-text-2); letter-spacing: .6px;
}
.home-events-items {
  max-height: 540px; overflow-y: auto;
}
.home-ev-item {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--ic-border);
  text-decoration: none;
  color: inherit;
  transition: background .15s;
}
.home-ev-item:hover { background: var(--ic-surface); }
.home-ev-item:last-child { border-bottom: 0; }
.home-ev-date {
  text-align: center;
  border-right: 1px solid var(--ic-border);
  padding-right: 12px;
  line-height: 1;
}
.home-ev-date strong {
  display: block; font-size: 1.6rem; font-weight: 800;
  color: #d4a017;
}
.home-ev-date span {
  display: block; margin-top: 4px;
  font-size: .68rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
  color: var(--ic-text-3);
}
.home-ev-type {
  display: inline-block; padding: 2px 8px; border-radius: 10px;
  background: rgba(212,160,23,.12); color: #8a6a0e;
  font-size: .65rem; font-weight: 800; text-transform: uppercase;
  letter-spacing: .5px; margin-bottom: 4px;
}
.home-ev-name { font-weight: 700; font-size: .95rem; color: var(--ic-text-1); margin-bottom: 3px; }
.home-ev-comune { font-size: .8rem; color: var(--ic-text-3); }
.home-ev-empty { padding: 24px; text-align: center; color: var(--ic-text-3); }

/* mini calendario */
.home-calendar {
  background: var(--ic-bg);
  border: 1px solid var(--ic-border);
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.home-calendar__head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px;
}
.home-calendar__nav {
  background: var(--ic-surface);
  border: 1px solid var(--ic-border);
  width: 32px; height: 32px; border-radius: 8px;
  font-size: 1.1rem; cursor: pointer; color: var(--ic-text-2);
}
.home-calendar__nav:hover { background: #d4a017; color: #1a1205; border-color: #b8860b; }
.home-calendar__title {
  font-weight: 800; font-size: 1rem; color: var(--ic-text-1);
  text-transform: capitalize;
}
.home-calendar__grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px;
}
.cal-wd {
  text-align: center; font-size: .7rem; font-weight: 800;
  color: var(--ic-text-3); padding: 6px 0;
  text-transform: uppercase; letter-spacing: .5px;
}
.cal-day {
  aspect-ratio: 1;
  display: flex; align-items: center; justify-content: center;
  position: relative;
  border-radius: 8px;
  font-size: .85rem; font-weight: 600;
  color: var(--ic-text-1);
  background: var(--ic-surface);
}
.cal-day--empty { background: transparent; }
.cal-day--today {
  background: #1a1205; color: #d4a017; font-weight: 800;
}
.cal-day--has { color: #8a6a0e; font-weight: 800; }
.cal-dot {
  position: absolute; bottom: 4px; left: 50%;
  transform: translateX(-50%);
  width: 5px; height: 5px; border-radius: 50%;
  background: #d4a017;
}
.home-calendar__hint { margin: 14px 0 0; text-align: center; font-size: .85rem; }
.home-calendar__hint a { color: #8a6a0e; font-weight: 700; text-decoration: none; }
.home-calendar__hint a:hover { text-decoration: underline; }

/* meteo - vedi regola completa più sotto */

/* dark mode adjustments */
@media (prefers-color-scheme: dark) {
  .home-ev-date strong { color: #e0b93a; }
  .home-ev-type { background: rgba(224,185,58,.15); color: #e0b93a; }
  .cal-day--today { background: #3a2a08; color: #e0b93a; }
  .cal-day--has { color: #e0b93a; }
  .cal-dot { background: #e0b93a; }
  .home-calendar__hint a { color: #e0b93a; }
}

/* ============================================================
   HOME v4 — Experience Puglia (eventi) + Meteo tabella + Footer 4 col
   ============================================================ */

/* Hero dark: riduci gap fra pills e sezione sotto */
.hero--dark { padding: 34px 24px 48px; }

/* ---- EXP HEAD ---- */
.home-exp { background: var(--ic-bg); padding-top: 48px; padding-bottom: 48px; }
.exp-head { text-align: center; margin-bottom: 20px; }
.exp-head h2 {
  font-size: 1.8rem; font-weight: 800; color: var(--ic-text-1);
  margin: 0; letter-spacing: -.01em;
}

/* ---- FILTRI ---- */
.exp-filters {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 8px;
  margin-bottom: 24px;
}
.exp-filter {
  background: var(--ic-surface);
  border: 1px solid var(--ic-border);
  color: var(--ic-text-2);
  padding: 8px 18px;
  border-radius: 999px;
  font-size: .78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
  cursor: pointer;
  transition: all .2s;
}
.exp-filter:hover { background: #fff; border-color: #b8860b; color: #b8860b; }
.exp-filter.is-active {
  background: #5b5ef0;
  border-color: #5b5ef0;
  color: #fff;
}

/* ---- GRID 3 col ---- */
.exp-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 18px;
  align-items: stretch;
}
@media (max-width: 1024px) { .exp-grid { grid-template-columns: 1fr 1fr; } .exp-map-col { grid-column: 1/-1; } }
@media (max-width: 680px)  { .exp-grid { grid-template-columns: 1fr; } .exp-map-col { grid-column: auto; } }

.exp-col {
  background: var(--ic-bg);
  border: 1px solid var(--ic-border);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
  display: flex; flex-direction: column;
  min-height: 420px;
}
.exp-col__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  background: var(--ic-surface);
  border-bottom: 1px solid var(--ic-border);
}
.exp-col__title {
  font-size: .72rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: .6px;
  color: var(--ic-text-2);
  display: flex; align-items: center; gap: 8px;
}
.exp-col__nav { display: flex; gap: 4px; }
.exp-nav {
  background: var(--ic-bg); border: 1px solid var(--ic-border);
  width: 26px; height: 26px; border-radius: 6px; cursor: pointer;
  color: var(--ic-text-2); font-size: .9rem;
}
.exp-nav:hover { background: #FFCC33; border-color: #b8860b; color: #0a1f3d; }

/* ---- LISTA EVENTI ---- */
.exp-list { flex: 1; overflow-y: auto; }
.exp-item {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--ic-border);
  text-decoration: none; color: inherit;
  transition: background .15s;
}
.exp-item:hover { background: var(--ic-surface); }
.exp-item:last-child { border-bottom: 0; }
.exp-item__date {
  text-align: center;
  border-right: 1px solid var(--ic-border);
  padding-right: 10px; line-height: 1;
}
.exp-item__date strong {
  display: block; font-size: 1.7rem; font-weight: 800;
  color: var(--ic-text-1);
}
.exp-item__date span {
  display: block; margin-top: 4px;
  font-size: .68rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
  color: var(--ic-text-3);
}
.exp-item__tag {
  display: inline-block;
  padding: 3px 9px; border-radius: 10px;
  font-size: .62rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: .5px;
  margin-bottom: 6px;
}
.exp-item__name {
  font-weight: 700; font-size: .92rem;
  color: var(--ic-text-1); margin-bottom: 4px;
  line-height: 1.3;
}
.exp-item__loc {
  font-size: .78rem; color: var(--ic-text-3);
  display: flex; align-items: center; gap: 6px;
}
.exp-item__prov {
  background: var(--ic-surface);
  border: 1px solid var(--ic-border);
  padding: 1px 6px; border-radius: 6px;
  font-size: .65rem; font-weight: 800;
  color: var(--ic-text-2);
  margin-left: 4px;
}
.exp-empty { padding: 24px; text-align: center; color: var(--ic-text-3); }

/* ---- CALENDARIO ---- */
.exp-cal-col { padding: 0; }
.exp-year-tabs {
  display: flex; justify-content: center; gap: 0;
  padding: 12px 16px;
  background: var(--ic-surface);
  border-bottom: 1px solid var(--ic-border);
}
.exp-year {
  background: var(--ic-bg);
  border: 1px solid var(--ic-border);
  color: var(--ic-text-2);
  padding: 6px 20px;
  font-size: .82rem; font-weight: 700;
  cursor: pointer;
}
.exp-year:first-child { border-radius: 8px 0 0 8px; }
.exp-year:last-child { border-radius: 0 8px 8px 0; border-left: 0; }
.exp-year.is-active { background: #FFCC33; color: #0a1f3d; border-color: #b8860b; }

.exp-cal { padding: 16px; flex: 1; display: flex; flex-direction: column; }
.exp-cal__head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 10px;
}
.exp-cal__nav {
  background: var(--ic-surface);
  border: 1px solid var(--ic-border);
  width: 28px; height: 28px; border-radius: 6px;
  cursor: pointer; color: var(--ic-text-2);
  font-size: 1rem;
}
.exp-cal__nav:hover { background: #FFCC33; border-color: #b8860b; color: #0a1f3d; }
.exp-cal__title {
  font-weight: 800; font-size: .95rem;
  color: var(--ic-text-1);
  text-transform: capitalize;
}
.exp-cal__grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px;
  flex: 1;
}
.cal-wd {
  text-align: center; font-size: .66rem; font-weight: 800;
  color: var(--ic-text-3); padding: 4px 0;
}
.cal-day {
  aspect-ratio: 1;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 2px;
  border-radius: 6px;
  font-size: .78rem; font-weight: 600;
  color: var(--ic-text-1);
  background: transparent;
  position: relative;
}
.cal-day--empty { background: transparent; }
.cal-day--today {
  background: #5b5ef0; color: #fff; font-weight: 800;
}
.cal-day--has { font-weight: 800; }
.cal-dots {
  display: flex; gap: 2px; align-items: center;
  margin-top: 1px;
}
.ev-dot {
  display: inline-block;
  width: 5px; height: 5px; border-radius: 50%;
  background: #64748b;
}
.ev-dot--festival { background: #8b5cf6; }
.ev-dot--processione { background: #d4a017; }
.ev-dot--festa { background: #ef4444; }
.ev-dot--fiera { background: #06b6d4; }

.exp-cal__legend {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 12px; margin-top: 12px;
  font-size: .7rem; color: var(--ic-text-3);
}
.exp-cal__legend span { display: flex; align-items: center; gap: 5px; }

/* ---- MAPPA ---- */
.exp-map-col { padding: 0; display: flex; flex-direction: column; }
.exp-map-col .exp-col__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  gap: 8px;
}
.exp-geo-btn {
  background: #1e3a8a;
  color: #fff;
  border: none;
  border-radius: 8px;
  width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: .9rem;
  transition: background .15s, transform .15s;
}
.exp-geo-btn:hover { background: #2543a8; transform: scale(1.05); }
.exp-geo-btn:focus-visible { outline: 3px solid #f6b93b; outline-offset: 2px; }
.exp-geo-btn.is-loading {
  animation: pulse-loading 1s ease-in-out infinite;
}
@keyframes pulse-loading {
  0%, 100% { opacity: 1; }
  50% { opacity: .55; }
}
.exp-map {
  flex: 1;
  min-height: 380px;
  background: #e8f0f7;
  position: relative;
  overflow: hidden;
}
.exp-map .leaflet-container {
  background: #aad3df;
  height: 100%;
  width: 100%;
  font-family: inherit;
}
.exp-map .leaflet-control-zoom a {
  background: #fff;
  color: #0a1f3d;
  border: 1px solid rgba(10,22,40,.15);
}
.exp-map .leaflet-control-zoom a:hover { background: #f6b93b; color: #0a1f3d; }
.exp-map .leaflet-popup-content-wrapper {
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(0,0,0,.2);
}
.exp-map .leaflet-popup-content {
  margin: 12px 14px;
  font-size: .88rem;
  line-height: 1.45;
}
.exp-map .leaflet-popup-content strong { color: #1e3a8a; font-size: .95rem; }
.exp-map .leaflet-popup-content a {
  color: #f6b93b;
  font-weight: 700;
  text-decoration: none;
  display: inline-block;
  margin-top: 6px;
}
.exp-map .leaflet-popup-content a:hover { text-decoration: underline; }
.exp-map__cta {
  padding: 12px 14px;
  background: #FFCC33;
  border-top: 1px solid #b8860b;
}
.exp-map__btn {
  display: flex; align-items: center; justify-content: center;
  gap: 8px;
  color: #0a1f3d;
  text-decoration: none;
  font-weight: 800; font-size: .82rem;
  text-transform: uppercase; letter-spacing: .4px;
}
.exp-map__btn:hover { text-decoration: underline; }

/* ---- STATS ---- */
.exp-stats {
  display: flex; justify-content: center; gap: 48px;
  margin-top: 28px;
}
.exp-stats div {
  text-align: center;
}
.exp-stats strong {
  display: block;
  font-size: 1.9rem; font-weight: 800;
  color: #FFCC33;
  line-height: 1;
}
.exp-stats span {
  display: block;
  font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .6px;
  color: var(--ic-text-3);
  margin-top: 4px;
}

/* ============================================================
   METEO — tabella 6 province x 7 giorni
   ============================================================ */
.home-meteo {
  background: linear-gradient(180deg,#0e2a55 0%,#0a1f3d 35%,#06152b 70%,#020812 100%) !important;
  padding: 56px 0 72px;
  position: relative;
}
.home-meteo::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(124,179,255,.10),transparent 60%);
  pointer-events:none;
}
.home-meteo .container{position:relative;z-index:1}
.home-meteo .meteo-head h2{color:#fff}
.home-meteo .meteo-head h2 i{color:#FFCC33;margin-right:8px}
.home-meteo .meteo-source{color:#94a3b8;font-size:12px}
.home-meteo .meteo-source a{color:#7cb3ff}
.home-meteo .weather-pv-table{background:rgba(255,255,255,.03);border:1px solid rgba(124,179,255,.16);border-radius:14px;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.45)}
.home-meteo .wpv-row{border-bottom:1px solid rgba(124,179,255,.10)}
.home-meteo .wpv-col__head{background:rgba(255,255,255,.05);color:#fff;border-bottom:2px solid rgba(255,204,51,.45)}
.home-meteo .wpv-cell{color:#cbd5e1}
.home-meteo .wpv-cell--day{color:#fff;font-weight:700}
.home-meteo .wpv-row--today{background:rgba(255,204,51,.10)}
.home-meteo .wpv-row--today .wpv-cell--day{color:#FFCC33}
.meteo-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 20px; flex-wrap: wrap; gap: 12px;
}
.meteo-head h2 {
  font-size: 1.4rem; font-weight: 800; margin: 0;
  color: var(--ic-text-1);
  display: flex; align-items: center; gap: 10px;
}
.meteo-head h2 i { color: #FFCC33; }
.meteo-source {
  font-size: .78rem; color: var(--ic-text-3);
}
.meteo-source a { color: #5b5ef0; }

.weather-pv-table {
  background: var(--ic-bg);
  border: 1px solid var(--ic-border);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.wpv-cols {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
}
.wpv-col {
  border-right: 1px solid var(--ic-border);
}
.wpv-col:last-child { border-right: 0; }
.wpv-col__head {
  background: #0a1f3d;
  color: #fff;
  text-align: center;
  padding: 12px 8px;
  font-size: .85rem;
  font-weight: 800;
  letter-spacing: .8px;
  border-bottom: 2px solid #b8860b;
}
.wpv-col__body {}
.wpv-row {
  display: grid;
  grid-template-columns: 48px 36px 1fr 1fr;
  align-items: center;
  padding: 10px 12px;
  gap: 6px;
  border-bottom: 1px solid var(--ic-border);
  font-size: .82rem;
}
.wpv-row:last-child { border-bottom: 0; }
.wpv-row--today {
  background: rgba(255,204,51,.12);
}
.wpv-row--today .wpv-day { color: #b8860b; }
.wpv-day {
  font-weight: 800;
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--ic-text-3);
}
.wpv-ico { font-size: 1.1rem; text-align: center; }
.wpv-max {
  text-align: right;
  font-weight: 800;
  color: var(--ic-text-1);
}
.wpv-min {
  text-align: right;
  font-weight: 600;
  color: var(--ic-text-3);
}

@media (max-width: 1024px) {
  .wpv-cols { grid-template-columns: repeat(3, 1fr); }
  .wpv-col:nth-child(3) { border-right: 0; }
}
@media (max-width: 680px) {
  .wpv-cols { grid-template-columns: repeat(2, 1fr); }
  .wpv-col:nth-child(2) { border-right: 0; }
  .wpv-col:nth-child(3), .wpv-col:nth-child(5) { border-right: 1px solid var(--ic-border); }
  .wpv-row { grid-template-columns: 40px 28px 1fr 1fr; padding: 8px 10px; font-size: .75rem; }
}

/* Mobile: hide inline meteo on homepage, show via overlay */
@media (max-width: 899px) {
  .home-meteo { display: none !important; }
}

/* ================================================================
   METEO OVERLAY - Fullscreen mobile-friendly weather panel
   Triggered by bottom nav Meteo button. Slides up from bottom.
   ================================================================ */
.meteo-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  background: #06152b;
  color: #f1f5f9;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transform: translateY(100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  will-change: transform;
  padding-bottom: calc(var(--bottom-nav-h, 60px) + env(safe-area-inset-bottom) + 16px);
}
.meteo-overlay.is-open {
  transform: translateY(0);
}
.meteo-overlay__header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: linear-gradient(180deg, #0a1f3d 0%, rgba(10,31,61,.95) 100%);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(124,179,255,.15);
}
.meteo-overlay__title {
  font-size: 1.15rem;
  font-weight: 800;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 8px;
}
.meteo-overlay__title i { color: #FFCC33; }
.meteo-overlay__close {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.06);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .18s;
}
.meteo-overlay__close:hover {
  background: rgba(255,204,51,.15);
  border-color: #FFCC33;
  color: #FFCC33;
}
.meteo-overlay__body {
  padding: 16px;
}
.meteo-overlay__source {
  text-align: center;
  padding: 12px 16px;
  font-size: 11px;
  color: #94a3b8;
}
.meteo-overlay__source a { color: #7cb3ff; }

/* Mobile meteo: single-column stacked cards per province */
.meteo-mobile-grid {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.meteo-prov-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(124,179,255,.14);
  border-radius: 14px;
  overflow: hidden;
}
.meteo-prov-card__head {
  background: rgba(255,255,255,.06);
  color: #fff;
  text-align: center;
  padding: 10px 14px;
  font-size: .9rem;
  font-weight: 800;
  letter-spacing: .6px;
  border-bottom: 2px solid rgba(255,204,51,.4);
  text-transform: uppercase;
}
.meteo-prov-card__days {
  display: flex;
  flex-direction: column;
}
.meteo-prov-row {
  display: grid;
  grid-template-columns: 52px 32px 1fr 1fr;
  align-items: center;
  padding: 12px 16px;
  gap: 8px;
  border-bottom: 1px solid rgba(124,179,255,.08);
  font-size: .88rem;
}
.meteo-prov-row:last-child { border-bottom: 0; }
.meteo-prov-row--today {
  background: rgba(255,204,51,.1);
}
.meteo-prov-row__day {
  font-weight: 800;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: rgba(255,255,255,.6);
}
.meteo-prov-row--today .meteo-prov-row__day { color: #FFCC33; }
.meteo-prov-row__ico { font-size: 1.2rem; text-align: center; }
.meteo-prov-row__max {
  text-align: right;
  font-weight: 800;
  color: #fff;
  font-size: .95rem;
}
.meteo-prov-row__min {
  text-align: right;
  font-weight: 600;
  color: rgba(255,255,255,.55);
  font-size: .88rem;
}

/* Desktop: hide overlay (meteo stays inline) */
@media (min-width: 900px) {
  .meteo-overlay { display: none !important; }
}

/* ============================================================
   FOOTER 4 colonne
   ============================================================ */
/* ---------- Footer grid: 3 colonne simmetriche ---------- */
.site-footer__grid--4 {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 28px;
  padding: 32px 0 24px;
  align-items: start;
}
.site-footer__grid--4 > .sf-col {
  display: flex;
  flex-direction: column;
}
@media (max-width: 768px) {
  .site-footer__grid--4 { grid-template-columns: 1fr 1fr; gap: 20px; }
}
@media (max-width: 520px) {
  .site-footer__grid--4 { grid-template-columns: 1fr; gap: 16px; padding: 24px 0 16px; }
}

/* ---------- Intestazioni colonne: tutte uguali ---------- */
.sf-col h4 {
  font-size: .7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: #FFCC33;
  margin: 0 0 10px;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(255,204,51,.1);
  line-height: 1.3;
}
.sf-col--brand h4 {
  color: #fff;
  font-size: .95rem;
  letter-spacing: -.01em;
  text-transform: none;
  border-bottom: 1px solid rgba(255,204,51,.1);
  padding-bottom: 7px;
  margin-bottom: 10px;
}

/* ---------- Col 1: brand ---------- */
.sf-net {
  font-size: .72rem; font-weight: 700; color: #FFCC33;
  margin: 0 0 6px;
  letter-spacing: .2px;
}
.sf-desc {
  font-size: .72rem; color: rgba(203,213,225,.65); line-height: 1.45; margin: 0 0 8px;
}
.sf-meta { list-style: none; padding: 0; margin: 0; }
.sf-meta li {
  font-size: .7rem; color: #94a3b8;
  display: flex; align-items: center; gap: 5px;
  margin-bottom: 3px;
  line-height: 1.3;
}
.sf-meta li i { color: #FFCC33; font-size: .6rem; }
.sf-meta a { color: #cbd5e1; text-decoration: none; }
.sf-meta a:hover { color: #FFCC33; }

/* ---------- Link lists ---------- */
.sf-links { list-style: none; padding: 0; margin: 0; }
.sf-links li { margin-bottom: 4px; }
.sf-links a {
  color: rgba(203,213,225,.75);
  text-decoration: none;
  font-size: .74rem;
  line-height: 1.3;
  transition: color .15s;
}
.sf-links a:hover { color: #FFCC33; }
.sf-links a i { margin-right: 3px; font-size: .6rem; opacity: .5; }

/* ---------- CTA block inline nella col brand ---------- */
.sf-cta-block {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,204,51,.1);
}
.sf-cta-label {
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: #FFCC33;
  margin: 0 0 8px;
}
.sf-cta-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 18px;
  border: none;
  background: linear-gradient(135deg,#FFCC33 0%,#f4b400 100%);
  color: #0a1f3d;
  border-radius: 999px;
  font-size: .74rem; font-weight: 800;
  text-decoration: none;
  transition: all .2s;
  box-shadow: 0 4px 14px rgba(255,204,51,.2);
  margin-top: auto;
}
.sf-cta-btn:hover {
  background: #fff; color: #06152b;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(255,204,51,.35);
}

/* ---------- Bottom bar ---------- */
.site-footer__bottom {
  border-top: 1px solid rgba(124,179,255,.1);
  padding: 12px 0;
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 8px;
}
.site-footer__bottom p { margin: 0; font-size: .76rem; color: #94a3b8; }
.sf-social { display: flex; gap: 14px; }
.sf-social a {
  color: #94a3b8;
  font-size: 1.1rem;
  transition: color .15s;
}
.sf-social a:hover { color: #FFCC33; }

/* ============================================================
   SCUOLE — gruppi per grado + griglia a card
   ============================================================ */
.scuole-section .scuole-gruppo { margin-top: 1.75rem; }
.scuole-section .scuole-gruppo:first-of-type { margin-top: .5rem; }
.scuole-gruppo__titolo {
  display: flex; align-items: center; gap: .5rem;
  font-size: 1.05rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #1e3a8a;
  border-bottom: 2px solid #f6b93b;
  padding-bottom: .4rem;
  margin-bottom: .9rem;
  font-weight: 700;
}
.scuole-gruppo__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  height: 1.6rem;
  padding: 0 .5rem;
  font-size: .75rem;
  font-weight: 700;
  background: #1e3a8a;
  color: #fff;
  border-radius: 999px;
  margin-left: auto;
}
.scuole-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: .85rem;
}
.scuola-card {
  background: var(--ic-surface, #fff);
  border: 1px solid rgba(10,22,40,.1);
  border-radius: 12px;
  padding: .9rem 1rem;
  box-shadow: 0 2px 6px rgba(10,22,40,.04);
  transition: border-color .15s, box-shadow .15s, transform .15s;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.scuola-card:hover {
  border-color: #f6b93b;
  box-shadow: 0 6px 18px rgba(10,22,40,.08);
  transform: translateY(-1px);
}
.scuola-card__head {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
}
.scuola-card__icon {
  font-size: 1.4rem;
  line-height: 1;
  flex-shrink: 0;
}
.scuola-card__title-wrap { flex: 1; min-width: 0; }
.scuola-card__title {
  font-weight: 700;
  color: #0a1f3d;
  line-height: 1.25;
  font-size: .95rem;
}
.scuola-card__tipo {
  font-size: .78rem;
  color: #64748b;
  margin-top: .15rem;
}
.scuola-card__badge {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  background: rgba(246,185,59,.18);
  color: #8a6a0e;
  border: 1px solid rgba(246,185,59,.5);
  border-radius: 999px;
  padding: .2rem .55rem;
  white-space: nowrap;
  align-self: flex-start;
}
.scuola-card__body {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding-left: 2.05rem;
}
.scuola-card__body .item-meta {
  font-size: .8rem;
  color: #475569;
  margin: 0;
}
.scuola-card__body .item-meta a { color: #1e3a8a; text-decoration: none; }
.scuola-card__body .item-meta a:hover { text-decoration: underline; }
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuole-gruppo__titolo { color: #f6b93b; border-bottom-color: #f6b93b; }
  :root:not(.force-light) .scuole-gruppo__count { background: #f6b93b; color: #1a1205; }
  :root:not(.force-light) .scuola-card {
    background: #0f1e34;
    border-color: rgba(255,255,255,.1);
    box-shadow: 0 2px 8px rgba(0,0,0,.3);
  }
  :root:not(.force-light) .scuola-card:hover { border-color: #f6b93b; }
  :root:not(.force-light) .scuola-card__title { color: #fff; }
  :root:not(.force-light) .scuola-card__tipo { color: #94a3b8; }
  :root:not(.force-light) .scuola-card__body .item-meta { color: #cbd5e1; }
  :root:not(.force-light) .scuola-card__body .item-meta a { color: #ffd966; }
}
@media (max-width: 520px) {
  .scuole-grid { grid-template-columns: 1fr; }
  .scuola-card__body { padding-left: 0; }
}

/* Dark mode tweaks */
@media (prefers-color-scheme: dark) {
  .exp-filter.is-active { background: #7c7fff; border-color: #7c7fff; }
  .cal-day--today { background: #7c7fff; }
  .wpv-col__head { background: #000; border-bottom-color: #d4a017; }
  .wpv-row--today { background: rgba(255,204,51,.08); }
  .exp-map__cta { background: #d4a017; border-top-color: #8a6a0e; }
  .meteo-source a { color: #9ea1ff; }
}

/* ============================================================
   CAL-STRIP - Event Calendar v4 curated (ported from pubblicazione)
   Three columns: Carousel | Calendar | Map
   ============================================================ */
.cal-strip{background:linear-gradient(180deg, #060e1e 0%, #0a1f3d 8%, #0a1f3d 100%);padding:44px 32px 36px;position:relative;overflow:hidden;color:#fff}
.cal-strip::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at top center,rgba(255,204,51,.08),transparent 55%);pointer-events:none}
.cal-inner{max-width:1280px;margin:0 auto;position:relative;z-index:1}
.cal-top{display:flex;flex-direction:column;align-items:center;margin-bottom:18px;gap:10px}
.cal-top-left h2{font-size:26px;font-weight:800;color:#fff;letter-spacing:-.4px;margin:0;text-align:center}
.cal-top-left h2 i{color:#FFCC33;margin-right:8px;font-size:20px}

.cal-tabs{display:flex;gap:6px;margin-bottom:18px;flex-wrap:wrap;justify-content:center}
.cal-tab{padding:6px 14px;border-radius:20px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04);color:rgba(255,255,255,.7);font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;font-family:inherit;text-transform:uppercase;letter-spacing:.3px}
.cal-tab:hover{background:rgba(255,255,255,.08);color:#fff}
.cal-tab.active{background:rgba(255,204,51,.14);border-color:rgba(255,204,51,.4);color:#FFCC33}

.cal-year-toggle{display:flex;gap:4px;justify-content:center}
.cal-year-btn{padding:6px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04);color:rgba(255,255,255,.7);font-size:12px;font-weight:700;cursor:pointer;transition:all .2s;font-family:inherit}
.cal-year-btn:hover{background:rgba(255,255,255,.08);color:#fff}
.cal-year-btn.active{background:rgba(255,204,51,.14);border-color:rgba(255,204,51,.4);color:#FFCC33}

.cal-nav{display:flex;gap:5px;align-items:center}
.cal-nav-btn{width:36px;height:36px;border-radius:8px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);color:rgba(255,255,255,.75);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:all .2s}
.cal-nav-btn:hover{background:rgba(255,255,255,.12);color:#fff}
.cal-month-label{color:#fff;font-size:15px;font-weight:800;padding:0 10px;min-width:140px;text-align:center;text-transform:capitalize}

/* THREE COLUMN GRID */
.cal-trio{display:grid;grid-template-columns:1fr 360px 1fr;gap:18px;height:440px}

/* COL 1: Carousel */
.cal-col-events{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.cal-col-header{padding:12px 16px;color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.cal-col-header i{margin-right:6px;font-size:12px;color:#FFCC33}
.cal-arr-group{display:flex;gap:5px}
.cal-arr{width:30px;height:30px;border-radius:7px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:rgba(255,255,255,.7);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:11px;transition:all .15s}
.cal-arr:hover{background:rgba(255,255,255,.1);color:#fff}
.cal-events-scroll{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}
.cal-events-scroll::-webkit-scrollbar{width:4px}
.cal-events-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:3px}

/* Event card */
.cal-ev{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:12px 14px;cursor:pointer;transition:all .22s;position:relative;display:flex;gap:12px;align-items:flex-start;border-left:3px solid transparent}
.cal-ev:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);transform:translateX(2px)}
.cal-ev.spotlight{background:rgba(255,204,51,.08);border-color:rgba(255,204,51,.3);border-left-color:#FFCC33}
.cal-ev.past{opacity:.45}.cal-ev.past:hover{opacity:.65}
.cal-ev-day{min-width:44px;text-align:center;flex-shrink:0}
.cal-ev-daynum{font-size:24px;font-weight:800;color:#fff;line-height:1}
.cal-ev.past .cal-ev-daynum{color:rgba(255,255,255,.55)}
.cal-ev-daym{font-size:9px;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.4px;font-weight:700;margin-top:2px}
.cal-ev-body{flex:1;min-width:0}
.cal-ev-tipo{display:inline-block;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;padding:2px 7px;border-radius:5px;margin-bottom:5px}
.cal-ev-body h4{font-size:13px;font-weight:700;color:#fff;margin:0 0 3px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-ev.past h4{color:rgba(255,255,255,.6)}
.cal-ev-desc{font-size:10px;color:rgba(255,255,255,.6);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 5px}
.cal-ev-loc{font-size:10px;color:rgba(255,255,255,.65);display:flex;align-items:center;gap:4px}
.cal-ev-loc i{color:#FFCC33;font-size:9px}
.cal-ev-prov{background:rgba(255,255,255,.08);padding:1px 6px;border-radius:4px;font-size:9px;font-weight:800;color:#fff;margin-left:3px;letter-spacing:.3px}
.cal-empty{text-align:center;padding:40px 16px;color:rgba(255,255,255,.5);font-size:12px;margin:auto;font-weight:500}

/* COL 2: Calendar grid */
.cal-col-cal{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.cal-col-cal-nav{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0;flex-wrap:wrap}
#calMonthGrid{display:flex;flex-direction:column;flex:1;min-height:0}
.cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid rgba(255,255,255,.08)}
.cal-weekday{padding:8px 0;text-align:center;font-size:10px;font-weight:700;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.3px}
.cal-weekday:nth-child(6),.cal-weekday:nth-child(7){color:rgba(255,204,51,.55)}
.cal-days{display:grid;grid-template-columns:repeat(7,1fr);flex:1}
.cal-day{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:default;transition:all .15s;border-right:1px solid rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.03);position:relative;padding:2px 0;min-height:44px}
.cal-day:nth-child(7n){border-right:none}
.cal-day-num{font-size:14px;font-weight:700;color:rgba(255,255,255,.85);width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .15s}
.cal-day.has-events{cursor:pointer}
.cal-day.has-events .cal-day-num{color:#fff;font-weight:800}
.cal-day.has-events:hover .cal-day-num{background:rgba(255,255,255,.1)}
.cal-day.today .cal-day-num{background:#FFCC33;color:#0a1f3d;font-weight:800;box-shadow:0 0 0 3px rgba(255,204,51,.25)}
.cal-day.selected{background:rgba(255,204,51,.08)}
.cal-day.selected .cal-day-num{background:rgba(255,204,51,.22);color:#FFCC33}
.cal-day.today.selected .cal-day-num{background:#FFCC33;color:#0a1f3d}
.cal-day.other-month .cal-day-num{color:rgba(255,255,255,.2)}
.cal-day.past-day .cal-day-num{color:rgba(255,255,255,.35)}
.cal-day.past-day.has-events .cal-day-num{color:rgba(255,255,255,.55)}
.cal-day-dots{display:flex;gap:3px;position:absolute;bottom:3px}
.cal-dot{width:4px;height:4px;border-radius:50%;display:inline-block}
.cal-day.past-day .cal-dot{opacity:.35}
.cal-legend{display:flex;gap:8px;flex-wrap:wrap;padding:8px 10px;border-top:1px solid rgba(255,255,255,.08);justify-content:center}
.cal-legend-item{display:flex;align-items:center;gap:4px;font-size:9px;color:rgba(255,255,255,.6);font-weight:600}
.cal-legend-dot{width:7px;height:7px;border-radius:50%}

/* COL 3: Map + Portami */
.cal-col-map{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
#calMap{flex:1;min-height:260px;background:#0d1a30}
.cal-map-header{padding:12px 14px;font-size:11px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.5px;display:flex;align-items:center;justify-content:center;gap:6px;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0}
.cal-map-header i{color:#FFCC33;font-size:12px}
.cal-map-footer{padding:0;display:flex;align-items:stretch;flex-shrink:0}
.cal-portami-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 16px;border-radius:0 0 0 14px;background:linear-gradient(135deg,#FFCC33,#f0b800);color:#0a1f3d;font-size:13px;font-weight:800;cursor:pointer;border:none;font-family:inherit;transition:all .2s;text-transform:uppercase;letter-spacing:.4px}
.cal-portami-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 16px rgba(255,204,51,.35)}
.cal-portami-btn:disabled{opacity:.45;cursor:not-allowed}
.cal-portami-btn i{font-size:14px}
.cal-locate-btn{width:48px;border-radius:0 0 14px 0;border:none;background:linear-gradient(135deg,#f0b800,#e6ad00);color:#0a1f3d;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:15px;transition:all .2s;flex-shrink:0}
.cal-locate-btn:hover{background:linear-gradient(135deg,#ffd24d,#FFCC33)}
.cal-locate-btn.is-loading i{animation:cal-spin 1s linear infinite}
@keyframes cal-spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.cal-map-popup-tipo{font-size:8px;font-weight:800;text-transform:uppercase;padding:2px 7px;border-radius:4px;display:inline-block;margin-bottom:3px;letter-spacing:.3px}
.cal-map-popup-nome{font-weight:800;font-size:12px;margin-bottom:2px;color:#0a1f3d}
.cal-map-popup-loc{font-size:10px;color:#666}

/* Counter */
.cal-counter{display:flex;justify-content:center;gap:36px;margin-top:22px;text-align:center}
.cal-counter-item{text-align:center}
.cc-num{display:block;font-size:22px;font-weight:800;color:#FFCC33;line-height:1}
.cc-lbl{display:block;font-size:9px;color:rgba(255,255,255,.55);text-transform:uppercase;letter-spacing:.5px;margin-top:4px;font-weight:700}

/* Responsive */
@media(max-width:1100px){
  .cal-trio{grid-template-columns:1fr 1fr;height:auto;gap:14px}
  .cal-col-events{order:1;grid-column:1/-1;max-height:360px}
  .cal-col-cal{order:2;min-height:380px}
  .cal-col-map{order:3;min-height:380px}
}
@media(max-width:700px){
  .cal-trio{grid-template-columns:1fr}
  .cal-col-events{order:1;max-height:340px}
  .cal-col-cal{order:2;min-height:340px}
  .cal-col-map{order:3;min-height:300px}
  .cal-strip{padding:32px 14px 28px}
  .cal-top-left h2{font-size:20px}
  .cal-counter{gap:22px}
  .cc-num{font-size:18px}
}

/* Portami button inside event cards (mobile) */
.cal-ev-portami{display:inline-flex;align-items:center;gap:5px;margin-top:6px;padding:5px 10px;border:none;border-radius:6px;background:linear-gradient(135deg,#FFCC33,#f0b800);color:#0a1f3d;font-size:10px;font-weight:800;cursor:pointer;font-family:inherit;text-transform:uppercase;letter-spacing:.3px;text-decoration:none;transition:all .18s}
.cal-ev-portami:hover{background:linear-gradient(135deg,#ffd24d,#FFCC33);transform:translateY(-1px);box-shadow:0 4px 12px rgba(255,204,51,.35)}
.cal-ev-portami i{font-size:10px}
.cal-ev.past .cal-ev-portami{opacity:.5}

/* ============================================================
   HOME DARK MODE - Deep navy palette + polished surfaces
   Activated by html.force-dark (default on home page).
   ============================================================ */
html.force-dark body{background:#06152b !important;color:#f1f5f9}
html.force-dark main,html.force-dark #main{background:#06152b}
html.force-dark .site-header{background:rgba(6,21,43,.92);backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid rgba(124,179,255,.12)}
html.force-dark .site-header__nav a{color:#cbd5e1}
html.force-dark .site-header__nav a:hover,
html.force-dark .site-header__nav a.is-active{color:#FFCC33}
html.force-dark .site-header__logo--light{display:block}
html.force-dark .site-header__logo--dark{display:none}
html.force-dark .icon-btn{color:#cbd5e1;border-color:rgba(124,179,255,.18);background:rgba(255,255,255,.04)}
html.force-dark .icon-btn:hover{background:rgba(255,204,51,.12);color:#FFCC33;border-color:rgba(255,204,51,.35)}
html.force-dark #btn-theme[aria-pressed="false"] svg{color:#FFCC33}

/* HERO scuro raffinato - blu navy chiaramente percepibile */
html.force-dark .hero,
html.force-dark .hero--dark{
  background:linear-gradient(180deg,#1e4a8c 0%,#163a72 30%,#0e2a55 65%,#0a1f3d 100%) !important;
  border-bottom:1px solid rgba(124,179,255,.18);
  position:relative;
  overflow:hidden;
  min-height:180px;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:56px 24px 56px !important;
}
html.force-dark .hero--dark{padding:48px 24px 48px !important}
html.force-dark .hero::before{
  background:
    radial-gradient(ellipse at 50% 0%,rgba(124,179,255,.18) 0%,transparent 60%),
    radial-gradient(circle at 12% 100%,rgba(255,204,51,.08) 0%,transparent 50%),
    radial-gradient(circle at 88% 100%,rgba(255,204,51,.06) 0%,transparent 50%) !important;
}
html.force-dark .hero-content,
html.force-dark .hero-content--compact{
  width:100% !important;
  max-width:1100px !important;
  margin:0 auto !important;
  text-align:center !important;
  position:relative;
  z-index:2;
}
html.force-dark .prov-pills{
  margin-left:auto !important;
  margin-right:auto !important;
}
html.force-dark .hero::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at 80% 18%,rgba(255,204,51,.06),transparent 55%);
  pointer-events:none;
  mix-blend-mode:screen;
}
html.force-dark .hero h1,html.force-dark .hero h2{color:#fff;text-shadow:0 2px 24px rgba(6,21,43,.6)}
html.force-dark .hero h1 span{color:#FFCC33;text-shadow:0 2px 24px rgba(255,204,51,.35)}
html.force-dark .hero p,html.force-dark .hero-sub{color:rgba(241,245,249,.88)}
html.force-dark .hero-sub{border-bottom-color:#FFCC33}

/* Search box su hero scuro */
html.force-dark .search-box input{
  background:rgba(255,255,255,.96);
  border:2px solid rgba(124,179,255,.25);
  box-shadow:0 12px 40px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.04) inset;
}
html.force-dark .search-box input:focus{
  border-color:#FFCC33;
  box-shadow:0 12px 40px rgba(255,204,51,.25),0 0 0 4px rgba(255,204,51,.15);
}

/* Province pills (.prov-pill) — glass morphism su hero scuro */
html.force-dark .prov-pill-wrap > summary.prov-pill{
  background:linear-gradient(135deg,rgba(255,255,255,.08) 0%,rgba(124,179,255,.06) 100%) !important;
  border:1.5px solid rgba(124,179,255,.28) !important;
  color:#f1f5f9 !important;
  backdrop-filter:blur(12px) saturate(140%);
  -webkit-backdrop-filter:blur(12px) saturate(140%);
  box-shadow:0 4px 16px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.04) inset;
}
html.force-dark .prov-pill-wrap[open] > summary.prov-pill,
html.force-dark .prov-pill-wrap > summary.prov-pill:hover{
  background:linear-gradient(135deg,#FFCC33 0%,#f4b400 100%) !important;
  color:#0a1f3d !important;
  border-color:#FFCC33 !important;
  box-shadow:0 8px 28px rgba(255,204,51,.45),0 0 0 1px rgba(255,255,255,.2) inset;
  transform:translateY(-3px);
}
html.force-dark .prov-pill-wrap .prov-dd{
  background:#0e2a55;
  color:#f1f5f9;
  border:1px solid rgba(255,204,51,.25);
  box-shadow:0 24px 60px rgba(0,0,0,.6);
}
html.force-dark .prov-dd-title{color:#FFCC33}
html.force-dark .prov-dd-item{color:#cbd5e1;border-color:rgba(124,179,255,.12)}
html.force-dark .prov-dd-item:hover,
html.force-dark .prov-dd-item:focus-visible{background:rgba(255,204,51,.1);color:#FFCC33}
html.force-dark .prov-dd-sep{background:rgba(124,179,255,.18)}

/* Sezioni section base */
html.force-dark .section{background:#06152b;color:#f1f5f9}
html.force-dark .section h2{color:#fff}
html.force-dark .section p{color:#cbd5e1}

/* Cal-strip integrato col fondo */
html.force-dark .cal-strip{
  background:linear-gradient(180deg,#06152b 0%,#0a1f3d 50%,#06152b 100%) !important;
  border-top:1px solid rgba(124,179,255,.1);
  border-bottom:1px solid rgba(124,179,255,.1);
}

/* METEO scuro - blu profondo con accento dorato */
html.force-dark .home-meteo{
  background:linear-gradient(180deg,#06152b 0%,#0a1f3d 50%,#06152b 100%) !important;
  padding:56px 0 64px;
  position:relative;
}
html.force-dark .home-meteo::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at 30% 0%,rgba(255,204,51,.05),transparent 60%);
  pointer-events:none;
}
html.force-dark .home-meteo .container{position:relative;z-index:1}
html.force-dark .meteo-head h2{color:#fff}
html.force-dark .meteo-head h2 i{color:#FFCC33;margin-right:8px}
html.force-dark .meteo-source{color:#94a3b8;font-size:12px}
html.force-dark .meteo-source a{color:#7cb3ff}
html.force-dark .weather-pv-table{background:rgba(255,255,255,.03);border:1px solid rgba(124,179,255,.14);border-radius:14px;overflow:hidden}
html.force-dark .wpv-row{border-bottom:1px solid rgba(124,179,255,.08)}
html.force-dark .wpv-col__head{background:rgba(255,255,255,.04);color:#fff;border-bottom-color:rgba(255,204,51,.4)}
html.force-dark .wpv-cell{color:#cbd5e1}
html.force-dark .wpv-cell--day{color:#fff;font-weight:700}
html.force-dark .wpv-row--today{background:rgba(255,204,51,.08)}

/* Footer scuro - contrasto AA verificato */
html.force-dark .site-footer,html.force-dark footer{
  background:#04101f !important;
  color:#cbd5e1;
  border-top:1px solid rgba(124,179,255,.14);
}
html.force-dark .site-footer a,html.force-dark footer a{color:#cbd5e1}
html.force-dark .site-footer a:hover,html.force-dark footer a:hover{color:#FFCC33}

/* Footer columns - tutti i testi visibili */
html.force-dark .sf-col h4{color:#FFCC33 !important}
html.force-dark .sf-col--brand h4{color:#FFCC33 !important;font-size:1.15rem}
html.force-dark .sf-net{color:#f1f5f9 !important}
html.force-dark .sf-desc{color:#cbd5e1 !important}
html.force-dark .sf-meta li{color:#94a3b8}
html.force-dark .sf-meta a{color:#cbd5e1}
html.force-dark .sf-meta a:hover{color:#FFCC33}
html.force-dark .sf-links a{color:#cbd5e1}
html.force-dark .sf-links a:hover{color:#FFCC33}
html.force-dark .sf-col--cta p{color:#cbd5e1 !important}

/* CTA "Attiva il tuo Comune" - oro contrastato */
html.force-dark .sf-cta-btn{
  background:linear-gradient(135deg,#FFCC33 0%,#f4b400 100%) !important;
  border:1px solid #FFCC33 !important;
  color:#0a1f3d !important;
  font-weight:800;
  box-shadow:0 6px 20px rgba(255,204,51,.25);
}
html.force-dark .sf-cta-btn:hover{
  background:#fff !important;
  color:#06152b !important;
  box-shadow:0 8px 28px rgba(255,204,51,.45);
  transform:translateY(-1px);
}

/* Bottom row */
html.force-dark .site-footer__bottom{border-top:1px solid rgba(124,179,255,.12)}
html.force-dark .site-footer__bottom p{color:#94a3b8}
html.force-dark .sf-social a{color:#94a3b8}
html.force-dark .sf-social a:hover{color:#FFCC33}

/* Generic dark cards */
html.force-dark .news-card,
html.force-dark .ev-card,
html.force-dark .srv-card,
html.force-dark .nu-card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(124,179,255,.14);
  color:#f1f5f9;
}
html.force-dark .news-card h4,
html.force-dark .ev-card h4,
html.force-dark .srv-card h4{color:#fff}

/* Calendario eventi - colori coerenti col nuovo palette */
html.force-dark .cal-col-events,
html.force-dark .cal-col-cal,
html.force-dark .cal-col-map{
  background:rgba(255,255,255,.035);
  border-color:rgba(124,179,255,.16);
  box-shadow:0 8px 32px rgba(0,0,0,.35);
}
html.force-dark #calMap{background:#0d2545}

/* Smooth global transition for theme toggle */
html body,html .section,html .cal-strip,html .home-meteo,html .site-header,html footer{
  transition:background .35s ease,color .35s ease,border-color .35s ease;
}

/* ============================================================
   PUGLIA SILHOUETTE - mappa stilizzata B&W minimalista
   257 comuni reali fusi via Gaussian blur in continuous shape
   Sfondo decorativo del banner province con motion lenta
   ============================================================ */
.hero{position:relative}
/* Sagoma Puglia decorativa: rimossa su richiesta (v20).
   Il blocco resta nel template ma e' nascosto via CSS per non rompere lo stacking. */
.hero-puglia-bg{display:none !important}
.hero-content,.hero-content--compact{position:relative;z-index:2}
.puglia-silhouette{
  width:100%;
  max-width:1100px;
  height:100%;
  fill:rgba(255,255,255,.13);
  animation:puglia-drift 22s ease-in-out infinite;
  transform-origin:50% 50%;
  will-change:transform,opacity;
}
@keyframes puglia-drift{
  0%,100%{transform:scale(1.02) translate(0,0);opacity:.85}
  33%{transform:scale(1.05) translate(-6px,-4px);opacity:1}
  66%{transform:scale(1.03) translate(4px,3px);opacity:.92}
}
@media(prefers-reduced-motion:reduce){
  .puglia-silhouette{animation:none;opacity:.85}
}
@media(max-width:700px){
  .puglia-silhouette{max-width:100%}
}

/* Light mode: silhouette grigio scuro su sfondo chiaro */
html.force-light .puglia-silhouette{
  fill:rgba(30,58,95,.12);
}

/* ============================================================
   LIGHT MODE - cal-strip eventi: contrasti AAA su sfondo chiaro
   ============================================================ */
html.force-light .cal-year-btn{
  background:#ffffff;
  color:#1e3a5f;
  border:1px solid #cbd5e1;
}
html.force-light .cal-year-btn:hover{background:#f1f5f9;color:#0a1f3d}
html.force-light .cal-year-btn.active{
  background:#FFCC33;
  border-color:#b8860b;
  color:#0a1f3d;
}
html.force-light .cal-events-scroll{scrollbar-color:#cbd5e1 transparent}
html.force-light .cal-events-scroll::-webkit-scrollbar-thumb{background:#cbd5e1}

/* Cards eventi (.cal-ev) chiare */
html.force-light .cal-ev{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  border-left:3px solid transparent;
  box-shadow:0 2px 8px rgba(10,31,61,.06);
}
html.force-light .cal-ev:hover{
  background:#f8fafc !important;
  border-color:#cbd5e1 !important;
  box-shadow:0 4px 16px rgba(10,31,61,.10);
}
html.force-light .cal-ev.spotlight{
  background:#fffbeb !important;
  border-color:#FFCC33 !important;
  border-left-color:#b8860b !important;
}
html.force-light .cal-ev-daynum{color:#0a1f3d}
html.force-light .cal-ev.past .cal-ev-daynum{color:#94a3b8}
html.force-light .cal-ev-daym{color:#475569}
html.force-light .cal-ev-body h4{color:#0a1f3d}
html.force-light .cal-ev.past h4{color:#64748b}
html.force-light .cal-ev-desc{color:#475569}
html.force-light .cal-ev-loc{color:#475569}
html.force-light .cal-ev-loc i{color:#b8860b}
html.force-light .cal-ev-prov{
  background:#0a1f3d;
  color:#ffffff;
}

/* Calendario griglia mese */
html.force-light .cal-day{border-right-color:#e2e8f0;border-bottom-color:#e2e8f0}
html.force-light .cal-day-num{color:#475569}
html.force-light .cal-day.has-events .cal-day-num{color:#0a1f3d}
html.force-light .cal-day.has-events:hover .cal-day-num{background:#fef3c7}
html.force-light .cal-day.today .cal-day-num{
  background:#FFCC33;
  color:#0a1f3d;
  box-shadow:0 0 0 3px rgba(255,204,51,.35);
}
html.force-light .cal-day.selected{background:#fffbeb}
html.force-light .cal-day.selected .cal-day-num{background:#FFCC33;color:#0a1f3d}
html.force-light .cal-day.other-month .cal-day-num{color:#cbd5e1}
html.force-light .cal-day.past-day .cal-day-num{color:#94a3b8}
html.force-light .cal-day.past-day.has-events .cal-day-num{color:#64748b}

/* Header settimana giorni */
html.force-light .cal-wkd,
html.force-light .cal-wkd-row,
html.force-light [class*="weekday"]{color:#475569 !important;background:#f8fafc !important;border-color:#e2e8f0 !important}

/* Mappa header */
html.force-light .cal-map-header{color:#0a1f3d;border-bottom-color:#e2e8f0}
html.force-light .cal-map-header i{color:#b8860b}

/* ============================================================
   LIGHT MODE - Attivato dal toggle luna in header
   Tutti i fondi diventano bianchi/avorio con testi navy ad alto contrasto
   Palette verificata WCAG 2.1 AA/AAA su #ffffff:
   - #0a1f3d navy: 16.0:1 (AAA)
   - #1e3a5f navy mid: 11.2:1 (AAA)
   - #475569 slate-600: 7.6:1 (AAA)
   - #92590a gold dark: 6.2:1 (AA+)
   - #b8860b dark goldenrod: 4.6:1 (AA)
   ============================================================ */
html.force-light{color-scheme:light}
html.force-light body{background:#ffffff !important;color:#0a1f3d}

/* HEADER chiaro */
html.force-light .site-header{
  background:rgba(255,255,255,.96) !important;
  backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid #e2e8f0;
  box-shadow:0 1px 3px rgba(10,31,61,.04);
}
html.force-light .site-header__nav a{color:#1e3a5f}
html.force-light .site-header__nav a:hover,
html.force-light .site-header__nav a.is-active{color:#92590a}
html.force-light .site-header__logo--light{display:none}
html.force-light .site-header__logo--dark{display:block}
html.force-light .icon-btn{color:#1e3a5f;border-color:#cbd5e1;background:#f8fafc}
html.force-light .icon-btn:hover{background:#FFCC33;color:#0a1f3d;border-color:#b8860b}

/* HERO chiaro */
/* --- LIGHT THEME: hero generico (NON mappa Puglia) --- */
html.force-light .hero:not(.hero--puglia-map),
html.force-light .hero--dark:not(.hero--puglia-map){
  background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 50%,#e2e8f0 100%) !important;
  border-bottom:1px solid #cbd5e1;
  color:#0a1f3d;
}
html.force-light .hero:not(.hero--puglia-map)::before,
html.force-light .hero:not(.hero--puglia-map)::after{
  background:radial-gradient(ellipse at 50% 0%,rgba(255,204,51,.18),transparent 60%) !important;
}
html.force-light .hero:not(.hero--puglia-map) h1,
html.force-light .hero:not(.hero--puglia-map) h2{color:#0a1f3d !important;text-shadow:none}
html.force-light .hero:not(.hero--puglia-map) h1 span{color:#92590a !important;text-shadow:none}
html.force-light .hero:not(.hero--puglia-map) p,
html.force-light .hero:not(.hero--puglia-map) .hero-sub{color:#1e3a5f !important}

/* --- LIGHT THEME: hero mappa Puglia — mantiene sfondo satellitare --- */
html.force-light .hero--puglia-map{
  /* Non sovrascrive background: la foto satellitare resta */
  border-bottom:1px solid rgba(255,255,255,.1);
}
html.force-light .hero--puglia-map::after{
  background:
    linear-gradient(to bottom, rgba(6,14,30,.55) 0%, transparent 25%, transparent 70%, rgba(6,14,30,.8) 100%),
    linear-gradient(to right, rgba(6,14,30,.45) 0%, transparent 15%, transparent 85%, rgba(6,14,30,.45) 100%) !important;
}

/* Search box: glass su satellite anche in light */
html.force-light .hero--puglia-map .search-box input{
  background:rgba(255,255,255,.12) !important;
  border:1.5px solid rgba(255,255,255,.25) !important;
  color:#fff;
  box-shadow:0 8px 32px rgba(0,0,0,.3);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
html.force-light .hero--puglia-map .search-box input::placeholder{color:rgba(255,255,255,.5)}
html.force-light .hero--puglia-map .search-box input:focus{
  border-color:rgba(255,204,51,.5) !important;
  box-shadow:0 8px 32px rgba(0,0,0,.35),0 0 0 3px rgba(255,204,51,.15);
}

/* Province pills: glass su satellite anche in light */
html.force-light .hero--puglia-map .prov-pill-wrap > summary.prov-pill{
  background:rgba(255,255,255,.08) !important;
  border:1.5px solid rgba(255,255,255,.18) !important;
  color:#fff !important;
  box-shadow:0 4px 16px rgba(0,0,0,.2);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
html.force-light .hero--puglia-map .prov-pill-wrap[open] > summary.prov-pill,
html.force-light .hero--puglia-map .prov-pill-wrap > summary.prov-pill:hover{
  background:rgba(255,204,51,.15) !important;
  color:#fff !important;
  border-color:rgba(255,204,51,.4) !important;
  box-shadow:0 8px 24px rgba(255,204,51,.2);
}
html.force-light .hero--puglia-map .prov-pill-wrap .prov-dd{
  background:rgba(10,20,42,.92);
  color:#e2e8f0;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 24px 60px rgba(0,0,0,.5);
}
html.force-light .hero--puglia-map .prov-dd-title{color:#FFCC33}
html.force-light .hero--puglia-map .prov-dd-item{color:#e2e8f0;border-color:rgba(255,255,255,.06)}
html.force-light .hero--puglia-map .prov-dd-item:hover,
html.force-light .hero--puglia-map .prov-dd-item:focus-visible{background:rgba(255,204,51,.08);color:#FFCC33}

/* Search box su hero chiaro generico (non mappa) */
html.force-light .hero:not(.hero--puglia-map) .search-box input{
  background:#fff !important;
  border:2px solid #cbd5e1 !important;
  color:#0a1f3d;
  box-shadow:0 4px 16px rgba(10,31,61,.10);
}
html.force-light .hero:not(.hero--puglia-map) .search-box input::placeholder{color:#475569}
html.force-light .hero:not(.hero--puglia-map) .search-box input:focus{
  border-color:#b8860b !important;
  box-shadow:0 6px 20px rgba(184,134,11,.20),0 0 0 4px rgba(255,204,51,.18);
}

/* Province pills chiare (generico, non mappa) */
html.force-light .hero:not(.hero--puglia-map) .prov-pill-wrap > summary.prov-pill{
  background:#ffffff !important;
  border:2px solid #cbd5e1 !important;
  color:#0a1f3d !important;
  box-shadow:0 2px 8px rgba(10,31,61,.08);
  backdrop-filter:none;
}
html.force-light .hero:not(.hero--puglia-map) .prov-pill-wrap[open] > summary.prov-pill,
html.force-light .hero:not(.hero--puglia-map) .prov-pill-wrap > summary.prov-pill:hover{
  background:linear-gradient(135deg,#FFCC33 0%,#f4b400 100%) !important;
  color:#0a1f3d !important;
  border-color:#b8860b !important;
  box-shadow:0 8px 24px rgba(184,134,11,.30);
}
html.force-light .prov-pill-wrap .prov-dd{
  background:#fff;
  color:#0a1f3d;
  border:1px solid #cbd5e1;
  box-shadow:0 24px 60px rgba(10,31,61,.18);
}
html.force-light .prov-dd-title{color:#92590a}
html.force-light .prov-dd-item{color:#1e3a5f;border-color:#e2e8f0}
html.force-light .prov-dd-item:hover,
html.force-light .prov-dd-item:focus-visible{background:#fffbeb;color:#92590a}

/* CAL-STRIP chiaro - "Vivi la Puglia" sezione eventi */
html.force-light .cal-strip{
  background:linear-gradient(180deg,#f8fafc 0%,#ffffff 50%,#f1f5f9 100%) !important;
  color:#0a1f3d !important;
  border-top:1px solid #e2e8f0;
  border-bottom:1px solid #e2e8f0;
}
html.force-light .cal-strip .cal-top-left h2,
html.force-light .cal-top-left h2{color:#0a1f3d !important}
html.force-light .cal-strip .cal-top-left h2 i,
html.force-light .cal-top-left h2 i{color:#b8860b !important}
html.force-light .cal-strip .cal-counter,
html.force-light .cal-counter{color:#0a1f3d !important}
html.force-light .cal-strip .cc-num,
html.force-light .cc-num{color:#0a1f3d !important}
html.force-light .cal-strip .cc-lbl,
html.force-light .cc-lbl{color:#475569 !important}
html.force-light .cal-col-events,
html.force-light .cal-col-cal,
html.force-light .cal-col-map{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  box-shadow:0 8px 24px rgba(10,31,61,.08);
  color:#0a1f3d;
}
html.force-light .cal-col-header{color:#0a1f3d;border-bottom-color:#e2e8f0}
html.force-light .cal-col-header i{color:#b8860b}
html.force-light .cal-arr,
html.force-light .cal-nav-btn{background:#f1f5f9;color:#1e3a5f;border-color:#cbd5e1}
html.force-light .cal-arr:hover,
html.force-light .cal-nav-btn:hover{background:#FFCC33;color:#0a1f3d;border-color:#b8860b}
html.force-light .cal-month-label{color:#0a1f3d}
html.force-light .cal-tabs button{background:#fff;color:#1e3a5f;border:1px solid #cbd5e1}
html.force-light .cal-tabs button.is-active,
html.force-light .cal-tabs button:hover{background:#FFCC33;color:#0a1f3d;border-color:#b8860b}
html.force-light #calMap{background:#e2e8f0}
html.force-light .cal-portami-btn,
html.force-light .cal-locate-btn{background:#f1f5f9;color:#1e3a5f;border:1px solid #cbd5e1}
html.force-light .cal-portami-btn:not(:disabled):hover,
html.force-light .cal-locate-btn:hover{background:#FFCC33;color:#0a1f3d}

/* METEO chiaro */
html.force-light .home-meteo{
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 50%,#f1f5f9 100%) !important;
}
html.force-light .home-meteo::before{
  background:radial-gradient(ellipse at 50% 0%,rgba(255,204,51,.10),transparent 60%) !important;
}
html.force-light .home-meteo .meteo-head h2{color:#0a1f3d !important}
html.force-light .home-meteo .meteo-head h2 i{color:#b8860b !important}
html.force-light .home-meteo .meteo-source{color:#475569 !important}
html.force-light .home-meteo .meteo-source a{color:#1e3a5f !important;text-decoration:underline}
html.force-light .weather-pv-table{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  box-shadow:0 12px 32px rgba(10,31,61,.10) !important;
}
html.force-light .wpv-row{border-bottom-color:#e2e8f0 !important}
html.force-light .wpv-col__head{
  background:#0a1f3d !important;
  color:#ffffff !important;
  border-bottom:2px solid #b8860b !important;
}
html.force-light .wpv-cell{color:#1e3a5f !important}
html.force-light .wpv-cell--day{color:#0a1f3d !important;font-weight:800}
html.force-light .wpv-row--today{background:#fffbeb !important}
html.force-light .wpv-row--today .wpv-cell--day{color:#92590a !important}

/* SECTION generiche chiare */
html.force-light .section{background:#ffffff;color:#0a1f3d}
html.force-light .section h2{color:#0a1f3d}
html.force-light .section p{color:#1e3a5f}

/* CARDS chiare (news, eventi, servizi) */
html.force-light .news-card,
html.force-light .ev-card,
html.force-light .srv-card,
html.force-light .nu-card{
  background:#ffffff;
  border:1px solid #e2e8f0;
  color:#0a1f3d;
  box-shadow:0 4px 16px rgba(10,31,61,.06);
}
html.force-light .news-card h4,
html.force-light .ev-card h4,
html.force-light .srv-card h4{color:#0a1f3d}
html.force-light .news-card p,
html.force-light .ev-card p,
html.force-light .srv-card p{color:#475569}

/* FOOTER chiaro */
html.force-light .site-footer,html.force-light footer{
  background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%) !important;
  color:#1e3a5f;
  border-top:1px solid #cbd5e1;
}
html.force-light .sf-col h4{color:#92590a !important}
html.force-light .sf-col--brand h4{color:#0a1f3d !important}
html.force-light .sf-net{color:#0a1f3d !important}
html.force-light .sf-desc{color:#475569 !important}
html.force-light .sf-meta li{color:#475569}
html.force-light .sf-meta li i{color:#b8860b}
html.force-light .sf-meta a{color:#1e3a5f}
html.force-light .sf-meta a:hover{color:#92590a}
html.force-light .sf-links a{color:#1e3a5f}
html.force-light .sf-links a:hover{color:#92590a}
html.force-light .sf-col--cta p{color:#475569 !important}
html.force-light .sf-cta-btn{
  background:linear-gradient(135deg,#FFCC33 0%,#f4b400 100%) !important;
  border:1px solid #b8860b !important;
  color:#0a1f3d !important;
  box-shadow:0 6px 20px rgba(184,134,11,.25);
}
html.force-light .sf-cta-btn:hover{
  background:#0a1f3d !important;
  color:#FFCC33 !important;
  border-color:#0a1f3d !important;
}
html.force-light .site-footer__bottom{border-top:1px solid #cbd5e1}
html.force-light .site-footer__bottom p{color:#475569}
html.force-light .sf-social a{color:#475569}
html.force-light .sf-social a:hover{color:#92590a}

/* Toggle button: icona luna/sole coerente */
html.force-light #btn-theme[aria-pressed="false"] svg{color:#92590a}
html.force-light #btn-theme[aria-pressed="true"] svg{color:#1e3a5f}

/* Dispositivo switcher: contrasto AAA su sfondo chiaro */
html.force-light .puglia-switch__btn{
  background:#ffffff !important;
  border:1.5px solid #0a1f3d !important;
  color:#0a1f3d !important;
  box-shadow:0 1px 3px rgba(10,31,61,.12);
}
html.force-light .puglia-switch__btn:hover,
html.force-light .puglia-switch__btn[aria-expanded="true"]{
  background:#fff8e1 !important;
  border-color:#b8860b !important;
  color:#0a1f3d !important;
}
html.force-light .puglia-switch__label{color:#0a1f3d !important;font-weight:700}
html.force-light .puglia-switch__chevron{color:#0a1f3d !important}
html.force-light .puglia-switch__dot{
  background:#b8860b !important;
  box-shadow:0 0 0 3px rgba(184,134,11,.25) !important;
}
html.force-light .puglia-menu{
  background:#ffffff !important;
  border:1px solid #cbd5e1 !important;
  box-shadow:0 20px 50px rgba(10,31,61,.18) !important;
}
html.force-light .puglia-menu__item{color:#0a1f3d !important}
html.force-light .puglia-menu__item:hover{background:#f1f5f9 !important}
html.force-light .puglia-menu__item strong{color:#0a1f3d !important}
html.force-light .puglia-menu__item em{color:#475569 !important}
html.force-light .puglia-menu__icon{color:#b8860b !important}

/* ============================================================
   v20 FIX — Dropdown province sopra qualsiasi sezione successiva
   Quando una pill e' [open] forziamo lo stacking context.
   ============================================================ */
.hero, .hero--dark{overflow:visible !important}
.prov-pill-wrap{position:relative}
.prov-pill-wrap[open]{z-index:9999}
.prov-pill-wrap .prov-dd{z-index:9999 !important}
/* La sezione hero non deve creare contesti che bloccano i dropdown */
.hero--dark{z-index:auto}
.cal-strip, .home-meteo, .section{position:relative;z-index:1}

/* ================================================================
   WCAG 2.1 AA refinements (v21) - non invasive
   Focus management, touch targets, text contrast reinforcement,
   motion, readability. Nessuna modifica strutturale al layout.
   ================================================================ */

/* 1) Focus-visible piu forte e universale */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible,
[role="tab"]:focus-visible,
[role="link"]:focus-visible {
  outline: 3px solid var(--ic-accent) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 5px rgba(240, 192, 64, 0.25) !important;
  border-radius: var(--r-sm);
}

/* 2) Touch target minimi 44x44 (WCAG 2.5.5 AAA / best practice) */
.btn,
.comune-tabs__btn,
.prov-pill,
.prov-dd-item,
.card a,
.info-list a,
.site-header a,
.site-footer a {
  min-height: 44px;
}
.btn, .comune-tabs__btn {
  min-width: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* 3) Rinforzo contrasto testo muted su card (AA safe) */
.info-list .item-meta,
.card__meta,
.news-card__date,
.news-card__excerpt,
.overview-card__desc,
.prov-card__count {
  color: var(--ic-text-2) !important;
}

/* 4) Link interni alle card: sempre sottolineati + colore link safe */
.info-list a,
.card a,
.news-card a {
  color: var(--ic-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.info-list a:hover,
.card a:hover {
  text-decoration-thickness: 2px;
}

/* 5) Skip-link sempre visibile quando focus (no piu off-screen trap) */
.skip-link {
  left: var(--sp-3);
  top: -60px;
  transition: top 150ms ease;
}
.skip-link:focus {
  left: var(--sp-3);
  top: var(--sp-3);
}

/* 6) Selezione testo leggibile */
::selection {
  background: var(--ic-accent);
  color: var(--ic-blue-dark);
}

/* 7) Bordi card rinforzati per separazione visiva */
.card,
.info-list li,
.news-card,
.overview-card {
  border-color: var(--ic-border-strong);
}

/* 8) Placeholder input con contrasto AA */
input::placeholder,
textarea::placeholder {
  color: var(--ic-text-3);
  opacity: 1;
}

/* 9) Stato disabled chiaramente distinguibile (non solo opacita) */
button[disabled],
.btn[disabled],
input[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* 10) Motion: rafforza reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .card:hover,
  .news-card:hover,
  .prov-card:hover,
  .overview-card:hover {
    transform: none !important;
  }
}

/* 11) High contrast mode (Windows) */
@media (forced-colors: active) {
  .card, .info-list li, .news-card, .overview-card {
    border: 1px solid CanvasText;
  }
  a { color: LinkText; }
  .btn { border: 2px solid ButtonText; }
}

/* 12) Badge con bordo per distinguibilita in alto contrasto */
.badge {
  border: 1px solid rgba(0,0,0,0.15);
}

/* 13) Heading gerarchia: niente sotto-h3 sotto 18px */
h4 { font-size: 18px; }
h5 { font-size: 16px; font-weight: 700; }
h6 { font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }

/* 14) Line-height generoso sui paragrafi per dislessia */
p, li { line-height: 1.6; }

/* 15) Link esterni con indicatore visivo (solo testuale, non icona) */
a[target="_blank"]::after {
  content: " ↗";
  font-size: 0.85em;
  opacity: 0.7;
}
.site-header a[target="_blank"]::after,
.site-footer a[target="_blank"]::after,
.btn[target="_blank"]::after { content: none; }

/* ================================================================
   v21.1 - Dark mode title color fix
   Titoli che erano color:var(--ic-blue) fisso diventano gialli in
   dark mode per risolvere contrasto blu su blu. In light mode
   restano blu (contrasto gia ok su bianco).
   ================================================================ */

@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .overview-card__title,
  :root:not(.force-light) .news-card__title,
  :root:not(.force-light) .pro-lock__title,
  :root:not(.force-light) .comune-panel h2,
  :root:not(.force-light) .comune-section h2,
  :root:not(.force-light) .comune-tabs__btn:hover,
  :root:not(.force-light) .comune-tabs__btn[aria-selected="true"],
  :root:not(.force-light) .page-header h1,
  :root:not(.force-light) .card h3,
  :root:not(.force-light) .info-list .item-title {
    color: var(--ic-accent) !important;
  }
  :root:not(.force-light) .btn-outline {
    color: var(--ic-accent) !important;
    border-color: var(--ic-accent) !important;
  }
  :root:not(.force-light) .btn-outline:hover {
    background: var(--ic-accent) !important;
    color: var(--ic-blue-dark) !important;
  }
}

:root.force-dark .overview-card__title,
:root.force-dark .news-card__title,
:root.force-dark .pro-lock__title,
:root.force-dark .comune-panel h2,
:root.force-dark .comune-section h2,
:root.force-dark .comune-tabs__btn:hover,
:root.force-dark .comune-tabs__btn[aria-selected="true"],
:root.force-dark .page-header h1,
:root.force-dark .card h3,
:root.force-dark .info-list .item-title {
  color: var(--ic-accent) !important;
}
:root.force-dark .btn-outline {
  color: var(--ic-accent) !important;
  border-color: var(--ic-accent) !important;
}
:root.force-dark .btn-outline:hover {
  background: var(--ic-accent) !important;
  color: var(--ic-blue-dark) !important;
}

/* ================================================================
   v26 - Titoli su container scuri fissi (backport da v22.1)
   Risolve i titoli blu-su-blu in container con sfondo hard-coded.
   ================================================================ */

.epica-cta h1,
.epica-cta h2,
.epica-cta h3,
.page-header h1,
.page-header h2,
.page-header h3,
.hero h1,
.hero h2,
.hero--dark h1,
.hero--dark h2,
.comune-hero:not(.comune-hero--map) h1,
.comune-hero:not(.comune-hero--map) h2,
.site-header h1,
.site-header h2,
.site-footer h3,
.site-footer h4 {
  color: var(--ic-accent) !important;
}

.epica-cta h4,
.epica-cta h5,
.epica-cta__service h4,
.page-header h4,
.page-header h5,
.site-footer h5 {
  color: #ffffff !important;
}

.epica-cta p,
.epica-cta li,
.epica-cta__service p,
.page-header p:not(.breadcrumb) {
  color: rgba(255,255,255,0.92) !important;
}

.epica-cta a:not(.btn-primary):not(.btn-outline),
.page-header a:not(.btn-primary):not(.btn-outline),
.site-footer a {
  color: var(--ic-accent);
}
.epica-cta a:not(.btn-primary):not(.btn-outline):hover,
.page-header a:not(.btn-primary):not(.btn-outline):hover,
.site-footer a:hover {
  color: #ffd966;
  text-decoration: underline;
}

.comune-meta__label {
  color: rgba(255, 212, 77, 0.95) !important;
}
.comune-meta__value,
.comune-meta__value a {
  color: #ffffff !important;
}

/* ================================================================
   InfoComuni v27 Enhancements
   Mobile bottom nav, Kiosk mode, Desktop refinements,
   Accessibility fixes, Visual polish
   ================================================================ */

/* -------- Design token extensions -------- */
:root {
  /* Bottom navigation */
  --bottom-nav-h: 60px;

  /* Kiosk mode */
  --kiosk-base: 20px;
  --kiosk-target: 56px;
}

/* ================================================================
   1. MOBILE BOTTOM TAB BAR (~150 lines)
   ================================================================ */

@media (max-width: 899px) {
  body {
    padding-bottom: calc(var(--bottom-nav-h) + env(safe-area-inset-bottom));
  }

  .whatsapp-fab {
    bottom: calc(var(--bottom-nav-h) + env(safe-area-inset-bottom) + var(--sp-4));
    transition: bottom var(--tr);
  }

  .site-header__toggle {
    display: none !important;
  }
}

/* Bottom navigation bar */
.bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: var(--bottom-nav-h);
  padding-bottom: env(safe-area-inset-bottom);
  background: var(--ic-blue-dark);
  backdrop-filter: blur(12px) saturate(120%);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  z-index: 200;
  display: flex;
  align-items: stretch;
  font-family: var(--f-sans);
}

@media (min-width: 900px) {
  .bottom-nav {
    display: none !important;
  }
}

@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .bottom-nav {
    background: var(--ic-blue-dark);
    border-top-color: rgba(255, 255, 255, 0.12);
  }
}

.force-dark .bottom-nav {
  background: rgba(6, 21, 43, 0.95);
  border-top-color: rgba(124, 179, 255, 0.15);
}

.force-light .bottom-nav {
  background: rgba(242, 248, 255, 0.98);
  border-top-color: rgba(211, 220, 230, 0.5);
}

/* Bottom nav items */
.bottom-nav__item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 6px var(--sp-2);
  background: transparent;
  border: none;
  cursor: pointer;
  color: rgba(255, 255, 255, 0.65);
  font-size: 11px;
  font-weight: 500;
  text-decoration: none;
  text-align: center;
  transition: color var(--tr), background var(--tr);
  position: relative;
  touch-action: manipulation;
  -webkit-user-select: none;
  user-select: none;
}

.bottom-nav__item:active {
  background: rgba(255, 255, 255, 0.08);
  transform: scale(0.98);
}

.bottom-nav__item.is-active {
  color: var(--ic-accent);
}

.bottom-nav__item.is-active::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--ic-accent);
  border-radius: 0 0 2px 2px;
}

.bottom-nav__item svg,
.bottom-nav__item .icon {
  width: 24px;
  height: 24px;
  display: block;
}

.bottom-nav__item.is-active svg,
.bottom-nav__item.is-active .icon {
  color: var(--ic-accent);
  filter: drop-shadow(0 0 4px rgba(240, 192, 64, 0.3));
}

/* Focus visible state */
.bottom-nav__item:focus-visible {
  outline: 2px solid var(--ic-accent);
  outline-offset: -2px;
  border-radius: 4px;
}

/* Dark mode overrides */
.force-light .bottom-nav__item {
  color: rgba(10, 22, 40, 0.6);
}

.force-light .bottom-nav__item.is-active {
  color: #d9a830;
}

/* ================================================================
   2. KIOSK MODE (~120 lines)
   ================================================================ */

body.layout-kiosk {
  font-size: var(--kiosk-base);
  background: var(--ic-blue-dark);
}

body.layout-kiosk::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      0deg,
      rgba(240, 192, 64, 0.01) 0px,
      rgba(240, 192, 64, 0.01) 1px,
      transparent 1px,
      transparent 3px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(240, 192, 64, 0.01) 0px,
      rgba(240, 192, 64, 0.01) 1px,
      transparent 1px,
      transparent 3px
    );
  pointer-events: none;
  z-index: 1;
  opacity: 0.5;
}

/* Force dark mode in kiosk */
body.layout-kiosk,
body.layout-kiosk * {
  color-scheme: dark;
}

@media (prefers-color-scheme: light) {
  body.layout-kiosk {
    --ic-bg: #0a1f3d;
    --ic-bg-deep: #06152b;
    --ic-surface: #162d54;
    --ic-surface-2: #1e3a6b;
    --ic-border: #355488;
    --ic-border-strong: #5577aa;
    --ic-text: #f8fbff;
    --ic-text-2: #dbe4f0;
    --ic-text-3: #b8c5d9;
    --ic-link: #9ec7ff;
    --ic-link-visited: #d4c2ff;
    --ic-accent: #FFCC33;
  }
}

body.layout-kiosk .whatsapp-fab {
  display: none;
}

body.layout-kiosk .site-header__utils {
  display: none !important;
}

body.layout-kiosk .site-footer {
  display: none;
}

body.layout-kiosk .bottom-nav {
  display: none !important;
}

body.layout-kiosk .container {
  max-width: 100%;
  padding: var(--sp-7);
}

/* Hero typography scaling */
body.layout-kiosk h1 {
  font-size: clamp(35px, 7vw, 55px);
}

body.layout-kiosk h2 {
  font-size: calc(var(--f-size-2xl) * 1.4);
}

body.layout-kiosk h3 {
  font-size: calc(var(--f-size-xl) * 1.3);
}

body.layout-kiosk .comune-hero h1 {
  font-size: clamp(40px, 8vw, 60px);
}

body.layout-kiosk .comum-hero__subtitle {
  font-size: calc(var(--f-size-lg) * 1.25);
  line-height: var(--f-lh-relaxed);
}

/* Card grid adjustments */
body.layout-kiosk .news-grid,
body.layout-kiosk .overview-grid,
body.layout-kiosk .epica-cta__services {
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: calc(var(--sp-4) * 1.5);
}

@media (min-width: 1200px) {
  body.layout-kiosk .news-grid,
  body.layout-kiosk .overview-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Touch target enforcement */
body.layout-kiosk button,
body.layout-kiosk a[role="button"],
body.layout-kiosk .comune-tabs__btn,
body.layout-kiosk .prov-dd-item {
  min-height: var(--kiosk-target);
  font-size: var(--kiosk-base);
  padding: 14px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

body.layout-kiosk .comune-tabs__btn {
  padding: var(--sp-4) var(--sp-5);
  font-size: 18px;
  min-height: 56px;
  gap: 12px;
}

body.layout-kiosk .prov-dd-item {
  padding: 18px 20px;
  min-height: 56px;
  font-size: 18px;
}

/* Province pills larger */
body.layout-kiosk .prov-pill-wrap {
  gap: var(--sp-4);
}

body.layout-kiosk .prov-dd-cap {
  padding: 14px 18px;
  font-size: var(--kiosk-base);
}

body.layout-kiosk .prov-dd-cap-name {
  font-size: var(--kiosk-base);
}

/* Disable hover transforms in kiosk */
body.layout-kiosk .news-card:hover,
body.layout-kiosk .overview-card:hover,
body.layout-kiosk .pro-lock__cta:hover {
  transform: none !important;
}

body.layout-kiosk .news-card:hover {
  box-shadow: 0 8px 25px rgba(10, 22, 40, 0.15);
}

/* Cursor hide class for inactivity */
body.layout-kiosk.kiosk-cursor-hidden {
  cursor: none;
}

body.layout-kiosk.kiosk-cursor-hidden * {
  cursor: none;
}

/* Card padding in kiosk */
body.layout-kiosk .news-card,
body.layout-kiosk .overview-card {
  padding: calc(var(--sp-5) * 1.2);
}

body.layout-kiosk .news-card__title,
body.layout-kiosk .overview-card__title {
  font-size: calc(var(--f-size-lg) * 1.2);
}

body.layout-kiosk .news-card__date,
body.layout-kiosk .news-card__excerpt,
body.layout-kiosk .overview-card__desc {
  font-size: calc(var(--f-size-sm) * 1.1);
}

/* ================================================================
   3. DESKTOP REFINEMENTS (~80 lines)
   ================================================================ */

@media (min-width: 900px) {
  /* Remove bottom padding added for mobile nav */
  body {
    padding-bottom: 0;
  }
}

/* Header navigation link indicator */
.site-header__nav a {
  position: relative;
  padding-bottom: 8px;
  border-bottom: 2px solid transparent;
  transition: border-color var(--tr), color var(--tr);
}

.site-header__nav a:hover {
  border-bottom-color: var(--ic-accent);
}

.site-header__nav a[aria-current="page"] {
  border-bottom-color: var(--ic-accent);
}

/* Province grid enhancement */
@media (min-width: 1200px) {
  .prov-pill-wrap {
    gap: var(--sp-5);
  }

  .prov-dd-grid {
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .prov-dd-item {
    padding: 16px 18px;
  }
}

/* Card hover refinement */
.news-card,
.overview-card {
  transition: transform var(--tr), box-shadow var(--tr), background var(--tr);
}

.news-card:hover,
.overview-card:hover {
  box-shadow: 0 8px 25px rgba(10, 22, 40, 0.12);
  transform: scale(1.01);
}

/* Section title accent bar */
.section h2::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 28px;
  background: var(--ic-accent);
  border-radius: 2px;
  margin-right: 12px;
  vertical-align: middle;
}

@media (max-width: 640px) {
  .section h2::before {
    display: none;
  }
}

/* Footer grid 4-column on large screens */
@media (min-width: 1400px) {
  .site-footer__grid--4 {
    grid-template-columns: repeat(4, 1fr);
    gap: 48px;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .site-footer__grid--4 {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Smooth scroll margin for anchored sections */
.section {
  scroll-margin-top: calc(var(--header-h) + 60px);
}

@media (max-width: 899px) {
  .section {
    scroll-margin-top: calc(var(--header-h) + var(--bottom-nav-h) + 20px);
  }
}

/* ================================================================
   4. ACCESSIBILITY FIXES (~60 lines)
   ================================================================ */

/* Focus trap on body when modal is open */
body.focus-trap-active {
  overflow: hidden;
}

/* Tab panel with aria-hidden */
.comune-panel[aria-hidden="true"] {
  display: none !important;
  pointer-events: none;
  visibility: hidden;
}

.comune-panel[aria-hidden="false"] {
  display: block;
  animation: panel-fade 200ms ease;
}

/* Improve hero meta label contrast */
.comune-hero__meta-label {
  font-size: var(--f-size-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255, 212, 77, 0.95);
  margin-bottom: 4px;
  font-weight: 600;
}

/* Minimum touch target for dropdown items */
.prov-dd-item {
  min-height: 44px;
  padding: 12px 16px;
  transition: background var(--tr), color var(--tr);
}

.prov-dd-item:focus-visible {
  outline: 2px solid var(--ic-accent);
  outline-offset: -2px;
  border-radius: 4px;
}

/* Search form input focus ring */
.search-form input {
  transition: border-color var(--tr), box-shadow var(--tr);
  border: 2px solid var(--ic-border);
}

.search-form input:focus {
  outline: none;
  border-color: var(--ic-accent);
  box-shadow: 0 0 0 3px rgba(240, 192, 64, 0.1);
}

.search-form input:focus-visible {
  outline: 2px solid var(--ic-accent);
  outline-offset: 2px;
}

/* Mobile nav focus trap styles */
.mobile-nav[aria-hidden="false"] {
  background: rgba(10, 22, 40, 0.95);
  backdrop-filter: blur(10px);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-nav a:focus-visible {
  outline: 2px solid var(--ic-accent);
  outline-offset: -2px;
  border-radius: 4px;
}

/* Ensure sufficient contrast for all interactive elements */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--ic-accent);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Dark mode focus ring */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) button:focus-visible,
  :root:not(.force-light) a:focus-visible,
  :root:not(.force-light) input:focus-visible {
    outline-color: #FFCC33;
  }
}

.force-dark button:focus-visible,
.force-dark a:focus-visible,
.force-dark input:focus-visible {
  outline-color: #FFCC33;
}

/* ================================================================
   5. VISUAL POLISH (~60 lines)
   ================================================================ */

/* Gradient separator between sections */
.section + .section::before {
  content: "";
  display: block;
  width: 60px;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--ic-accent) 50%,
    transparent 100%
  );
  margin: 0 auto var(--sp-6);
  opacity: 0.5;
}

.section:first-child::before {
  display: none;
}

/* Badge refinement */
.comune-hero__badge {
  padding: 8px 16px;
  font-size: var(--f-size-sm);
  border-radius: var(--r-full);
  border: 1px solid rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(10px);
  font-weight: 500;
  transition: all var(--tr);
}

.comune-hero__badge:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.35);
}

.comum-hero__badge--pro {
  background: var(--ic-accent);
  color: var(--ic-blue-dark);
  border-color: var(--ic-accent-dark);
  font-weight: 600;
}

/* EPICA CTA background pattern */
.epica-cta {
  position: relative;
  overflow: hidden;
}

.epica-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      45deg,
      rgba(255, 255, 255, 0.02) 0px,
      rgba(255, 255, 255, 0.02) 10px,
      transparent 10px,
      transparent 20px
    );
  pointer-events: none;
  z-index: 0;
}

.epica-cta > * {
  position: relative;
  z-index: 1;
}

/* Loading skeleton animation */
@keyframes shimmer {
  0% {
    background-position: -1000px 0;
  }
  100% {
    background-position: 1000px 0;
  }
}

.skeleton {
  background: linear-gradient(
    90deg,
    var(--ic-surface) 0%,
    var(--ic-surface-2) 50%,
    var(--ic-surface) 100%
  );
  background-size: 1000px 100%;
  animation: shimmer 2s infinite;
  border-radius: var(--r-md);
  height: 16px;
}

.skeleton.skeleton-title {
  height: 24px;
  margin-bottom: var(--sp-3);
}

.skeleton.skeleton-line {
  height: 16px;
  margin-bottom: var(--sp-2);
}

.skeleton.skeleton-avatar {
  width: 48px;
  height: 48px;
  border-radius: var(--r-full);
}

/* Ensure smooth page transitions */
html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

/* Print styles */
@media print {
  .site-header,
  .site-header__nav,
  .site-header__utils,
  .bottom-nav,
  .mobile-nav,
  .site-footer,
  .whatsapp-fab,
  .skip-link {
    display: none !important;
  }

  body {
    padding-bottom: 0;
  }

  .comune-tabs__btn[aria-selected="false"] {
    display: none;
  }

  .comune-panel[aria-hidden="true"] {
    display: block !important;
    visibility: visible;
    pointer-events: auto;
  }

  .section {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .news-card,
  .overview-card {
    page-break-inside: avoid;
    break-inside: avoid;
  }
}

/* ================================================================
   RESPONSIVE REFINEMENTS
   ================================================================ */

@media (max-width: 640px) {
  .section h2::before {
    display: none;
  }

  .epica-cta {
    padding: var(--sp-5);
  }

  .section {
    scroll-margin-top: calc(var(--header-h) + var(--bottom-nav-h) + 12px);
  }
}

@media (min-width: 641px) and (max-width: 899px) {
  .news-grid,
  .overview-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sezione h2::before {
    width: 3px;
    height: 24px;
    margin-right: 10px;
  }
}

/* ================================================================
   DARK MODE ENHANCEMENTS
   ================================================================ */

@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .section + .section::before {
    background: linear-gradient(
      90deg,
      transparent 0%,
      rgba(255, 204, 51, 0.6) 50%,
      transparent 100%
    );
  }

  :root:not(.force-light) .skeleton {
    background: linear-gradient(
      90deg,
      var(--ic-surface) 0%,
      var(--ic-surface-2) 50%,
      var(--ic-surface) 100%
    );
  }

  :root:not(.force-light) .search-form input {
    background: var(--ic-surface);
    border-color: var(--ic-border);
    color: var(--ic-text);
  }

  :root:not(.force-light) .search-form input:focus {
    border-color: #FFCC33;
    box-shadow: 0 0 0 3px rgba(255, 204, 51, 0.15);
  }
}

.force-dark .section + .section::before {
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 204, 51, 0.6) 50%,
    transparent 100%
  );
}

.force-dark .skeleton {
  background: linear-gradient(
    90deg,
    #162d54 0%,
    #1e3a6b 50%,
    #162d54 100%
  );
}

.force-light .section + .section::before {
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(217, 168, 48, 0.5) 50%,
    transparent 100%
  );
}

.force-light .skeleton {
  background: linear-gradient(
    90deg,
    #f6f9fc 0%,
    #eef3f9 50%,
    #f6f9fc 100%
  );
}

/* ================================================================
   ANIMATION & TRANSITION REFINEMENTS
   ================================================================ */

@media (prefers-reduced-motion: no-preference) {
  .bottom-nav__item {
    transition: color 150ms ease, background 150ms ease;
  }

  .comune-tabs__btn {
    transition: color 150ms ease, border-color 150ms ease;
  }

  .news-card,
  .overview-card {
    transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 250ms ease,
                background 150ms ease;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bottom-nav__item,
  .comune-tabs__btn,
  .news-card,
  .overview-card {
    transition: none;
  }

  .skeleton {
    animation: none;
  }
}

/* ================================================================
   UTILITY CLASSES
   ================================================================ */

/* For JS-based cursor hiding in kiosk mode */
.kiosk-cursor-hidden {
  cursor: none;
}

.kiosk-cursor-hidden * {
  cursor: none;
}

/* High contrast mode support */
@media (prefers-contrast: more) {
  .bottom-nav__item.is-active {
    font-weight: 700;
  }

  .section h2::before {
    width: 5px;
  }

  button:focus-visible,
  a:focus-visible,
  input:focus-visible {
    outline-width: 3px;
  }
}

/* Forced colors mode (Windows high contrast) */
@media (forced-colors: active) {
  .bottom-nav {
    border-top: 2px solid CanvasText;
  }

  .bottom-nav__item {
    forced-color-adjust: none;
  }

  .bottom-nav__item.is-active {
    forced-color-adjust: none;
    color: Highlight;
  }

  .section h2::before {
    forced-color-adjust: none;
    background: Highlight;
  }
}

/* ================================================================
   v27.1 - LEGGIBILITA CARD DARK MODE
   Fix contrasto percettivo su tutte le card (scuole, servizi,
   numeri utili, trasporti, sanita, cultura, info-list).
   Problema: sfondo card #0f1e34 troppo vicino a bg #0a1f3d,
   testi muted (.item-meta) a .8rem illeggibili, link poco visibili.
   ================================================================ */

/* --- A. Sfondo card piu chiaro per stacco visivo --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuola-card,
  :root:not(.force-light) .info-list li,
  :root:not(.force-light) .card {
    background: #162d54;
    border-color: rgba(255,255,255,.14);
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
  }
  :root:not(.force-light) .scuola-card:hover,
  :root:not(.force-light) .info-list li:hover,
  :root:not(.force-light) .card:hover {
    border-color: #f6b93b;
    box-shadow: 0 6px 20px rgba(0,0,0,.35);
  }
}
:root.force-dark .scuola-card,
:root.force-dark .info-list li,
:root.force-dark .card {
  background: #162d54;
  border-color: rgba(255,255,255,.14);
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
}
:root.force-dark .scuola-card:hover,
:root.force-dark .info-list li:hover,
:root.force-dark .card:hover {
  border-color: #f6b93b;
  box-shadow: 0 6px 20px rgba(0,0,0,.35);
}

/* --- B. Titoli card: bianco pieno (era color ereditato o muted) --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuola-card__title,
  :root:not(.force-light) .info-list .item-title,
  :root:not(.force-light) .card h3 {
    color: #ffffff !important;
    font-size: 1rem;
  }
}
:root.force-dark .scuola-card__title,
:root.force-dark .info-list .item-title,
:root.force-dark .card h3 {
  color: #ffffff !important;
  font-size: 1rem;
}

/* --- C. Sottotitoli (tipo struttura): piu luminosi --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuola-card__tipo {
    color: #b8c5d9;
    font-size: .82rem;
    font-weight: 500;
  }
}
:root.force-dark .scuola-card__tipo {
  color: #b8c5d9;
  font-size: .82rem;
  font-weight: 500;
}

/* --- D. Testo meta (indirizzo, telefono, email): piu grande e luminoso --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuola-card__body .item-meta,
  :root:not(.force-light) .info-list .item-meta,
  :root:not(.force-light) .card__meta {
    color: #dbe4f0 !important;
    font-size: .85rem;
    line-height: 1.5;
  }
}
:root.force-dark .scuola-card__body .item-meta,
:root.force-dark .info-list .item-meta,
:root.force-dark .card__meta {
  color: #dbe4f0 !important;
  font-size: .85rem;
  line-height: 1.5;
}

/* --- E. Link dentro card: giallo dorato ben visibile + underline --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuola-card__body .item-meta a,
  :root:not(.force-light) .info-list a,
  :root:not(.force-light) .card a:not(.btn-primary):not(.btn-outline) {
    color: #ffd966 !important;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
  }
  :root:not(.force-light) .scuola-card__body .item-meta a:hover,
  :root:not(.force-light) .info-list a:hover,
  :root:not(.force-light) .card a:not(.btn-primary):not(.btn-outline):hover {
    color: #ffe699 !important;
    text-decoration-thickness: 2px;
  }
}
:root.force-dark .scuola-card__body .item-meta a,
:root.force-dark .info-list a,
:root.force-dark .card a:not(.btn-primary):not(.btn-outline) {
  color: #ffd966 !important;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
:root.force-dark .scuola-card__body .item-meta a:hover,
:root.force-dark .info-list a:hover,
:root.force-dark .card a:not(.btn-primary):not(.btn-outline):hover {
  color: #ffe699 !important;
  text-decoration-thickness: 2px;
}

/* --- F. Badge (INFANZIA, PRIMARIA, ecc.): piu leggibile --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuola-card__badge,
  :root:not(.force-light) .badge {
    background: rgba(255,204,51,.22);
    color: #ffd966;
    border-color: rgba(255,204,51,.45);
    font-size: .72rem;
  }
}
:root.force-dark .scuola-card__badge,
:root.force-dark .badge {
  background: rgba(255,204,51,.22);
  color: #ffd966;
  border-color: rgba(255,204,51,.45);
  font-size: .72rem;
}

/* --- G. Icone emoji nelle card: dimensione minima leggibile --- */
.scuola-card__icon {
  font-size: 1.5rem;
}
.info-list li .item-meta::before {
  font-size: 1.1rem;
}

/* --- H. Spaziatura card body per respiro visivo --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuola-card {
    padding: 1rem 1.1rem;
    gap: .6rem;
  }
  :root:not(.force-light) .scuola-card__body {
    gap: .35rem;
  }
}

/* --- I. Gruppo titoli sezione (INFANZIA, PRIMARIA): risalto --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .scuole-gruppo__titolo {
    color: #FFCC33 !important;
    border-bottom-color: rgba(255,204,51,.5);
    font-size: 1.1rem;
    letter-spacing: .08em;
  }
  :root:not(.force-light) .scuole-gruppo__count {
    background: #FFCC33;
    color: #0a1f3d;
    font-size: .8rem;
    min-width: 1.8rem;
    height: 1.8rem;
  }
}
:root.force-dark .scuole-gruppo__titolo {
  color: #FFCC33 !important;
  border-bottom-color: rgba(255,204,51,.5);
  font-size: 1.1rem;
  letter-spacing: .08em;
}
:root.force-dark .scuole-gruppo__count {
  background: #FFCC33;
  color: #0a1f3d;
  font-size: .8rem;
  min-width: 1.8rem;
  height: 1.8rem;
}

/* --- J. Section titles h2 dentro container scuro: contrasto --- */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) .comune-section h2,
  :root:not(.force-light) .comune-panel h2,
  :root:not(.force-light) section > h2 {
    color: #FFCC33 !important;
    font-size: 1.35rem;
  }
  :root:not(.force-light) .comune-section > p,
  :root:not(.force-light) .comune-panel > p {
    color: #dbe4f0;
    font-size: .95rem;
    line-height: 1.6;
  }
}

/* ================================================================
   v27.2 - MOBILE: HIDE FOOTER + INFO OVERLAY
   ================================================================ */
@media (max-width: 899px) {
  .site-footer { display: none !important; }
}

/* Info overlay (same pattern as meteo overlay) */
.info-overlay {
  position: fixed; inset: 0; z-index: 10100;
  background: linear-gradient(170deg, #0a1628 0%, #0f2442 100%);
  transform: translateY(100%);
  transition: transform .32s cubic-bezier(.4,0,.2,1);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  display: flex; flex-direction: column;
}
.info-overlay.is-open { transform: translateY(0); }
.info-overlay__header {
  position: sticky; top: 0; z-index: 2;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px;
  background: rgba(10,22,40,.95);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(255,204,51,.15);
}
.info-overlay__title {
  font-size: 1.05rem; font-weight: 800; color: #FFCC33;
  display: flex; align-items: center; gap: 8px;
}
.info-overlay__close {
  width: 36px; height: 36px; border-radius: 50%;
  border: none; background: rgba(255,255,255,.08);
  color: #fff; font-size: 16px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.info-overlay__body {
  flex: 1; padding: 20px 18px 100px;
}
.info-overlay__section { margin-bottom: 28px; }
.info-overlay__section h4 {
  font-size: .78rem; font-weight: 800; text-transform: uppercase;
  letter-spacing: 1px; color: #FFCC33; margin: 0 0 12px;
}
.info-overlay__section p {
  font-size: .85rem; color: #cbd5e1; line-height: 1.6; margin: 0 0 10px;
}
.info-overlay__links {
  list-style: none; margin: 0; padding: 0;
}
.info-overlay__links li { margin-bottom: 8px; }
.info-overlay__links a {
  color: #e2e8f0; font-size: .88rem; text-decoration: none;
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px; border-radius: 8px;
  background: rgba(255,255,255,.04);
  transition: background .2s;
}
.info-overlay__links a:hover,
.info-overlay__links a:focus { background: rgba(255,204,51,.1); color: #FFCC33; }
.info-overlay__links a i { width: 18px; text-align: center; color: #FFCC33; font-size: .85rem; }
.info-overlay__social {
  display: flex; gap: 12px; margin-top: 12px;
}
.info-overlay__social a {
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,.06);
  color: #e2e8f0; font-size: 18px;
  display: flex; align-items: center; justify-content: center;
  text-decoration: none; transition: background .2s, color .2s;
}
.info-overlay__social a:hover { background: rgba(255,204,51,.15); color: #FFCC33; }
.info-overlay__cta {
  display: block; width: 100%; text-align: center;
  padding: 14px; border-radius: 10px;
  background: linear-gradient(135deg, #FFCC33, #f0b800);
  color: #0a1f3d; font-size: .9rem; font-weight: 800;
  text-decoration: none; margin-top: 16px;
}
.info-overlay__copy {
  text-align: center; font-size: .75rem; color: rgba(255,255,255,.35);
  margin-top: 24px; padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.06);
}

/* ================================================================
   v27.2 - ENHANCED SEARCH OVERLAY
   ================================================================ */
.search-overlay {
  position: fixed; inset: 0; z-index: 10200;
  background: rgba(10,22,40,.97);
  backdrop-filter: blur(12px);
  transform: translateY(100%);
  transition: transform .28s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column;
}
.search-overlay.is-open { transform: translateY(0); }
.search-overlay__header {
  display: flex; align-items: center; gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255,204,51,.12);
}
.search-overlay__input {
  flex: 1; padding: 10px 14px;
  border: 2px solid rgba(255,204,51,.25); border-radius: 10px;
  background: rgba(255,255,255,.06);
  color: #fff; font-size: .95rem;
  outline: none;
}
.search-overlay__input:focus { border-color: #FFCC33; }
.search-overlay__input::placeholder { color: rgba(255,255,255,.35); }
.search-overlay__close {
  width: 36px; height: 36px; border-radius: 50%;
  border: none; background: rgba(255,255,255,.08);
  color: #fff; font-size: 16px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.search-overlay__body {
  flex: 1; overflow-y: auto; padding: 8px 16px 100px;
  -webkit-overflow-scrolling: touch;
}
.search-result-group { margin-bottom: 16px; }
.search-result-group__title {
  font-size: .7rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1px; color: #FFCC33; padding: 8px 0 4px;
  border-bottom: 1px solid rgba(255,204,51,.1); margin-bottom: 6px;
}
.search-result-item {
  display: block; padding: 10px 12px; border-radius: 8px;
  text-decoration: none; color: #e2e8f0; font-size: .88rem;
  transition: background .15s;
}
.search-result-item:hover,
.search-result-item:focus { background: rgba(255,204,51,.08); }
.search-result-item__sub {
  font-size: .75rem; color: rgba(255,255,255,.4); margin-top: 2px;
}
.search-result-item mark {
  background: rgba(255,204,51,.25); color: #FFCC33;
  border-radius: 2px; padding: 0 2px;
}
.search-empty {
  text-align: center; padding: 40px 16px; color: rgba(255,255,255,.35);
  font-size: .9rem;
}

/* ================================================================
   v27.2 - BRINDISI MAPPA MULTIMEDIALE (always visible, PRO badge)
   ================================================================ */
.mappa-multimediale-showcase {
  padding: 40px 0 32px;
  background: linear-gradient(170deg, #0b1b34 0%, #0f2442 50%, #0b1b34 100%);
  border-top: 1px solid rgba(255,204,51,.12);
}
.mappa-multimediale-showcase .container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
.mappa-mm__header {
  display: flex; align-items: center; gap: 12px; margin-bottom: 16px;
}
.mappa-mm__header h2 {
  font-size: 1.3rem; font-weight: 800; color: #fff; margin: 0;
}
.mappa-mm__badge-pro {
  display: inline-block; padding: 3px 10px;
  border-radius: 20px; font-size: .65rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1.2px;
  background: linear-gradient(135deg, #FFCC33, #f0b800);
  color: #0a1f3d;
}
.mappa-mm__lead {
  font-size: .92rem; color: #b8c5d9; line-height: 1.6;
  margin: 0 0 20px; max-width: 700px;
}
.mappa-mm__frame {
  width: 100%; height: 520px; border: none; border-radius: 12px;
  background: #0a1628;
}
@media (max-width: 700px) { .mappa-mm__frame { height: 380px; } }
.mappa-mm__actions {
  display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap;
}
.mappa-mm__actions a {
  padding: 10px 18px; border-radius: 8px;
  font-size: .85rem; font-weight: 700; text-decoration: none;
  display: inline-flex; align-items: center; gap: 6px;
}
.mappa-mm__actions .btn-primary {
  background: linear-gradient(135deg, #FFCC33, #f0b800);
  color: #0a1f3d;
}
.mappa-mm__actions .btn-outline {
  border: 1.5px solid rgba(255,204,51,.4);
  color: #FFCC33; background: transparent;
}

/* ─── v28.1: Portami GPS link ─── */
.portami-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: .78rem;
  font-weight: 700;
  text-decoration: none;
  background: linear-gradient(135deg, #2196F3, #1976D2);
  color: #fff !important;
  transition: transform .15s, box-shadow .15s;
  white-space: nowrap;
}
.portami-link:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(33,150,243,.35);
}
[data-theme="light"] .portami-link {
  background: linear-gradient(135deg, #1976D2, #1565C0);
}

/* ─── v28.1: Accessibility badges ─── */
.acc-badge {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: .7rem;
  font-weight: 700;
  margin-left: 6px;
  vertical-align: middle;
  white-space: nowrap;
}
.acc-badge.acc-interna {
  background: rgba(76,175,80,.18);
  color: #4CAF50;
  border: 1px solid rgba(76,175,80,.3);
}
.acc-badge.acc-esterna {
  background: rgba(33,150,243,.18);
  color: #2196F3;
  border: 1px solid rgba(33,150,243,.3);
}
[data-theme="light"] .acc-badge.acc-interna {
  background: rgba(76,175,80,.12);
  color: #2E7D32;
  border-color: rgba(76,175,80,.25);
}
[data-theme="light"] .acc-badge.acc-esterna {
  background: rgba(33,150,243,.12);
  color: #1565C0;
  border-color: rgba(33,150,243,.25);
}

/* ============================================================
   FAQ Section - 100 domande accordion
   ============================================================ */
.faq-section{background:linear-gradient(180deg,#060e1e,#0a1628);padding:56px 24px 48px;color:#fff}
.faq-inner{max-width:900px;margin:0 auto}
.faq-section h2{font-size:1.8rem;font-weight:800;text-align:center;margin-bottom:8px;color:#fff}
.faq-section .faq-sub{text-align:center;color:rgba(255,255,255,.55);font-size:.9rem;margin-bottom:32px}
.faq-cats{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:28px}
.faq-cat-btn{padding:6px 14px;border-radius:20px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:rgba(255,255,255,.65);font-size:.72rem;font-weight:700;cursor:pointer;transition:all .2s;font-family:inherit;text-transform:uppercase;letter-spacing:.4px}
.faq-cat-btn:hover,.faq-cat-btn.active{background:rgba(255,204,51,.12);border-color:rgba(255,204,51,.35);color:#FFCC33}
.faq-item{border-bottom:1px solid rgba(255,255,255,.06)}
.faq-item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:16px 4px;cursor:pointer;font-size:.9rem;font-weight:600;color:#e2e8f0;transition:color .2s;gap:12px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';font-size:1.2rem;font-weight:300;color:rgba(255,255,255,.3);transition:transform .2s;flex-shrink:0}
.faq-item[open] summary::after{content:'-';color:#FFCC33}
.faq-item[open] summary{color:#FFCC33}
.faq-item .faq-answer{padding:0 4px 18px 0;font-size:.84rem;color:rgba(255,255,255,.6);line-height:1.7;max-width:820px}
.faq-show-more{text-align:center;margin-top:24px}
.faq-show-more button{padding:10px 28px;border-radius:10px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);color:rgba(255,255,255,.7);font-size:.82rem;font-weight:700;cursor:pointer;transition:all .2s;font-family:inherit}
.faq-show-more button:hover{background:rgba(255,204,51,.1);border-color:rgba(255,204,51,.3);color:#FFCC33}
@media(max-width:640px){
  .faq-section{padding:40px 16px 36px}
  .faq-section h2{font-size:1.4rem}
  .faq-item summary{font-size:.84rem;padding:14px 2px}
}

/* ============================================================
   FAQ Modal Overlay
   ============================================================ */
.faq-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.faq-modal[hidden]{display:none}
.faq-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.faq-modal__panel{position:relative;z-index:1;width:94%;max-width:960px;max-height:88vh;overflow-y:auto;border-radius:20px;box-shadow:0 32px 80px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08)}
.faq-modal__panel .faq-section{border-radius:20px;padding-top:48px}
.faq-modal__close{position:absolute;top:14px;right:18px;z-index:10;width:40px;height:40px;border:none;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .25s;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.faq-modal__close:hover{background:rgba(255,204,51,.2);color:#FFCC33;transform:scale(1.1)}
@media(max-width:640px){
  .faq-modal__panel{width:100%;max-width:100%;max-height:100vh;border-radius:0}
  .faq-modal__panel .faq-section{border-radius:0;padding-top:56px}
  .faq-modal__close{top:10px;right:12px}
}

/* ================================================================
   Pagine comuni: nascondere footer
   ================================================================ */
body.page-comune .site-footer { display: none !important; }

/* ================================================================
   Mappa multimediale: overlay fullscreen
   ================================================================ */
.mappa-fs-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mappa-fs-overlay[hidden] { display: none; }
.mappa-fs-overlay__frame {
  width: 100%;
  height: 100%;
  border: none;
}
.mappa-fs-overlay__close {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 100000;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 50%;
  background: rgba(10,20,40,.8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .2s ease;
}
.mappa-fs-overlay__close:hover {
  background: rgba(255,204,51,.2);
  border-color: rgba(255,204,51,.5);
  color: #FFCC33;
  transform: scale(1.08);
}