/* Music Art Management — foglio di stile unico, nessuna dipendenza esterna */

@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo-var.woff2") format("woff2");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("../fonts/instrument-serif-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

:root {
  --ink: #0a0a1f;
  --ink-2: #121233;
  --ink-3: #1d1b47;
  --bone: #eef2f8;
  --bone-2: #c8d1e3;
  --muted: #8f99b8;
  --muted-dark: #4b5475;
  --line: rgb(238 242 248 / .13);
  --line-dark: rgb(33 30 70 / .16);
  --accent: #38b3e7;
  --blue: #2a7dc7;
  --navy: #211e46;
  --paper: #eef1f6;
  --accent-ink: #0a0a1f;
  --accent-soft: rgb(56 179 231 / .14);
  --error: #ff8a7a;

  --sans: "Archivo", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --serif: "Instrument Serif", ui-serif, Georgia, "Times New Roman", serif;

  --gutter: clamp(1rem, 4vw, 3rem);
  --max: 82rem;
  --radius: 14px;
  --ease: cubic-bezier(.2, .7, .1, 1);

  --step--1: clamp(.84rem, .82rem + .1vw, .9rem);
  --step-0: clamp(1rem, .96rem + .2vw, 1.125rem);
  --step-1: clamp(1.2rem, 1.1rem + .45vw, 1.45rem);
  --step-2: clamp(1.45rem, 1.25rem + .9vw, 2rem);
  --step-3: clamp(2rem, 1.5rem + 2.2vw, 3.4rem);
  --step-4: clamp(2.6rem, 1.6rem + 4.6vw, 5.6rem);
  --step-5: clamp(3.2rem, 1.4rem + 8.4vw, 9.5rem);

  color-scheme: dark;
}

@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
}
::view-transition-old(root) { animation: .22s ease-in both vt-out; }
::view-transition-new(root) { animation: .34s var(--ease) both vt-in; }
@keyframes vt-out { to { opacity: 0; } }
@keyframes vt-in { from { opacity: 0; transform: translateY(10px); } }
.site-header { view-transition-name: header; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 6rem; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--ink);
  color: var(--bone);
  font-family: var(--sans);
  font-size: var(--step-0);
  line-height: 1.6;
  font-size-adjust: from-font;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--accent); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--accent); color: var(--accent-ink); }
h1, h2, h3 { margin: 0; line-height: 1.05; font-weight: 800; text-wrap: balance; }
p { margin: 0 0 1em; text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; }
em { font-family: var(--serif); font-style: italic; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--accent); }
address { font-style: normal; }

.wrap { width: min(100% - 2 * var(--gutter), var(--max)); margin-inline: auto; }
.skip { position: absolute; left: 1rem; top: -4rem; z-index: 100; padding: .7rem 1rem; background: var(--accent); color: var(--accent-ink); font-weight: 700; border-radius: 8px; }
.skip:focus { top: 1rem; }

/* Tipografia */
.eyebrow {
  display: inline-flex; align-items: baseline; gap: .6rem;
  margin: 0 0 1.2rem;
  font-size: var(--step--1); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted);
}
.eyebrow::before { content: ""; flex: none; align-self: flex-start; margin-top: .45em; width: .55rem; height: .55rem; border-radius: 50%; background: var(--accent); box-shadow: 0 0 14px var(--accent); }
.display, .h1, .h2 { font-stretch: 72%; text-transform: uppercase; letter-spacing: -.01em; }
.display { font-size: var(--step-5); line-height: .86; font-weight: 850; }
.display .line { display: block; }
.display em, .h1 em, .h2 em { font-size: 1.08em; line-height: .8; }
.h1 { font-size: var(--step-4); line-height: .92; }
.h2 { font-size: var(--step-3); line-height: .95; }
.h3 { font-size: var(--step-2); font-stretch: 85%; letter-spacing: -.01em; }

/* Pulsanti */
.btn {
  --bg: transparent; --fg: var(--bone); --bd: var(--line);
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 3rem; padding: .8rem 1.4rem;
  border: 1px solid var(--bd); border-radius: 999px;
  background: var(--bg); color: var(--fg);
  font: 700 var(--step-0)/1.1 var(--sans); font-stretch: 90%; letter-spacing: .01em;
  text-decoration: none; cursor: pointer;
  transition: transform .25s var(--ease), background-color .25s, color .25s, border-color .25s;
}
.btn:hover { color: var(--fg); transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--accent { --bg: var(--accent); --fg: var(--accent-ink); --bd: var(--accent); }
.btn--accent:hover { --bg: #63c5ef; }
.btn--ghost:hover { --bd: var(--bone); }
.btn--sm { min-height: 2.5rem; padding: .55rem 1.1rem; font-size: var(--step--1); }
.btn--lg { min-height: 3.6rem; font-size: var(--step-1); }
.btn--block { width: 100%; }
.link-arrow { position: relative; display: inline-flex; gap: .5rem; align-items: center; font-weight: 700; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: .15rem; }
/* area di tocco di almeno 44px senza cambiare l'aspetto (::after è la freccia) */
.link-arrow::before { content: ""; position: absolute; inset: min(0px, calc((100% - 2.75rem) / 2)) -.5rem; }
.link-arrow::after { content: "→"; transition: transform .25s var(--ease); }
.link-arrow:hover::after { transform: translateX(4px); }

/* Header */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgb(10 10 31 / .82);
  backdrop-filter: blur(14px) saturate(1.3);
  -webkit-backdrop-filter: blur(14px) saturate(1.3);
  border-bottom: 1px solid var(--line);
}
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 4.5rem; }
.brand { display: inline-flex; align-items: center; gap: .7rem; min-height: 2.75rem; text-decoration: none; }
.brand:hover { color: var(--bone); }
.brand img { width: auto; height: 3.3rem; }
@media (max-width: 30rem) { .brand img { height: 2.6rem; } }

.nav { display: flex; align-items: center; gap: 1rem; }
.nav__list, .nav__sub-list { list-style: none; }
.nav__list { display: flex; gap: .2rem; }
.nav__list > li > a { display: block; padding: .5rem .75rem; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .95rem; color: var(--bone-2); }
.nav__list > li > a:hover { color: var(--bone); background: var(--ink-3); }
.nav__list > li > a[aria-current], .nav__cta[aria-current="page"] { color: var(--bone); background: var(--ink-3); box-shadow: inset 0 -2px 0 var(--accent); }
.nav-toggle { display: none; }

/* Sottomenu Artisti / Eventi: la voce resta un link, la freccia accanto apre e chiude l'elenco.
   Senza JavaScript la freccia non c'è e l'elenco si apre al passaggio del mouse o con il focus da tastiera. */
.nav__item--sub { position: relative; }
.nav__sub-btn { display: none; }
.nav__sub-btn svg { width: .75rem; height: auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: rotate .25s var(--ease); }
.nav__sub-btn[aria-expanded="true"] svg { rotate: 180deg; }
.nav__sub-list a { display: block; text-decoration: none; font-weight: 600; line-height: 1.5rem; color: var(--bone-2); }
.nav__year { color: var(--bone); font-variant-numeric: tabular-nums; }

@media (min-width: 62.01rem) {
  /* voce e freccia formano un'unica pillola, come le altre voci */
  .nav__item--sub { display: flex; align-items: center; border-radius: 999px; transition: background-color .2s; }
  .js .nav__item--sub > a { padding-right: .3rem; }
  .nav__list > .nav__item--sub > a:hover, .nav__list > .nav__item--sub > a[aria-current] { background: none; box-shadow: none; }
  .nav__item--sub:hover, .nav__item--sub.is-open, .nav__item--current { background: var(--ink-3); }
  .nav__item--sub:hover > a, .nav__item--sub.is-open > a { color: var(--bone); }
  .nav__item--current { box-shadow: inset 0 -2px 0 var(--accent); }
  .js .nav__sub-btn {
    display: grid; place-items: center;
    width: 1.75rem; height: 2.5rem; margin: 0; padding: 0 .45rem 0 0;
    border: 0; border-radius: 999px; background: none; color: var(--muted); cursor: pointer;
  }
  .js .nav__sub-btn:hover, .js .nav__sub-btn[aria-expanded="true"] { color: var(--accent); }

  .nav__sub {
    position: absolute; top: 100%; left: -.6rem; z-index: 2;
    padding-top: 1.35rem; /* ponte invisibile tra la voce e il pannello: il mouse non lo chiude passando */
    visibility: hidden; opacity: 0; translate: 0 -.35rem;
    transition: opacity .18s, translate .25s var(--ease), visibility 0s .18s;
  }
  .nav__sub--cols { left: auto; right: -.6rem; }
  .nav__item--sub.is-open > .nav__sub,
  html:not(.js) .nav__item--sub:is(:hover, :focus-within) > .nav__sub {
    visibility: visible; opacity: 1; translate: none;
    transition: opacity .18s, translate .25s var(--ease);
  }
  .nav__sub-list {
    display: grid; gap: .15rem; min-width: 14rem; padding: .5rem;
    background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--radius);
  }
  .nav__sub--cols .nav__sub-list { grid-template-columns: repeat(2, auto); grid-template-rows: repeat(5, auto); grid-auto-flow: column; column-gap: .25rem; }
  .nav__sub-list a { padding: .5rem .85rem; border-radius: 9px; font-size: .95rem; white-space: nowrap; }
  .nav__sub-list a:hover { color: var(--bone); background: var(--ink-3); }
  .nav__sub-list a[aria-current="page"] { color: var(--bone); background: var(--ink-3); box-shadow: inset 2px 0 0 var(--accent); }
}
@media (min-width: 62.01rem) and (pointer: coarse) {
  .js .nav__sub-btn { width: 2.4rem; height: 2.75rem; padding-right: .55rem; }
  .nav__sub-list a { padding-block: .625rem; }
}
@media (min-width: 62.01rem) and (prefers-reduced-motion: reduce) {
  .nav__sub, .nav__item--sub.is-open > .nav__sub { translate: none; transition: none; }
}

@media (max-width: 62rem) {
  .nav-toggle {
    display: inline-flex; align-items: center; gap: .6rem;
    min-height: 2.75rem; padding: .5rem 1rem; border: 1px solid var(--line); border-radius: 999px;
    background: none; color: var(--bone); font: 600 .95rem var(--sans); cursor: pointer;
  }
  .nav-toggle__bars, .nav-toggle__bars::before { display: block; width: 1.1rem; height: 2px; background: currentColor; position: relative; transition: transform .3s var(--ease); }
  .nav-toggle__bars::before { content: ""; position: absolute; top: 6px; }
  .nav-toggle__bars { top: -3px; }
  .nav-toggle[aria-expanded="true"] .nav-toggle__bars { transform: translateY(3px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] .nav-toggle__bars::before { transform: translateY(-6px) rotate(-90deg); }
  /* menu del telefono: un foglio che copre tutto lo schermo sotto l'intestazione e scorre al suo interno */
  .js .nav {
    /* l'intestazione ha backdrop-filter, quindi fa da riferimento al position: fixed: altezza esplicita */
    position: fixed; inset: 4.5rem 0 auto 0; z-index: 49;
    height: calc(100vh - 4.5rem); height: calc(100dvh - 4.5rem);
    flex-direction: column; align-items: stretch; gap: 1.5rem;
    padding: 1.5rem var(--gutter) calc(2.5rem + env(safe-area-inset-bottom, 0px));
    background: var(--ink);
    overflow-y: auto; overscroll-behavior: contain;
    opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity .25s, transform .3s var(--ease), visibility 0s .3s;
  }
  .js .nav.is-open { opacity: 1; visibility: visible; transform: none; transition: opacity .25s, transform .3s var(--ease); }
  .nav__list { flex-direction: column; }
  .nav__list > li > a { font-size: var(--step-2); font-weight: 800; font-stretch: 75%; text-transform: uppercase; padding: .45rem 0; border-radius: 0; }
  .nav__list > li > a:hover, .nav__list > li > a[aria-current], .nav__cta[aria-current="page"] { background: none; box-shadow: none; color: var(--accent); }
  .nav__cta { min-height: 3.2rem; font-size: var(--step-0); }

  /* sottomenu nel foglio: chiusi dietro la freccia, si aprono uno alla volta */
  .js .nav__item--sub { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 1rem; }
  .js .nav__sub-btn {
    display: grid; place-items: center; width: 2.75rem; height: 2.75rem; margin: 0; padding: 0;
    border: 1px solid var(--line); border-radius: 50%; background: none; color: var(--bone); cursor: pointer;
    transition: border-color .2s, color .2s;
  }
  .js .nav__sub-btn:hover, .js .nav__sub-btn[aria-expanded="true"] { border-color: var(--accent); color: var(--accent); }
  .js .nav__sub { grid-column: 1 / -1; display: none; }
  .js .nav__item--sub.is-open > .nav__sub { display: block; }
  .js .nav__sub-list { margin: .35rem 0 .9rem; padding-left: 1rem; border-left: 1px solid var(--line); }
  .js .nav__sub-list a { padding-block: .625rem; font-size: var(--step-0); }
  .js .nav__sub-list a:hover, .js .nav__sub-list a[aria-current="page"] { color: var(--accent); }
  .js .nav__sub-list a[aria-current="page"] .nav__year { color: inherit; }

  /* senza JavaScript: le voci restano in riga sotto il logo; i sottomenu si aprono con il focus o il mouse */
  html:not(.js) .site-header { position: relative; } /* le voci vanno su più righe: l'intestazione non resta fissa sopra la pagina */
  html:not(.js) .site-header__inner { flex-wrap: wrap; padding-block: .8rem; }
  html:not(.js) .nav { position: relative; width: 100%; flex-wrap: wrap; }
  html:not(.js) .nav__list { flex-direction: row; flex-wrap: wrap; }
  html:not(.js) .nav__list > li > a { display: flex; align-items: center; min-height: 2.75rem; font-size: 1rem; padding: 0 .6rem; }
  html:not(.js) .nav__item--sub { position: static; }
  html:not(.js) .nav__sub { position: absolute; top: 100%; left: 0; right: 0; z-index: 2; padding-top: .4rem; visibility: hidden; }
  html:not(.js) .nav__item--sub:is(:hover, :focus-within) > .nav__sub { visibility: visible; }
  html:not(.js) .nav__sub-list { display: grid; padding: .4rem; background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--radius); }
  html:not(.js) .nav__sub-list a { padding: .625rem .75rem; border-radius: 9px; }
  html:not(.js) .nav__sub-list a:hover, html:not(.js) .nav__sub-list a[aria-current="page"] { color: var(--bone); background: var(--ink-3); }
  html:not(.js) .nav-toggle { display: none; }
}
@media (min-width: 36rem) and (max-width: 62rem) {
  .nav__cta { align-self: flex-start; min-width: 12rem; }
  .js .nav__sub--cols .nav__sub-list { display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); grid-template-rows: repeat(5, auto); grid-auto-flow: column; column-gap: 2.5rem; }
}
body.nav-open { overflow: hidden; }

/* Hero */
.hero { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(4rem, 12vw, 9rem) 0; border-bottom: 1px solid var(--line); }
.hero__lights { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.hero__lights span {
  position: absolute; top: -20%; width: 46vmax; height: 140%;
  background: conic-gradient(from 180deg at 50% 0%, transparent 168deg, rgb(220 238 255 / .2) 180deg, transparent 192deg);
  transform-origin: 50% 0;
  filter: blur(6px);
}
.hero__lights span:nth-child(1) { left: -6%; transform: rotate(-16deg); }
.hero__lights span:nth-child(2) { left: 30%; transform: rotate(4deg); background: conic-gradient(from 180deg at 50% 0%, transparent 170deg, rgb(56 179 231 / .34) 180deg, transparent 190deg); }
.hero__lights span:nth-child(3) { right: -10%; transform: rotate(18deg); }
.hero::before {
  content: ""; position: absolute; inset: auto 0 0; height: 55%; z-index: -1;
  background: radial-gradient(60% 80% at 50% 100%, rgb(42 125 199 / .32), transparent 70%);
}
@media (prefers-reduced-motion: no-preference) {
  .hero__lights span { animation: sweep 9s ease-in-out infinite alternate; }
  .hero__lights span:nth-child(2) { animation-duration: 11s; animation-delay: -3s; }
  .hero__lights span:nth-child(3) { animation-duration: 13s; animation-delay: -6s; }
  @keyframes sweep { from { rotate: -7deg; } to { rotate: 7deg; } }
  .display .line { animation: rise .9s var(--ease) both; }
  .display .line:nth-child(2) { animation-delay: .08s; }
  .display .line:nth-child(3) { animation-delay: .16s; }
  @keyframes rise { from { opacity: 0; transform: translateY(.35em); } }
}
.hero__mark { position: absolute; z-index: -1; right: calc(var(--gutter) * -1); top: 50%; width: min(44vw, 40rem); translate: 0 -30%; opacity: .08; pointer-events: none; }
@media (max-width: 62rem) { .hero__mark { display: none; } }
.hero__inner { padding-bottom: clamp(3rem, 8vw, 6rem); }
.hero__lead { max-width: 40rem; margin-top: 2rem; font-size: var(--step-1); line-height: 1.5; color: var(--bone-2); }
.hero__lead strong { color: var(--bone); }
.hero__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }

.marquee { border-top: 1px solid var(--line); overflow: hidden; padding-block: 1.1rem; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee__track { display: flex; width: max-content; gap: 3rem; }
.marquee__track span { font-size: var(--step-2); font-weight: 800; font-stretch: 72%; text-transform: uppercase; color: var(--muted-dark); white-space: nowrap; display: inline-flex; align-items: center; gap: 3rem; }
.marquee__track span::after { content: "✦"; color: var(--accent); font-size: .6em; }
@media (prefers-reduced-motion: no-preference) {
  .marquee__track { animation: marquee 50s linear infinite; }
  .marquee:hover .marquee__track { animation-play-state: paused; }
  @keyframes marquee { to { transform: translateX(-50%); } }
}

/* Fatti in breve */
.facts { border-bottom: 1px solid var(--line); }
.facts__grid { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; }
.facts__grid > div { padding: 2rem 1.5rem 2rem 0; border-right: 1px solid var(--line); }
.facts__grid > div + div { padding-left: 1.5rem; }
.facts__grid > div:last-child { border-right: 0; }
.facts dt { font-size: var(--step--1); color: var(--muted); letter-spacing: .08em; text-transform: uppercase; }
.facts dd { margin: .3rem 0 0; font-size: var(--step-3); font-weight: 850; font-stretch: 72%; line-height: 1; font-variant-numeric: tabular-nums; }
.facts .dd--text { font-size: var(--step-2); text-transform: uppercase; }
@media (max-width: 48rem) {
  .facts__grid { grid-template-columns: 1fr 1fr; }
  .facts__grid > div { padding: 1.4rem 1rem 1.4rem 0; }
  .facts__grid > div:nth-child(2) { border-right: 0; }
  .facts__grid > div:nth-child(3) { padding-left: 0; }
  .facts__grid > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}

/* Sezioni */
.section { padding-block: clamp(4rem, 9vw, 8rem); }
.section--tight { padding-block: clamp(2.5rem, 6vw, 5rem); }
.section--light { background: var(--paper); color: var(--navy); }
.section--light .eyebrow { color: var(--muted-dark); }
.section--light em { color: var(--blue); }
.section__head { max-width: 52rem; margin-bottom: clamp(2rem, 5vw, 3.5rem); }
.section__head--split { max-width: none; display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1.5rem; }
.section__intro { margin-top: 1.2rem; max-width: 40rem; color: var(--muted); font-size: var(--step-1); line-height: 1.5; }
.section--light .section__intro { color: var(--muted-dark); }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.two-col--wide { grid-template-columns: 1.6fr 1fr; }
.two-col--form { grid-template-columns: 1.7fr 1fr; }
@media (max-width: 56rem) { .two-col, .two-col--wide, .two-col--form { grid-template-columns: 1fr; } }

/* Lista servizi (home) */
.service-list { list-style: none; border-top: 1px solid var(--line); }
.service-list__item a {
  display: grid; grid-template-columns: 3.5rem minmax(0, 1.1fr) minmax(0, 1.4fr) 2rem; gap: 1.5rem; align-items: center;
  padding: 1.6rem 0; border-bottom: 1px solid var(--line); text-decoration: none;
  transition: padding .35s var(--ease), background-color .35s;
}
.service-list__item a:hover { color: var(--bone); padding-inline: 1rem; background: linear-gradient(90deg, var(--accent-soft), transparent 70%); }
.service-list__n { font-size: var(--step--1); color: var(--muted); font-variant-numeric: tabular-nums; }
.service-list__name { font-size: var(--step-2); font-weight: 800; font-stretch: 75%; text-transform: uppercase; line-height: 1; }
.service-list__text { color: var(--muted); }
.service-list__arrow { font-size: var(--step-1); transition: transform .3s var(--ease); }
.service-list__item a:hover .service-list__arrow { transform: translateX(6px); color: var(--accent); }
@media (max-width: 48rem) {
  .service-list__item a { grid-template-columns: 2.4rem 1fr auto; gap: .4rem 1rem; }
  .service-list__text { grid-column: 2 / 3; font-size: var(--step--1); }
  .service-list__arrow { grid-row: 1; grid-column: 3; }
}

/* Pilastri */
.pillars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; list-style: none; border-top: 1px solid var(--line-dark); }
.pillar { padding: 2rem 1.5rem 0 0; }
.pillar + .pillar { padding-left: 1.5rem; border-left: 1px solid var(--line-dark); }
.pillar h3 { font-size: var(--step-3); font-stretch: 70%; text-transform: uppercase; margin-bottom: 1rem; }
.pillar p { color: var(--muted-dark); margin: 0; }
@media (max-width: 62rem) {
  .pillars { grid-template-columns: 1fr 1fr; }
  .pillar:nth-child(3) { padding-left: 0; border-left: 0; }
  .pillar { padding-bottom: 2rem; }
}
@media (max-width: 36rem) { .pillars { grid-template-columns: 1fr; } .pillar + .pillar { padding-left: 0; border-left: 0; border-top: 1px solid var(--line-dark); } }

/* Produzioni (home) */
.prod-list { list-style: none; border-top: 1px solid var(--line); }
.prod-list__item a { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 2rem; padding: 1.2rem 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.prod-list__name { font-size: var(--step-4); font-weight: 850; font-stretch: 68%; text-transform: uppercase; line-height: .95; transition: color .25s, transform .35s var(--ease); }
.prod-list__kind { color: var(--muted); font-size: var(--step--1); letter-spacing: .1em; text-transform: uppercase; }
.prod-list__item a:hover .prod-list__name { color: var(--accent); transform: translateX(.4rem); }

/* Produzioni (indice) */
.prod-index { list-style: none; border-top: 1px solid var(--line); }
.prod-index__item { display: grid; grid-template-columns: 3.5rem 1.1fr 1.3fr; gap: 1.5rem; padding: 2rem 0; border-bottom: 1px solid var(--line); scroll-margin-top: 6rem; }
.prod-index__item:target { background: linear-gradient(90deg, var(--accent-soft), transparent 70%); }
.prod-index__n { color: var(--muted); font-variant-numeric: tabular-nums; padding-top: .4rem; }
.prod-index__name { font-size: var(--step-3); font-stretch: 70%; text-transform: uppercase; }
.prod-index__kind { margin: .5rem 0 0; color: var(--accent); font-size: var(--step--1); letter-spacing: .1em; text-transform: uppercase; font-weight: 600; }
.prod-index__text { margin: 0; color: var(--bone-2); font-size: var(--step-1); line-height: 1.5; }
@media (max-width: 48rem) { .prod-index__item { grid-template-columns: 2.4rem 1fr; } .prod-index__text { grid-column: 2; font-size: var(--step-0); } }

/* Eventi */
.event-list { list-style: none; counter-reset: ev; border-top: 1px solid var(--line); }
.event-list li { counter-increment: ev; display: grid; grid-template-columns: 2.4rem 1fr; gap: .1rem 1rem; padding: .95rem 0; border-bottom: 1px solid var(--line); }
.event-list li::before { content: counter(ev, decimal-leading-zero); grid-row: span 2; color: var(--accent); font-size: var(--step--1); font-variant-numeric: tabular-nums; padding-top: .2rem; }
.event-list__t { font-weight: 650; }
.event-list__p { color: var(--muted); font-size: var(--step--1); }
.event-list--big li { padding: 1.4rem 0; }
.event-list--big .event-list__t { font-size: var(--step-2); font-weight: 800; font-stretch: 78%; text-transform: uppercase; line-height: 1.05; }
.event-list--big .event-list__p { font-size: var(--step-0); margin-top: .3rem; }
.event-list--compact li { padding: .6rem 0; }
.event-list--compact .event-list__t { font-weight: 550; font-size: .97rem; }

.year-nav { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 3rem; }
.year-nav a { padding: .45rem .9rem; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; font-weight: 600; font-variant-numeric: tabular-nums; }
.year-nav a:hover { border-color: var(--accent); color: var(--accent); }
.years { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); gap: 3rem 2.5rem; }
.year__title { font-size: var(--step-4); font-stretch: 68%; margin-bottom: 1rem; line-height: 1; }
.year__title a { text-decoration: none; }
.year { content-visibility: auto; contain-intrinsic-size: auto 40rem; }

.pager { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 3rem; font-weight: 700; }
.pager a { text-decoration: none; padding: .6rem 1rem; border: 1px solid var(--line); border-radius: 999px; }
.pager a:hover { border-color: var(--accent); }

/* Chip */
.chips { display: flex; flex-wrap: wrap; gap: .6rem; list-style: none; }
.chip { display: inline-flex; align-items: center; gap: .6rem; padding: .7rem 1.15rem; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; font-weight: 650; transition: border-color .25s, background-color .25s, color .25s; }
a.chip:hover { border-color: var(--accent); background: var(--accent-soft); color: var(--bone); }
.chip span { font-size: .78rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.chips--static .chip { color: var(--bone-2); }
.prose .chips { margin-bottom: 2rem; }

/* Page head */
.page-head { position: relative; padding-block: clamp(2.5rem, 7vw, 6rem) clamp(2.5rem, 5vw, 4rem); border-bottom: 1px solid var(--line); overflow: hidden; isolation: isolate; }
.page-head::before { content: ""; position: absolute; z-index: -1; inset: -40% 40% auto -10%; height: 140%; background: radial-gradient(closest-side, rgb(42 125 199 / .26), transparent); }
.page-head__lead { max-width: 46rem; margin: 1.8rem 0 0; font-size: var(--step-1); line-height: 1.5; color: var(--bone-2); }
.page-head__lead a { color: var(--accent); }
.crumbs ol { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; margin-bottom: 2rem; font-size: var(--step--1); color: var(--muted); }
.crumbs li + li::before { content: "/"; margin-right: .4rem; opacity: .5; }
.crumbs a { text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }

/* Prose e card */
.prose { max-width: 44rem; }
.prose .h3 { margin: 2.5rem 0 1rem; }
.prose .h3:first-child { margin-top: 0; }
.prose p { color: var(--bone-2); }
.answer { font-size: var(--step-1); line-height: 1.55; color: var(--bone) !important; padding-left: 1.2rem; border-left: 3px solid var(--accent); }
.card { padding: clamp(1.5rem, 3vw, 2.2rem); background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--radius); }
.card--sticky { position: sticky; top: 6rem; }
.card__kicker { font-size: var(--step-2); font-weight: 800; font-stretch: 78%; text-transform: uppercase; line-height: 1.05; }
.card p { color: var(--bone-2); }
.card__alt { margin: 1rem 0 0; text-align: center; font-size: var(--step--1); color: var(--muted) !important; }
.kv { display: grid; grid-template-columns: auto 1fr; gap: .7rem 1.5rem; margin: 1.5rem 0 0; }
.kv dt { color: var(--muted); font-size: var(--step--1); padding-top: .15rem; }
.kv dd { margin: 0; font-weight: 600; }
.note { color: var(--muted); font-size: var(--step--1); margin-top: 1.5rem; }
.plain { list-style: none; display: grid; gap: .45rem; }
.plain--lg { font-size: var(--step-1); font-weight: 700; margin-block: 1rem; }
.plain a { text-decoration: none; }
.plain a:hover { text-decoration: underline; }

.ticks { list-style: none; display: grid; gap: .5rem; }
.ticks li { position: relative; padding-left: 1.6rem; color: var(--bone-2); }
.ticks li::before { content: ""; position: absolute; left: 0; top: .62em; width: .8rem; height: 2px; background: var(--accent); }
.ticks--lg { gap: .9rem; margin-bottom: 1rem; }
.ticks--lg li { font-size: var(--step-1); }

/* Griglia servizi */
.service-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); gap: 1rem; }
.service-card { position: relative; display: flex; flex-direction: column; gap: 1rem; padding: 2rem; background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--radius); transition: border-color .3s, transform .4s var(--ease); }
.service-card:hover { border-color: var(--accent); transform: translateY(-4px); }
.service-card__n { color: var(--accent); font-variant-numeric: tabular-nums; font-size: var(--step--1); }
.service-card h2 a { text-decoration: none; }
.service-card h2 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.service-card p { color: var(--bone-2); margin: 0; }
.service-card .ticks li { font-size: var(--step--1); }
.service-card .link-arrow { margin-top: auto; align-self: start; }

/* Artisti */
.artist-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); gap: 1rem; }
.artist-cat { position: relative; display: flex; flex-direction: column; gap: .8rem; padding: 2rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--ink-2); transition: border-color .3s, transform .4s var(--ease); }
.artist-cat:hover { border-color: var(--accent); transform: translateY(-4px); }
.artist-cat h2 { font-stretch: 72%; text-transform: uppercase; }
.artist-cat h2 a { text-decoration: none; }
.artist-cat h2 a::after { content: ""; position: absolute; inset: 0; }
.artist-cat p { margin: 0; color: var(--bone-2); }
.artist-cat__names { font-size: var(--step--1); color: var(--muted) !important; }
.artist-cat .link-arrow { margin-top: auto; align-self: start; }

.name-grid { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.name-grid a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; height: 100%; padding: 1.3rem 1.2rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); text-decoration: none; font-size: var(--step-1); font-weight: 750; font-stretch: 85%; transition: background-color .25s; }
.name-grid__cta { font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); opacity: 0; transform: translateX(-6px); transition: opacity .25s, transform .3s var(--ease); }
.name-grid a:hover, .name-grid a:focus-visible { background: var(--accent-soft); color: var(--bone); }
.name-grid a:hover .name-grid__cta, .name-grid a:focus-visible .name-grid__cta { opacity: 1; transform: none; }
@media (hover: none) { .name-grid__cta { opacity: 1; transform: none; } }

/* FAQ */
.faq__list { border-top: 1px solid var(--line); max-width: 58rem; }
.faq__item { border-bottom: 1px solid var(--line); }
.faq__item summary { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; padding: 1.5rem 0; cursor: pointer; list-style: none; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary h3 { font-size: var(--step-1); font-weight: 700; line-height: 1.3; }
.faq__item summary:hover h3 { color: var(--accent); }
.faq__icon { flex: none; position: relative; width: 2.2rem; height: 2.2rem; border: 1px solid var(--line); border-radius: 50%; }
.faq__icon::before, .faq__icon::after { content: ""; position: absolute; inset: 50% auto auto 50%; width: .8rem; height: 2px; background: currentColor; translate: -50% -50%; transition: rotate .3s var(--ease); }
.faq__icon::after { rotate: 90deg; }
.faq__item[open] .faq__icon::after { rotate: 0deg; }
.faq__item[open] .faq__icon { border-color: var(--accent); color: var(--accent); }
.faq__item p { max-width: 48rem; padding-bottom: 1.5rem; margin: 0; color: var(--bone-2); }
@media (prefers-reduced-motion: no-preference) {
  .faq__item::details-content { transition: height .35s var(--ease), content-visibility .35s allow-discrete; height: 0; overflow: clip; }
  .faq__item[open]::details-content { height: auto; }
  :root { interpolate-size: allow-keywords; }
}

/* CTA */
.cta { position: relative; overflow: hidden; isolation: isolate; background: var(--navy); color: var(--bone); border-top: 1px solid var(--line); }
.cta::before { content: ""; position: absolute; z-index: -1; inset: -50% -10% auto auto; width: 75%; aspect-ratio: 1; background: radial-gradient(closest-side, rgb(56 179 231 / .35), rgb(42 125 199 / .15) 55%, transparent); }
.cta::after { content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; height: 4px; background: linear-gradient(90deg, var(--navy), var(--blue), var(--accent)); }
.cta__inner { padding-block: clamp(3.5rem, 8vw, 6.5rem); display: grid; gap: 1.2rem; }
.cta__title { font-size: var(--step-4); font-stretch: 68%; text-transform: uppercase; line-height: .92; max-width: 18ch; }
.cta__text { font-size: var(--step-1); max-width: 38rem; margin: 0; color: var(--bone-2); }
.cta__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: .8rem; }

/* Contatti */
.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: 1rem; }
.contact-tile { display: flex; flex-direction: column; gap: .8rem; padding: 1.8rem; min-height: 10rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--ink-2); text-decoration: none; transition: border-color .3s, transform .4s var(--ease); }
.contact-tile:hover { border-color: var(--accent); color: var(--bone); transform: translateY(-4px); }
.contact-tile__k { font-size: var(--step--1); color: var(--muted); text-transform: uppercase; letter-spacing: .1em; }
.contact-tile__v { margin-top: auto; font-size: var(--step-2); font-weight: 800; font-stretch: 78%; line-height: 1.1; overflow-wrap: anywhere; }
.contact-tile__v--sm { font-size: var(--step-1); }

/* Modulo */
.form fieldset { border: 0; padding: 0; margin: 0 0 2.5rem; }
.form legend { font-size: var(--step-2); font-weight: 800; font-stretch: 78%; text-transform: uppercase; margin-bottom: 1.2rem; }
.field { display: grid; gap: .4rem; margin-bottom: 1.2rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
@media (max-width: 36rem) { .field-row { grid-template-columns: 1fr; } }
.field label, .field__label { font-weight: 650; font-size: .95rem; }
.field__hint { font-size: var(--step--1); color: var(--muted); }
.field input:not([type="checkbox"]), .field select, .field textarea {
  width: 100%; min-height: 3.1rem; padding: .75rem 1rem;
  font: inherit; font-size: 1rem; color: var(--bone);
  background: var(--ink-2); border: 1px solid rgb(238 242 248 / .4); border-radius: 10px; /* contorno ≥ 3:1 sul fondo (WCAG 1.4.11) */
  transition: border-color .2s, box-shadow .2s;
}
.field textarea { resize: vertical; min-height: 9rem; }
.field input:not([type="checkbox"]):focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.field :is(input, select, textarea):user-invalid, .field :is(input, select, textarea)[aria-invalid="true"] { border-color: var(--error); }
.field :is(input, textarea)[required]:user-valid { border-color: rgb(140 220 160 / .6); }
.field__error { margin: 0; color: var(--error); font-size: var(--step--1); font-weight: 600; }
.field input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1); opacity: .7; }
.checks { display: flex; flex-wrap: wrap; gap: .5rem; }
.check { display: inline-flex; align-items: flex-start; gap: .6rem; cursor: pointer; }
.checks .check { padding: .55rem .95rem; border: 1px solid var(--line); border-radius: 999px; font-weight: 600; font-size: .95rem; align-items: center; }
.checks .check:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.check input { width: 1.15rem; height: 1.15rem; margin: .2rem 0 0; accent-color: var(--accent); flex: none; }
.checks .check input { margin: 0; }
.check--consent { font-weight: 400; font-size: var(--step--1); color: var(--bone-2); }
.check--consent a { color: var(--bone); }
.form__alert { padding: 1.2rem 1.4rem; margin-bottom: 2rem; border: 1px solid var(--error); border-radius: 10px; background: rgb(255 138 122 / .08); }
.form__alert ul { padding-left: 1.2rem; }
.form__alert a { color: var(--error); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Footer: logo, link, "Seguici su" e riga legale (gli stessi contenuti del vecchio sito) */
.site-footer { background: var(--ink-2); border-top: 1px solid var(--line); padding-block: clamp(3rem, 7vw, 5rem) 2rem; }
.site-footer__grid {
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 2.5rem 2rem; align-items: start;
  padding-bottom: clamp(2.5rem, 6vw, 4rem);
}
.site-footer__logo { display: block; width: 10rem; height: auto; }
.site-footer__h { margin: 0 0 .45rem; font-size: var(--step--1); font-weight: 600; line-height: 1.2; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.site-footer__nav, .site-footer__social { list-style: none; display: grid; justify-items: start; }
/* la prima voce parte alla stessa altezza del logo e di "Seguici su" */
.site-footer__nav { margin-top: -.5rem; }
.site-footer__nav a {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  font-size: var(--step-2); font-weight: 800; font-stretch: 75%; line-height: 1; text-transform: uppercase;
  text-decoration: none; color: var(--bone); transition: color .2s;
}
.site-footer__social a { display: inline-flex; align-items: center; gap: .45rem; min-height: 2.25rem; color: var(--bone-2); text-decoration: none; transition: color .2s; }
.site-footer__social a::after { content: "↗"; content: "↗" / ""; font-size: .85em; color: var(--muted); transition: translate .25s var(--ease), color .2s; }
.site-footer__nav a:hover, .site-footer__social a:hover { color: var(--accent); }
.site-footer__social a:hover::after { color: var(--accent); translate: 2px -2px; }
.site-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .5rem 2rem; padding-top: 1.5rem; border-top: 1px solid var(--line); font-size: var(--step--1); color: var(--muted); }
.site-footer__legal p { margin: 0; }
.site-footer__seg { white-space: nowrap; } /* la riga va a capo solo tra una voce e l'altra */
.site-footer__legal a { color: var(--bone-2); }
.site-footer__legal a:hover { color: var(--accent); }
@media (max-width: 48rem) {
  /* sul telefono ogni link del piè di pagina è alto almeno 44px */
  .site-footer__social a, .site-footer__legal a { min-height: 2.75rem; }
  .site-footer__legal { flex-direction: column; align-items: flex-start; gap: .4rem; }
  .site-footer__legal a { display: inline-flex; align-items: center; }
}
@media (max-width: 36rem) {
  .site-footer__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2rem 1.25rem; }
  .site-footer__logo { grid-column: 1 / -1; }
}

/* Comparsa allo scroll: solo miglioramento progressivo, nessun fallback necessario (effetto decorativo) */
@media (prefers-reduced-motion: no-preference) {
  @supports ((animation-timeline: view()) and (animation-range: entry)) {
    .reveal {
      animation: reveal-in linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 60%;
    }
    @keyframes reveal-in { from { opacity: 0; transform: translateY(28px); } }
  }
}

/* Area riservata */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.admin-narrow { max-width: 26rem; margin-top: 2rem; }
.admin-code { padding: 1rem; background: var(--ink-2); border: 1px solid var(--line); border-radius: 10px; overflow-x: auto; white-space: pre-wrap; word-break: break-all; }
.admin-list { display: grid; gap: 1rem; }
.admin-item--nuova { border-left: 3px solid var(--accent); }
.admin-item--chiusa { opacity: .65; }
.admin-item__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; }
.admin-item__head .note { margin: .4rem 0 0; }
.admin-item__actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.admin-item__actions select { min-height: 2.5rem; padding: .3rem .6rem; background: var(--ink); color: var(--bone); border: 1px solid var(--line); border-radius: 8px; font: inherit; }
.admin-item__msg { margin: 1.2rem 0 0; padding-top: 1rem; border-top: 1px solid var(--line); color: var(--bone-2); }
.year-nav a[aria-current="page"] { border-color: var(--accent); color: var(--accent); }

@media print {
  .site-header, .skip, .hero__lights, .hero__mark, .a-map__art, .d-thanks__mark { display: none !important; }
  body { background: #fff; color: #000; }
  /* su carta: testo scuro ovunque e logo nella versione per fondi chiari */
  body *, body *::before, body *::after { color: #000 !important; background-color: transparent !important; background-image: none !important; box-shadow: none !important; transition: none !important; }
  .site-footer { border-top-color: #000; }
  .site-footer__logo { width: 10rem; content: url("../img/logo-color.svg"); }
}

/* ---------------------------------------------------------------------------
   Foto del vecchio sito (cartella /images sul server). Il riquadro ha sempre
   proporzioni fisse; se il file manca resta il fondo con il marchio MAM.
   ------------------------------------------------------------------------- */
.photo {
  position: relative;
  overflow: hidden;
  aspect-ratio: var(--ratio, 4 / 3);
  max-width: 100%;
  background: var(--ink-3);
  border-radius: calc(var(--radius) * .6);
}
.photo::before {
  content: "";
  position: absolute; inset: 0;
  background: url("../img/mark-dark.svg") center / 44% auto no-repeat;
  opacity: .09;
}
.photo img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  color: transparent; /* niente testo alternativo sovrapposto se l'immagine non arriva */
}
.photo.is-missing img { opacity: 0; } /* nascosta ma con il testo alternativo ancora leggibile dagli screen reader */

/* Briciole di pane: area di tocco di almeno 44px sul telefono */
.crumbs a { display: inline-block; padding-block: .75rem; margin-block: -.75rem; }

/* ===== a-home.css ===== */
/* Gruppo a-home: Home, Chi siamo, Contatti (stessi token di main.css) */

/* ---------------------------------------------------------------------------
   Home — hero
   ------------------------------------------------------------------------- */
.a-hero { padding-top: clamp(4.5rem, 13vw, 10rem); }
.a-hero .hero__inner { padding-bottom: clamp(3.5rem, 9vw, 7.5rem); }
.a-hero .hero__lead { margin-top: clamp(1.5rem, 3vw, 2.2rem); max-width: 34rem; text-wrap: balance; }
.a-hero .hero__actions { align-items: center; gap: 1rem 2rem; margin-top: clamp(2rem, 4vw, 2.8rem); }
.a-hero .hero__actions .link-arrow { position: relative; }
/* area di tocco di almeno 44px senza spostare la sottolineatura */
.a-hero .hero__actions .link-arrow::before { content: ""; position: absolute; inset: -.8rem -.6rem; }

/* ---------------------------------------------------------------------------
   Home — Eventi 2020
   ------------------------------------------------------------------------- */
.a-ev__title { margin-bottom: clamp(2rem, 4.5vw, 3.2rem); }
.a-ev__title a { display: inline-flex; align-items: center; gap: .35em; text-decoration: none; }
.a-ev__go {
  display: inline-grid; place-items: center; flex: none;
  width: clamp(2.75rem, 2rem + 2vw, 3.6rem); aspect-ratio: 1;
  border: 1px solid var(--line); border-radius: 50%;
  font: 400 var(--step-1)/1 var(--sans); font-stretch: 100%;
  transition: border-color .25s, color .25s, transform .35s var(--ease);
}
.a-ev__title a:hover { color: var(--bone); }
.a-ev__title a:hover .a-ev__go { border-color: var(--accent); color: var(--accent); transform: translateX(4px); }

.a-ev__list {
  --thumb: 8.5rem;
  list-style: none;
  display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(5, auto); grid-auto-flow: column;
  column-gap: clamp(2rem, 5vw, 5rem);
}
.a-ev__item {
  display: grid; grid-template-columns: var(--thumb) minmax(0, 1fr); grid-template-rows: auto auto;
  column-gap: clamp(1rem, 2vw, 1.5rem); align-content: center;
  padding-block: 1rem; border-bottom: 1px solid var(--line);
}
.a-ev__item:nth-child(5n + 1) { border-top: 1px solid var(--line); }
.a-ev__photo { --ratio: 4 / 3; grid-row: 1 / 3; align-self: center; }
.a-ev__photo::before { background-size: 54% auto; }
.a-ev__n { align-self: end; color: var(--accent); font-size: var(--step--1); font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: .06em; }
.a-ev__t { align-self: start; margin-top: .2rem; font-size: var(--step-1); font-weight: 650; line-height: 1.25; text-wrap: balance; }

/* Foto mancante (main.js aggiunge .is-missing): niente riquadri vuoti, resta un elenco numerato
   come "Archivio 2020" della proposta 1: numero a sinistra, titolo sulla stessa riga */
.a-ev__photo.is-missing { display: none; }
.a-ev__item:has(> .a-ev__photo.is-missing) { grid-template-columns: 2.6rem minmax(0, 1fr); grid-template-rows: auto; align-items: baseline; align-content: start; }
.a-ev__item:has(> .a-ev__photo.is-missing) > .a-ev__n,
.a-ev__item:has(> .a-ev__photo.is-missing) > .a-ev__t { align-self: baseline; margin-top: 0; }

@media (max-width: 62rem) {
  .a-ev__list { --thumb: 7rem; grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; }
  .a-ev__item:nth-child(5n + 1) { border-top: 0; }
  .a-ev__item:first-child { border-top: 1px solid var(--line); }
}
@media (max-width: 36rem) {
  .a-ev__list { --thumb: 5.75rem; }
  .a-ev__item { padding-block: .85rem; }
  .a-ev__item:has(> .a-ev__photo.is-missing) { grid-template-columns: 2.1rem minmax(0, 1fr); }
  .a-ev__t { font-size: var(--step-0); }
}

/* ---------------------------------------------------------------------------
   Home — Operiamo / Collaboriamo / Progettiamo / Forniamo
   Il verbo (titolo) e la sua frase si leggono come un’unica affermazione.
   ------------------------------------------------------------------------- */
.a-verbs__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 5vw, 4.5rem) clamp(2rem, 6vw, 6rem); }
.a-verb { padding-top: clamp(1.4rem, 2.5vw, 2rem); border-top: 1px solid var(--line-dark); }
.a-verb__h, .a-verb__p { display: inline; font-size: var(--step-2); line-height: 1.22; }
.a-verb__h {
  margin-right: .12em;
  font-weight: 850; font-stretch: 70%; text-transform: uppercase; letter-spacing: -.005em;
  font-size: calc(var(--step-2) * 1.12);
  color: var(--blue);
}
.a-verb__p { margin: 0; font-weight: 450; color: var(--navy); text-wrap: pretty; }
.a-nowrap { white-space: nowrap; }
@media (max-width: 48rem) { .a-verbs__grid { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------------
   Chi siamo
   ------------------------------------------------------------------------- */
.a-about__grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.a-about__text { max-width: 40rem; }
.a-about__text p { font-size: var(--step-1); line-height: 1.55; }
.a-about__text .a-about__first { font-size: var(--step-2); line-height: 1.35; font-weight: 500; color: var(--bone); margin-bottom: 1.2em; }
.a-about__photo { --ratio: 4 / 5; width: 100%; max-width: 30rem; justify-self: end; }
/* Tablet: il primo paragrafo prende tutta la riga, sotto il secondo paragrafo accanto alla foto
   (evita la foto isolata a sinistra con mezza riga vuota) */
@media (max-width: 56rem) {
  .a-about__grid { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1.6rem clamp(1.5rem, 5vw, 3rem); align-items: start; }
  .a-about__text { display: contents; }
  .a-about__text .a-about__first { grid-column: 1 / -1; max-width: 44rem; margin: 0; }
  .a-about__text p:last-child { margin: 0; }
  .a-about__photo { justify-self: stretch; max-width: none; }
}
@media (max-width: 36rem) {
  .a-about__grid { grid-template-columns: 1fr; }
  .a-about__photo { justify-self: start; max-width: 26rem; margin-top: .4rem; }
}
/* Foto mancante: niente pannello vuoto. Sugli schermi larghi il primo paragrafo resta a sinistra e il secondo
   gli si affianca a destra, allineato all’ultima riga; sotto i 56rem i due paragrafi si leggono su una colonna */
.a-about__photo.is-missing { display: none; }
.a-about__grid:has(> .a-about__photo.is-missing) { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 56.01rem) {
  .a-about__grid:has(> .a-about__photo.is-missing) { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: end; }
  .a-about__grid:has(> .a-about__photo.is-missing) .a-about__text { display: contents; }
  .a-about__grid:has(> .a-about__photo.is-missing) .a-about__text p { max-width: 40rem; margin: 0; }
}

.a-aff__grid { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); }
.a-aff__item { display: flex; flex-direction: column; gap: 1.2rem; }
.a-aff__logo { --ratio: 1 / 1; background: #fff; border: 1px solid var(--line-dark); }
.a-aff__logo::before { filter: brightness(0); opacity: .06; }
.a-aff__logo img { object-fit: contain; padding: 12%; }
.a-aff__t { font-size: var(--step-1); font-weight: 800; font-stretch: 80%; text-transform: uppercase; line-height: 1.1; letter-spacing: 0; color: var(--navy); }
@media (max-width: 62rem) { .a-aff__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.2rem 1.2rem; } }
/* Logo mancante: niente quadrati bianchi vuoti, i titoli diventano una fila di voci con filetto (come i "pilastri") */
.a-aff__logo.is-missing { display: none; }
.a-aff__item:has(> .a-aff__logo.is-missing) { padding-top: 1.2rem; border-top: 1px solid var(--line-dark); }
.a-aff:has(.a-aff__logo.is-missing) { padding-block: clamp(2.5rem, 6vw, 5rem); } /* fascia bassa, come .section--tight */
@media (max-width: 30rem) {
  .a-aff__grid { grid-template-columns: 1fr; gap: 0; border-top: 1px solid var(--line-dark); }
  .a-aff__item { flex-direction: row; align-items: center; gap: 1.2rem; padding-block: 1rem; border-bottom: 1px solid var(--line-dark); }
  .a-aff__logo { flex: none; width: 6.5rem; }
  .a-aff__item:has(> .a-aff__logo.is-missing) { padding-top: 1rem; border-top: 0; }
}
@media (max-width: 24rem) { .a-aff__logo { width: 5rem; } }

/* ---------------------------------------------------------------------------
   Contatti
   ------------------------------------------------------------------------- */
.a-contact__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 6rem); align-items: stretch; }
.a-contact__name { font-size: var(--step-3); font-stretch: 70%; text-transform: uppercase; line-height: .95; letter-spacing: -.01em; margin-bottom: 1.2rem; }
.a-contact__addr { margin: 0 0 clamp(1.8rem, 4vw, 2.6rem); font-size: var(--step-1); line-height: 1.45; color: var(--bone-2); }
.a-contact__list { margin: 0; border-top: 1px solid var(--line); }
.a-contact__list > div { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: .2rem 1.5rem; align-items: baseline; padding-block: .55rem; border-bottom: 1px solid var(--line); }
.a-contact__list dt { font-size: var(--step--1); color: var(--muted); letter-spacing: .1em; text-transform: uppercase; }
.a-contact__list dd { margin: 0; display: flex; flex-direction: column; align-items: flex-start; }
.a-contact__list a {
  display: inline-flex; align-items: center; min-height: 2.75rem; max-width: 100%; padding-block: .3rem;
  font-size: var(--step-2); font-weight: 800; font-stretch: 78%; line-height: 1.1;
  text-decoration: none; overflow-wrap: anywhere;
}
.a-contact__list a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
@media (max-width: 36rem) {
  .a-contact__list > div { grid-template-columns: 1fr; padding-block: .9rem .35rem; }
}

.a-map {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; align-items: flex-end;
  min-height: 22rem; padding: clamp(1.4rem, 3vw, 2rem);
  background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--radius);
  text-decoration: none;
  transition: border-color .3s;
}
.a-map__art { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; }
.a-map__grid line { stroke: rgb(238 242 248 / .07); stroke-width: 1; }
.a-map__roads path { fill: none; stroke: rgb(238 242 248 / .16); stroke-width: 7; stroke-linecap: round; }
.a-map__ring { fill: none; stroke: var(--accent); stroke-width: 1.5; opacity: .55; }
.a-map__pin { fill: var(--accent); }
.a-map__label {
  display: inline-flex; align-items: center; gap: .5rem;
  min-height: 2.75rem; padding: .6rem 1.1rem;
  background: var(--ink); border: 1px solid var(--line); border-radius: 999px;
  font-weight: 700; font-stretch: 90%;
}
.a-map__label::after { content: "↗"; transition: transform .25s var(--ease); }
.a-map:hover { color: var(--bone); border-color: var(--accent); }
.a-map:hover .a-map__label { border-color: var(--accent); }
.a-map:hover .a-map__label::after { transform: translate(2px, -2px); }
@media (prefers-reduced-motion: no-preference) {
  .a-map__ring { transform-box: fill-box; transform-origin: center; animation: a-ping 2.8s var(--ease) infinite; }
  @keyframes a-ping { 0% { scale: .5; opacity: .8; } 100% { scale: 1.5; opacity: 0; } }
}
/* Una colonna fino a 72rem: sotto questa larghezza la colonna dei recapiti a fianco della mappa è troppo stretta
   e email e sito andrebbero a capo a metà parola. La mappa sotto ai recapiti non supera i 26rem di altezza. */
@media (max-width: 72rem) {
  .a-contact__grid { grid-template-columns: 1fr; }
  .a-map { width: 100%; min-height: 0; aspect-ratio: 16 / 9; max-height: 26rem; }
}
@media (max-width: 36rem) { .a-map { aspect-ratio: 4 / 3; } }

/* ===== b-artisti.css ===== */
/* Gruppo b-artisti: /produzioni, /artisti, /artisti/{categoria}.
   Solo token e componenti di main.css; classi con prefisso proprio (prod-feature, cat-index, roster, cat-switch). */

/* ---------------------------------------------------------------------------
   Produzioni: elenco editoriale (numero, nome grande, testo; foto a lato)
   ------------------------------------------------------------------------- */
.prod-feature-wrap { padding-top: 0; }
.prod-feature { list-style: none; counter-reset: prod; }
.prod-feature__item {
  counter-increment: prod;
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 6fr);
  gap: clamp(1.5rem, 4vw, 4.5rem);
  align-items: start;
  padding-block: clamp(2.25rem, 4.5vw, 3.75rem);
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 5rem;
}
.prod-feature__body { display: grid; gap: clamp(1rem, 1.8vw, 1.5rem); }
.prod-feature__body::before {
  content: counter(prod, decimal-leading-zero);
  font-size: var(--step--1); font-weight: 600; color: var(--accent);
  letter-spacing: .08em; font-variant-numeric: tabular-nums;
}
.prod-feature__name {
  font-size: clamp(2.3rem, 1.5rem + 3.6vw, 4.6rem); font-weight: 850; font-stretch: 68%;
  text-transform: uppercase; line-height: .92; letter-spacing: -.005em;
  overflow-wrap: normal; hyphens: manual;
}
.prod-feature__text { margin: 0; max-width: 36ch; font-size: var(--step-1); line-height: 1.5; color: var(--bone-2); }
.prod-feature__item:target .prod-feature__name { color: var(--accent); }

.prod-feature__photo { --ratio: 3 / 2; }
/* Il logo di Battiti Live resta intero, mai tagliato; il fondo copre il marchio di riserva dietro le zone trasparenti */
.prod-feature__photo--logo img { object-fit: contain; padding: 10%; background: var(--ink-3); }

/* Niente doppia riga sopra il piede di pagina */
.prod-feature__item:last-child { border-bottom: 0; }

@media (max-width: 40rem) {
  .prod-feature__item { grid-template-columns: 1fr; gap: 1.3rem; }
  .prod-feature__photo { order: -1; }
  .prod-feature__body { gap: .85rem; }
  .prod-feature__text { font-size: var(--step-0); }
}
/* Dal tablet in su: testo centrato sulla foto e foto alternata a sinistra e a destra */
@media (min-width: 40.01rem) {
  .prod-feature__item { align-items: center; }
  .prod-feature__item:nth-child(even) { grid-template-columns: minmax(0, 6fr) minmax(0, 7fr); }
  .prod-feature__item:nth-child(even) .prod-feature__photo { order: -1; }
}

/* Foto non disponibile (main.js aggiunge .is-missing): niente riquadro vuoto, la voce diventa una riga
   dell'elenco tipografico (numero, nome, testo), come l'indice delle produzioni della proposta 1 */
.prod-feature__photo.is-missing { display: none; }
.prod-feature__item:has(> .prod-feature__photo.is-missing) {
  grid-template-columns: minmax(0, 1fr);
  padding-block: clamp(1.6rem, 2.6vw, 2.25rem);
}
.prod-feature__item:has(> .prod-feature__photo.is-missing) .prod-feature__body {
  grid-template-columns: 3.5rem minmax(0, 1.1fr) minmax(0, 1.3fr);
  align-items: baseline;
  gap: 1rem 1.5rem;
}
.prod-feature__item:has(> .prod-feature__photo.is-missing) .prod-feature__name { font-size: var(--step-3); font-stretch: 70%; }
.prod-feature__item:has(> .prod-feature__photo.is-missing) .prod-feature__text { max-width: 60ch; }
@media (max-width: 48rem) {
  .prod-feature__item:has(> .prod-feature__photo.is-missing) .prod-feature__body { grid-template-columns: 2.4rem minmax(0, 1fr); gap: .6rem 1rem; }
  .prod-feature__item:has(> .prod-feature__photo.is-missing) .prod-feature__text { grid-column: 2; font-size: var(--step-0); }
}

/* ---------------------------------------------------------------------------
   Artisti (indice): le nove categorie come grandi link, con un ventaglio di foto
   ------------------------------------------------------------------------- */
.cat-index-wrap { padding-top: 0; }
.cat-index { list-style: none; }
.cat-index__link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 2.5rem;
  align-items: center;
  gap: 1.5rem clamp(1.5rem, 3vw, 3rem);
  padding-block: clamp(1.1rem, 2.2vw, 1.7rem);
  border-bottom: 1px solid var(--line);
  text-decoration: none;
}
.cat-index__link:hover { color: var(--bone); }
/* Stessa scala dei nomi di /produzioni: un gradino sotto il titolo della pagina */
.cat-index__name {
  font-size: clamp(2.3rem, 1.5rem + 3.6vw, 4.6rem); font-weight: 850; font-stretch: 68%;
  text-transform: uppercase; line-height: .92; letter-spacing: -.005em;
  text-wrap: balance;
  transition: color .25s, transform .35s var(--ease);
}
.cat-index__faces { display: flex; }
.cat-index__face {
  --ratio: 4 / 5;
  flex: none;
  width: clamp(3.4rem, 5vw, 4.6rem);
  border: 3px solid var(--ink);
  border-radius: 10px;
  transition: transform .35s var(--ease);
}
.cat-index__face::before { display: none; } /* il marchio non si legge in un riquadro così piccolo */
.cat-index__face:not(.is-missing) ~ .cat-index__face { margin-left: -1.1rem; }
/* Foto che non arrivano: niente riquadri vuoti; se mancano tutte, resta solo il nome con la freccia */
.cat-index__face.is-missing { display: none; }
.cat-index__faces:not(:has(> :not(.is-missing))) { display: none; }
.cat-index__arrow { grid-column: 3; justify-self: end; font-size: var(--step-2); line-height: 1; color: var(--muted); transition: transform .3s var(--ease), color .25s; }

.cat-index__link:hover .cat-index__name,
.cat-index__link:focus-visible .cat-index__name { color: var(--accent); transform: translateX(.4rem); }
.cat-index__link:hover .cat-index__arrow,
.cat-index__link:focus-visible .cat-index__arrow { color: var(--accent); transform: translateX(6px); }
.cat-index__link:hover .cat-index__face:nth-child(2) { transform: translateX(.3rem); }
.cat-index__link:hover .cat-index__face:nth-child(3) { transform: translateX(.6rem); }
.cat-index__link:hover .cat-index__face:nth-child(4) { transform: translateX(.9rem); }

@media (max-width: 40rem) {
  .cat-index__link { grid-template-columns: minmax(0, 1fr) auto; gap: .9rem 1rem; padding-block: 1.3rem; }
  .cat-index__faces { grid-row: 2; grid-column: 1; }
  .cat-index__face { width: 2.9rem; border-width: 2px; border-radius: 8px; }
  .cat-index__face:not(.is-missing) ~ .cat-index__face { margin-left: -.7rem; }
  .cat-index__arrow { grid-row: 1; grid-column: 2; align-self: start; padding-top: .3rem; }
}

/* ---------------------------------------------------------------------------
   Categoria: i 20 artisti (foto verticale + nome, link a Wikipedia come nel vecchio sito)
   ------------------------------------------------------------------------- */
.roster {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  /* tra le colonne c'è spazio per l'asterisco che sporge a sinistra del nome, lontano dalla freccia della scheda accanto */
  gap: clamp(1.6rem, 3vw, 2.6rem) clamp(1.25rem, 1.6vw, 1.5rem);
}
@media (min-width: 42rem) { .roster { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .roster { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

.roster__card { display: grid; grid-template-rows: auto 1fr; align-content: start; gap: .8rem; height: 100%; text-decoration: none; }
.roster__photo { --ratio: 4 / 5; }
.roster__photo img { transition: transform .5s var(--ease); }
.roster__name {
  display: flex; justify-content: space-between; align-items: start; gap: .6rem;
  margin: 0;
  font-size: clamp(1.02rem, .9rem + .45vw, 1.35rem); font-weight: 800; font-stretch: 80%;
  text-transform: uppercase; line-height: 1.08; letter-spacing: .01em;
  text-wrap: balance;
  hyphens: manual; overflow-wrap: normal; word-break: normal;
}
.roster__ext { flex: none; font-size: .9em; line-height: 1.1; color: var(--muted); transition: color .25s, transform .3s var(--ease); }
a.roster__card:hover { color: var(--bone); }
a.roster__card:hover .roster__photo img { transform: scale(1.04); }
a.roster__card:hover .roster__name,
a.roster__card:hover .roster__ext { color: var(--accent); }
a.roster__card:hover .roster__ext { transform: translate(2px, -2px); }
a.roster__card:focus-visible { outline-offset: 6px; }

/* Schede con due artisti (es. Gino Paoli e Danilo Rea): la scheda non è un link, lo è ogni nome.
   Una riga per nome, con la stessa freccia delle altre schede; tutta la riga è l'area cliccabile del suo link. */
.roster__name--multi { display: grid; justify-content: stretch; gap: .3em; }
.roster__row { position: relative; display: flex; justify-content: space-between; align-items: start; gap: .6rem; }
.roster__row::after {
  content: "↗";
  content: "↗" / "";
  flex: none; font-size: .9em; line-height: 1.1; color: var(--muted);
  transition: color .25s, transform .3s var(--ease);
}
.roster__link { text-decoration: none; transition: color .25s; }
/* Area cliccabile del link = la riga intera (anche "e" e la freccia), fino a metà dello spazio tra le due righe */
.roster__link::before { content: ""; position: absolute; inset: -.15em 0; }
.roster__row:has(.roster__link:hover)::after { color: var(--accent); transform: translate(2px, -2px); }
.roster__card--multi:has(.roster__link:hover) .roster__photo img { transform: scale(1.04); }
@supports selector(:has(*)) {
  .roster__link:focus-visible { outline: none; }
  .roster__row:has(.roster__link:focus-visible) { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
}
/* Telefono e schermi touch: area di tocco di almeno 44px per nome, senza cambiare l'aspetto. La prima riga
   si allarga verso l'alto (spazio sotto la foto), l'ultima verso il basso (spazio tra le file di schede, 1.6rem o più) */
@media (max-width: 40rem), (pointer: coarse) {
  .roster__row:first-child .roster__link::before { top: -1.5rem; }
  .roster__row:last-child .roster__link::before { bottom: -1.5rem; }
}

.roster__note {
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0;
  font-size: var(--step--1); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted);
}

/* Navigazione tra le categorie */
.cat-switch { border-top: 1px solid var(--line); }
.cat-switch__label {
  margin-bottom: 1.2rem;
  font-size: var(--step--1); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; line-height: 1.4; color: var(--muted);
}
.cat-switch .chip { min-height: 2.75rem; }

/* Asterisco del vecchio sito: artisti in collaborazione con agenzia nazionale. Sporge a sinistra, così tutti
   i nomi (e le loro seconde righe) partono dal bordo della foto o della cella */
.roster__star { display: inline-block; width: .6em; margin-left: -.6em; color: var(--accent); }

/* Artisti senza foto nei dati (Spettacoli e Cabaret): al posto del marchio, le iniziali del nome */
.roster__photo[data-initials]::before { display: none; }
.roster__photo[data-initials]::after {
  content: attr(data-initials);
  content: attr(data-initials) / "";
  position: absolute; inset: 0;
  display: grid; place-items: center;
  font-size: clamp(2.5rem, 5vw, 4.5rem); font-weight: 850; font-stretch: 68%; line-height: 1; letter-spacing: .01em;
  color: var(--muted-dark);
}

/* ---------------------------------------------------------------------------
   Foto non disponibili (anteprima online): se manca già la foto della prima scheda, l'elenco diventa la
   griglia di nomi bordata della proposta 1, senza riquadri vuoti. Le due schede senza foto nei dati di
   Spettacoli e Cabaret non sono le prime, quindi sul sito con le foto non la attivano.
   ------------------------------------------------------------------------- */
.roster:has(> .roster__item:first-child .roster__photo.is-missing) {
  gap: 0;
  border-top: 1px solid var(--line); border-left: 1px solid var(--line);
}
.roster:has(> .roster__item:first-child .roster__photo.is-missing) .roster__item {
  border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.roster:has(> .roster__item:first-child .roster__photo.is-missing) .roster__photo { display: none; }
.roster:has(> .roster__item:first-child .roster__photo.is-missing) .roster__card {
  --cell-y: 1.3rem; --cell-x: clamp(1rem, .5rem + 1vw, 1.2rem);
  display: block; padding: var(--cell-y) var(--cell-x);
  transition: background-color .25s;
}
.roster:has(> .roster__item:first-child .roster__photo.is-missing) a.roster__card:hover,
.roster:has(> .roster__item:first-child .roster__photo.is-missing) a.roster__card:focus-visible { background: var(--accent-soft); }
.roster:has(> .roster__item:first-child .roster__photo.is-missing) a.roster__card:focus-visible { outline-offset: -2px; border-radius: 0; }
/* Schede con due nomi: ogni link occupa la sua metà della cella (sopra e sotto fino al bordo) */
.roster:has(> .roster__item:first-child .roster__photo.is-missing) .roster__link::before { left: calc(-1 * var(--cell-x)); right: calc(-1 * var(--cell-x)); }
.roster:has(> .roster__item:first-child .roster__photo.is-missing) .roster__row:first-child .roster__link::before { top: calc(-1 * var(--cell-y)); }
.roster:has(> .roster__item:first-child .roster__photo.is-missing) .roster__row:last-child .roster__link::before { bottom: calc(-1 * var(--cell-y)); }
/* Celle abbastanza larghe per i nomi lunghi (Castrignanò, Brancaleoni) e la freccia: due colonne fino al tablet */
@media (max-width: 47.99rem) {
  .roster:has(> .roster__item:first-child .roster__photo.is-missing) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 40rem) {
  .roster:has(> .roster__item:first-child .roster__photo.is-missing) .roster__card { --cell-y: 1.15rem; }
}
@media (max-width: 47.99rem), (pointer: coarse) {
  .roster:has(> .roster__item:first-child .roster__photo.is-missing) .roster__card--multi { --cell-y: 1.6rem; }
}
@media (max-width: 22.4rem) {
  .roster:has(> .roster__item:first-child .roster__photo.is-missing) { grid-template-columns: minmax(0, 1fr); }
}

/* ===== c-eventi.css ===== */
/* Gruppo c-eventi: /eventi, /eventi/{anno}, /gallery (solo token e componenti di main.css; classi evy, evh1, evd, evt, evc, evp, gal, lb) */

/* ---------------------------------------------------------------------------
   Eventi (indice): i dieci link "I 10 eventi più importanti del <anno>" con la foto dell’anno.
   Telefono: righe con miniatura. Tablet: 2 colonne. Desktop: 3 colonne, prima e ultima scheda larghe.
   ------------------------------------------------------------------------- */
.evy { list-style: none; display: grid; border-top: 1px solid var(--line); }
.evy__link {
  display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); align-items: center; column-gap: 1.1rem;
  padding-block: 1rem; border-bottom: 1px solid var(--line);
  text-decoration: none;
}
.evy__link:hover { color: var(--bone); }
.evy__photo { display: block; --ratio: 4 / 3; }
.evy__photo::before, .evc__photo::before, .evd__photo::before { background-size: auto 30%; }
.evy__photo img { transition: transform .6s var(--ease); }
.evy__text { display: grid; gap: .45rem; min-width: 0; }
.evy__k {
  font-size: var(--step--1); font-weight: 600; line-height: 1.3; letter-spacing: .12em; text-transform: uppercase;
  color: var(--bone-2);
}
.evy__y {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  font-size: var(--step-4); font-weight: 850; font-stretch: 68%; line-height: .9; letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  transition: color .25s;
}
.evy__go {
  display: inline-grid; place-items: center; flex: none;
  width: clamp(2.75rem, 2rem + 1.6vw, 3.4rem); aspect-ratio: 1;
  border: 1px solid var(--line); border-radius: 50%;
  font: 400 var(--step-1)/1 var(--sans); font-stretch: 100%; letter-spacing: 0;
  transition: border-color .25s, color .25s, transform .35s var(--ease);
}
.evy__link:hover .evy__y { color: var(--accent); }
.evy__link:hover .evy__go { border-color: var(--accent); transform: translateX(4px); }
@media (prefers-reduced-motion: no-preference) { .evy__link:hover .evy__photo img { transform: scale(1.04); } }

@media (min-width: 40rem) {
  .evy { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1rem, 2.5vw, 2rem); border-top: 0; }
  /* la riga della foto e quella del testo sono condivise tra le schede affiancate (subgrid) */
  .evy__item { display: grid; grid-row: span 2; grid-template-rows: subgrid; padding-bottom: clamp(2.5rem, 4.5vw, 3.75rem); }
  .evy__link { grid-row: span 2; grid-template-rows: subgrid; grid-template-columns: none; align-items: stretch; padding: 0; border: 0; }
  .evy__photo { --ratio: 3 / 2; }
  .evy__text { margin-top: 1.1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
}
@media (min-width: 62rem) {
  .evy { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .evy__item--wide { grid-column: span 2; }
  /* la foto larga prende l’altezza delle foto vicine */
  .evy__item--wide .evy__photo { aspect-ratio: auto; min-height: 12rem; }
}
/* Senza foto (file assenti, main.js aggiunge .is-missing): niente riquadri vuoti, resta l’indice degli anni a righe */
.evy:has(> .evy__item:first-child .evy__photo.is-missing) .evy__photo { display: none; }
.evy:has(> .evy__item:first-child .evy__photo.is-missing) .evy__link { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 40rem) {
  .evy:has(> .evy__item:first-child .evy__photo.is-missing) .evy__text { margin-top: 0; }
}

/* ---------------------------------------------------------------------------
   Anno: titolo, foto di testata, elenco (2011–2019) o schede con foto (2020), anni vicini
   ------------------------------------------------------------------------- */
.evh1 { display: block; }
/* sempre su due righe uguali per ogni anno ("I 10 eventi più / importanti del <anno>"), anche a 320px */
.evh1 { max-width: 11em; }
@media (max-width: 40rem) { .evh1 { font-size: min(var(--step-4), 2.45rem, 10.2vw); } }

/* Testo evento "Evento, Luogo": la parte prima della virgola in evidenza, il resto in corsivo */
.evt { display: block; text-wrap: pretty; }
.evt__name { font-weight: 800; font-stretch: 78%; text-transform: uppercase; letter-spacing: -.003em; }
.evt__place { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.12em; line-height: 1; color: var(--bone-2); }

.evd { display: grid; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.evd__photo { display: block; --ratio: 16 / 9; }
.evd__list { border-top: 1px solid var(--line); }
.evd__list li { grid-template-columns: 2.2rem minmax(0, 1fr); padding-block: 1rem; }
.evd__list li::before { padding-top: .35em; font-weight: 600; letter-spacing: .06em; }
.evd__list .evt { font-size: var(--step-1); line-height: 1.12; }
@media (min-width: 40rem) {
  .evd__list li { grid-template-columns: 2.6rem minmax(0, 1fr); padding-block: 1.05rem; }
  .evd__list .evt { font-size: var(--step-2); line-height: 1.08; }
}
@media (min-width: 56rem) {
  .evd { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .evd__media { position: sticky; top: 6.5rem; }
  .evd__photo { --ratio: 4 / 3; }
}
/* Senza la foto di testata l’elenco prende tutta la larghezza */
.evd:has(.evd__photo.is-missing) { grid-template-columns: minmax(0, 1fr); }
.evd__media:has(.evd__photo.is-missing) { display: none; }

/* 2020: una foto per evento */
.evc { list-style: none; counter-reset: evc; display: grid; border-top: 1px solid var(--line); }
.evc__item {
  counter-increment: evc;
  /* telefono: la miniatura si stringe sotto i 500px circa, così il titolo ha almeno ~13rem */
  display: grid; grid-template-columns: clamp(6rem, 27vw, 8.5rem) minmax(0, 1fr); align-items: center; column-gap: clamp(.9rem, 3.5vw, 1.1rem);
  padding-block: 1rem; border-bottom: 1px solid var(--line);
}
.evc__photo { display: block; --ratio: 4 / 3; }
.evc__t { margin: 0; font-size: var(--step-1); line-height: 1.15; }
.evc__t::before {
  content: counter(evc, decimal-leading-zero);
  display: block; margin-bottom: .45rem;
  font: 600 var(--step--1)/1 var(--sans); letter-spacing: .06em; color: var(--accent); font-variant-numeric: tabular-nums;
}
@media (min-width: 40rem) {
  .evc { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(1rem, 2.5vw, 2rem); border-top: 0; }
  .evc__item { grid-row: span 2; grid-template-rows: subgrid; grid-template-columns: none; align-items: stretch; padding: 0 0 clamp(2.25rem, 4vw, 3.25rem); border: 0; }
  .evc__t { margin-top: 1rem; padding-top: .95rem; border-top: 1px solid var(--line); }
}
/* 3 colonne sui portatili, 4 da 1280px: con 10 eventi la prima e l’ultima scheda larghe chiudono le righe in entrambi i casi */
@media (min-width: 62rem) {
  .evc { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .evc__item--wide { grid-column: span 2; }
  .evc__item--wide .evc__photo { aspect-ratio: auto; min-height: 12rem; }
}
@media (min-width: 80rem) { .evc { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* Senza foto: elenco numerato a righe, senza riquadri vuoti */
.evc:has(> .evc__item:first-child .evc__photo.is-missing) .evc__photo { display: none; }
.evc:has(> .evc__item:first-child .evc__photo.is-missing) .evc__item { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 40rem) {
  .evc:has(> .evc__item:first-child .evc__photo.is-missing) .evc__t { margin-top: 0; }
}

/* Anno precedente / Eventi / anno successivo */
.evp {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem;
  margin-top: clamp(2.5rem, 6vw, 4.5rem); padding-top: clamp(1.25rem, 2.5vw, 1.75rem); border-top: 1px solid var(--line);
}
.evp__link {
  display: inline-flex; align-items: center; gap: clamp(.6rem, 1.5vw, 1rem); justify-self: start;
  min-height: 2.75rem; text-decoration: none;
  font-size: var(--step-3); font-weight: 850; font-stretch: 68%; line-height: 1; font-variant-numeric: tabular-nums;
}
.evp__link--next { justify-self: end; }
.evp__arrow {
  display: inline-grid; place-items: center; flex: none;
  width: clamp(2.75rem, 2rem + 1.6vw, 3.4rem); aspect-ratio: 1;
  border: 1px solid var(--line); border-radius: 50%;
  font: 400 var(--step-1)/1 var(--sans); font-stretch: 100%;
  transition: border-color .25s, color .25s, transform .35s var(--ease);
}
.evp__link:hover .evp__arrow { border-color: var(--accent); }
.evp__link--prev:hover .evp__arrow { transform: translateX(-4px); }
.evp__link--next:hover .evp__arrow { transform: translateX(4px); }
.evp__all {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: .5rem 1.15rem;
  border: 1px solid var(--line); border-radius: 999px;
  font-weight: 700; text-decoration: none;
}
.evp__all:hover { border-color: var(--accent); }
@media (max-width: 30rem) {
  .evp { gap: .5rem; }
  .evp__link { gap: .5rem; font-size: var(--step-2); }
  .evp__all { padding-inline: .9rem; }
}

/* ---------------------------------------------------------------------------
   Gallery: griglia regolare con didascalie; la foto si apre in grande con :target (nessun JavaScript)
   ------------------------------------------------------------------------- */
.gal { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem .9rem; }
@media (min-width: 40rem) { .gal { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.25rem 1.25rem; } }
@media (min-width: 62rem) { .gal { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.75rem 1.5rem; } }
.gal__fig { margin: 0; }
.gal__link { display: block; border-radius: calc(var(--radius) * .6); cursor: zoom-in; }
.gal__photo { display: block; --ratio: 3 / 2; }
.gal__photo img { object-position: 50% 35%; transition: transform .6s var(--ease); }
@media (prefers-reduced-motion: no-preference) { .gal__link:hover .gal__photo img { transform: scale(1.04); } }
/* Senza foto (anteprima): al posto del marchio ripetuto 108 volte, il numero della foto (lo stesso del contatore "N / 108"
   nella foto ingrandita). Decorativo: il testo alternativo vuoto dopo "/" lo tiene fuori dalla lettura vocale. */
.gal { counter-reset: gal; }
.gal__item { counter-increment: gal; }
.gal__photo.is-missing::before { display: none; }
.gal__photo.is-missing::after {
  content: counter(gal, decimal-leading-zero);
  content: counter(gal, decimal-leading-zero) / "";
  position: absolute; left: .9rem; bottom: .55rem;
  font: 850 var(--step-3)/1 var(--sans); font-stretch: 68%; font-variant-numeric: tabular-nums;
  color: var(--muted-dark);
}
.gal__cap { margin-top: .75rem; font-size: var(--step--1); line-height: 1.4; color: var(--bone-2); text-wrap: pretty; overflow-wrap: anywhere; }

.lb { display: none; }
.lb:target {
  position: fixed; inset: 0; z-index: 80;
  display: grid; place-items: center;
  /* ai lati lo spazio dei pulsanti precedente/successivo (3rem + margine), così non coprono la foto */
  padding: 4.5rem max(clamp(1rem, 7vw, 7rem), calc(var(--gutter) + 3.75rem)) 2rem;
  background: var(--ink);
}
.lb:focus { outline: none; }
html:has(.lb:target) { overflow: hidden; }
.lb__shade { position: absolute; inset: 0; cursor: zoom-out; }
.lb__fig { position: relative; margin: 0; width: min(100%, calc((100dvh - 10.5rem) * 1.5)); }
.lb__photo { display: block; --ratio: 3 / 2; background: none; border-radius: calc(var(--radius) * .4); }
.lb__photo::before { opacity: 0; }
.lb__photo.is-missing { background: var(--ink-3); }
.lb__photo.is-missing::before { opacity: .09; background-size: auto 22%; }
/* i file del vecchio sito sono versioni piccole ("-lowly"): mai ingranditi oltre la loro misura, solo ridotti se serve */
.lb__photo img { object-fit: scale-down; }
.lb__bar { display: flex; align-items: baseline; justify-content: space-between; gap: 1.5rem; margin-top: 1rem; }
.lb__cap { font-weight: 600; text-wrap: pretty; }
.lb__n { flex: none; margin-left: auto; color: var(--muted); font-size: var(--step--1); font-variant-numeric: tabular-nums; letter-spacing: .06em; }
.lb__btn {
  position: absolute; z-index: 1;
  display: grid; place-items: center; width: 3rem; height: 3rem;
  border: 1px solid var(--line); border-radius: 50%; background: var(--ink-2);
  font-size: 1.25rem; line-height: 1; text-decoration: none;
  transition: border-color .25s, color .25s;
}
.lb__btn:hover { border-color: var(--accent); color: var(--accent); }
.lb__close { top: 1rem; right: var(--gutter); font-size: 1.6rem; }
.lb__prev, .lb__next { top: 50%; translate: 0 -50%; }
.lb__prev { left: var(--gutter); }
.lb__next { right: var(--gutter); }
@media (max-width: 40rem) {
  .lb:target { padding: 4.5rem var(--gutter) 5.5rem; }
  .lb__prev, .lb__next { top: auto; bottom: 1.25rem; translate: none; }
}
@media (prefers-reduced-motion: no-preference) {
  .lb:target { animation: lb-in .25s var(--ease) both; }
  @keyframes lb-in { from { opacity: 0; } }
}

/* ===== d-booking.css ===== */
/* Gruppo d-booking: Booking, Richiesta inviata, area riservata (stessi token di main.css) */

/* ---------------------------------------------------------------------------
   Booking — modulo a righe: etichetta grande a sinistra, campo a destra
   ------------------------------------------------------------------------- */
.d-book { padding-top: clamp(.75rem, 2.5vw, 2.25rem); }
/* niente filo sopra la prima riga: il filo di .page-head fa già da separatore (due linee parallele a 30–60px stonavano) */
.d-book__row {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: .7rem clamp(1.5rem, 4vw, 4rem);
  align-items: start;
  margin: 0;
  padding-block: clamp(1.25rem, 2.4vw, 1.9rem);
  border-bottom: 1px solid var(--line);
}
.d-book__row > :last-child { grid-column: 2; max-width: 46rem; }
.d-book__row--alert { border-bottom: 0; padding-bottom: 0; }
.d-book__row--alert .form__alert { margin: 0; }
.d-book__row--alert .form__alert p:last-child { margin-bottom: 0; }
/* il riepilogo riceve il focus al caricamento: anello nel colore dell'errore, non un secondo bordo azzurro */
.d-book .form__alert:focus-visible { outline-color: var(--error); outline-offset: 4px; }
.d-book__row--send { border-bottom: 0; padding-top: clamp(1.5rem, 3vw, 2.2rem); }

.d-book .d-book__label {
  padding-top: .6rem;
  font-size: var(--step-2);
  font-weight: 800;
  font-stretch: 75%;
  line-height: 1.02;
  letter-spacing: -.005em;
  text-transform: uppercase;
  color: var(--bone);
  cursor: pointer;
}
.d-book__row--pick .d-book__label { padding-top: .85rem; }
.d-book__req { margin-left: .1em; color: var(--accent); font-weight: 700; }
.d-book__ctl { display: grid; gap: .45rem; min-width: 0; }

.d-book .field input:not([type="checkbox"]),
.d-book .field select,
.d-book .field textarea { min-height: 3.25rem; }
.d-book .field textarea { min-height: 10rem; }
/* errore segnalato dal server: in main.css la regola base dei campi prevale su [aria-invalid] per gli input */
.d-book .field :is(input, select, textarea)[aria-invalid="true"] { border-color: var(--error); }

/* Scegli l'artista: è il cuore del vecchio modulo, quindi ha più peso */
.d-book .field .d-book__select {
  appearance: none;
  -webkit-appearance: none;
  min-height: 3.75rem;
  padding-right: 3.2rem;
  font-size: var(--step-1);
  font-weight: 700;
  font-stretch: 90%;
  text-overflow: ellipsis;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1.5 1.5 8 8l6.5-6.5' fill='none' stroke='%2338b3e7' stroke-width='2.2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1.2rem center;
  background-size: 1rem auto;
}
.d-book .field .d-book__select:hover { border-color: rgb(238 242 248 / .6); }
.d-book select option { background: var(--ink-2); color: var(--bone); font-size: 1rem; font-weight: 500; }

/* Consenso e invio */
.d-book__consent { margin: 0 0 1.6rem; }
.d-book .check input[type="checkbox"] {
  appearance: none; -webkit-appearance: none;
  display: grid; place-content: center;
  width: 1.4rem; height: 1.4rem; margin: .05rem 0 0;
  background: var(--ink-2); border: 1px solid rgb(238 242 248 / .45); border-radius: 6px;
  cursor: pointer; transition: background-color .2s, border-color .2s;
}
.d-book .check input[type="checkbox"]::before {
  content: ""; width: .8rem; height: .8rem;
  background: var(--accent-ink);
  clip-path: polygon(14% 44%, 0 59%, 39% 96%, 100% 22%, 85% 8%, 38% 66%);
  transform: scale(0); transition: transform .15s var(--ease);
}
.d-book .check input[type="checkbox"]:hover { border-color: var(--bone); }
.d-book .check input[type="checkbox"]:checked { background: var(--accent); border-color: var(--accent); }
.d-book .check input[type="checkbox"]:checked::before { transform: scale(1); }
.d-book .check input[type="checkbox"][aria-invalid="true"] { border-color: var(--error); }
.d-book .check--consent { align-items: flex-start; gap: .75rem; font-weight: 400; font-size: var(--step--1); line-height: 1.5; color: var(--bone-2); max-width: 40rem; }
.d-book .check--consent a { color: var(--bone); }
.d-book .check--consent a:hover { color: var(--accent); }
.d-book .check input[type="checkbox"]:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-color: var(--accent); }
.d-book__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; }
.d-book__send { min-width: 12rem; }
/* Reset (pulsante del vecchio modulo): secondario, più leggero di Invia */
.d-book .d-book__reset { --bd: rgb(238 242 248 / .3); --fg: var(--bone-2); font-size: var(--step-0); }
.d-book .d-book__reset:hover { --bd: var(--bone); --fg: var(--bone); }

@media (max-width: 44rem) {
  .d-book__row { grid-template-columns: minmax(0, 1fr); gap: .55rem; padding-block: 1.15rem; }
  .d-book__row > :last-child { grid-column: 1; max-width: none; }
  .d-book .d-book__label { padding-top: 0; font-size: var(--step-1); }
  .d-book .field .d-book__select { font-size: 1.05rem; }
  .d-book__send { flex: 1 1 auto; min-width: 0; }
  .d-book .d-book__reset { flex: 0 0 auto; padding-inline: 1.6rem; }
  .d-book .check--consent { padding-block: .3rem; }
}

/* ---------------------------------------------------------------------------
   Richiesta inviata
   ------------------------------------------------------------------------- */
.d-thanks {
  display: flex;
  align-items: flex-start;
  min-height: min(68svh, 42rem);
  padding-bottom: clamp(3.5rem, 8vw, 6rem);
}
.d-thanks > .wrap { position: relative; }
.d-thanks__mark {
  position: absolute; z-index: -1;
  right: calc(var(--gutter) * -1); bottom: clamp(2rem, 6vw, 5rem);
  width: min(46vw, 42rem); height: auto;
  opacity: .07;
  pointer-events: none;
}
.d-thanks__icon {
  width: clamp(3rem, 2.4rem + 2.4vw, 4.2rem); height: auto;
  margin-bottom: clamp(1.4rem, 3vw, 2.2rem);
  fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.d-thanks .page-head__lead { margin-top: clamp(1.2rem, 2.5vw, 1.8rem); }
.d-thanks__home { margin: clamp(2rem, 4vw, 2.8rem) 0 0; }
.d-thanks__home .link-arrow { position: relative; font-size: var(--step-1); }
/* area di tocco di almeno 44px senza spostare la sottolineatura */
.d-thanks__home .link-arrow::before { content: ""; position: absolute; inset: -.7rem -.6rem; }
@media (max-width: 62rem) {
  .d-thanks { min-height: min(62svh, 40rem); }
  .d-thanks__mark { width: min(78vw, 30rem); right: calc(var(--gutter) * -1.5); bottom: 1.6rem; opacity: .06; }
}

/* ---------------------------------------------------------------------------
   Area riservata /admin
   ------------------------------------------------------------------------- */
.d-admin__head { align-items: center; margin-bottom: 1.8rem; }
.d-admin > .wrap > h1 { margin-bottom: 1.2rem; }
.d-admin__text { max-width: 44rem; color: var(--bone-2); }
.d-admin .year-nav { margin-bottom: 2rem; }
.d-admin .year-nav a { display: inline-flex; align-items: center; min-height: 2.75rem; }
.d-admin__item { border-radius: var(--radius); }
.d-admin__who { min-width: 0; }
.d-admin .d-admin__artist {
  margin: 0 0 .5rem;
  font-size: var(--step--1); font-weight: 650; letter-spacing: .1em; text-transform: uppercase;
  color: var(--accent);
}
.d-admin__item .h3 { overflow-wrap: anywhere; }
.d-admin__item .kv { grid-template-columns: max-content minmax(0, 1fr); }
.d-admin__item .kv dd { overflow-wrap: anywhere; }
.d-admin__item .admin-item__msg { max-width: 70ch; white-space: normal; overflow-wrap: anywhere; }
.d-admin .admin-item__actions .btn--sm,
.d-admin__head .btn--sm,
.d-admin__logout .btn--sm { min-height: 2.75rem; }
/* email e telefono: area di tocco di 44px senza allargare le righe */
.d-admin__item .kv dd a { display: inline-block; padding-block: .75rem; margin-block: -.75rem; }
.d-admin .admin-item__actions select { min-height: 2.75rem; }

/* ===== ritocchi finali (ricontrollo di design) ===== */
@media (min-width: 62.01rem) {
  .nav__item--sub > a:focus-visible { outline: none; }
  .nav__item--sub:has(> a:focus-visible) { outline: 2px solid var(--accent); outline-offset: 3px; }
}
@media (max-width: 48rem) {
  .site-footer__seg { display: block; }
  .site-footer__sep { display: none; }
}
/* anteprima senza foto: indici a righe regolari */
@media (min-width: 62rem) {
  .evy:has(> .evy__item:first-child .evy__photo.is-missing),
  .evc:has(> .evc__item:first-child .evc__photo.is-missing) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .evy:has(> .evy__item:first-child .evy__photo.is-missing) .evy__item--wide,
  .evc:has(> .evc__item:first-child .evc__photo.is-missing) .evc__item--wide { grid-column: auto; }
}
@media (min-width: 64rem) and (max-width: 79.99rem) {
  .roster:has(> .roster__item:first-child .roster__photo.is-missing) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}