/* ==========================================================================
   Artomotive — custom.css (tema figlio yootheme-artomotive, caricato in automatico da YOOtheme)
   Porting di 04-home/theme.css sul markup generato dal builder YOOtheme 5.0.55.
   Ogni blocco è "custom" rispetto al Customizer: il motivo è nel commento.
   Font in locale: fonts/ (nessuna chiamata a Google).
   ========================================================================== */
@import url(../fonts/fonts.css);

/* ---------- 1. Token ---------- */
:root {
  --am-ink: #0d0d0f;
  --am-ink-soft: #46464d;
  --am-white: #ffffff;
  --am-paper: #f0f0f1;
  --am-grey: #5c5c61;
  --am-grey-inverse: #a3a3a8;
  --am-line: #d9d9dc;
  --am-line-inverse: #2b2b2f;
  --am-font: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --am-font-mono: "DM Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;   /* per tornare a solo Montserrat: var(--am-font) */
  --am-gutter: clamp(16px, 2.2vw, 40px);
  --am-header-h: 76px;
  --am-radius: 8px;
  --am-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
}
@media (max-width: 1199px) { :root { --am-header-h: 64px; } }

/* ---------- 2. Base ----------
   Font, colori, sfondi delle sezioni e selezione sono nel Customizer (stile UIkit, variabili in 05-wordpress/customizer-less.json).
   Qui resta solo ciò che le variabili non esprimono. */
html { -webkit-font-smoothing: antialiased; }
body { overflow-x: clip; }
h1, h2, h3, h4, h5, h6, .uk-h1, .uk-h2, .uk-h3, .uk-heading-small, .uk-heading-medium, .uk-heading-large, .uk-heading-xlarge, .uk-heading-2xlarge { color: inherit; }   /* i titoli seguono il colore del contesto (es. pannello chiaro nel footer scuro) */
.tm-page p { max-width: 62ch; }
.uk-container { padding-left: var(--am-gutter); padding-right: var(--am-gutter); }   /* gutter fluido: il Customizer ha solo valori fissi per breakpoint */
.uk-section-xlarge { padding-top: clamp(96px, 14vw, 220px); padding-bottom: clamp(96px, 14vw, 220px); }
.uk-light, .uk-section-secondary:not(.uk-preserve-color) { color: var(--am-white); }
[id] { scroll-margin-top: var(--am-header-h); }

/* ---------- 3. Scala tipografica ----------
   Peso, maiuscolo, interlinea e spaziatura dei titoli, lead e meta sono nel Customizer.
   Qui restano solo le dimensioni fluide (clamp): il Customizer ha valori fissi per breakpoint. */
.uk-heading-2xlarge { font-size: clamp(3rem, 8vw, 9rem); }
.uk-heading-xlarge { font-size: clamp(3rem, 8vw, 9rem); }
.uk-heading-large { font-size: clamp(2rem, 4.6vw, 5rem); }
.uk-heading-medium { font-size: clamp(2rem, 4vw, 4.25rem); }
.uk-text-lead { font-size: clamp(1rem, 1.15vw, 1.1875rem); }
/* Mono: .am-mono replica lo stile Meta del Customizer per i blocchi HTML */
.am-mono { font-family: var(--am-font-mono); font-size: 0.75rem; line-height: 1.35; font-weight: 400; letter-spacing: 0.02em; text-transform: uppercase; color: inherit; }
.am-mono p { margin: 0; }
.am-mono--muted, .am-mono--muted p { color: var(--am-grey); }
.uk-light .am-mono--muted, .uk-section-secondary .am-mono--muted, .uk-light .am-mono--muted p, .uk-section-secondary .am-mono--muted p { color: var(--am-grey-inverse); }
.am-light { font-weight: 300; }   /* articoli dei titoli in peso light */

/* ---------- 4. Pulsanti a pillola ----------
   Font mono, dimensione, raggio a pillola e colori base sono nel Customizer (Button).
   Qui: padding asimmetrico per il puntino, layout flex, transizioni e hover solo con mouse. */
.uk-button { line-height: 1;
  padding: 14px 18px 14px 22px; white-space: nowrap; display: inline-flex; align-items: center; gap: 28px;
  transition-property: transform, translate, background-color, color; transition-duration: 160ms, 450ms, 200ms, 200ms; transition-timing-function: var(--am-ease-out); }
.uk-button:active { transform: scale(0.97); }
/* custom: puntino a destra (link interni) o freccia ↗ (link esterni), senza markup aggiuntivo nel builder */
.uk-button:not([target="_blank"])::after { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; flex: none; transition: transform 200ms var(--am-ease-out); }
.uk-button[target="_blank"]::after { content: "↗"; font-family: var(--am-font); font-size: 0.875rem; line-height: 1; transition: transform 200ms var(--am-ease-out); }
/* custom: hover solo con mouse. Nel Customizer hover = stato base, così su touch il pulsante non resta "acceso" dopo il tap */
@media (hover: hover) and (pointer: fine) {
  .uk-button-default:hover { background: var(--am-ink); color: var(--am-white); }
  .uk-button-primary:hover { background: var(--am-ink-soft); color: var(--am-white); }
  .uk-light .uk-button-default:hover, .uk-section-secondary .uk-button-default:hover { background: var(--am-white); color: var(--am-ink); }
  .uk-light .uk-button-primary:hover, .uk-section-secondary .uk-button-primary:hover { background: var(--am-paper); color: var(--am-ink); }
  .uk-button:not([target="_blank"]):hover::after { transform: translateX(4px) scale(1.4); }
  .uk-button[target="_blank"]:hover::after { transform: translate(2px, -2px); }
}
:focus-visible { outline: 2px solid var(--am-ink); outline-offset: 3px; }
.uk-light :focus-visible, .uk-section-secondary :focus-visible { outline-color: var(--am-white); }

/* ---------- 5. Header (→ Customizer › Header: trasparente, sticky, inverse automatico) ---------- */
.tm-header .uk-navbar-container, .tm-header-mobile .uk-navbar-container { transition: background-color 240ms var(--am-ease-out); }
.tm-header .uk-navbar-item, .tm-header .uk-navbar-nav > li > a, .tm-header-mobile .uk-navbar-item, .tm-header-mobile .uk-navbar-toggle { min-height: var(--am-header-h); }
.am-eventinfo { margin: 0; padding-left: 18px; color: inherit; }
.tm-header .uk-navbar-nav { gap: 6px; }
.tm-header .uk-navbar-nav > li > a { padding: 0 12px; position: relative; }   /* font, dimensione e colori pieni (anche inverse) nel Customizer › Navbar */
.tm-header .uk-navbar-nav > li > a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 24px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform 240ms var(--am-ease-out); }   /* custom: filetto della voce attiva */
.tm-header .uk-navbar-nav > li.uk-active > a::after { transform: scaleX(1); }
@media (hover: hover) and (pointer: fine) { .tm-header .uk-navbar-nav > li > a:hover::after { transform: scaleX(1); } }
.am-header-btns { display: flex; gap: 10px; }
.tm-header .uk-button, .tm-header-mobile .uk-button { padding: 11px 14px 11px 18px; gap: 18px; }
.tm-header .uk-light .uk-button-default, .tm-header-mobile .uk-light .uk-button-default { background: rgba(255, 255, 255, 0.16); color: var(--am-white); }
.tm-header .uk-light .uk-button-primary, .tm-header-mobile .uk-light .uk-button-primary { background: var(--am-white); color: var(--am-ink); }
/* custom: velo quando l'header è sticky (fuori dalla hero), chiaro o scuro secondo la sezione sotto */
.uk-navbar-sticky { background: rgba(255, 255, 255, 0.86) !important; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.uk-navbar-sticky.uk-light { background: rgba(13, 13, 15, 0.72) !important; }
/* tra 1200 e 1599 px il menu occupa lo spazio dell'info evento */
@media (min-width: 1200px) and (max-width: 1599px) { .am-eventinfo { display: none !important; } }
/* custom: header mobile, logo + "Prenota" + "Menu" a pillola */
.tm-header-mobile .uk-navbar-toggle { font-family: var(--am-font-mono); font-size: 0.75rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.04em; }
.tm-header-mobile .uk-navbar-toggle > :not(.uk-navbar-toggle-icon) { padding: 11px 16px; border-radius: 999px; background: var(--am-paper); color: var(--am-ink); }
.tm-header-mobile .uk-light .uk-navbar-toggle > :not(.uk-navbar-toggle-icon) { background: rgba(255, 255, 255, 0.16); color: var(--am-white); }
.tm-header-mobile .uk-navbar-toggle-icon { display: none; }
@media (max-width: 639px) { .tm-header-mobile .uk-button, .tm-header-mobile .uk-navbar-toggle > span { padding: 10px 12px; font-size: 0.6875rem; } }

/* ---------- 6. Offcanvas (→ Customizer › Mobile › Dialog) e pannello "Prenota la visita" ---------- */
.uk-offcanvas-bar { padding: 24px var(--am-gutter); }   /* sfondo nel Customizer › Offcanvas */
/* custom: pannello largo 520 px da 960 px. UIkit lo fa entrare e uscire animando left/right fino a −larghezza standard (350 px):
   le posizioni di riposo vanno allineate alla nuova larghezza, altrimenti in chiusura si ferma a 170 px e poi scatta */
@media (min-width: 960px) {
  .uk-offcanvas-bar { width: 520px; padding: 40px 48px; left: -520px; }
  .uk-offcanvas-flip .uk-offcanvas-bar { left: auto; right: -520px; }
  .uk-open > .uk-offcanvas-bar { left: 0; }
  .uk-offcanvas-flip .uk-open > .uk-offcanvas-bar { left: auto; right: 0; }
}
.uk-offcanvas-overlay::before { background: rgba(13, 13, 15, 0.55); }
.tm-header-mobile + * .uk-nav-default > li > a, .uk-offcanvas-bar .uk-nav-default > li > a { font-size: clamp(2.25rem, 10vw, 3rem); font-weight: 700; letter-spacing: -0.045em; text-transform: uppercase; line-height: 1; padding: 8px 0; color: var(--am-white); }
.am-dialog-btns { display: grid; gap: 10px; margin-top: 32px; }
.am-dialog-btns .uk-button { justify-content: space-between; }
/* custom: pannello chiaro. Sta nel footer scuro e la barra offcanvas di UIkit è "inverse" di default:
   tutti i colori vanno riportati a quelli su fondo bianco, con selettori più specifici di .uk-light / .uk-offcanvas-bar */
.am-plan .uk-offcanvas-bar { background: var(--am-white); color: var(--am-ink); }
.am-plan .uk-offcanvas-bar :where(h2, h3, p, li, label, legend, a:not(.uk-button)) { color: var(--am-ink); }   /* :where = specificità 0,2,0: batte .uk-light h2 ma lascia vincere le classi sotto */
.am-plan .uk-offcanvas-bar .uk-offcanvas-close { color: var(--am-ink); }
#pianifica .uk-offcanvas-bar :is(h2, h3) { color: var(--am-ink); }   /* titoli: la regola della section scura (.uk-section-secondary:not(.uk-preserve-color) h2) è più forte, serve l'id */
.am-plan .uk-offcanvas-bar .am-mono--muted, .am-plan .uk-offcanvas-bar .am-form-help { color: var(--am-grey); }
.am-plan .uk-offcanvas-bar h2 { font-weight: 700; text-transform: uppercase; letter-spacing: -0.045em; line-height: 0.9; }
.am-plan .uk-offcanvas-bar h3 { font-size: clamp(1.125rem, 1.4vw, 1.375rem); font-weight: 700; }
.am-plan .uk-offcanvas-bar .uk-button-default { background: var(--am-paper); color: var(--am-ink); }
.am-plan .uk-offcanvas-bar .uk-button-primary { background: var(--am-ink); color: var(--am-white); }
@media (hover: hover) and (pointer: fine) {
  .am-plan .uk-offcanvas-bar .uk-button-default:hover { background: var(--am-ink); color: var(--am-white); }
  .am-plan .uk-offcanvas-bar .uk-button-primary:hover { background: var(--am-ink-soft); color: var(--am-white); }
}
.am-plan .uk-offcanvas-bar :focus-visible { outline-color: var(--am-ink); }
/* elenco delle info in mono con filetto, come nelle card */
.am-plan .am-card__list { list-style: none; padding: 16px 0 0; margin-left: 0; border-top: 1px solid var(--am-line); }
.am-plan .am-card__list li { font-family: var(--am-font-mono); font-size: 0.75rem; text-transform: uppercase; line-height: 1.6; padding-left: 0; }
.am-plan .am-card__list li::before { content: "• "; }
.am-form-help { font-size: 0.8125rem; color: var(--am-grey); }
/* form CF7 dentro il pannello (→ Customizer › Form) */
.am-plan .wpcf7 label { display: block; font-family: var(--am-font-mono); font-size: 0.75rem; text-transform: uppercase; }
.am-plan .wpcf7 input[type="text"], .am-plan .wpcf7 input[type="email"], .am-plan .wpcf7 input[type="tel"], .am-plan .wpcf7 textarea { width: 100%; box-sizing: border-box; border-radius: var(--am-radius); border: 1px solid transparent; background: var(--am-paper); color: var(--am-ink); height: 50px; padding: 0 16px; font: 1rem var(--am-font); margin-top: 6px; }
.am-plan .wpcf7 input:focus, .am-plan .wpcf7 textarea:focus { border-color: var(--am-ink); background: var(--am-white); outline: 2px solid var(--am-ink); outline-offset: 2px; }
.am-plan .wpcf7 .wpcf7-checkbox .wpcf7-list-item { margin: 0 8px 8px 0; }
.am-plan .wpcf7 .wpcf7-checkbox label { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 999px; background: var(--am-paper); cursor: pointer; }
/* custom: spazio tra i campi; il gruppo dei giorni (fieldset) senza bordo, con la legenda in stile etichetta */
.am-plan .wpcf7 form > p, .am-plan .wpcf7 fieldset { margin: 0 0 20px; }
.am-plan .wpcf7 fieldset { border: 0; padding: 0; min-width: 0; }
.am-plan .wpcf7 fieldset p { margin: 0; }
/* custom: la rotellina di CF7 va a capo sotto il pulsante a tutta larghezza; occupa spazio solo durante l'invio */
.am-plan .wpcf7 form:not(.submitting) .wpcf7-spinner { display: none; }
.am-plan .wpcf7 form > p:last-of-type { margin-bottom: 0; }
/* custom: nasconde il badge flottante di reCAPTCHA v3 (richiesta di Andre, 2026-11-13) */
.grecaptcha-badge {
	visibility: hidden;
}
/* custom: messaggio di esito (errore/conferma) nello stile del pannello al posto del bordo blu di CF7 */
.am-plan .wpcf7 form .wpcf7-response-output { margin: 16px 0 0; padding: 12px 16px; border: 1px solid var(--am-ink); border-radius: var(--am-radius); font: 0.75rem/1.5 var(--am-font-mono); text-transform: uppercase; }
.am-plan .wpcf7 legend { padding: 0; margin-bottom: 10px; font-family: var(--am-font-mono); font-size: 0.75rem; text-transform: uppercase; }
.am-plan .wpcf7 input[type="submit"] { width: 100%; height: auto; border: 0; border-radius: 999px; background: var(--am-ink); color: var(--am-white); padding: 16px 22px; font: 500 0.75rem var(--am-font-mono); letter-spacing: 0.04em; text-transform: uppercase; cursor: pointer; }

/* ---------- 7. Sezioni ---------- */
/* custom: rientro di 1/6 da 1200 px (asimmetria DDD). Si fa con la classe di riga "am-indent" e non con una colonna vuota,
   perché il builder ricostruisce le colonne dai layout predefiniti e fonderebbe la colonna vuota con le altre */
@media (min-width: 1200px) { .am-indent { padding-left: calc(100% / 6); box-sizing: border-box; } }
/* 1 · HERO — section nativa (immagine + overlay a gradiente, altezza viewport); custom: le 3 righe agganciate in alto e in basso */
.am-hero > .uk-section { display: flex; flex-direction: column; min-height: 100vh; min-height: 100svh; }
.am-hero > .uk-section > .uk-container { flex: 1; display: flex; flex-direction: column; width: 100%; box-sizing: border-box;
  padding-top: calc(var(--am-header-h) + clamp(12px, 2vw, 32px)); padding-bottom: clamp(20px, 2.5vw, 40px); }
.am-hero__head { margin-block: auto !important; }   /* titolo centrato nello spazio tra header e parole mono */
.am-hero .uk-heading-2xlarge { font-size: clamp(2rem, 6.2vw, 7.25rem); }   /* H1 e "Origgio" alla stessa misura */
.am-hero__title { line-height: 0.88 !important; }
.am-hero__title .am-line { display: block; }
.am-hero__title .am-line--indent { padding-left: 0.42em; }
.am-hero__words { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--am-gutter); }
.am-hero__place { line-height: 0.8 !important; text-align: right; }
@media (max-width: 639px) {
  .am-hero > .uk-section { background-image: url(/wp-content/uploads/2026/11/visual-guasco-mobile.jpg) !important; }   /* custom: taglio verticale del visual su mobile */
  .am-hero__words { grid-template-columns: repeat(2, 1fr); row-gap: 6px; }
  .am-hero__place { text-align: left; }
}
@media (max-width: 959px) { .am-hero__bottom > div:last-child { order: -1; } }

/* 2 · SECONDA EDIZIONE — titolo a due pesi, numeri con filetto spesso, testo in un unico blocco */
.am-weights { font-weight: 300 !important; }
.am-weights strong { font-weight: 700; }
.am-edition { margin-top: clamp(56px, 7vw, 112px) !important; }
.am-stats .el-title { border-top: 6px solid var(--am-white); padding-top: 16px; margin-top: 0 !important; color: var(--am-white); font-size: clamp(4.5rem, 10vw, 10rem); font-weight: 700; line-height: 0.9; letter-spacing: -0.05em; }
.am-stats .el-meta { margin-top: 18px !important; color: var(--am-grey-inverse); }
.uk-section-secondary .am-stats .uk-grid-divider > :not(.uk-first-column)::before { border-left-color: var(--am-line-inverse); }
.am-body { max-width: 62ch; border-top: 1px solid rgba(255, 255, 255, 0.28); padding-top: 22px; }
.am-body p { font-size: clamp(1.0625rem, 1.2vw, 1.25rem); line-height: 1.55; color: var(--am-grey-inverse); margin: 0 0 1.1em; }
.am-body strong { color: var(--am-white); font-weight: 600; }

/* 3 · ARTISTI — Grid nativo (24 item, una colonna) con classe am-roster: elenco numerato dei nomi a tutte le larghezze.
   Da 960 px (custom): grigio chiaro → ink sull'artista attivo; ritratto e descrizione nel pannello fisso.
   Sotto 960 px (custom): al tocco l'artista si apre sotto il nome con ritratto e descrizione (una alla volta) */
.am-roster .el-image { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; border-radius: 2px; background: var(--am-paper); filter: grayscale(1) contrast(1.05); }
.am-roster .el-title { margin: 0; font-weight: 700; text-transform: uppercase; color: var(--am-ink); }
.am-roster .el-content { color: var(--am-grey); font-family: var(--am-font-mono); font-size: 0.75rem; text-transform: uppercase; line-height: 1.35; }
.am-roster .el-meta { color: var(--am-ink); }
.am-roster > .uk-grid { margin-left: 0; counter-reset: am-artist; border-top: 1px solid var(--am-line); }
.am-roster > .uk-grid > * { padding-left: 0; }
.am-roster > .uk-grid > .uk-grid-margin { margin-top: 0; }
@media (max-width: 959px) {
  .am-roster .el-item { counter-increment: am-artist; display: grid; grid-template-columns: 1.5rem minmax(0, 1fr) 1.25rem; column-gap: 10px; align-items: baseline;
    padding: 14px 0 12px; border-bottom: 1px solid var(--am-line); cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .am-roster .el-item::before { content: counter(am-artist, decimal-leading-zero); grid-column: 1; grid-row: 1; font-family: var(--am-font-mono); font-size: 0.6875rem; color: var(--am-grey); }
  .am-roster .el-item::after { content: "+"; grid-column: 3; grid-row: 1; justify-self: end; font-size: 1.25rem; font-weight: 300; line-height: 1; transition: transform 240ms var(--am-ease-out); }
  .am-roster .el-item.is-open::after { transform: rotate(45deg); }
  .am-roster .el-title { grid-column: 2; grid-row: 1; font-size: clamp(1.375rem, 6.4vw, 1.875rem); line-height: 1; letter-spacing: -0.04em; margin: 0 !important; }
  .am-roster .el-meta { grid-column: 2; grid-row: 2; margin: 4px 0 0 !important; color: var(--am-grey); font-size: 0.6875rem; }   /* paese sotto il nome: i nomi restano su una riga */
  .am-roster .el-item > picture, .am-roster .el-item > .el-content { display: none; grid-column: 2 / 4; }
  .am-roster .el-item.is-open > picture { display: block; grid-row: 3; width: min(62%, 260px); margin-top: 16px; animation: am-reveal 320ms var(--am-ease-out) both; }
  .am-roster .el-item.is-open > .el-content { display: block; grid-row: 4; margin: 12px 0 4px !important; max-width: 40ch; animation: am-reveal 320ms 60ms var(--am-ease-out) both; }
  .am-roster .el-item:focus-visible { outline: 2px solid var(--am-ink); outline-offset: 2px; }
}
@keyframes am-reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (min-width: 960px) {
  .am-roster-note { max-width: 30ch; }
  .am-roster .el-item { counter-increment: am-artist; display: grid; grid-template-columns: 3.25rem minmax(0, 1fr) auto; column-gap: 16px; align-items: baseline;
    padding: 12px 0 10px; border-bottom: 1px solid var(--am-line); cursor: default; outline: none; }
  .am-roster .el-item::before { content: counter(am-artist, decimal-leading-zero); grid-column: 1; grid-row: 1; font-family: var(--am-font-mono); font-size: 0.75rem; color: var(--am-grey); transition: color 200ms var(--am-ease-out); }
  .am-roster .el-item > picture, .am-roster .el-item > .el-image { display: none; }
  .am-roster .el-title { grid-column: 2; grid-row: 1; font-size: clamp(1.75rem, 3vw, 3.5rem); line-height: 1; letter-spacing: -0.04em; color: #959599; transition: color 200ms var(--am-ease-out); }
  .am-roster .el-meta { grid-column: 3; grid-row: 1; margin: 0 !important; text-align: right; color: var(--am-grey); transition: color 200ms var(--am-ease-out); }
  .am-roster .el-content { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0 !important; }   /* resta per gli screen reader; a video è nel pannello */
  .am-roster .el-item.is-active .el-title, .am-roster .el-item:hover .el-title { color: var(--am-ink); }
  .am-roster .el-item.is-active::before, .am-roster .el-item.is-active .el-meta { color: var(--am-ink); }
  .am-roster .el-item:focus-visible { outline: 2px solid var(--am-ink); outline-offset: 4px; }
  .am-panel { position: sticky; top: calc(var(--am-header-h) + 32px); max-width: 380px; }
  .am-panel__img { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 2px; background: var(--am-paper); }
  .am-panel__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); opacity: 0; transition: opacity 220ms ease; }
  .am-panel__img img.is-front { opacity: 1; }
  .am-panel__name { margin: 18px 0 0; color: var(--am-ink); }
  .am-panel__desc { margin: 8px 0 0; color: var(--am-grey); max-width: 38ch; min-height: 3.2em; }
  .am-panel__country { margin: 8px 0 0; color: var(--am-ink); }
}
/* il pannello sticky ha bisogno che la colonna non tagli l'overflow */
.uk-visible\@m > .uk-margin-remove-vertical:has(.am-panel) { height: 100%; }

/* 4 · COLLEZIONE — marquee (custom) e slider nativo della prima edizione */
.am-intro { margin-top: clamp(32px, 4vw, 64px); }
@media (min-width: 1200px) { .am-intro { margin-left: 16.666%; max-width: 30%; } }
.am-marquee { overflow: hidden; white-space: nowrap; padding: clamp(4px, 0.6vw, 10px) 0 clamp(10px, 1.6vw, 26px); margin-inline: calc(-1 * var(--am-gutter)); }   /* a tutta larghezza, con spazio per i discendenti */
.am-marquee__row { display: flex; width: max-content; }
.am-marquee__row span { font-size: clamp(2.5rem, 6vw, 6.5rem); font-weight: 700; letter-spacing: -0.04em; line-height: 1.15; color: #6e6e76; padding-right: 0.3em; text-transform: none; }
.am-marquee__row span::after { content: "/"; font-weight: 300; padding-left: 0.3em; }
.am-js .am-marquee__row { animation: am-marquee 60s linear infinite; }
.am-js .am-marquee__row--rev { animation-direction: reverse; animation-duration: 70s; }
.am-js .am-marquee__row--slow { animation-duration: 80s; }
@keyframes am-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.am-ed1-head { margin-top: clamp(96px, 11vw, 180px) !important; }
.am-ed1-head > :last-child { padding-right: 140px; }   /* spazio per le frecce dello slider */
@media (max-width: 959px) { .am-ed1-head > :last-child { padding-right: 0; } }
.am-ed1-slider .el-item { overflow: hidden; border-radius: 2px; background: #1b1b1f; }
.am-ed1-slider .el-image { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; transition: transform 900ms var(--am-ease-out); }
/* custom: frecce tonde dello slider spostate in alto a destra, sopra le foto (come nella home statica) */
.am-ed1-slider .uk-position-center-left, .am-ed1-slider .uk-position-center-right { top: auto; bottom: calc(100% + clamp(28px, 3vw, 48px)); transform: none; margin: 0; }
.am-ed1-slider .uk-position-center-left { left: auto; right: 60px; }
.am-ed1-slider .uk-position-center-right { right: 0; }
.am-ed1-slider .el-slidenav { width: 52px; height: 52px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; padding: 0; background: #2b2b2f; color: var(--am-white) !important;
  transition-property: transform, translate, background-color, color; transition-duration: 160ms, 450ms, 200ms, 200ms; transition-timing-function: var(--am-ease-out); }
.am-ed1-slider .el-slidenav:active { transform: scale(0.95); }
.am-ed1-slider .el-slidenav.uk-invisible { visibility: visible !important; opacity: 0.35; pointer-events: none; }
@media (hover: hover) and (pointer: fine) {
  .am-ed1-slider .el-slidenav:hover { background: var(--am-white); color: var(--am-ink) !important; }
  .am-ed1-slider .el-item:hover .el-image { transform: scale(1.04); }
  .am-marquee:hover .am-marquee__row { animation-play-state: paused; }
}

/* 5 · LOCATION — lead più ampio, CTA grande, card informative (Grid nativo con classe am-cards) */
.am-visit__lead { max-width: 34ch; }
.am-visit__lead.uk-text-lead, .am-visit__lead p { font-size: clamp(1.125rem, 1.4vw, 1.375rem); line-height: 1.4; }
.am-cta .uk-button { padding: 20px 24px 20px 30px; font-size: 0.8125rem; }
.am-cards .el-item { background: var(--am-paper); border-radius: var(--am-radius); padding: clamp(20px, 2vw, 28px); display: flex; flex-direction: column; height: 100%; box-sizing: border-box; transition: background-color 250ms ease; }
.am-cards .el-meta { margin: 0 !important; font-family: var(--am-font); font-size: 0.9375rem; font-weight: 700; letter-spacing: 0.01em; line-height: 1.2; color: var(--am-ink); }
.am-cards .el-title { font-size: clamp(2.25rem, 3.4vw, 3.25rem); font-weight: 700; letter-spacing: -0.04em; line-height: 1; margin: 28px 0 18px !important; text-align: right; }
.am-cards .el-content { margin: 0 !important; }
.am-cards .el-content ul { list-style: none; padding: 16px 0 0; margin: 0 0 24px; border-top: 1px solid var(--am-line); }
.am-cards .el-content li { font-family: var(--am-font-mono); font-size: 0.75rem; text-transform: uppercase; line-height: 1.6; }
.am-cards .el-content li::before { content: "• "; }
.am-cards .el-item > :last-child:has(.uk-button) { margin-top: auto !important; }
.am-cards .uk-button { justify-content: space-between; width: 100%; box-sizing: border-box; background: var(--am-white); }
@media (hover: hover) and (pointer: fine) { .am-cards .el-item:hover { background: #e9e9eb; } .am-cards .uk-button:hover { background: var(--am-ink); } }

/* ---------- 8. Footer (Footer Builder) — CTA gigante, colonne, loghi con punti agli incroci, logo che si svela ---------- */
.am-footer.uk-section { padding-top: clamp(96px, 12vw, 200px) !important; }   /* !important: nel builder il padding verticale è "nessuno" (uk-padding-remove-vertical), qui si ridà solo quello in alto */
.am-footer a { text-decoration: none; }
.am-footer__cta { display: inline-flex; align-items: flex-end; gap: clamp(16px, 2vw, 32px); color: var(--am-white) !important; }
.am-footer__cta-text { display: block; }
.am-footer__cta-arrow { flex: none; width: clamp(56px, 6vw, 96px); height: clamp(56px, 6vw, 96px); border-radius: 999px; background: var(--am-white); color: var(--am-ink);
  display: inline-flex; align-items: center; justify-content: center; margin-bottom: 0.6vw; transition-property: transform, translate; transition-duration: 260ms, 450ms; transition-timing-function: var(--am-ease-out); }
.am-footer__cta-arrow svg { width: 42%; height: 42%; }
.am-footer__cta:active .am-footer__cta-arrow { transform: scale(0.95); }
@media (hover: hover) and (pointer: fine) { .am-footer__cta:hover .am-footer__cta-arrow { transform: rotate(45deg); } }
.am-footer__cta:focus-visible { outline: 2px solid var(--am-white); outline-offset: 8px; }
.am-footer__facts { list-style: none; margin: 0; padding: 0; }
.am-footer__facts li { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-top: 1px solid var(--am-line-inverse); color: var(--am-white); margin: 0; }
.am-footer__facts li:last-child { border-bottom: 1px solid var(--am-line-inverse); }
.am-footer__facts span { color: var(--am-grey-inverse); }
.am-footer__cols { margin-top: clamp(80px, 9vw, 160px) !important; padding-top: clamp(32px, 3vw, 48px); border-top: 1px solid var(--am-line-inverse); }
.am-footer__claim p { margin: 0; max-width: 22ch; font-size: clamp(1.25rem, 1.6vw, 1.625rem); font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; color: var(--am-white); }
.am-footer .am-footer__label { margin: 0 0 16px; }
.am-footer__nav { list-style: none; margin: 0; padding: 0; }
.am-footer__nav li + li { margin-top: 6px; }
.am-footer__nav a, .am-footer__link { color: var(--am-white) !important; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size 260ms var(--am-ease-out); padding-bottom: 2px; }
@media (hover: hover) and (pointer: fine) { .am-footer__nav a:hover, .am-footer__link:hover { background-size: 100% 1px; } }
.am-footer__text { margin: 0 0 14px; color: var(--am-grey-inverse); line-height: 1.5; }
.am-footer__link { display: inline-block; font-family: var(--am-font-mono); font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.04em; }
.am-footer__founders { margin-top: clamp(64px, 7vw, 120px) !important; }
.am-logos { display: grid; grid-template-columns: repeat(3, 1fr); position: relative; border-top: 1px solid var(--am-line-inverse); border-bottom: 1px solid var(--am-line-inverse); }
.am-logos > div { position: relative; min-height: 190px; display: flex; align-items: center; justify-content: center; padding: 24px; }
.am-logos > div + div { border-left: 1px solid var(--am-line-inverse); }
.am-logos > div::before, .am-logos > div:last-child::after { content: ""; position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--am-grey-inverse); top: -3px; left: -3px; }   /* punti agli incroci */
.am-logos > div:last-child::after { left: auto; right: -3px; }
.am-logos img { height: 68px; width: auto; max-width: 100%; object-fit: contain; display: block; opacity: 0.85; transition: opacity 200ms ease; }   /* max-width: il logo largo non esce dalla cella su mobile */
.am-logos a:hover img, .am-logos a:focus-visible img { opacity: 1; }
@media (max-width: 639px) { .am-logos > div { min-height: 104px; padding: 12px; } .am-logos img { height: 34px; } }   /* altezza fissa: gli SVG non hanno dimensioni intrinseche */
.am-footer__wordmark { margin-top: clamp(64px, 8vw, 140px) !important; overflow: hidden; }
.am-footer__wordmark img { display: block; width: 100%; height: auto; }
.am-js .am-footer__wordmark img { transform: translateY(101%); transition: transform 1100ms var(--am-ease-out); }
.am-js .am-footer__wordmark.am-in img { transform: none; }
.am-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 28px; padding: 22px 0 26px; margin-top: clamp(20px, 2vw, 32px); border-top: 1px solid var(--am-line-inverse); color: var(--am-grey-inverse); }
.am-footer__legal-links { display: flex; flex-wrap: wrap; gap: 12px 28px; }
.am-footer__legal a { color: inherit; }
.am-footer__legal a:hover { color: var(--am-white); }
.am-offcanvas-row { margin: 0 !important; }

/* ---------- 9. Motion: stati iniziali SOLO con JS attivo e movimento non ridotto ---------- */
.am-js .am-split, .am-js .am-lines, .am-js .am-type { visibility: hidden; }
.am-caret { display: inline-block; width: 0.6em; height: 1em; background: currentColor; vertical-align: -0.12em; margin-left: 2px; animation: am-caret 0.9s steps(1) infinite; }
@keyframes am-caret { 50% { opacity: 0; } }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }

/* Cursore (solo mouse): alone bianco sfocato in "difference" che accompagna il cursore di sistema */
.am-cursor { position: fixed; left: 0; top: 0; z-index: 2000; pointer-events: none; width: 0; height: 0; opacity: 0; transition: opacity 200ms ease; mix-blend-mode: difference; }
.am-cursor.is-drag { mix-blend-mode: normal; }
.am-cursor.is-on { opacity: 1; }
.am-cursor.is-hidden { opacity: 0; }
.am-cursor::before { content: ""; position: absolute; left: -32px; top: -32px; width: 64px; height: 64px; border-radius: 50%; background: #fff; filter: blur(5px); transform: scale(0.22);
  transition: transform 380ms var(--am-ease-out), background-color 250ms ease, filter 250ms ease; }
.am-cursor.is-hover::before { transform: scale(1); }
.am-cursor.is-drag::before { transform: scale(1.4); filter: none; background: rgba(13, 13, 15, 0.25); border: 1px solid rgba(255, 255, 255, 0.35); -webkit-backdrop-filter: blur(10px) saturate(1.3); backdrop-filter: blur(10px) saturate(1.3); }
.am-cursor.is-down::before { transform: scale(0.16); }
.am-cursor.is-hover.is-down::before { transform: scale(0.85); }
.am-cursor__label { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); color: var(--am-white); font-size: 0.6875rem; white-space: nowrap; opacity: 0; transition: opacity 200ms ease; }
.am-cursor.is-drag .am-cursor__label { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .am-js .am-split, .am-js .am-lines, .am-js .am-type { visibility: visible; }
  .am-marquee__row { animation: none !important; }
  .am-caret { display: none; }
  .uk-button, .uk-button::after, .am-panel__img img, .am-roster *, .am-ed1-slider .el-image { transition-duration: 1ms !important; }
  .am-js .am-footer__wordmark img { transform: none; transition: none; }
  [uk-parallax] { transform: none !important; }
}

/* ==========================================================================
   10. Mobile (sotto 960 / 640 px) — revisione del 2026-11-11
   ========================================================================== */
/* Offcanvas (menu e "Prenota la visita"): più larghi; le posizioni di riposo seguono la larghezza, come da 960 px */
@media (max-width: 959px) {
  .uk-offcanvas-bar { --am-oc-w: min(88vw, 440px); width: var(--am-oc-w); left: calc(-1 * var(--am-oc-w)); padding: 24px 24px 32px; }
  .uk-offcanvas-flip .uk-offcanvas-bar { left: auto; right: calc(-1 * var(--am-oc-w)); }
  .uk-open > .uk-offcanvas-bar { left: 0; }
  .uk-offcanvas-flip .uk-open > .uk-offcanvas-bar { left: auto; right: 0; }
}
/* Menu mobile: voci numerate con filetti, come l'elenco artisti */
#tm-dialog-mobile .uk-nav-default { counter-reset: am-nav; margin-top: 48px; border-top: 1px solid var(--am-line-inverse); }
#tm-dialog-mobile .uk-nav-default > li { counter-increment: am-nav; border-bottom: 1px solid var(--am-line-inverse); }
#tm-dialog-mobile .uk-nav-default > li > a { display: flex; align-items: baseline; gap: 14px; font-size: clamp(1.625rem, 7.4vw, 2.125rem); padding: 14px 0 12px; }
#tm-dialog-mobile .uk-nav-default > li > a::before { content: counter(am-nav, decimal-leading-zero); flex: none; width: 1.75rem; font-family: var(--am-font-mono); font-size: 0.6875rem; font-weight: 400; letter-spacing: 0.02em; color: var(--am-grey-inverse); }
#tm-dialog-mobile .uk-nav-default > li.uk-active > a { color: var(--am-white); }
#tm-dialog-mobile .uk-nav-default > li:not(.uk-active) > a { color: rgba(255, 255, 255, 0.92); }

@media (max-width: 639px) {
  /* Hero: titolo più grande che va a capo da solo (Il festival / che unisce / arte e / motori) */
  .am-hero .uk-heading-2xlarge { font-size: 12vw; }
  .am-hero__title { line-height: 0.92 !important; }
  .am-hero__title .am-line { display: inline; }
  .am-hero__title .am-line--indent { padding-left: 0; }
  .am-hero .uk-text-lead, .am-hero .uk-text-lead p { font-size: 0.9375rem; line-height: 1.45; }
  .am-hero__words { grid-template-columns: 1fr; row-gap: 4px; }   /* le 5 voci mono in colonna, senza riga orfana */
  .am-hero__bottom .uk-grid-small > .el-item { width: 100%; }     /* pulsanti a tutta larghezza, uguali */
  .am-hero__bottom .uk-button { width: 100%; justify-content: space-between; box-sizing: border-box; }

  /* Location: card più basse, etichetta e numero sulla stessa riga */
  .am-cards .el-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; column-gap: 12px; padding: 18px 18px 16px; }
  .am-cards .el-meta { grid-column: 1; grid-row: 1; }
  .am-cards .el-title { grid-column: 2; grid-row: 1; margin: 0 !important; font-size: 2rem; }
  .am-cards .el-content { grid-column: 1 / -1; margin-top: 14px !important; }
  .am-cards .el-content ul { margin-bottom: 0; padding-top: 12px; }
  .am-cards .el-item > :last-child:has(.uk-button) { grid-column: 1 / -1; margin-top: 16px !important; }

  /* Footer: Esplora e Dove affiancati */
  .am-footer__cols > :nth-child(2), .am-footer__cols > :nth-child(3) { width: 50%; }
  .am-footer__cols { column-gap: 0; }
  .am-footer__cols > :nth-child(2) :is(li, p), .am-footer__cols > :nth-child(3) p { font-size: 0.875rem; }
}

/* Seconda edizione: "Leggi tutto" sotto 960 px (il JS aggiunge il pulsante e la classe) */
.am-body--collapsed > p:nth-of-type(n+2) { display: none; }
.am-readmore { display: inline-flex; align-items: center; gap: 10px; margin: 4px 0 0; padding: 0 0 4px; border: 0; background: none; color: var(--am-white); cursor: pointer;
  border-bottom: 1px solid currentColor; font-family: var(--am-font-mono); font-size: 0.75rem; letter-spacing: 0.04em; text-transform: uppercase; }
.am-readmore::after { content: "+"; font-family: var(--am-font); font-size: 1rem; line-height: 1; }

/* Slider della prima edizione: contatore sotto 960 px (le frecce lì sono nascoste) */
.am-ed1-count { margin: 16px 0 0; text-align: right; color: var(--am-grey-inverse); }
.am-ed1-count b { color: var(--am-white); font-weight: 500; }
@media (min-width: 960px) { .am-ed1-count { display: none; } }
@media (prefers-reduced-motion: reduce) { .am-roster .el-item > * { animation: none !important; } }