/* Repliche di monete — Imperivm Art · Roma
   Un solo foglio di stile per le due pagine (index.html e it/index.html).
   Prima il telefono (iPhone, Safari), poi il computer. Caratteri e colori del sito. */

@font-face{font-family:"Cinzel";font-style:normal;font-weight:400 700;font-display:swap;src:url(font/cinzel-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cinzel Decorative";font-style:normal;font-weight:400;font-display:swap;src:url(font/cinzeldecorative-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:400 600;font-display:swap;src:url(font/ebgaramond-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"EB Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(font/ebgaramond-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* caratteri di riserva con le stesse misure (Georgia c'e' su iPhone, Mac e Windows): mentre i
   caratteri del sito arrivano il testo non cambia larghezza, quindi la pagina non salta */
@font-face{font-family:"Garamond riserva";src:local("Georgia");size-adjust:86.5%;ascent-override:116%;descent-override:34%;line-gap-override:0%}
/* il grassetto ha la sua riserva (Georgia Bold): senza, la frase sottolineata andava su due righe e
   poi tornava su una all'arrivo dei caratteri (EB Garamond 600 e' largo il 77,4% di Georgia Bold) */
@font-face{font-family:"Garamond riserva";font-weight:600 700;src:local("Georgia Bold"),local("Georgia-Bold"),local("Georgia");size-adjust:77.4%;ascent-override:129%;descent-override:38%;line-gap-override:0%}
/* il corsivo ha la sua riserva (Georgia Italic, misurata con strumenti/misura_riserva_corsivo.mjs su tutti
   i testi in corsivo della pagina: EB Garamond Italic e' largo l'83,4% di Georgia Italic in italiano, l'82,6%
   in inglese). Senza, chi arrivava a meta' pagina vedeva il testo saltare di 19-150 punti all'arrivo dei
   caratteri (prova telefono del 19/10/2026, m3) */
@font-face{font-family:"Garamond riserva";font-style:italic;src:local("Georgia Italic"),local("Georgia-Italic");size-adjust:83%;ascent-override:120.8%;descent-override:35.4%;line-gap-override:0%}
/* Cinzel scrive le minuscole come maiuscolette: la riserva cambia secondo il testo. Titoli con
   maiuscole e minuscole (122%), titolo grande in italiano e in inglese (misurati uno per uno sul
   titolo del 19/10/2026: 119,6% e 121,8%),
   cifre del prezzo, scritte tutte maiuscole (Cinzel e Georgia maiuscolo sono larghi uguali) */
@font-face{font-family:"Cinzel riserva";src:local("Georgia");size-adjust:122%;ascent-override:80%;descent-override:30%;line-gap-override:0%}
@font-face{font-family:"Cinzel riserva titolo";src:local("Georgia");size-adjust:119.6%;ascent-override:81.6%;descent-override:30.6%;line-gap-override:0%}
@font-face{font-family:"Cinzel riserva title";src:local("Georgia");size-adjust:121.8%;ascent-override:80.1%;descent-override:30%;line-gap-override:0%}
@font-face{font-family:"Cinzel riserva cifre";src:local("Georgia");size-adjust:111%;ascent-override:87.9%;descent-override:33%;line-gap-override:0%}
@font-face{font-family:"Cinzel riserva maiuscole";src:local("Georgia");size-adjust:99%;ascent-override:98.6%;descent-override:37%;line-gap-override:0%}

:root{
  --bg:#0E0B0F;--bg-2:#161219;--surface:#1A151E;
  --gold:#C9A84C;--gold-lt:#EDD080;--gold-dk:#8A722C;--red:#9E2424;
  --text:#F2E8D5;--text-2:#C8B89A;--text-3:#A8956F;
  --line:rgba(201,168,76,.16);--line-2:rgba(201,168,76,.38);
  --serif:"EB Garamond","Garamond riserva",Georgia,"Times New Roman",serif;
  --caps:"Cinzel","Cinzel riserva",Georgia,serif;
  --maiuscole:"Cinzel","Cinzel riserva maiuscole",Georgia,serif;
  --display:"Cinzel Decorative","Cinzel","Cinzel riserva",Georgia,serif;
  --g:16px;
  --striscia:40px;
  --largo:1180px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg)}
.js:not(.fermo){scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--serif);font-size:18px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
img{max-width:100%;height:auto}
a{color:var(--gold-lt);text-underline-offset:3px;text-decoration-thickness:1px}
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px}
button{font:inherit;color:inherit}
p,ul,ol,dl,dd,figure,h1,h2,h3,address{margin:0}
h1,h2,h3{font-weight:400;text-wrap:balance}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.no-js .solo-js{display:none!important}
.fermo .moneta [data-gira]{display:none}
.salta{position:absolute;left:var(--g);top:-80px;z-index:200;background:var(--gold);color:#1a140c;padding:12px 16px;font-family:var(--caps);font-size:14px}
/* "Vendiamo repliche, non monete vere": sottolineatura vera nel testo (decisione di Davide del 14/10) */
.sottolinea{font-weight:600;color:var(--text);-webkit-text-decoration-line:underline;text-decoration-line:underline;text-decoration-thickness:2px;-webkit-text-decoration-color:var(--gold-lt);text-decoration-color:var(--gold-lt);text-underline-offset:5px;text-decoration-skip-ink:auto}
.salta:focus{top:8px}
/* pezzi di frase che non vanno spezzati a capo («Via Cavour 280 ·», «non le vendiamo online») */
.unito{white-space:nowrap}
/* le istruzioni da tastiera solo dove c'e' un mouse (il telefono non ha frecce ne' Esc) */
.solo-tastiera{display:none}
@media (hover:hover) and (pointer:fine){.solo-tastiera{display:list-item}}

/* pulsanti: almeno 44 punti */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:2px;border:1px solid transparent;font-family:var(--maiuscole);font-size:14px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;cursor:pointer;touch-action:manipulation;background:none;color:var(--gold-lt);transition:background-color .2s,border-color .2s,color .2s}
.btn--oro{background:var(--gold);color:#1a140c;border-color:var(--gold)}
.btn--vuoto{border-color:var(--line-2)}
.btn--piccolo{min-height:44px;padding:0 14px;font-size:14px;border-color:var(--line-2)}
.btn span[aria-hidden]{font-family:var(--serif);font-size:19px;letter-spacing:0;line-height:1}
@media (hover:hover){.btn--oro:hover{background:var(--gold-lt);border-color:var(--gold-lt)}.btn--vuoto:hover,.btn--piccolo:hover{border-color:var(--gold-lt)}}

/* testata e striscia della replica dichiarata */
.testata{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(8px + env(safe-area-inset-top)) max(var(--g),env(safe-area-inset-right)) 8px max(var(--g),env(safe-area-inset-left));border-bottom:1px solid var(--line)}
.marchio{display:flex;flex-direction:column;justify-content:center;min-height:44px;text-decoration:none;line-height:1.15}
.marchio__nome{font-family:var(--display);font-size:17px;color:var(--gold)}
.marchio__sotto{font-family:var(--maiuscole);font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);margin-top:3px;white-space:nowrap}
.testata__nav{display:none}
.lingua{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 12px;border:1px solid var(--line-2);font-family:var(--maiuscole);font-size:14px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--gold-lt)}
.striscia{position:-webkit-sticky;position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:6px max(var(--g),env(safe-area-inset-right)) 6px max(var(--g),env(safe-area-inset-left));background:var(--red);color:var(--gold-lt);box-shadow:0 6px 18px rgba(0,0,0,.35)}
.striscia__badge{font-size:15.5px;font-weight:500;line-height:1.25}
@media (min-width:360px){.striscia__badge{font-size:16px}}
.striscia__contatore{font-family:var(--caps);font-size:14px;letter-spacing:.06em;white-space:nowrap;opacity:0;transition:opacity .3s}
.striscia__contatore.su{opacity:1}

/* apertura. Sul telefono: titolo, poi le due frasi di Davide (vendiamo repliche; solo in negozio,
   con il prezzo), poi la moneta piccola nella sua vetrina, poi la risposta. Il blocco di testo si
   "apre" (display:contents) cosi' l'ordine cambia senza cambiare l'HTML */
.eroe{display:flex;flex-direction:column;align-items:center;padding:16px var(--g) 40px;text-align:center}
.eroe__testo{display:contents}
.sopratitolo{order:1;font-family:var(--maiuscole);font-size:14px;letter-spacing:.1em;line-height:1.4;text-transform:uppercase;color:var(--gold);margin-bottom:8px;text-wrap:balance}
h1{order:2;font-family:"Cinzel","Cinzel riserva titolo",Georgia,serif;font-size:27px;line-height:1.15;color:var(--gold-lt);margin-bottom:12px}
.patto{order:3;width:100%;max-width:34rem;margin:0 auto 14px;padding:12px 14px 13px;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);background:linear-gradient(180deg,rgba(158,36,36,.16),rgba(158,36,36,.05))}
.patto__vere{font-size:20px;line-height:1.35;text-wrap:balance}
.patto__negozio{margin-top:8px;font-size:16.5px;line-height:1.45;color:var(--text);text-wrap:balance}
html[lang=en] h1{font-family:"Cinzel","Cinzel riserva title",Georgia,serif}
.patto__prezzo{font-family:"Cinzel","Cinzel riserva cifre",Georgia,serif;font-size:16px;letter-spacing:.04em;color:var(--gold-lt);white-space:nowrap}
.eroe__moneta{--d:150px;order:4;display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;margin-bottom:20px}
.risposta{order:5;font-size:18.5px;max-width:36em;margin:0 auto}
.eroe .firma{order:6}
.eroe__azioni{order:7;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px}
.eroe__didascalia{order:1;font-size:16px;line-height:1.45;color:var(--text-2);max-width:24em}
.eroe__moneta [data-gira]{order:2}
.eroe__didascalia strong,.teca__nota strong{font-weight:600;color:var(--gold-lt)}
.firma{font-family:var(--maiuscole);font-size:14px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-top:18px}

/* la vetrina: la foto e' piccola (ogni moneta circa 100-130 pixel all'origine), quindi la moneta si mostra a
   140-150 punti sul telefono e la bellezza la fanno il fondo, la luce, l'anello e l'ombra */
.teca{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:26rem;margin:0 auto;padding:26px 18px 16px;border:1px solid var(--line);border-radius:3px;background:radial-gradient(60% 50% at 50% 40%,rgba(237,208,128,.14),rgba(237,208,128,0) 100%),linear-gradient(180deg,#211a21 0%,#140f15 100%);background:radial-gradient(circle calc(var(--d) * .95) at 50% calc(26px + var(--d) / 2),rgba(237,208,128,.17),rgba(237,208,128,.05) 62%,rgba(237,208,128,0) 100%),linear-gradient(180deg,#211a21 0%,#140f15 100%);box-shadow:inset 0 1px 0 rgba(237,208,128,.10),0 12px 30px rgba(0,0,0,.35)}
.teca--eroe{width:auto;padding:16px;border-radius:50%;border:0;background:radial-gradient(closest-side,rgba(237,208,128,.20),rgba(237,208,128,.06) 60%,rgba(237,208,128,0));box-shadow:none}
.teca__nota{max-width:22rem;font-size:16px;line-height:1.45;color:var(--text-2);text-align:center}

/* la moneta: una cornice rotonda che mostra la foto vera dentro un cerchio */
.palco{position:relative;width:var(--d);height:var(--d);margin:0 auto;cursor:pointer;scroll-margin:calc(var(--striscia) + 16px) 0 16px}
/* l'anello della capsula intorno alla moneta (solo quando si vede una faccia per volta) */
.js:not(.fermo) .palco::before,.palco--eroe::before{content:"";position:absolute;top:-7px;right:-7px;bottom:-7px;left:-7px;border-radius:50%;border:1px solid rgba(237,208,128,.30);box-shadow:inset 0 0 0 5px rgba(14,11,15,.55),0 0 18px rgba(237,208,128,.08);pointer-events:none}
.cornice{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;overflow:hidden;background:#2a211c;box-shadow:0 16px 26px -6px rgba(0,0,0,.8),0 0 0 1px rgba(237,208,128,.22);-webkit-mask-image:-webkit-radial-gradient(white,black);isolation:isolate}
/* luce: un riflesso morbido in alto a sinistra, sopra la foto (la foto non e' ritoccata) */
.moneta .cornice::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;border-radius:50%;background:radial-gradient(circle at 30% 24%,rgba(255,246,222,.13),rgba(255,246,222,0) 46%),radial-gradient(circle at 72% 84%,rgba(0,0,0,.16),rgba(0,0,0,0) 52%);pointer-events:none}
.cornice::before,.cornice img{position:absolute;display:block;max-width:none;width:calc(100% * 50 / var(--r));height:auto;aspect-ratio:1/1;left:calc(50% - var(--cx) * 50 / var(--r) * 1%);top:calc(50% - var(--cy) * 50 / var(--r) * 1%)}
.cornice::before{content:"";height:calc(100% * 50 / var(--r));background:var(--lqip) center/100% 100% no-repeat}
.cornice img.attesa{opacity:0}
.cornice img.pronta{opacity:1;transition:opacity .35s ease}
.js:not(.fermo) .palco .cornice:not(.attiva){visibility:hidden}
.palco--eroe .cornice:not(.attiva){visibility:hidden}
.punto{position:absolute;z-index:2;left:var(--x);top:var(--y);width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:rgba(14,11,15,.78);border:1.5px solid var(--gold-lt);color:var(--gold-lt);font:600 14px/21px var(--caps);text-align:center;pointer-events:none;transition:opacity .3s ease,transform .25s ease,background-color .25s ease,color .25s ease}
.punto.acceso{background:var(--gold-lt);color:#1a140c;transform:scale(1.4)}
/* la moneta resta pulita: con il motore attivo un numero compare sulla foto solo quando si tocca
   la sua voce nell'elenco (e poi resta); al computer si vedono tutti passando sopra la moneta.
   Senza JavaScript e con le monete ferme si vedono sempre tutti */
.js:not(.fermo) .moneta .punto{opacity:0;transform:scale(.6)}
.js:not(.fermo) .moneta .punto.visto{opacity:1;transform:none}
.js:not(.fermo) .moneta .punto.acceso{opacity:1;transform:scale(1.4)}
@media (hover:hover) and (pointer:fine){.js:not(.fermo) .moneta .palco:hover .punto:not(.acceso){opacity:1;transform:none}}
/* i numeri compaiono solo sopra la foto vera, mai sopra la miniatura sfocata */
.cornice .foto.attesa~.punto{opacity:0!important;transition:none}
.palco--eroe::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;border-radius:50%;background:radial-gradient(circle at 30% 24%,rgba(255,246,222,.13),rgba(255,246,222,0) 46%);pointer-events:none}
.palco--eroe .cornice.attiva::after{content:"";position:absolute;top:-10%;bottom:-10%;left:0;width:45%;background:linear-gradient(90deg,rgba(255,240,200,0),rgba(255,240,200,.32),rgba(255,240,200,0));transform:translate3d(-130%,0,0) skewX(-14deg);pointer-events:none}
.palco--eroe.luce .cornice.attiva::after{animation:luce 1.4s ease-out 1}
@keyframes luce{to{transform:translate3d(330%,0,0) skewX(-14deg)}}

/* senza JavaScript, o con meno movimento: i due lati uno accanto all'altro */
.no-js .moneta .palco,.fermo .moneta .palco{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:min(100%,330px);height:auto;cursor:default}
.no-js .moneta .cornice,.fermo .moneta .cornice{position:relative;height:auto;padding-top:100%}

/* blocchi di testo */
.cornice-testo{max-width:44rem;margin:0 auto;padding:0 max(var(--g),env(safe-area-inset-right)) 0 max(var(--g),env(safe-area-inset-left))}
.blocco,.linea,.finale{padding:44px 0;border-top:1px solid var(--line);scroll-margin-top:calc(var(--striscia) + 8px)}
h2{font-family:var(--caps);font-size:25px;line-height:1.2;color:var(--gold-lt);margin-bottom:14px}
.blocco p+p,.finale p+p{margin-top:12px}
.nota{font-size:16px;color:var(--text-2);margin-top:14px}
.cartellino-prezzo{margin:22px 0 4px;padding:16px 18px;border:1px solid var(--line-2);border-left:3px solid var(--red);background:var(--surface)}
.cartellino-prezzo__cifra{font-family:var(--caps);font-size:22px;color:var(--gold-lt);line-height:1.25}
.cartellino-prezzo__dove{margin-top:6px;font-size:17px;line-height:1.45;color:var(--text)}
.cartellino-prezzo__dove strong,.finale__solo strong,.in-negozio strong{font-weight:600;color:var(--text)}
.listino{margin:10px 0 0;padding-left:20px;font-size:16.5px;color:var(--text-2)}
.listino li+li{margin-top:4px}
.cartellino-prezzo__banco{margin-top:10px;font-size:16.5px;color:var(--text-2)}
.vere-riga{margin-bottom:12px;font-size:19px;text-wrap:balance}
.finale__vere{margin:0 0 14px;font-size:20px;text-wrap:balance}
.finale__solo{font-size:17.5px}
.collega{margin-top:16px}
.collega a{display:inline-flex;align-items:center;min-height:44px}
.fonti-riga{font-size:15.5px;color:var(--text-2);margin-top:14px}
/* i rimandi alle fonti restano discreti a vista, ma l'area da toccare e' alta 44 punti:
   il riempimento di un elemento in riga non sposta il testo intorno */
.rif{display:inline;margin:0 -8px 0 -4px;padding:14px 8px;font-size:15px;line-height:1.4;color:var(--gold);text-decoration:underline dotted;text-underline-offset:3px;white-space:nowrap}
/* nelle righe di fonti la riga stessa e' alta 44 punti: l'area da toccare non copre la riga sotto */
.fonti-riga .rif,.fonti-moneta .rif,.tappa__nota .rif,.confronto .rif,#prezzi .rif{display:inline-block;padding:0 8px;line-height:44px}

/* riquadri chiusi: il testo e' nell'HTML (lo leggono motori e assistenti), si apre toccando */
.chiuso,.approfondire{margin-top:18px;border:1px solid var(--line-2)}
.chiuso>summary,.approfondire>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:8px 16px;cursor:pointer;list-style:none;font-family:var(--maiuscole);font-size:14px;line-height:1.35;letter-spacing:.07em;text-transform:uppercase;color:var(--gold-lt);touch-action:manipulation}
.chiuso>summary::-webkit-details-marker,.approfondire>summary::-webkit-details-marker,.lato>summary::-webkit-details-marker{display:none}
.chiuso>summary::after,.approfondire>summary::after{content:"+";flex:0 0 auto;font-family:var(--serif);font-size:24px;line-height:1}
.chiuso[open]>summary::after,.approfondire[open]>summary::after{content:"−"}
.chiuso__corpo{padding:0 16px 14px}
.chiuso__corpo p+p{margin-top:12px}

/* linea del tempo: si scorre col dito */
.linea .cornice-testo p{color:var(--text-2)}
.linea__binario{list-style:none;display:flex;gap:14px;margin:22px 0 0;padding:6px max(var(--g),env(safe-area-inset-left)) 18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--g);-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--gold-dk) transparent}
.tappa{position:relative;flex:0 0 min(82%,310px);min-width:0;scroll-snap-align:start;padding:18px 16px 14px;background:var(--surface);border:1px solid var(--line);border-top:2px solid var(--gold-dk)}
.tappa::before{content:"";position:absolute;top:-7px;left:16px;width:12px;height:12px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px var(--bg)}
.tappa__anni{font-family:var(--caps);font-size:14px;letter-spacing:.06em;color:var(--gold)}
.tappa__nome{font-family:var(--caps);font-size:20px;line-height:1.25;letter-spacing:.03em;text-transform:none;color:var(--text);margin:6px 0 4px}
.tappa__nota{font-size:15.5px;color:var(--text-2);margin-bottom:10px}
.tappa__monete{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.tappa__moneta{display:flex;align-items:center;gap:12px;min-height:60px;text-decoration:none;color:var(--text);border-radius:2px}
.tappa__titolo{font-size:16.5px;line-height:1.3}
.miniatura{position:relative;flex:0 0 52px;width:52px;height:52px;border-radius:50%;overflow:hidden;background:#2a211c;box-shadow:0 0 0 1px var(--line-2);-webkit-mask-image:-webkit-radial-gradient(white,black)}
.miniatura img{position:absolute;max-width:none;width:calc(100% * 50 / var(--r));height:auto;left:calc(50% - var(--cx) * 50 / var(--r) * 1%);top:calc(50% - var(--cy) * 50 / var(--r) * 1%)}
@media (hover:hover){.tappa__moneta:hover .tappa__titolo{color:var(--gold-lt)}}

/* le monete */
.monete{border-top:1px solid var(--line)}
.uso{padding-top:36px;font-size:16px;color:var(--text-2)}
.uso__titolo{font-family:var(--maiuscole);font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.uso ul{margin:8px 0 12px;padding-left:20px}
.uso__fermo{margin-bottom:10px;color:var(--text)}
.moneta{padding:34px 0;border-bottom:1px solid var(--line);scroll-margin-top:var(--striscia)}
.moneta__griglia{max-width:var(--largo);margin:0 auto;padding:0 max(var(--g),env(safe-area-inset-right)) 0 max(var(--g),env(safe-area-inset-left));display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"testa" "vista" "testo";row-gap:18px}
.moneta__testa{grid-area:testa}
.moneta__vista{grid-area:vista;min-width:0}
.moneta__testo{grid-area:testo;min-width:0}
.moneta__etichetta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:10px}
.chip{display:inline-block;padding:4px 10px;border:1px solid var(--line-2);font-family:var(--maiuscole);font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-lt)}
.moneta__numero{font-family:var(--maiuscole);font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.moneta h2{margin-bottom:10px;outline:none}
.h2__titolo{display:block}
.h2__tipo{display:block;margin-top:6px;font-family:var(--serif);font-style:italic;font-size:18.5px;line-height:1.35;color:var(--text-2)}
.moneta__apertura{font-style:italic;font-size:19px;line-height:1.5}
.moneta__figura{--d:140px;position:relative;display:flex;flex-direction:column;align-items:center}
/* il pulsante tondo per girare la moneta, appoggiato in basso a destra fuori dall'anello */
.gira-tondo{position:absolute;top:calc(26px + var(--d) - 40px);left:calc(50% + var(--d) / 2 - 8px);left:min(calc(50% + var(--d) / 2 - 8px),calc(100% - 52px));z-index:2;display:flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border-radius:50%;border:1.5px solid var(--gold-lt);background:rgba(14,11,15,.88);color:var(--gold-lt);font-family:var(--serif);font-size:25px;line-height:1;cursor:pointer;touch-action:manipulation;box-shadow:0 4px 14px rgba(0,0,0,.55)}
@media (hover:hover){.gira-tondo:hover{background:var(--gold);color:#1a140c}}
.lati{width:100%;margin-top:16px;display:grid;gap:10px}
/* le due facce: riquadri apribili; quello della faccia che si vede e' aperto */
.lato{padding:0 14px;border:1px solid var(--line);background:var(--bg-2);transition:border-color .3s}
.js:not(.fermo) .lato.attivo{border-color:var(--line-2);order:-1}
.lato__titolo{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;min-height:46px;padding:8px 28px 8px 0;position:relative;cursor:pointer;list-style:none;font-family:var(--maiuscole);font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);touch-action:manipulation}
.lato__titolo::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-family:var(--serif);font-size:24px;line-height:1;color:var(--gold-lt)}
.lato[open]>.lato__titolo::after{content:"−"}
.lato__stato{font-family:var(--serif);font-size:15px;letter-spacing:0;text-transform:none;color:var(--text-3);font-style:italic}
.fermo .lato__stato{display:none}
.lato__desc{font-size:16.5px;color:var(--text)}
.lato__dettagli{list-style:none;margin:6px 0 10px;padding:0}
.dettaglio{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:5px 0;border:0;border-top:1px solid var(--line);background:none;text-align:left;font-size:16px;line-height:1.35;color:var(--text);cursor:pointer;touch-action:manipulation}
.no-js .dettaglio{cursor:default}
.dettaglio__n{flex:0 0 24px;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--gold-lt);color:var(--gold-lt);font:600 14px/21px var(--caps);text-align:center}
.moneta__breve{margin-bottom:16px;padding:12px 14px;border-left:3px solid var(--gold);background:var(--surface);font-size:17.5px}
/* i tre dati dell'originale in tre colonne anche sul telefono (pagina piu' corta) */
.dati{margin:0 0 6px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px}
.dato{display:flex;flex-direction:column;gap:3px;padding:9px 0 4px;border-top:1px solid var(--line-2)}
.dato dt{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--text-3);line-height:1.3;overflow-wrap:anywhere}
.dato dd{font-size:16.5px;line-height:1.3;overflow-wrap:anywhere}
.dato dd .rif{display:block;margin:-8px 0 -12px;padding:12px 0;white-space:normal}
h3{font-family:var(--maiuscole);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:24px 0 8px}
.storia{font-size:18.5px;line-height:1.62}
.approfondire__corpo{padding:0 16px 14px}
.approfondire h3{margin:14px 0 6px}
.ipotesi{margin:0;padding-left:20px;font-size:16.5px;color:var(--text-2)}
.ipotesi li+li{margin-top:6px}
.riferimento{font-size:16.5px;color:var(--text-2)}
.confronto{margin-top:20px;padding:4px 16px 14px;border:1px solid var(--line-2);background:linear-gradient(180deg,var(--surface),var(--bg-2))}
.confronto h3{margin-top:12px}
.confronto p{font-size:17px}
.confronto__nostra{margin-top:8px;font-family:var(--caps);font-size:15px;line-height:1.4;color:var(--gold-lt)}
.fonti-moneta{margin:0;padding-left:22px;font-size:15.5px;color:var(--text-2)}
.fonti-moneta li{margin:0;padding:12px 0;overflow-wrap:anywhere;scroll-margin-top:calc(var(--striscia) + 16px)}
.fonti-moneta li a:not(.rif),.bib a{padding:12px 0}
.fonti-moneta li.evidenza,.bib li.evidenza,.bib li:target{background:var(--surface);outline:1px solid var(--line-2);outline-offset:4px}
.in-negozio{margin-top:18px;padding:10px 14px;border-left:3px solid var(--red);background:var(--surface);font-size:16px;line-height:1.5;color:var(--text-2)}
.in-negozio a{display:inline;padding:12px 0;white-space:nowrap}

/* prezzi */
.tabella-scorre{margin-top:20px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tabella{width:100%;min-width:300px;border-collapse:collapse;font-size:16px}
.tabella caption{text-align:left;font-family:var(--maiuscole);font-size:14px;letter-spacing:.05em;text-transform:uppercase;color:var(--gold);padding-bottom:8px;line-height:1.45}
.tabella th,.tabella td{padding:10px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tabella thead th{font-family:var(--maiuscole);font-size:14px;letter-spacing:.03em;text-transform:uppercase;color:var(--text-3);font-weight:400}
.tabella tbody th{font-weight:500}
/* telefoni: intestazioni in corsivo senza maiuscole spaziate e celle piu' strette, cosi' la tabella delle
   aste sta nello schermo dell'iPhone 16 e dell'iPhone SE (prova telefono del 19/10/2026, I1) */
@media (max-width:480px){
  .tabella thead th{font-family:var(--serif);font-style:italic;text-transform:none;letter-spacing:0;font-size:15px}
  .tabella caption{letter-spacing:0}
  .tabella th,.tabella td{padding:10px 6px}
  .tabella th:first-child,.tabella td:first-child{padding-left:0}
}

/* finale col negozio */
.finale{text-align:center;background:radial-gradient(80% 60% at 50% 0%,rgba(158,36,36,.22),rgba(158,36,36,0) 70%)}
.finale__indirizzo{font-style:normal;font-family:var(--caps);font-size:19px;line-height:1.4;color:var(--gold-lt);margin-bottom:10px}
.finale__azioni{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px!important}
.elenco-link{list-style:none;margin:0;padding:0}
.elenco-link a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid var(--line);text-decoration:none}
.elenco-link a::after{content:"→";margin-left:auto;padding-left:12px;color:var(--gold)}
.crediti p{font-size:16.5px;color:var(--text-2)}
.bib{margin:0;padding:4px 16px 12px;list-style:none;font-size:15.5px;color:var(--text-2)}
.bib li{margin:0;padding:12px 0;overflow-wrap:anywhere;scroll-margin-top:calc(var(--striscia) + 12px)}
.bib__link{list-style:none;margin:4px 0 0;padding:0}
.bib__link li{padding:0}
.bib .bib__link a{display:flex;align-items:center;min-height:44px;padding:0}
.bib__id{display:inline-block;min-width:44px;font-family:var(--caps);font-size:14px;letter-spacing:.04em;color:var(--text-3)}
.piede{padding:40px var(--g) calc(40px + env(safe-area-inset-bottom));border-top:1px solid var(--line);text-align:center;font-size:15.5px;color:var(--text-2)}
.piede p+p{margin-top:10px}
.piede__link a{display:inline-block;padding:10px 6px}
.piede__su{display:inline-flex;align-items:center;min-height:44px;padding:0 10px}
.piede__nota{color:var(--text-3)}

/* tablet */
@media (min-width:700px){
  :root{--g:28px}
  h1{font-size:40px}
  h2{font-size:30px}
  .moneta__figura,.eroe__moneta{--d:180px}
  .lati{grid-template-columns:1fr 1fr}
  .lato__titolo{cursor:default;padding-right:0}
  .lato__titolo::after{display:none}
  .dati{gap:0 18px}
  .moneta{padding:52px 0}
  .blocco,.linea,.finale{padding:52px 0}
}
/* computer */
@media (min-width:960px){
  .testata__nav{display:flex;gap:26px;margin-left:auto;margin-right:22px}
  .testata__nav a{display:inline-flex;align-items:center;min-height:44px;font-family:var(--maiuscole);font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-2);text-decoration:none}
  .testata__nav a:hover{color:var(--gold-lt)}
  .eroe{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:center;gap:56px;max-width:var(--largo);margin:0 auto;padding:56px var(--g) 72px;text-align:left;min-height:min(calc(100vh - 110px),720px)}
  .eroe__testo{display:block}
  .eroe__moneta{margin:0}
  .patto{margin:0 0 22px;max-width:36rem}
  .eroe .risposta{margin:0}
  .eroe__azioni{justify-content:flex-start}
  .eroe__moneta{--d:220px}
  .moneta__figura{--d:200px}
  h1{font-size:50px}
  .moneta__griglia{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-areas:"vista testa" "vista testo";column-gap:64px;row-gap:0}
  .moneta:nth-of-type(even) .moneta__griglia{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);grid-template-areas:"testa vista" "testo vista"}
  .lati{grid-template-columns:minmax(0,1fr)}
  .moneta__vista{position:-webkit-sticky;position:sticky;top:calc(var(--striscia) + 28px);align-self:start}
  .moneta__testa{padding-bottom:18px}
  .linea__binario{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));max-width:var(--largo);margin:28px auto 0;padding:10px var(--g) 8px;overflow:visible}
  .tappa{flex:none}
}
/* linea del tempo sul telefono e sul tablet: ogni riquadro alto quanto le sue monete (prova telefono
   del 19/10/2026, m7: prima erano tutti alti come quello di Caligola, con tre monete) */
@media (max-width:959px){
  .tappa{align-self:flex-start}
}
/* telefono in orizzontale (schermo basso): moneta e titolo affiancati, cosi' il primo schermo
   mostra anche il titolo; le monete non superano l'altezza visibile */
@media (orientation:landscape) and (max-height:520px) and (max-width:959px){
  .eroe{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:28px;max-width:var(--largo);margin:0 auto;padding:16px max(var(--g),env(safe-area-inset-right)) 32px max(var(--g),env(safe-area-inset-left));text-align:left}
  .eroe__testo{display:block}
  .eroe__moneta{order:-1;max-width:220px;align-self:start;margin:0}
  .eroe .risposta{margin:0;font-size:17px}
  .eroe__azioni{justify-content:flex-start}
  .patto{margin:0 0 16px}
  h1{font-size:28px}
  .eroe__moneta{--d:min(40vh,150px)}
  .moneta__figura{--d:min(46vh,150px)}
}
@supports (height:1svh){
  @media (orientation:landscape) and (max-height:520px) and (max-width:959px){
    .eroe__moneta{--d:min(40svh,150px)}
    .moneta__figura{--d:min(46svh,150px)}
  }
}
/* banner del consenso (solo nella versione del sito: lo crea /assets/consent.js, lo stesso delle
   altre pagine). Stesso aspetto del sito, con i pulsanti alti almeno 44 punti */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:500;background:rgba(22,18,25,.985);border-top:1px solid var(--line-2);padding:14px max(var(--g),env(safe-area-inset-right)) calc(14px + env(safe-area-inset-bottom)) max(var(--g),env(safe-area-inset-left));transform:translateY(105%);transition:transform .3s ease;box-shadow:0 -12px 40px rgba(0,0,0,.45)}
.consent.is-shown{transform:translateY(0)}
.consent [hidden]{display:none!important}
.consent__in{max-width:var(--largo);margin:0 auto;display:flex;flex-direction:column;gap:12px}
.consent__title{font-family:var(--maiuscole);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.consent__body{font-size:15px;line-height:1.5;color:var(--text-2)}
.consent__body a{display:inline-block;padding:12px 0;margin:-12px 0;color:var(--gold-lt)}
.consent__opts{display:flex;flex-direction:column;margin-top:8px}
.consent__opt{display:flex;align-items:center;gap:10px;min-height:44px;font-size:15px;color:var(--text-2);cursor:pointer}
.consent__opt input{width:20px;height:20px;accent-color:var(--gold)}
.consent__actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.consent__actions .btn{width:100%;min-height:46px;padding:0 10px;font-size:14px;letter-spacing:.06em}
.consent .btn--gold{background:var(--gold);color:#1a140c;border-color:var(--gold)}
.consent .btn--ghost{border-color:var(--line-2)}
.consent__link,.consent__actions #consentSave{grid-column:1 / -1}
.consent__link{min-height:44px;background:none;border:0;font-family:var(--maiuscole);font-size:14px;letter-spacing:.1em;text-transform:uppercase;text-decoration:underline;color:var(--text-3);cursor:pointer}
@media (max-width:719px){
  .consent{padding-top:10px;background:rgb(22,18,25)}
  .consent__in{gap:10px}
  .consent__title{display:none}
  .consent__body{font-size:15px;line-height:1.4}
  .consent__actions{grid-template-columns:1fr 1fr 1fr}
  .consent__link{grid-column:auto}
  .consent__actions .btn{min-height:44px;padding:0 6px;letter-spacing:.03em}
  .consent__link{padding:0 4px;letter-spacing:.03em}
}
/* iPhone piccoli (320 punti): il banner resta sotto un quarto dello schermo */
@media (max-width:359px){
  .consent{padding-top:8px;padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  .consent__in{gap:8px}
  .consent__body{font-size:14.5px;line-height:1.35}
}
@media (min-width:720px){
  .consent__in{flex-direction:row;align-items:flex-start;gap:28px}
  .consent__text{flex:1 1 340px;min-width:0}
  .consent__actions{display:flex;flex-wrap:wrap;align-items:center}
  .consent__actions .btn{width:auto;min-width:172px}
  .consent__link{padding:0 8px}
}
.piede__link a[data-consent-open]{white-space:nowrap}

@media (max-width:359px){
  .rif{white-space:normal}
  .lingua{padding:0 8px;letter-spacing:0}
  /* 14 pixel come tutte le scritte (19/10/2026): con meno spazio fra le lettere sta su una riga a 320 punti */
  .marchio__sotto{font-size:14px;letter-spacing:.02em}
}
/* le frasi del negozio restano intere fino al testo ingrandito al 175-200% (schermo sotto i 250
   punti): a 320 punti e al 150% «Via Cavour 280 ·» non si stacca e «Come arrivare →» resta su una riga */
@media (max-width:249px){
  .unito,.patto__prezzo,.in-negozio a{white-space:normal}
}
/* testo ingrandito al 200% (lo schermo diventa largo meno di 300 punti): la testata va a capo,
   le monete si stringono un poco, niente esce di lato */
@media (max-width:299px){
  .marchio{min-width:0}
  .marchio__sotto{white-space:normal}
  .lingua{flex:0 0 auto}
  .eroe__moneta,.moneta__figura{--d:124px}
  .dati{grid-template-columns:minmax(0,1fr)}
  .prezzo__link{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  .consent{transition:none}
  .cornice img.pronta,.punto,.lato,.striscia__contatore{transition:none}
  .palco--eroe.luce .cornice.attiva::after{animation:none}
}

/* pagina unica (19/10/2026): un solo riquadro dei prezzi, con una miniatura per riga; l'astuccio
   dentro la pagina; le serie media e piccola nelle proporzioni del pannello (le piccole sono grandi
   circa la meta' delle grandi); la foto vera fatta in negozio dove c'e' */
.prezzi{margin:22px 0 4px;padding:14px 16px 14px;border:1px solid var(--line-2);border-left:3px solid var(--red);background:var(--surface);scroll-margin-top:calc(var(--striscia) + 12px)}
.prezzi__titolo{font-family:var(--caps);font-size:22px;line-height:1.25;color:var(--gold-lt)}
.prezzi__lista{list-style:none;margin:8px 0 0;padding:0}
.prezzo{border-top:1px solid var(--line)}
.prezzo:first-child{border-top:0}
.prezzo__link{display:flex;align-items:center;gap:14px;min-height:64px;padding:6px 0;color:var(--text);text-decoration:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.prezzo__link:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px}
.prezzo__vai{flex:none;margin-left:auto;padding-left:4px;font-family:var(--serif);font-size:26px;line-height:1;color:var(--gold)}
@media (hover:hover){.prezzo__link:hover .prezzo__testo{color:var(--gold-lt)}}
/* «Vai alle schede: le grandi · le medie · le piccole» (prova telefono del 19/10/2026, I5) */
.prezzi__salta{display:flex;flex-wrap:wrap;align-items:center;column-gap:16px;margin-top:6px;font-size:16.5px;color:var(--text-2)}
.prezzi__salta-testo{flex-basis:100%;margin-bottom:-6px}
.prezzi__salta a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;color:var(--gold-lt);white-space:nowrap}
.prezzo__testo{min-width:0;font-size:17px;line-height:1.4;color:var(--text)}
.prezzo__testo strong{font-family:"Cinzel","Cinzel riserva cifre",Georgia,serif;font-weight:400;font-size:17px;letter-spacing:.03em;color:var(--gold-lt);white-space:nowrap}
.prezzo .miniatura{box-shadow:0 0 0 1px var(--line-2),0 6px 12px rgba(0,0,0,.45)}
.prezzo__moneta--piccola{flex-basis:30px;width:30px;height:30px;margin:0 11px}
.prezzo__astucci{position:relative;flex:0 0 52px;width:52px;height:52px}
.prezzo__astucci picture{position:absolute;width:38px;height:38px}
.prezzo__astucci picture:first-child{top:0;left:0}
.prezzo__astucci picture:last-child{right:0;bottom:0}
.prezzo__astucci img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 6px rgba(0,0,0,.55))}
.prezzi__dove{margin-top:10px;font-size:17px;line-height:1.45}
.prezzi__dove strong{font-weight:600;color:var(--text)}
.prezzi__banco{margin-top:6px;font-size:16.5px;color:var(--text-2)}
#astuccio{border-top:1px solid var(--line);scroll-margin-top:calc(var(--striscia) + 8px)}
.serie+.serie{border-top:1px solid var(--line)}
.serie{scroll-margin-top:var(--striscia)}
.serie__testa{padding-top:40px;padding-bottom:4px}
.serie__titolo{margin-bottom:6px}
.serie__testo{font-size:17px;color:var(--text-2)}
.moneta--media .moneta__figura{--d:116px}
.moneta--piccola .moneta__figura{--d:80px}
/* sulle piccole il pulsante tondo sta accanto alla moneta, non sopra: da 80 punti ne coprirebbe un quarto */
.moneta--piccola .gira-tondo{top:calc(26px + var(--d) / 2 - 24px);left:calc(50% + var(--d) / 2 + 14px)}
.no-js .moneta--media .palco,.fermo .moneta--media .palco{width:min(100%,272px)}
.no-js .moneta--piccola .palco,.fermo .moneta--piccola .palco{width:min(100%,192px)}
.dati--1{grid-template-columns:minmax(0,1fr)}
.dati--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.foto-vera{display:flex;align-items:center;gap:14px;margin:20px 0 4px;padding:12px;border:1px solid var(--line);background:var(--bg-2)}
.foto-vera__tondo{position:relative;flex:0 0 104px;width:104px;height:104px;border-radius:50%;overflow:hidden;background:#1d1f3e;box-shadow:0 0 0 1px var(--line-2),0 8px 18px rgba(0,0,0,.5);-webkit-mask-image:-webkit-radial-gradient(white,black)}
.foto-vera__tondo img{position:absolute;display:block;max-width:none;width:calc(100% * 50 / var(--r));height:auto;aspect-ratio:1/1;left:calc(50% - var(--cx) * 50 / var(--r) * 1%);top:calc(50% - var(--cy) * 50 / var(--r) * 1%)}
.foto-vera figcaption{min-width:0;font-size:16px;line-height:1.45;color:var(--text-2)}
.foto-vera strong{font-weight:600;color:var(--gold-lt)}
.finale__prezzi{display:inline-block;margin:-12px 0;padding:12px 4px;white-space:nowrap}
@media (max-width:359px){
  .foto-vera{flex-direction:column;text-align:center}
  /* testo ingrandito (prova telefono del 19/10/2026, I2): «5 euro in più.» va a capo e
     «CONSTANTINVS NOB CAES» non allarga i riquadri dei lati */
  .prezzo__testo strong{white-space:normal}
  .dettaglio{overflow-wrap:anywhere;min-width:0}
  .dettaglio>*{min-width:0}
}
@media (min-width:700px){
  .moneta--media .moneta__figura{--d:150px}
  .moneta--piccola .moneta__figura{--d:104px}
  .prezzi__lista{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px}
  .prezzo:nth-child(2){border-top:0}
}
@media (min-width:960px){
  .moneta--media .moneta__figura{--d:165px}
  .moneta--piccola .moneta__figura{--d:112px}
}
@media (orientation:landscape) and (max-height:520px) and (max-width:959px){
  .moneta--media .moneta__figura{--d:min(38vh,124px)}
  .moneta--piccola .moneta__figura{--d:min(27vh,86px)}
}
@supports (height:1svh){
  @media (orientation:landscape) and (max-height:520px) and (max-width:959px){
    .moneta--media .moneta__figura{--d:min(38svh,124px)}
    .moneta--piccola .moneta__figura{--d:min(27svh,86px)}
  }
}
@media (max-width:299px){
  .moneta--media .moneta__figura{--d:104px}
  .moneta--piccola .moneta__figura{--d:72px}
}
/* telefoni piccoli in orizzontale (iPhone SE, 568x320): la moneta piu' stretta e il titolo un poco piu'
   piccolo, cosi' «Vendiamo repliche» e «solo in negozio» col prezzo restano nella prima schermata */
@media (orientation:landscape) and (max-height:360px) and (max-width:959px){
  .eroe{gap:20px;padding-top:10px}
  .eroe__moneta{max-width:176px}
  .eroe__moneta{--d:min(36vh,118px)}
  .sopratitolo{margin-bottom:4px}
  h1{font-size:23px;margin-bottom:8px}
  .patto{padding:8px 12px 9px}
  .patto__vere{font-size:18.5px}
}