/* Black Sun (#214) — «Niente trucco, solo semplicità.»
   La pagina prodotto del salone, nel segno di The Ordinary: bianco e nero, etichette cliniche, la tabella degli attributi.
   Firma: il dischetto struccante che toglie il trucco dalla foto della postazione (canvas, solo con JS e movimento). */

:root {
  --carta: #FFFFFF;
  --carta-2: #F4F2EF;
  --inchiostro: #111111;
  --inchiostro-2: #57534F;
  --filo: #DCD7D1;
  --lilla: #E2D6E4;
  --lilla-scuro: #6A5577;
  --f-testo: "Wix Madefor Display", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-elena: "Castoro", Georgia, "Times New Roman", serif;
  --testata: 64px;
  --largo: 1320px;
  --gutter: clamp(18px, 4vw, 48px);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--testata) + 12px); }
.reduced-motion { scroll-behavior: auto; }
body { margin: 0; background: var(--carta); color: var(--inchiostro); font: 400 1.02rem/1.6 var(--f-testo); overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; font-weight: 700; letter-spacing: -.015em; }
p { margin: 0; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--lilla-scuro); outline-offset: 3px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.simboli { position: absolute; width: 0; height: 0; overflow: hidden; }
.sole { width: 1.25em; height: 1.25em; flex: none; color: currentColor; }

/* ── intro ── */
.intro { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; background: var(--inchiostro); color: #fff; transition: opacity .6s ease, visibility .6s; }
.intro.hide { opacity: 0; visibility: hidden; }
.intro__in { display: grid; justify-items: center; gap: 18px; padding: 0 24px; }
.intro__logo { width: min(420px, 78vw); }
.intro__cosa { font: 500 .8rem/1.4 var(--f-testo); letter-spacing: .22em; text-transform: uppercase; color: #C9C4BE; text-align: center; }
.intro__salta { position: absolute; right: 22px; bottom: 22px; background: none; border: 1px solid #555; color: #ddd; border-radius: 999px; padding: 8px 16px; font-size: .85rem; cursor: pointer; }
.no-js .intro, .reduced-motion .intro { display: none; }

/* ── testata ── */
.testata { position: sticky; top: 0; z-index: 50; height: var(--testata); display: flex; align-items: center; gap: 24px; padding: 0 var(--gutter); background: rgba(255, 255, 255, .97); border-bottom: 1px solid var(--filo); }
.testata__logo { display: block; flex: none; }
.testata__logo img { height: 30px; width: auto; }
.testata__nav { display: flex; gap: 26px; margin-left: auto; }
.testata__nav a { text-decoration: none; font-weight: 500; font-size: .95rem; padding: 6px 0; border-bottom: 1.5px solid transparent; }
.testata__nav a:hover { border-bottom-color: var(--inchiostro); }
.testata__destra { display: flex; align-items: center; gap: 14px; }
.lingue { display: inline-flex; border: 1px solid var(--filo); border-radius: 999px; overflow: hidden; }
.lingue button { background: none; border: 0; padding: 5px 11px; font-size: .78rem; font-weight: 600; cursor: pointer; color: var(--inchiostro-2); }
.lingue button[aria-pressed="true"] { background: var(--inchiostro); color: #fff; }
.testata__prenota { text-decoration: none; background: var(--inchiostro); color: #fff; font-weight: 600; font-size: .9rem; padding: 9px 18px; border-radius: 999px; }
#burger { display: none; width: 42px; height: 42px; border: 1px solid var(--filo); border-radius: 50%; background: #fff; cursor: pointer; padding: 0; flex-direction: column; justify-content: center; align-items: center; gap: 4px; }
#burger span { display: block; width: 18px; height: 1.6px; background: var(--inchiostro); }

/* ── la scheda prodotto (apertura) ── */
.prodotto { max-width: var(--largo); margin: 0 auto; padding: 22px var(--gutter) clamp(48px, 7vw, 88px); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(28px, 4.5vw, 72px); row-gap: 18px; }
.briciole { grid-column: 1 / -1; font-size: .82rem; color: var(--inchiostro-2); padding-bottom: 14px; border-bottom: 1px solid var(--filo); }
.briciole span[aria-hidden] { margin: 0 .45em; }
.prodotto__galleria { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; align-items: start; }
.galleria__grande { grid-column: 2; grid-row: 1; margin: 0; }
.galleria__mini { grid-column: 1; grid-row: 1; list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mini { position: relative; display: block; width: 76px; height: 76px; padding: 0; border: 1px solid var(--filo); background: var(--carta-2); cursor: pointer; overflow: hidden; }
.mini img { width: 100%; height: 100%; object-fit: cover; }
.mini.is-on { border: 2px solid var(--inchiostro); }
.mini__cap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.galleria__foto { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--carta-2); }
.galleria__foto > img { width: 100%; height: 100%; object-fit: cover; }
.galleria__cap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; font-size: .88rem; color: var(--inchiostro-2); }
.rifatelo { display: inline-flex; align-items: center; gap: 6px; background: none; border: 1px solid var(--filo); border-radius: 999px; padding: 5px 12px 5px 9px; font-size: .82rem; font-weight: 600; cursor: pointer; color: var(--inchiostro); }
.rifatelo svg { width: 15px; height: 15px; }
.rifatelo[hidden] { display: none; }

/* la firma: il trucco (canvas) e il dischetto, creati dal JS solo col movimento */
.trucco { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.dischetto { position: absolute; left: 0; top: 0; width: var(--d, 120px); height: var(--d, 120px); margin: calc(var(--d, 120px) / -2) 0 0 calc(var(--d, 120px) / -2); border-radius: 50%; pointer-events: none; will-change: transform; opacity: 0;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0) 58%, rgba(0, 0, 0, .05) 70%, rgba(0, 0, 0, .1) 100%),
    radial-gradient(circle, rgba(0, 0, 0, .07) 1.2px, transparent 1.6px) 0 0 / 9px 9px,
    #FDFCFA;
  box-shadow: 0 10px 22px rgba(0, 0, 0, .22), 0 2px 5px rgba(0, 0, 0, .12), inset 0 0 0 1px rgba(0, 0, 0, .06); }
.dischetto__macchie { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 50%; }

.prodotto__scheda { display: flex; flex-direction: column; gap: 18px; padding-top: 4px; }
.fase { display: inline-flex; align-items: center; gap: 8px; font: 600 .74rem/1.2 var(--f-testo); letter-spacing: .16em; text-transform: uppercase; color: var(--inchiostro-2); }
.prodotto h1 { font-size: clamp(2.3rem, 4.1vw, 3.55rem); line-height: 1.03; letter-spacing: -.025em; }
.marca { font-size: .95rem; color: var(--inchiostro-2); }
.elena { margin: 0; }
.elena p { font: italic 400 1.22rem/1.45 var(--f-elena); }
.elena footer { margin-top: 8px; font-size: .84rem; color: var(--inchiostro-2); }
.attributi { margin: 4px 0 0; border-top: 1px solid var(--inchiostro); }
.attributi > div { display: grid; grid-template-columns: minmax(0, 10.5rem) minmax(0, 1fr); gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--filo); }
.attributi dt { font-weight: 600; font-size: .9rem; }
.attributi dd { margin: 0; font-size: .95rem; }
.voti { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: .88rem; font-weight: 500; }
.voti span::before { content: "★ "; color: var(--inchiostro); }
.tasti { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.tasto { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 12px 18px; border: 1.5px solid var(--inchiostro); text-decoration: none; font-weight: 600; font-size: .95rem; text-align: center; background: #fff; }
.tasto:hover { background: var(--carta-2); }
.tasto--pieno { background: var(--inchiostro); color: #fff; }
.tasto--pieno:hover { background: #333; }
.stato { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: .88rem; color: var(--inchiostro-2); }
#orarioStato { font-weight: 700; color: var(--inchiostro); }
#orarioStato:empty { display: none; }

/* ── i dettagli: tre capitoli ── */
.dettaglio { max-width: var(--largo); margin: 0 auto; padding: clamp(52px, 7vw, 96px) var(--gutter); display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 28px clamp(28px, 4.5vw, 72px); border-top: 1px solid var(--inchiostro); }
.dettaglio__testa { align-self: start; position: sticky; top: calc(var(--testata) + 24px); }
.dettaglio__k { display: flex; align-items: baseline; gap: 10px; font: 600 .74rem/1.3 var(--f-testo); letter-spacing: .16em; text-transform: uppercase; color: var(--inchiostro-2); margin-bottom: 14px; }
.dettaglio__n { letter-spacing: .06em; }
.dettaglio h2 { font-size: clamp(1.8rem, 2.6vw, 2.45rem); line-height: 1.05; }
.dettaglio__corpo { display: flex; flex-direction: column; gap: clamp(28px, 4vw, 44px); min-width: 0; }
.dettaglio__intro { font-size: 1.05rem; max-width: 46rem; }
.elena--grande p { font-size: clamp(1.4rem, 2.5vw, 2.05rem); line-height: 1.3; }

.stanze { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.stanza { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.stanza--larga { grid-column: span 2; }
.stanza--alta { grid-column: 3; grid-row: 1 / span 2; }
.foto-btn { display: block; width: 100%; padding: 0; border: 0; background: var(--carta-2); cursor: zoom-in; overflow: hidden; }
.foto-btn img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.foto-btn:hover img { transform: scale(1.025); }
.reduced-motion .foto-btn img { transition: none; }
.stanza .foto-btn { aspect-ratio: 4 / 3; }
.stanza--larga .foto-btn { aspect-ratio: 16 / 10; }
.stanza--alta .foto-btn { aspect-ratio: auto; flex: 1; min-height: 0; }
.stanza figcaption { display: flex; gap: 10px; font-size: .88rem; color: var(--inchiostro-2); }
.stanza__n { font-weight: 700; color: var(--inchiostro); }
.arrivo { display: flex; align-items: center; gap: 10px; font-size: .95rem; padding: 14px 18px; background: var(--carta-2); }

/* gli scaffali e le etichette */
.scaffale { display: flex; flex-direction: column; gap: 20px; }
.scaffale + .scaffale { margin-top: clamp(12px, 2vw, 24px); }
.scaffale__testa { display: grid; gap: 8px; padding-bottom: 14px; border-bottom: 1px solid var(--filo); }
.scaffale__testa h3 { font-size: clamp(1.45rem, 2.2vw, 1.8rem); }
.scaffale__cit { font: italic 400 1rem/1.5 var(--f-elena); color: var(--inchiostro-2); max-width: 52rem; }
.etichette { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 18px; }
.etichetta { display: flex; flex-direction: column; gap: 6px; padding: 20px 20px 18px; background: #fff; border: 1px solid var(--inchiostro); min-height: 250px; }
.etichetta__marca { font-weight: 700; font-size: .92rem; letter-spacing: -.01em; margin-bottom: 18px; }
.etichetta__nome { font-size: 1.32rem; line-height: 1.15; }
.etichetta__sotto { font-size: .86rem; color: var(--inchiostro-2); }
.etichetta__dati { margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--filo); display: grid; gap: 6px; }
.etichetta__dati > div { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr); gap: 10px; }
.etichetta__dati dt { font-size: .74rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding-top: .2em; }
.etichetta__dati dd { margin: 0; font-size: .88rem; }
.etichetta__nota { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--filo); font: italic 400 .95rem/1.45 var(--f-elena); }
.etichetta__chi { display: block; margin-top: 4px; font: 400 .78rem/1.3 var(--f-testo); font-style: normal; color: var(--inchiostro-2); }
.etichetta--nera { background: var(--inchiostro); color: #fff; }
.etichetta--nera .etichetta__sotto, .etichetta--nera .etichetta__chi { color: #C9C4BE; }
.etichetta--nera .etichetta__dati { border-top-color: #444; }
.marche { display: grid; gap: 10px; padding: clamp(22px, 3vw, 34px); background: var(--lilla); }
.marche__d { font-weight: 600; font-size: .95rem; }
.marche .elena footer { color: #4A4150; }
.prezzi { font-size: .95rem; }
.prezzi a { font-weight: 600; }

/* le clienti */
.squadra { display: grid; gap: 14px; }
.squadra__intro { font-size: 1.05rem; }
.squadra__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.squadra__lista li { display: grid; gap: 2px; padding: 14px 20px; border: 1px solid var(--inchiostro); flex: 1 1 13rem; max-width: 20rem; }
.squadra__nome { font-weight: 700; font-size: 1.15rem; }
.squadra__ruolo { font-size: .86rem; color: var(--inchiostro-2); }
.note { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.nota { margin: 0; display: flex; flex-direction: column; gap: 12px; padding: 22px; border: 1px solid var(--filo); }
.nota blockquote { margin: 0; font-size: 1rem; line-height: 1.6; }
.nota figcaption { margin-top: auto; font-size: .82rem; font-weight: 600; color: var(--inchiostro-2); }
.nota--prima { grid-column: 1 / -1; background: var(--carta-2); border-color: var(--carta-2); }
.nota--prima blockquote { font-size: clamp(1.1rem, 1.7vw, 1.3rem); line-height: 1.55; }
.note__piede { font-size: .82rem; color: var(--inchiostro-2); }
.lavori { display: grid; gap: 16px; }
.lavori__t { font-size: 1.35rem; }
.lavori__griglia { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.lavoro { margin: 0; display: grid; gap: 8px; }
.lavoro .foto-btn { aspect-ratio: 4 / 5; }
.lavoro figcaption { font-size: .86rem; color: var(--inchiostro-2); }

/* ── orari e dove ── */
.orari { max-width: var(--largo); margin: 0 auto; padding: clamp(52px, 7vw, 96px) var(--gutter); border-top: 1px solid var(--inchiostro); }
.orari__testa { display: grid; gap: 10px; margin-bottom: clamp(26px, 4vw, 40px); max-width: 44rem; }
.orari__testa h2 { font-size: clamp(1.8rem, 2.6vw, 2.45rem); line-height: 1.05; }
.orari__intro { font-size: 1.05rem; }
.orari__griglia { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(22px, 3vw, 40px); align-items: start; }
.orari__canali { display: grid; gap: 10px; }
.canale { display: grid; gap: 2px; padding: 14px 18px; border: 1.5px solid var(--inchiostro); text-decoration: none; }
.canale__k { font: 600 .72rem/1.3 var(--f-testo); letter-spacing: .14em; text-transform: uppercase; }
.canale__v { font-weight: 600; font-size: 1.05rem; overflow-wrap: anywhere; }
.canale--pieno { background: var(--inchiostro); color: #fff; }
.canale:hover { background: var(--carta-2); }
.canale--pieno:hover { background: #333; }
.stato--grande { font-size: .95rem; margin-bottom: 10px; }
#orarioStato2 { font-weight: 700; color: var(--inchiostro); }
.giorni { width: 100%; border-collapse: collapse; font-size: .98rem; }
.giorni th, .giorni td { padding: 9px 10px; text-align: left; border-bottom: 1px solid var(--filo); }
.giorni th { font-weight: 500; }
.giorni td { font-variant-numeric: tabular-nums; }
.giorni tr.is-today { background: var(--lilla); }
.giorni tr.is-today th, .giorni tr.is-today td { font-weight: 700; }
.orari__nota { margin-top: 12px; font-size: .88rem; color: var(--inchiostro-2); }
.orari__dove { display: grid; gap: 12px; }
.dove__via { font-weight: 700; font-size: 1.2rem; line-height: 1.35; }
.dove__come { font-size: .95rem; }
.mappa { aspect-ratio: 4 / 3; background: var(--carta-2); }
.mappa iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ── domande ── */
.domande { max-width: var(--largo); margin: 0 auto; padding: clamp(52px, 7vw, 96px) var(--gutter); border-top: 1px solid var(--inchiostro); display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 28px clamp(28px, 4.5vw, 72px); }
.domande h2 { font-size: clamp(1.8rem, 2.6vw, 2.45rem); line-height: 1.05; }
.domande__lista { border-top: 1px solid var(--inchiostro); }
.domande details { border-bottom: 1px solid var(--filo); }
.domande summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 16px; padding: 18px 0; font-weight: 600; font-size: 1.05rem; }
.domande summary::-webkit-details-marker { display: none; }
.domande summary::after { content: "+"; font-weight: 400; font-size: 1.3rem; line-height: 1; }
.domande details[open] summary::after { content: "–"; }
.domande details p { padding: 0 0 18px; max-width: 46rem; }

/* ── piè di pagina (l'unica fascia nera) ── */
.piede { background: var(--inchiostro); color: #fff; padding: 56px var(--gutter) 96px; display: grid; justify-items: center; gap: 10px; text-align: center; }
.piede__logo { width: min(300px, 70vw); margin-bottom: 10px; }
.piede__riga { font-size: .95rem; }
.piede a { color: #fff; }
.piede__cred { max-width: 52rem; margin-top: 12px; font-size: .8rem; line-height: 1.55; color: #B9B3AC; }

/* ── barra mobile ── */
.barra { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: none; grid-template-columns: repeat(4, minmax(0, 1fr)); background: #fff; border-top: 1px solid var(--inchiostro); transform: translateY(100%); transition: transform .3s ease; }
.barra.is-visible { transform: none; }
.barra a { display: flex; align-items: center; justify-content: center; min-height: 50px; text-decoration: none; font-weight: 600; font-size: .9rem; border-left: 1px solid var(--filo); }
.barra a:first-child { border-left: 0; background: var(--inchiostro); color: #fff; }

/* ── lightbox ── */
#lightbox { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: rgba(17, 17, 17, .92); padding: 24px; }
#lightbox[hidden] { display: none !important; }
#lightboxImg { max-width: min(1200px, 100%); max-height: 88vh; width: auto; height: auto; }
#lightboxClose { position: absolute; top: 14px; right: 16px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid #666; background: none; color: #fff; font-size: 1.6rem; line-height: 1; cursor: pointer; }

/* ── reveal ── */
.js .reveal { opacity: 0; }
.js .reveal.in-view, .reduced-motion .reveal { opacity: 1; }

/* ── responsive ── */
@media (max-width: 1100px) {
  .orari__griglia { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .orari__dove { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); align-items: start; }
  .orari__dove .mappa { grid-row: span 3; grid-column: 2; }
}
@media (max-width: 960px) {
  .testata__nav { display: none; position: absolute; top: var(--testata); left: 0; right: 0; flex-direction: column; gap: 0; margin: 0; padding: 8px var(--gutter) 18px; background: #fff; border-bottom: 1px solid var(--inchiostro); }
  .testata__nav.nav-open { display: flex; }
  .testata__nav a { padding: 14px 0; border-bottom: 1px solid var(--filo); font-size: 1.05rem; }
  .testata__destra { margin-left: auto; }
  #burger { display: inline-flex; }
  .prodotto { grid-template-columns: minmax(0, 1fr); }
  .prodotto__galleria { grid-template-columns: minmax(0, 1fr); }
  .galleria__grande { grid-column: 1; grid-row: 1; }
  .galleria__mini { grid-column: 1; grid-row: 2; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  .mini { width: 100%; height: auto; aspect-ratio: 1; }
  .dettaglio, .domande { grid-template-columns: minmax(0, 1fr); }
  .dettaglio__testa { position: static; }
  .barra { display: grid; }
  .piede { padding-bottom: 110px; }
}
@media (max-width: 760px) {
  .stanze { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .stanza--larga { grid-column: 1 / -1; }
  .stanza--alta { grid-column: auto; grid-row: span 1; }
  .stanza--alta .foto-btn { aspect-ratio: 4 / 5; flex: none; }
  .note { grid-template-columns: minmax(0, 1fr); }
  .orari__griglia { grid-template-columns: minmax(0, 1fr); }
  .orari__dove { grid-template-columns: minmax(0, 1fr); }
  .orari__dove .mappa { grid-row: auto; grid-column: auto; }
  .lavori__griglia { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
}
@media (max-width: 560px) {
  body { font-size: 1rem; }
  .testata { gap: 12px; }
  .testata__logo img { height: 24px; }
  .testata__prenota { display: none; }
  .tasti { grid-template-columns: minmax(0, 1fr); }
  .attributi > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .stanze { grid-template-columns: minmax(0, 1fr); }
  .stanza--alta .foto-btn { aspect-ratio: 4 / 3; }
  .lavori__griglia { grid-template-columns: minmax(0, 1fr); }
  .lavoro .foto-btn { aspect-ratio: 4 / 3; }
  .etichetta { min-height: 0; }
}
@media (max-width: 400px) {
  .galleria__mini { gap: 6px; }
  .lingue button { padding: 5px 8px; }
}

/*MAPPACLIC*/
/* la mappa Google si carica solo al clic (giro privacy 1/10/2026) */
.mappa-clic { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: var(--mappa-h, 320px); box-sizing: border-box; padding: 24px; text-align: center; background: repeating-linear-gradient(0deg, rgba(127, 127, 127, 0.14) 0 1px, transparent 1px 28px), repeating-linear-gradient(90deg, rgba(127, 127, 127, 0.14) 0 1px, transparent 1px 28px); }
.mappa-clic__velo { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 32em; }
.mappa-clic__btn { display: inline-block; padding: 0.75em 1.4em; border: 2px solid currentColor; border-radius: 999px; color: inherit; font: inherit; font-weight: 600; line-height: 1.2; text-decoration: none; background: transparent; cursor: pointer; }
.mappa-clic__btn:hover, .mappa-clic__btn:focus-visible { text-decoration: underline; }
.mappa-clic__nota { margin: 0; font-size: 0.85em; line-height: 1.45; }
/*/MAPPACLIC*/