/* extras.css — aggiunte comuni a tutte le pagine (accessibilità, legale, lingua). */
:root{ --ash-dim:#6F6879; }   /* grigio secondario: contrasto 5,2:1 su sfondo chiaro (prima 3,4:1) */

/* link "salta al contenuto" per tastiera e screen reader */
.skip-link{
  position:fixed; left:12px; top:-60px; z-index:10000;
  background:#1A1822; color:#fff; padding:10px 16px; border-radius:3px;
  font-size:13.5px; font-weight:600; transition:top .2s ease;
}
.skip-link:focus{ top:12px; }

/* selettore lingua: pulsante a sé, staccato dai social (divisore + spazio), con globo e nome della lingua */
.lang-switch{
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  height:34px; padding:0 15px 0 11px; border-radius:17px;
  border:1px solid rgba(131,56,236,0.34);
  font-family:var(--body); font-size:12.5px; font-weight:600; letter-spacing:0.01em; line-height:1;
  color:var(--ash); white-space:nowrap;
  transition:border-color .25s ease, color .25s ease, background .25s ease, transform .25s ease;
}
.lang-switch svg{ width:16px; height:16px; flex:none; }
.lang-switch:hover{ border-color:var(--amber); color:var(--amber); background:rgba(131,56,236,0.06); transform:translateY(-2px); }
.nav:not(.scrolled) .lang-switch{ border-color:rgba(255,255,255,0.55); color:#fff; }
.nav:not(.scrolled) .lang-switch:hover{ background:rgba(255,255,255,0.14); color:#fff; border-color:#fff; }
body.subpage .nav .lang-switch{ border-color:rgba(131,56,236,0.34); color:var(--ash); }
body.subpage .nav .lang-switch:hover{ border-color:var(--amber); color:var(--amber); background:rgba(131,56,236,0.06); }
.nav-tools{ display:flex; align-items:center; gap:12px; flex-shrink:0; }
.nav-tools .nav-social{ gap:10px; }
.nav-sep{ width:1px; height:26px; background:rgba(131,56,236,0.28); margin:0 6px; flex:none; }
.brand, .nav-links a{ white-space:nowrap; }
@media (min-width:1121px) and (max-width:1320px){ .nav-links{ gap:22px; } }
.nav:not(.scrolled) .nav-sep{ background:rgba(255,255,255,0.42); }
body.subpage .nav .nav-sep{ background:rgba(131,56,236,0.28); }
/* ---------- menu mobile: scheda centrata, più piccola, con margini su tutti i lati ---------- */
.mobile-menu{
  inset:0 0 auto 0; height:100vh; height:100dvh; box-sizing:border-box;
  padding:88px 22px 28px;
  justify-content:flex-start; gap:0;
  overflow-y:auto; overscroll-behavior:contain;
  background:rgba(240,234,252,0.93);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
}
.mobile-menu-card{
  margin:auto; width:min(320px, 100%); box-sizing:border-box;
  display:flex; flex-direction:column; align-items:center;
  padding:clamp(8px, 1.6vh, 14px) 22px clamp(16px, 2.6vh, 24px);
  background:#fff; border:1px solid rgba(131,56,236,0.16); border-radius:26px;
  box-shadow:0 26px 60px -24px rgba(70,30,140,0.34), 0 2px 8px rgba(70,30,140,0.06);
}
.mobile-menu-card > a{
  display:block; width:100%; box-sizing:border-box; text-align:center;
  font-size:clamp(19px, 3.1vh, 23px); line-height:1.2;
  padding:clamp(9px, 1.9vh, 15px) 0;
  border-bottom:1px solid rgba(131,56,236,0.1);
}
.mobile-menu-card > a:last-of-type{ border-bottom:0; }
.mobile-menu-card > a[aria-current="page"]{ color:var(--amber); }
.mobile-menu-social{ margin-top:clamp(8px, 1.6vh, 14px); gap:14px; }
.mobile-menu-social a{ width:36px; height:36px; }
.mobile-menu-lang{
  display:flex; align-items:center; justify-content:center; gap:14px;
  width:100%; margin-top:clamp(12px, 2.2vh, 18px); padding-top:clamp(12px, 2.2vh, 18px); border-top:1px solid rgba(131,56,236,0.16);
}
.mobile-menu-lang-label{ font-family:var(--mono); font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ash-dim); }
.mobile-menu .lang-switch{ font-family:var(--body); font-size:13.5px; height:38px; padding:0 18px 0 13px; margin:0; border-color:rgba(131,56,236,0.4); color:var(--ash); }
.mobile-menu .lang-switch:hover{ color:var(--amber); }
@media (max-width:360px){ .mobile-menu{ padding-left:16px; padding-right:16px; } .mobile-menu-card{ padding-left:16px; padding-right:16px; } }

/* riga legale in fondo al footer: piccola, discreta */
.footer-legal{
  max-width:var(--container); margin:0 auto;
  padding:18px var(--edge) 0;
  font-size:11.5px; line-height:1.7; color:var(--ash-dim);
  margin-top:26px; position:relative;
  display:flex; flex-wrap:wrap; gap:4px 16px; justify-content:space-between;
}
.footer-legal a{ color:var(--ash-dim); text-decoration:underline; text-underline-offset:2px; }
.footer-legal a:hover{ color:var(--amber); }
.footer-legal span{ white-space:nowrap; }
@media (max-width:420px){ .footer-legal span{ white-space:normal; } }   /* «Registered office…» in inglese sforava a 320 px */
footer{ padding-bottom:26px; }

/* consenso nel modulo */
.contact-field .contact-consent, .contact-consent{
  display:flex; gap:10px; align-items:flex-start;
  font-family:var(--body); font-size:13px; line-height:1.55; color:var(--ash);
  letter-spacing:0; text-transform:none;
}
.contact-consent input{ margin-top:3px; flex-shrink:0; width:16px; height:16px; accent-color:#8338EC; }
.contact-consent a{ color:var(--amber); text-decoration:underline; text-underline-offset:2px; }
.contact-hint{ font-size:12px; color:var(--ash-dim); margin:0; }

/* pulsanti secondari usati nelle nuove sezioni */
.btn-outline{
  border-color:rgba(131,56,236,0.4); color:var(--amber); background:transparent;
}
.btn-outline:hover{ border-color:var(--amber); background:rgba(131,56,236,0.06); transform:translateY(-2px); }

/* nav: gruppo social + lingua. Sotto gli 860 px i social restano nel menu e il selettore di lingua resta SEMPRE nella barra, accanto al pulsante del menu */
.lang-switch .ls-code{ display:none; }
@media (max-width:860px){
  .nav-social, .nav-sep{ display:none; }
  .nav .wrap{ gap:10px; }
  .nav-tools{ margin-left:auto; }
  .nav-tools .lang-switch{ height:34px; padding:0 13px 0 10px; gap:6px; font-size:13px; font-weight:700; background:rgba(131,56,236,0.07); border-color:rgba(131,56,236,0.4); }
  .nav:not(.scrolled) .nav-tools .lang-switch{ background:rgba(255,255,255,0.16); border-color:rgba(255,255,255,0.7); }
  body.subpage .nav .nav-tools .lang-switch{ background:rgba(131,56,236,0.07); border-color:rgba(131,56,236,0.4); }
  body.menu-open .nav .nav-tools .lang-switch{ color:var(--ink); background:rgba(131,56,236,0.07); border-color:rgba(131,56,236,0.4); }
}
@media (max-width:520px){
  .nav-tools .lang-switch .ls-full{ display:none; }
  .nav-tools .lang-switch .ls-code{ display:inline; letter-spacing:0.06em; }
  .nav-tools .lang-switch{ padding:0 12px 0 9px; }
  .brand{ font-size:17.5px; }
}
@media (max-width:360px){ .brand{ font-size:16px; } .nav .wrap{ gap:6px; } .nav-tools .lang-switch{ padding:0 10px 0 8px; } }

/* ---------- card degli itinerari (home e pagina itinerari) ---------- */
.itin-index{ display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; margin-top:8px; }
@media (max-width:980px){ .itin-index{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:560px){ .itin-index{ grid-template-columns:1fr; } }
.itin-card{
  display:flex; flex-direction:column; gap:10px; padding:22px 20px 22px; background:#fff;
  border:1px solid rgba(131,56,236,0.16); border-top:4px solid var(--ic, #8338EC); border-radius:3px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.itin-card:hover{ transform:translateY(-4px); box-shadow:0 22px 34px -22px color-mix(in srgb, var(--ic, #8338EC) 65%, transparent); }
.itin-card h3{ font-family:var(--display); font-weight:600; font-size:19px; line-height:1.25; margin:0; color:var(--ink); }
.itin-card p{ font-size:13.5px; line-height:1.6; color:var(--ash); margin:0; }
.itin-meta{ display:flex; flex-wrap:wrap; gap:6px 12px; font-family:var(--mono); font-size:11px; color:var(--ash); margin-top:auto; padding-top:6px; }


/* ---------- home: sezione itinerari ---------- */
.itin-teaser-head{ display:flex; flex-wrap:wrap; gap:14px 30px; align-items:flex-end; justify-content:space-between; margin-bottom:34px; }
.itin-teaser-head .section-head{ margin-bottom:0; }

/* ---------- link scheda del luogo, sotto la foto della mappa ---------- */
.map-info-links{ display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; margin-top:2px; }
.map-info-links .map-info-maps-link{ margin-top:0; }
.map-info-links a[hidden]{ display:none; }

/* ---------- progetto: chi c'è dietro / per chi vuole esserci ---------- */
.about-box{
  display:grid; grid-template-columns:1fr 1.2fr; gap:36px; align-items:start;
  background:#fff; border:1px solid rgba(131,56,236,0.16); border-left:4px solid var(--amber); border-radius:3px; padding:30px 32px;
}
@media (max-width:860px){ .about-box{ grid-template-columns:1fr; gap:14px; padding:24px 22px; } }
.about-box h3{ font-family:var(--display); font-weight:600; font-size:22px; line-height:1.25; margin:0; color:var(--ink); }
.about-box p{ font-size:15px; line-height:1.75; color:var(--ash); margin:0 0 10px; }
.about-box p:last-child{ margin-bottom:0; }
.about-box a{ color:var(--amber); text-decoration:underline; text-underline-offset:3px; }

.collab-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; }
@media (max-width:980px){ .collab-grid{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:560px){ .collab-grid{ grid-template-columns:1fr; } }
.collab-card{
  display:flex; flex-direction:column; gap:10px; padding:24px 22px 22px; background:#fff;
  border:1px solid rgba(131,56,236,0.16); border-top:4px solid var(--cc, #8338EC); border-radius:3px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.collab-card:hover{ transform:translateY(-4px); box-shadow:0 22px 34px -22px color-mix(in srgb, var(--cc, #8338EC) 65%, transparent); }
.collab-card h3{ font-family:var(--display); font-weight:600; font-size:19px; line-height:1.25; margin:0; color:var(--ink); }
.collab-card p{ font-size:13.5px; line-height:1.65; color:var(--ash); margin:0; }
.collab-card .collab-go{ margin-top:auto; padding-top:6px; font-family:var(--mono); font-size:11.5px; letter-spacing:0.03em; color:var(--amber); }

/* ---------- modulo: errore ---------- */
.contact-error{ font-size:13.5px; color:#B0124F; margin:0; }


/* ---------- link "Scheda del luogo" accanto ad "Apri in Google Maps" ---------- */
.map-info-page-link{ font-weight:600; }
.map-info-page-link:hover{ text-decoration:underline; }

/* ---------- link testuali dentro i paragrafi ---------- */
.link-inline{ color:var(--amber); text-decoration:underline; text-underline-offset:3px; }
.link-inline:hover{ color:var(--amber-soft); }

/* ---------- sezione itinerari nella home ---------- */
.itin-teaser{ padding-top:0; padding-bottom:20px; }

/* ---------- mappe: cursore nativo ---------- */
html.custom-cursor [role="application"], html.custom-cursor [role="application"] *{ cursor:auto !important; }

/* ---------- menu: cinque voci + social + lingua su schermi medi (le icone social escono dalla barra solo sotto i 1024 px) ---------- */
@media (min-width:861px) and (max-width:1120px){
  .nav-links{ gap:18px; }
  .nav .wrap{ gap:16px; }
}
@media (min-width:861px) and (max-width:1023px){
  .nav-social, .nav-sep{ display:none; }
}

.footer-legal::before{ content:''; position:absolute; top:0; left:var(--edge); right:var(--edge); height:1px; background:rgba(131,56,236,0.12); }

/* titoli delle pagine interne: l'ombra pensata per la foto scura dell'home sporca il fondo chiaro */
body.subpage h1{ text-shadow:none; }

/* elenco della mappa: i pulsanti avevano il bordo predefinito del browser (nero, in rilievo) su lato alto e destro */
.map-list-item{ border-top:0; border-right:0; font:inherit; color:inherit; }

.contact-field .contact-consent{ font-family:var(--body); font-size:13px; letter-spacing:0; text-transform:none; color:var(--ash); }

/* titoli senza parole orfane sull'ultima riga (utile soprattutto in inglese, dove le righe vanno a capo in altri punti) */
h1, h2, h3{ text-wrap:balance; }
p, li{ text-wrap:pretty; }

/* menu mobile aperto sulla home: il marchio e il pulsante erano bianchi su fondo quasi bianco */
body.menu-open .nav:not(.scrolled) .brand{ background:none; -webkit-text-fill-color:var(--ink); color:var(--ink); }
body.menu-open .nav:not(.scrolled) .nav-toggle span{ background:var(--ink); }

/* ---------- card curiosità: link alla scheda del luogo ---------- */
.curio-more{ display:inline-block; margin-top:12px; font-family:var(--mono); font-size:11.5px; letter-spacing:0.03em; color:#B0124F; text-decoration:underline; text-underline-offset:3px; }
.curio-more::after{ content:' →'; }
.curio-more:hover{ color:var(--ink); }

/* elenco statico dei luoghi (senza JavaScript); la mappa lo sostituisce appena parte */
.map-list-static{ list-style:none; margin:0; padding:14px 16px; display:grid; gap:8px; font-size:14px; line-height:1.5; }
.map-list-static a{ color:var(--ink); font-weight:600; text-decoration:underline; text-decoration-color:rgba(131,56,236,0.4); text-underline-offset:3px; }
.map-list-static span{ color:var(--ash); font-size:12.5px; }

/* ---------- stampa: pagine di luogo e itinerari leggibili su carta ---------- */
@media print{
  @page{ margin:16mm 14mm; }
  html, body{ background:#fff !important; }
  body{ color:#000; }
  .nav, .mobile-menu, .skip-link, #backToTop, #cursorDot, .cursor-dot, .top-bar, .btn, .place-actions, .itin-map-actions, .cta-band,
  .itin-map, .itin-map-wrap .leaflet-container, .route-chips, .share-btn, footer .footer-social, .reveal-hide{ display:none !important; }
  .reveal{ opacity:1 !important; transform:none !important; }
  .place-page-head, .page-header{ padding:0 0 12px !important; background:none !important; }
  .place-photo{ box-shadow:none !important; max-height:70mm; }
  .place-photo img{ max-height:70mm; object-fit:cover; }
  .place-grid{ grid-template-columns:1fr 1fr !important; gap:16px !important; }
  .place-body-grid{ grid-template-columns:1.5fr 1fr !important; gap:20px !important; }
  .place-facts{ position:static !important; }
  .place-story p, .place-lead{ font-size:11.5pt; line-height:1.55; }
  .info-grid{ grid-template-columns:1fr 1fr 1fr !important; }
  .steps, .step, .step-card, .info-card, .place-facts, .itin-fact{ break-inside:avoid; }
  .itin-body{ display:block !important; }
  .source-list a::after{ content:' (' attr(href) ')'; font-size:8.5pt; color:#555; word-break:break-all; }
  .src-host{ display:none; }
  a{ color:#000 !important; text-decoration:none !important; }
  footer{ border-top:1px solid #999; padding:10px 0 0 !important; background:none !important; }
}

/* campi di testo: il bordo viola non bastava come segno di focus da tastiera, si aggiunge il contorno */
.contact-field input:focus-visible, .contact-field select:focus-visible, .contact-field textarea:focus-visible, .map-search input:focus-visible{
  outline:2px solid var(--amber); outline-offset:2px;
}

/* ---------- foto: copertine delle card itinerario ---------- */
.itin-card .itin-cover{
  display:block; margin:-22px -20px 6px; aspect-ratio:16/9; overflow:hidden; background:var(--stone-2, #EFEAF8);
}
.itin-card .itin-cover img{ display:block; width:100%; height:100%; object-fit:cover; object-position:var(--fx, 50% 50%); transition:transform .7s ease; }
.itin-card:hover .itin-cover img{ transform:scale(1.05); }

/* ---------- galleria della home ---------- */
.gallery{ padding:72px 0 84px; overflow:hidden; --gal-pad:max(var(--edge), calc((100vw - var(--container)) / 2 + var(--edge))); }
.gal-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px 30px; flex-wrap:wrap; margin-bottom:30px; }
.gal-head .section-head{ margin-bottom:0; }
.gal-ctrl{ display:flex; gap:10px; flex:none; }
.gal-ctrl[hidden]{ display:none; }
.gal-btn{
  width:46px; height:46px; border-radius:50%; border:1px solid rgba(131,56,236,0.35); background:#fff; color:var(--ink);
  display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0;
  transition:border-color .25s ease, color .25s ease, background .25s ease, opacity .25s ease;
}
.gal-btn svg{ width:20px; height:20px; }
.gal-btn:hover:not(:disabled){ border-color:var(--amber); color:var(--amber); background:rgba(131,56,236,0.06); }
.gal-btn:disabled{ opacity:.35; cursor:default; }
.gal-track{
  display:flex; gap:16px; overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-padding-inline:var(--gal-pad);
  padding:6px var(--gal-pad) 24px; scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
.gal-track::-webkit-scrollbar{ display:none; }
.gal-track:focus-visible{ outline-offset:-3px; }
.gal-item{
  position:relative; flex:0 0 auto; width:clamp(236px, 74vw, 318px); aspect-ratio:4/5; border-radius:8px; overflow:hidden;
  scroll-snap-align:start; background:var(--stone-2, #EFEAF8); isolation:isolate;
  box-shadow:0 22px 38px -26px rgba(60,20,120,0.5); transition:transform .35s ease, box-shadow .35s ease;
}
.gal-item img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:var(--fx, 50% 50%); transition:transform .8s ease; z-index:-2; }
.gal-item::after{ content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(24,10,64,0) 52%, rgba(24,10,64,0.78) 100%); }
.gal-item:hover{ transform:translateY(-4px); box-shadow:0 30px 44px -26px rgba(60,20,120,0.6); }
.gal-item:hover img{ transform:scale(1.05); }
.gal-cap{ position:absolute; left:0; right:0; bottom:0; padding:16px 18px 18px; display:flex; flex-direction:column; gap:4px; color:#fff; }
.gal-cap strong{ font-family:var(--display); font-weight:600; font-size:19px; line-height:1.2; text-shadow:0 1px 10px rgba(24,10,64,0.5); }
.gal-cap em{ font-style:normal; font-family:var(--mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.88); }
@media (max-width:700px){ .gallery{ padding:56px 0 64px; } .gal-head{ margin-bottom:22px; } }

/* ---------- foto in più nelle schede dei luoghi ---------- */
.place-gallery{ padding:0 0 56px; }
.place-gallery-grid{ display:grid; gap:14px; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); }
.place-gallery-grid{ align-items:start; }
.place-gallery-grid.n1{ grid-template-columns:minmax(0, 880px); justify-content:center; }
.place-gallery figure{ margin:0; position:relative; }
.place-gallery img{ display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:6px; background:var(--stone-2, #EFEAF8); }
.place-gallery-grid.n1 img{ aspect-ratio:16/9; }
.place-gallery figcaption{ font-size:12px; color:var(--ash-dim); padding:8px 2px 0; }
@media (prefers-reduced-motion: reduce){ .gal-item, .gal-item img, .itin-card .itin-cover img{ transition:none; } .gal-track{ scroll-behavior:auto; } }
@media print{ .gallery{ display:none; } }

/* ---------- home: foto larga sopra «Come arrivare» ---------- */
.practical-photo{ position:relative; margin:0 0 28px; border-radius:8px; overflow:hidden; aspect-ratio:16/7; background:var(--stone-2, #EFEAF8); box-shadow:0 26px 48px -32px rgba(60,20,120,0.55); }
.practical-photo img{ display:block; width:100%; height:100%; object-fit:cover; object-position:var(--fx, 50% 50%); }
.practical-photo::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(24,10,64,0) 55%, rgba(24,10,64,0.72) 100%); pointer-events:none; }
.practical-photo figcaption{ position:absolute; left:0; right:0; bottom:0; z-index:1; padding:20px 24px 20px; display:flex; flex-direction:column; gap:3px; color:#fff; }
.practical-photo figcaption strong{ font-family:var(--display); font-weight:600; font-size:clamp(17px, 2.2vw, 22px); line-height:1.25; text-shadow:0 1px 12px rgba(24,10,64,0.55); }
.practical-photo figcaption span{ font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.88); }
@media (max-width:700px){ .practical-photo{ aspect-ratio:4/3; margin-bottom:20px; } .practical-photo figcaption{ padding:14px 16px 16px; } }

/* ---------- fascia panoramica a tutta larghezza (compare solo se c'è la foto) ---------- */
.panorama{ margin:0; padding:0; line-height:0; background:var(--stone-2, #EFEAF8); }
.panorama img{ display:block; width:100%; height:auto; max-height:600px; object-fit:cover; object-position:42% 50%; }
@media (max-width:700px){ .panorama img{ aspect-ratio:16/10; object-position:36% 50%; } }

/* =====================================================================
   EVENTI E NOTIZIE (pagina elenco, blocco in home) e PROPONI (modulo)
   ===================================================================== */
.footer-legal .footer-links{ white-space:normal; }
.ev-head-actions{ margin-top:26px; display:flex; flex-wrap:wrap; gap:12px; }
.ev-section{ padding:44px 0 56px; }
.ev-bar{ display:flex; flex-wrap:wrap; gap:14px 28px; align-items:center; justify-content:space-between; margin-bottom:38px; }
.ev-filters{ display:flex; flex-wrap:wrap; gap:8px; }
.ev-filters[hidden]{ display:none; }
.ev-filter{
  font-family:var(--body); font-size:13.5px; font-weight:600; line-height:1; cursor:pointer;
  padding:11px 20px; border-radius:999px; border:1px solid rgba(131,56,236,0.34); background:#fff; color:var(--ash);
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.ev-filter:hover{ border-color:var(--amber); color:var(--amber); }
.ev-filter[aria-pressed="true"]{ background:var(--amber); border-color:var(--amber); color:#fff; }
.ev-filter:focus-visible{ outline:2px solid var(--amber); outline-offset:3px; }
.ev-note{ margin:0; font-size:13.5px; line-height:1.6; color:var(--ash); max-width:540px; }
.ev-block{ margin:0 0 60px; scroll-margin-top:100px; }
.ev-block.ev-off{ display:none; }
.ev-block > h2{ font-family:var(--display); font-weight:600; font-size:clamp(1.55rem, 2.8vw, 2.05rem); line-height:1.2; margin:0 0 22px; color:var(--ink); }
.ev-month{
  display:flex; align-items:center; gap:14px; margin:34px 0 4px;
  font-family:var(--mono); font-weight:500; font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ash);
}
.ev-month::after{ content:''; flex:1; height:1px; background:rgba(131,56,236,0.2); }
.ev-month:first-child{ margin-top:0; }
.ev-list{ display:flex; flex-direction:column; gap:14px; }

.ev-card{
  display:grid; grid-template-columns:92px minmax(0, 1fr); gap:24px; align-items:start;
  padding:22px 26px 22px 22px; background:#fff;
  border:1px solid rgba(131,56,236,0.16); border-left:5px solid var(--ec, #8338EC); border-radius:4px;
  transition:transform .3s ease, box-shadow .3s ease; scroll-margin-top:110px;
}
.ev-card:hover{ transform:translateY(-2px); box-shadow:0 24px 36px -28px color-mix(in srgb, var(--ec, #8338EC) 75%, transparent); }
.ev-card:target{ box-shadow:0 0 0 3px color-mix(in srgb, var(--ec, #8338EC) 45%, transparent); }
.ev-date{
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  padding:12px 6px; min-height:96px; box-sizing:border-box; border-radius:6px;
  background:color-mix(in srgb, var(--ec, #8338EC) 14%, #fff); border:1px solid color-mix(in srgb, var(--ec, #8338EC) 38%, transparent);
}
.ev-day{ font-family:var(--display); font-weight:600; font-size:2.1rem; line-height:1; color:var(--ink); }
.ev-mon{ font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink); margin-top:5px; }
.ev-wd{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.05em; text-transform:uppercase; color:var(--ash); margin-top:7px; line-height:1.3; }
.ev-body{ min-width:0; }
.ev-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; margin:0 0 8px; font-family:var(--mono); font-size:12px; letter-spacing:0.02em; color:var(--ash); }
.ev-chip{
  display:inline-flex; align-items:center; gap:7px; padding:4px 10px; border-radius:999px; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink);
  border:1px solid color-mix(in srgb, var(--ec, #8338EC) 45%, transparent); background:color-mix(in srgb, var(--ec, #8338EC) 9%, #fff);
}
.ev-chip::before{ content:''; width:7px; height:7px; border-radius:50%; background:var(--ec, #8338EC); }
.ev-live{ padding:3px 9px; border-radius:999px; background:var(--ink); color:#fff; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; }
.ev-card h3, .ev-news h3{ font-family:var(--display); font-weight:600; font-size:clamp(1.15rem, 2vw, 1.4rem); line-height:1.25; margin:0 0 8px; color:var(--ink); }
.ev-place{ display:flex; gap:8px; align-items:flex-start; margin:0 0 10px; font-family:var(--mono); font-size:12px; line-height:1.55; color:var(--ash); }
.ev-place svg, .ev-price svg{ width:14px; height:14px; flex:none; margin-top:2px; }
.ev-sum{ margin:0 0 12px; font-size:14.5px; line-height:1.7; color:var(--ash); max-width:720px; }
.ev-price{ display:flex; gap:8px; align-items:center; margin:0 0 14px; font-family:var(--mono); font-size:12px; color:var(--ink); }
.ev-actions{ display:flex; flex-wrap:wrap; gap:10px; }
.ev-btn{ padding:10px 16px; font-size:13px; }
.ev-btn svg{ width:16px; height:16px; flex:none; }
.ev-btn:focus-visible{ outline:2px solid var(--amber); outline-offset:3px; }
.ev-host{ font-family:var(--mono); font-weight:400; font-size:11px; opacity:.92; }
.ev-empty{ margin:0; padding:26px 24px; border:1px dashed rgba(131,56,236,0.4); border-radius:4px; color:var(--ash); font-size:15px; line-height:1.6; }
.ev-empty a{ color:var(--amber); text-decoration:underline; text-underline-offset:3px; }

.ev-news-grid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px; }
.ev-news-grid > .ev-empty{ grid-column:1 / -1; }
.ev-news{
  display:flex; flex-direction:column; gap:0; padding:22px 20px 20px; background:#fff;
  border:1px solid rgba(131,56,236,0.16); border-top:4px solid var(--ec, #8338EC); border-radius:3px; scroll-margin-top:110px;
}
.ev-news .ev-meta{ margin-bottom:10px; }
.ev-news .ev-sum{ font-size:14px; line-height:1.65; flex:1; }
.ev-links{ display:flex; flex-wrap:wrap; gap:6px 18px; font-size:13.5px; }
.ev-links a{ color:var(--amber); text-decoration:underline; text-underline-offset:3px; }
.ev-links .ev-host{ color:var(--ash); }
.ev-older, .ev-past{ margin-top:18px; }
.ev-older summary, .ev-past summary{
  display:flex; align-items:center; gap:12px; cursor:pointer; list-style:none;
  font-family:var(--display); font-weight:500; font-size:1.2rem; color:var(--ink); padding:10px 0;
}
.ev-older summary::-webkit-details-marker, .ev-past summary::-webkit-details-marker{ display:none; }
.ev-older summary::after, .ev-past summary::after{ content:'+'; font-family:var(--mono); font-size:1.1rem; color:var(--amber); width:28px; height:28px; border-radius:50%; border:1px solid rgba(131,56,236,0.34); display:inline-flex; align-items:center; justify-content:center; }
.ev-older[open] summary::after, .ev-past[open] summary::after{ content:'–'; }
.ev-older summary:focus-visible, .ev-past summary:focus-visible{ outline:2px solid var(--amber); outline-offset:4px; }
.ev-older[hidden], .ev-past[hidden]{ display:none; }
.ev-older > .ev-news-grid{ margin-top:12px; }
.ev-past-list{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; }
.ev-past-row{
  display:grid; grid-template-columns:minmax(120px, 200px) minmax(0, 1fr) auto; gap:6px 20px; align-items:baseline;
  padding:14px 0 14px 16px; border-bottom:1px solid rgba(131,56,236,0.14); border-left:3px solid var(--ec, #8338EC); scroll-margin-top:110px;
}
.ev-past-row time{ font-family:var(--mono); font-size:12px; color:var(--ash); }
.ev-past-row strong{ display:block; font-weight:600; font-size:15px; color:var(--ink); line-height:1.4; }
.ev-past-row span{ display:block; font-size:13px; color:var(--ash); margin-top:2px; }
.ev-past-link{ font-size:18px; color:var(--amber); padding:4px 8px; }
.ev-past-link:hover{ color:var(--ink); }

@media (max-width:980px){ .ev-news-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:640px){
  .ev-section{ padding-top:30px; }
  .ev-news-grid{ grid-template-columns:1fr; }
  .ev-card{ grid-template-columns:1fr; gap:14px; padding:18px 18px 20px 16px; }
  .ev-date{ flex-direction:row; justify-content:flex-start; gap:10px; min-height:0; padding:8px 14px; align-self:start; justify-self:start; }
  .ev-btn .ev-host{ display:none; }
  .ev-day{ font-size:1.6rem; } .ev-mon, .ev-wd{ margin-top:0; }
  .ev-past-row{ grid-template-columns:minmax(0, 1fr) auto; }
  .ev-past-row time{ grid-column:1 / -1; }
  .ev-actions .btn{ flex:1 1 auto; justify-content:center; }
}

/* home: blocco «Eventi e notizie» */
.ev-teaser{ padding:90px 0 40px; }
.ev-mini-grid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px; }
.ev-mini-grid > .ev-empty{ grid-column:1 / -1; }
.ev-mini{
  display:flex; gap:16px; align-items:flex-start; padding:18px 18px 20px; background:#fff;
  border:1px solid rgba(131,56,236,0.16); border-top:4px solid var(--ec, #8338EC); border-radius:3px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.ev-mini:hover{ transform:translateY(-4px); box-shadow:0 22px 34px -22px color-mix(in srgb, var(--ec, #8338EC) 70%, transparent); }
.ev-mini .ev-date{ flex:none; flex-direction:column; justify-content:center; gap:0; width:64px; min-height:78px; padding:9px 4px; align-self:flex-start; }
.ev-mini .ev-day{ font-size:1.7rem; } .ev-mini .ev-mon{ font-size:11px; margin-top:3px; } .ev-mini .ev-wd{ font-size:9.5px; margin-top:5px; }
.ev-mini-body{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.ev-mini-when{ font-family:var(--mono); font-size:11.5px; color:var(--ash); line-height:1.4; }
.ev-mini strong{ font-family:var(--display); font-weight:600; font-size:17px; line-height:1.28; color:var(--ink); }
.ev-mini-place{ display:flex; gap:6px; align-items:flex-start; font-size:12.5px; line-height:1.45; color:var(--ash); }
.ev-mini-place svg{ width:13px; height:13px; flex:none; margin-top:2px; }
.ev-teaser-foot{ display:flex; flex-wrap:wrap; gap:14px 24px; align-items:center; justify-content:space-between; margin-top:24px; }
.ev-latest{ display:inline-flex; flex-wrap:wrap; gap:4px 12px; align-items:baseline; min-width:0; font-size:14.5px; color:var(--ash); }
.ev-latest-k{ font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--amber); }
.ev-latest-t{ color:var(--ink); text-decoration:underline; text-decoration-color:rgba(131,56,236,0.4); text-underline-offset:3px; }
.ev-latest:hover .ev-latest-t{ color:var(--amber); }
@media (max-width:980px){ .ev-mini-grid{ grid-template-columns:1fr; } .ev-teaser{ padding-top:70px; } }

/* proponi un evento o una notizia */
.contact-hp{ position:absolute; left:-9999px; }
.prop-section{ padding:24px 0 96px; }
.prop-grid{ display:grid; grid-template-columns:minmax(0, 1.55fr) minmax(0, 1fr); gap:44px; align-items:start; }
@media (max-width:900px){ .prop-grid{ grid-template-columns:1fr; gap:30px; } }
.prop-form{
  display:flex; flex-direction:column; gap:22px; padding:32px 32px 34px; background:#fff;
  border:1px solid rgba(131,56,236,0.16); border-radius:6px; box-shadow:0 26px 50px -36px rgba(70,30,140,0.35);
}
@media (max-width:560px){ .prop-form{ padding:24px 18px 26px; } }
.pf-type{ border:0; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px; position:relative; }
.pf-type legend{ padding:0; margin:0 0 10px; width:100%; font-family:var(--mono); font-size:11.5px; letter-spacing:0.04em; color:var(--ash-dim); }
.pf-radio{ position:relative; cursor:pointer; }
.pf-radio input{ position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0; cursor:pointer; }
.pf-radio span{
  display:inline-flex; align-items:center; padding:11px 22px; border-radius:999px; border:1px solid rgba(131,56,236,0.34);
  font-size:14px; font-weight:600; color:var(--ash); background:#fff; transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.pf-radio input:checked + span{ background:var(--amber); border-color:var(--amber); color:#fff; }
.pf-radio input:focus-visible + span{ outline:2px solid var(--amber); outline-offset:3px; }
.pf-field{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.pf-field > label:not(.contact-consent){ font-family:var(--mono); font-size:11.5px; letter-spacing:0.04em; color:var(--ash-dim); }
.pf-field input:not([type="checkbox"]), .pf-field select, .pf-field textarea{
  font-family:var(--body); font-size:15px; color:var(--ink); background:#fff; width:100%; box-sizing:border-box;
  border:1px solid rgba(131,56,236,0.26); border-radius:4px; padding:12px 14px; resize:vertical; min-width:0;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.pf-field input:focus, .pf-field select:focus, .pf-field textarea:focus{ outline:none; border-color:var(--amber); box-shadow:0 0 0 3px rgba(131,56,236,0.16); }
.pf-field input:user-invalid, .pf-field textarea:user-invalid{ border-color:#B0124F; }
.pf-hint{ font-size:12.5px; line-height:1.5; color:var(--ash-dim); }
.pf-count{ font-size:12px; color:var(--ash); text-align:right; }
.pf-event{ display:flex; flex-direction:column; gap:22px; }
.pf-event[hidden]{ display:none; }
.pf-row{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:18px; }
.pf-row-2{ grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr); }
@media (max-width:640px){ .pf-row, .pf-row-2{ grid-template-columns:1fr; } }
.prop-form .btn{ align-self:flex-start; }
.prop-form .btn:disabled{ opacity:.6; cursor:default; transform:none; }
.prop-main .contact-success{ margin:0; text-align:left; padding:30px 28px; border-radius:6px; border:1px solid rgba(131,56,236,0.2); background:var(--stone-2); color:var(--ink); font-size:16px; line-height:1.65; }
.prop-main .contact-success p{ margin:0 0 16px; } .prop-main .contact-success p:last-child{ margin:0; }
.prop-main .contact-success[hidden], .contact-error[hidden]{ display:none; }
.prop-side{ display:flex; flex-direction:column; gap:16px; position:sticky; top:96px; }
@media (max-width:900px){ .prop-side{ position:static; } }
.prop-card{ padding:24px 24px 22px; background:#fff; border:1px solid rgba(131,56,236,0.16); border-left:4px solid var(--amber); border-radius:3px; }
.prop-card h2{ font-family:var(--display); font-style:italic; font-weight:500; font-size:21px; line-height:1.25; margin:0 0 12px; color:var(--ink); }
.prop-card ul, .prop-card ol{ margin:0; padding:0 0 0 20px; display:flex; flex-direction:column; gap:9px; font-size:14.5px; line-height:1.65; color:var(--ash); }
.prop-card li::marker{ color:var(--amber); font-weight:600; }
.prop-note{ margin:16px 0 0; font-size:13px; line-height:1.65; color:var(--ash); }
.prop-note a{ color:var(--amber); text-decoration:underline; text-underline-offset:3px; }
@media print{ .ev-filters, .ev-actions, .ev-teaser-foot, .prop-side{ display:none !important; } .ev-card, .ev-news{ break-inside:avoid; } }
@media (prefers-reduced-motion: reduce){ .ev-card, .ev-mini{ transition:none; } }

/* barra di navigazione con la voce «Eventi»: tra 861 e 980 px le icone social escono dalla barra (restano nel footer e nella sezione «Seguici») */
@media (min-width:861px) and (max-width:980px){
  .nav-tools .nav-social, .nav-tools .nav-sep{ display:none; }
  .nav .wrap{ padding-left:24px; padding-right:24px; gap:14px; }
  .nav-links{ gap:13px; font-size:13px; }
}

/* home: riga «Prossimo evento» sotto i pulsanti della prima schermata */
.hero-next{
  display:inline-flex; align-items:center; gap:10px; max-width:100%; box-sizing:border-box; margin-top:22px; padding:9px 16px 9px 14px;
  border-radius:999px; border:1px solid rgba(255,255,255,0.4); background:rgba(255,255,255,0.14);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); color:#fff; font-size:13.5px; line-height:1.3;
  transition:background .25s ease, border-color .25s ease, transform .25s ease;
}
.hero-next:hover{ background:rgba(255,255,255,0.24); border-color:#fff; transform:translateY(-2px); }
.hero-next:focus-visible{ outline:2px solid #fff; outline-offset:3px; }
.hero-next-k{ flex:none; display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:#FFE27A; }
.hero-next-k::before{ content:''; width:7px; height:7px; border-radius:50%; background:#FFE27A; box-shadow:0 0 0 4px rgba(255,226,122,0.25); }
.hero-next-t{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.hero-next-go{ flex:none; }
@media (max-width:640px){
  .hero-next{ margin-top:18px; font-size:13px; padding:9px 14px 9px 12px; border-radius:20px; align-items:flex-start; }
  .hero-next-k{ font-size:10px; padding-top:2px; }
  .hero-next-t{ white-space:normal; overflow:visible; text-overflow:clip; }
  .hero-next-go{ padding-top:0; }
}
.prop-form[hidden], .ev-cal[hidden], .ev-filters[hidden], .ev-block[hidden]{ display:none; }

/* ---------- prima schermata: testo mai sopra lo skyline, allineato alla griglia del sito ---------- */
.hero .wrap{ width:100%; }                                   /* il blocco di testo parte dallo stesso margine del logo e delle sezioni */
.hero-inner{ max-width:880px; }
.hero-sub{ max-width:520px; }
.hero-inner h1{ max-width:880px; }   /* il titolo ha le sue interruzioni (a capo dopo «Cosenza Vecchia:» e dopo «storia,»): nessuna parola da sola sull'ultima riga */
@media (min-width:641px){
  .hero{ padding-top:112px; padding-bottom:calc(14vw + 16px); }   /* sotto il testo resta libero tutto lo skyline (tetti, Teatro, Duomo) */
}
@media (min-width:861px) and (max-height:820px){               /* laptop 1280x720, 1366x768: un po' più compatto così lo skyline entra nella prima schermata */
  .hero{ padding-top:104px; }
  .hero-inner h1{ font-size:clamp(2.4rem, 4.5vw, 3.5rem); margin-bottom:20px; }
  .hero-sub{ font-size:17px; margin-bottom:28px; }
  .hero-next{ margin-top:16px; }
}
@media (max-width:640px){
  .hero{ padding-top:124px; padding-bottom:200px; }
  .hero-moon{ top:68px; bottom:auto; right:6px; width:84px; height:84px; }   /* la luna sta nel cielo sopra il titolo, mai sul testo */
}

/* ---------- rifiniture di coerenza (home) ---------- */
/* nessuno stacco netto tra «Otto modi di guardare…» e «Storie che non stanno su una guida» */
#pilastri::before{ -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 14%, #000 86%, transparent 100%); mask-image:linear-gradient(180deg, transparent 0, #000 14%, #000 86%, transparent 100%); }
#curiosita{ background:linear-gradient(180deg, var(--stone) 0%, color-mix(in srgb, var(--c-curiosita) 8%, var(--stone)) 30%, var(--stone) 100%); }
/* etichette in monospazio: non sotto i 10,5 px (leggibili anche per chi ha la vista stanca) */
.curio-tag, .map-info-eyebrow, .social-card .s-badge, .ev-mini .ev-wd{ font-size:10.5px; }
/* su tablet e telefono le sezioni respirano meno: niente "buchi" di 240 px tra un blocco e l'altro */
@media (max-width:900px){ section{ padding-top:92px; padding-bottom:92px; } }
@media (max-width:640px){ section{ padding-top:72px; padding-bottom:72px; } .section-head{ margin-bottom:40px; } }

/* «Seguici»: le card non escono mai dallo schermo (4 colonne larghe su desktop, 2 colonne uguali da tablet in giù; il badge con il nome utente va a capo se serve) */
.social-grid{ max-width:900px; grid-template-columns:repeat(4, minmax(0, 1fr)); }
.social-card{ min-width:0; }
.social-card .s-badge{ max-width:100%; box-sizing:border-box; text-align:center; overflow-wrap:break-word; }
@media (max-width:900px){ .social-grid{ max-width:520px; grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:700px){ .social-card .s-badge{ letter-spacing:0.04em; } }

/* ---------- canali social: blocco «Seguici» che compare dopo la prima schermata (js/site.js) ---------- */
.social-dock{
  position:fixed; z-index:94; left:16px; bottom:16px;
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:opacity .3s ease, transform .3s ease, visibility .3s;
}
.social-dock.show{ opacity:1; visibility:visible; transform:none; }
.sd-toggle{
  display:inline-flex; align-items:center; justify-content:center; height:44px; min-width:44px; padding:0 13px; box-sizing:border-box;
  border-radius:22px; border:1.5px solid transparent; cursor:pointer;
  background:linear-gradient(#fff, #fff) padding-box, var(--brand-grad) border-box;
  color:var(--amber); font-family:var(--body); font-size:13.5px; font-weight:600; letter-spacing:0.01em;
  box-shadow:0 10px 24px -10px rgba(131,56,236,0.5);
  transition:box-shadow .25s ease, transform .25s ease;
}
.sd-toggle:hover{ box-shadow:0 12px 26px -8px rgba(131,56,236,0.62); }
.sd-toggle svg{ width:19px; height:19px; flex:none; }
.sd-label{ display:inline-block; max-width:0; opacity:0; overflow:hidden; white-space:nowrap; margin-left:0; transition:max-width .45s ease, opacity .3s ease, margin-left .45s ease; }
.social-dock.intro .sd-label, .sd-toggle:focus-visible .sd-label{ max-width:90px; opacity:1; margin-left:8px; }
.social-dock.open .sd-toggle{ box-shadow:0 12px 28px -8px rgba(131,56,236,0.66); }
.sd-list{
  position:absolute; left:0; bottom:calc(100% + 10px); display:flex; flex-direction:column; align-items:flex-start; gap:8px;
  opacity:0; visibility:hidden; transform:translateY(8px) scale(0.98); transform-origin:bottom left;
  transition:opacity .22s ease, transform .22s ease, visibility .22s;
}
.social-dock.open .sd-list{ opacity:1; visibility:visible; transform:none; }
.sd-cap{ display:none; }
.sd-link{
  display:grid; grid-template-columns:44px 1fr 44px; align-items:center; width:176px; height:44px; padding:0; box-sizing:border-box; border-radius:22px;
  background:#fff; border:1px solid rgba(131,56,236,0.24); color:var(--ink);
  font-family:var(--body); font-size:14px; font-weight:600; white-space:nowrap; text-decoration:none;
  box-shadow:0 8px 20px -10px rgba(26,24,34,0.4);
  transition:border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease;
}
.sd-link::after{ content:''; }                                  /* colonna vuota a destra: il nome resta esattamente al centro della pillola */
.sd-link svg{ width:18px; height:18px; flex:none; justify-self:center; color:var(--amber); }
.sd-name{ text-align:center; line-height:1; }
.sd-link:hover, .sd-link:focus-visible{ border-color:var(--amber); color:var(--amber); transform:translateX(2px); }
.social-dock.typing, body.menu-open .social-dock{ display:none; }

@media (max-width:1599px){
  .social-dock.on-map{ display:none; }   /* la pagina della mappa è larga quasi quanto lo schermo: lì il blocco compare solo sui monitor molto grandi */
}
@media (max-width:420px){ .social-dock{ left:12px; bottom:12px; } }

/* schermi larghi: barra verticale sottile sul bordo sinistro, sempre aperta; il nome compare al passaggio del mouse */
@media (min-width:1360px){
  .social-dock{ left:14px; bottom:auto; top:50%; transform:translate(-8px, -50%); }
  .social-dock.show{ transform:translate(0, -50%); }
  .sd-toggle{ display:none; }
  .sd-list{
    position:static; opacity:1; visibility:visible; transform:none; align-items:center; gap:4px; padding:10px 5px 8px; border-radius:999px;
    background:rgba(255,255,255,0.88); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
    border:1px solid rgba(131,56,236,0.2); box-shadow:0 18px 40px -22px rgba(26,24,34,0.55);
  }
  .sd-cap{
    display:block; writing-mode:vertical-rl; transform:rotate(180deg); padding:2px 0 8px;
    font-family:var(--mono); font-size:10.5px; letter-spacing:0.22em; text-transform:uppercase; color:var(--ash);
  }
  .sd-link{ position:relative; display:flex; width:38px; height:38px; padding:0; gap:0; justify-content:center; border-radius:50%; border-color:transparent; background:transparent; box-shadow:none; color:var(--amber); }
  .sd-link::after{ display:none; }
  .sd-link svg{ width:18px; height:18px; color:currentColor; }
  .sd-link:hover, .sd-link:focus-visible{ background:var(--brand-grad); color:#fff; border-color:transparent; transform:scale(1.08); }
  .sd-name{
    position:absolute; left:calc(100% + 12px); top:50%; transform:translate(-4px, -50%); padding:6px 12px; border-radius:16px;
    background:var(--ink); color:#fff; font-size:12.5px; font-weight:600; line-height:1; white-space:nowrap; pointer-events:none; text-align:left; padding-top:6px;
    opacity:0; transition:opacity .18s ease, transform .18s ease;
  }
  .sd-link:hover .sd-name, .sd-link:focus-visible .sd-name{ opacity:1; transform:translate(0, -50%); }
}
@media (prefers-reduced-motion: reduce){ .social-dock, .sd-list, .sd-label, .sd-link, .sd-name{ transition:none; } }
@media print{ .social-dock{ display:none !important; } }

/* icone social nella barra in alto: un poco più grandi e con il colore del progetto al passaggio */
.nav-tools .nav-social a{ width:32px; height:32px; border-color:rgba(131,56,236,0.4); }
.nav-social svg{ width:15px; height:15px; }
.nav-social a:hover{ background:var(--brand-grad); border-color:transparent; color:#fff; }
.nav:not(.scrolled) .nav-social a:hover{ background:rgba(255,255,255,0.22); border-color:#fff; color:#fff; }
body.subpage .nav .nav-social a:hover{ background:var(--brand-grad); border-color:transparent; color:#fff; }
/* nel menu del telefono: icone più comode da toccare */
.mobile-menu-social{ gap:12px; }
.mobile-menu-social a{ width:44px; height:44px; border-color:rgba(131,56,236,0.42); }
.mobile-menu-social svg{ width:19px; height:19px; }

/* centratura ottica delle icone social (barra in alto, menu del telefono, piè di pagina, blocco «Seguici»): i disegni non riempiono tutto il riquadro, quindi li riallineo al centro del cerchio (in percentuale, così vale a ogni dimensione) */
:is(.nav-social a, .mobile-menu-social a, .footer-social a, a.sd-link)[href*="instagram"] svg,
:is(.nav-social a, .mobile-menu-social a, .footer-social a, a.sd-link)[href*="youtube"] svg{ transform:translate(-2%, 0); }
:is(.nav-social a, .mobile-menu-social a, .footer-social a, a.sd-link)[href*="tiktok"] svg{ transform:translate(-4.8%, 7.2%) scale(1.2); }
:is(.nav-social a, .mobile-menu-social a, .footer-social a, a.sd-link)[href*="facebook"] svg{ transform:translate(-2.1%, -4.2%) scale(1.06); }
.sd-toggle svg{ transform:translateY(-0.5px); }

/* scheda della mappa: il riquadro foto compare solo quando si sceglie un luogo (js/home.js, js/mappa.js); nello stato iniziale e con un filtro attivo c'è solo il testo */
.map-photo-frame[hidden]{ display:none; }
/* senza luogo scelto non restano righe vuote in fondo alla scheda (indirizzo e link sono nascosti) */
.map-info-area:empty{ display:none; }
.map-info-links:not(:has(a:not([hidden]))){ display:none; }

/* pagina «Mappa» su telefono e tablet: la scheda del luogo NON copre più la mappa. Sta subito sotto la cartina (che resta tutta visibile e usabile), con la foto ridotta a una fascia */
@media (max-width:900px){
  .map-big-wrap #cosenzaMapBig{ height:460px; }
  .map-big-wrap .map-float-card{
    position:static; left:auto; right:auto; bottom:auto; width:auto; max-width:none;
    padding:16px 18px 18px; gap:8px; border:0; border-top:1px solid rgba(131,56,236,0.18); border-radius:0;
    background:var(--maiolica); box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none;
  }
  .map-big-wrap .map-float-card .map-photo-frame{ aspect-ratio:auto; height:clamp(120px, 34vw, 190px); }
}
@media (max-width:640px){
  .map-big-wrap #cosenzaMapBig{ height:380px; }
}

/* contrasto dei testi piccoli colorati: le tonalità delle categorie, scurite quel tanto che basta per superare 4,5:1 sul bianco (i pallini e i bordi restano nei colori pieni) */
:root{ --t-storia:#8338EC; --t-botteghe:#BA3E03; --t-gastro:#856200; --t-bellezza:#005DF2; --t-persone:#980FFF; --t-eventi:#D1005A; --t-curiosita:#D0123F; --t-luoghi:#03785A; }
.curio-tag{ color:var(--t-curiosita); }
.intro-badge{ color:var(--bt, var(--bc, var(--ink))); }
.map-list-cat{ color:var(--ict, var(--ic, var(--amber))); }

/* leggibilità dei testi chiari sopra sfondi colorati o fotografici */
/* prima schermata, riga «Prossimo evento»: fondo scuro e vetrato, il testo bianco resta leggibile anche sul tramonto chiaro dietro lo skyline */
.hero-next{ background:rgba(28,10,64,0.46); border-color:rgba(255,255,255,0.42); }
.hero-next:hover{ background:rgba(28,10,64,0.62); }
/* foto con didascalia (home «Come arrivare» e galleria): velatura più marcata in basso */
.practical-photo::after{ background:linear-gradient(180deg, rgba(24,10,64,0) 36%, rgba(24,10,64,0.55) 66%, rgba(24,10,64,0.88) 100%); }
.gal-item::after{ background:linear-gradient(180deg, rgba(24,10,64,0) 42%, rgba(24,10,64,0.6) 72%, rgba(24,10,64,0.88) 100%); }
/* sezione «Seguici»: lo sfondo viola-rosa-arancio resta com'è agli angoli; solo dietro al titolo e alle card c'è una velatura scura leggera, così il testo bianco supera il contrasto minimo anche sul rosa e sull'arancio */
.follow::before{
  background:
    radial-gradient(480px 380px at 12% 15%, rgba(255,255,255,0.14), transparent 70%),
    radial-gradient(640px 250px at 50% 24%, rgba(48,6,64,0.34), transparent 74%),
    radial-gradient(860px 300px at 50% 66%, rgba(48,6,64,0.34), transparent 76%);
}
.social-card{ background:rgba(40,4,56,0.2); }
.social-card:hover{ background:rgba(40,4,56,0.08); }
.social-card .s-badge{ color:#fff; }

/* ===== Utility: testo solo per screen reader / outline dei titoli ===== */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ===== Aree di tap: almeno 24px di altezza (WCAG 2.2, 2.5.8) senza spostare il layout ===== */
.brand{ padding-block:4px; }
.back-link{ min-height:24px; margin-bottom:19px; }
.curio-more{ padding-block:4px; margin-top:6px; }
.ev-links a{ padding-block:2px; }
.ev-latest{ min-height:24px; align-items:center; }

/* «Seguici» su telefoni stretti: i nomi utente restano interi nella pillola (l'handle lungo va a capo solo tra «cosenza» e «centrostorico») */
@media (max-width:400px){
  .social-card{ padding-left:8px; padding-right:8px; }
  .social-card .s-badge{ letter-spacing:0; padding:3px 6px; }
}

/* ===== Pulsanti fissi (torna su, «Seguici»): un solo tocco su telefono ===== */
.back-to-top, .sd-toggle, .sd-link{ touch-action:manipulation; }
/* senza mouse niente effetti «hover» che restano appiccicati dopo il tocco (e su iPhone fanno scartare il primo tocco) */
@media (hover:none){
  .back-to-top:hover{ box-shadow:0 10px 24px -8px rgba(131,56,236,0.5); transform:translateY(12px); }
  .back-to-top.visible:hover{ transform:none; }
  .sd-toggle:hover{ box-shadow:0 10px 24px -10px rgba(131,56,236,0.5); }
  .sd-link:hover{ border-color:rgba(131,56,236,0.24); color:var(--ink); transform:none; }
}
/* iPhone/iPad (Safari): la barra in basso, quando è ridotta, intercetta i tocchi nella fascia più bassa dello schermo:
   il primo tocco la riapre e il pulsante non risponde. Si alzano un poco i due pulsanti, così restano sopra quella fascia. */
@supports (-webkit-touch-callout:none){
  @media (max-width:900px){
    .back-to-top{ bottom:58px; }
    .social-dock{ bottom:58px; }
  }
}
/* durante la risalita con «torna su» il blocco «Seguici» resta nascosto */
.going-top .social-dock{ opacity:0 !important; visibility:hidden !important; pointer-events:none; }

/* ---------- intestazioni con foto: Eventi e Il progetto (stesso schema delle schede dei luoghi) ---------- */
.ph-grid{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(32px, 5vw, 64px); align-items:center; }
.ph-text{ min-width:0; }
.ph-photo{
  position:relative; margin:0; aspect-ratio:16/11; border-radius:6px; overflow:hidden; background:var(--stone-2);
  border:1px solid rgba(131,56,236,0.25); box-shadow:0 26px 50px -28px rgba(131,56,236,0.6);
}
.ph-photo img{ display:block; width:100%; height:100%; object-fit:cover; object-position:var(--fx, 50% 50%); }
.ph-photo figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:60px 18px 14px; color:#fff;
  display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 12px;
  background:linear-gradient(180deg, rgba(24,10,64,0) 0%, rgba(24,10,64,0.6) 48%, rgba(24,10,64,0.9) 100%);
}
.ph-photo figcaption strong{ font-family:var(--display); font-weight:600; font-size:16px; letter-spacing:0.01em; }
.ph-photo figcaption em{ font-family:var(--mono); font-style:normal; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; opacity:0.92; }
@media (max-width:860px){
  .ph-grid{ grid-template-columns:1fr; gap:26px; }
  .ph-photo{ order:-1; aspect-ratio:16/10; }
}
@media (min-width:600px) and (max-width:860px){ .ph-photo{ aspect-ratio:21/9; } }
@media print{ .ph-grid{ grid-template-columns:1fr 1fr !important; gap:16px !important; } .ph-photo{ box-shadow:none; max-height:70mm; } }

/* home, «Uno dei centri storici più antichi d'Italia»: titolo, paragrafi e etichette sullo stesso asse.
   Prima i paragrafi erano allineati a sinistra dentro una colonna centrata: con il margine destro frastagliato il blocco di testo sembrava spostato a sinistra. */
@media (min-width:641px){
  .intro-copy p:not(.eyebrow){ text-align:center; text-wrap:balance; }
}