/* Calendario del Marketing — aggiunte a style.css (che è quello della famiglia Calendario Creativo / Scacchi).
   Regole di Simone: titoli piccoli ed equilibrati, testo nero sui colori, niente evidenziatori, niente 3D a blocchi.
   Il motivo grafico del sito è la finestra con la barra in alto, presa dalla copertina vera. */

/* titoli: principale max 50 px, sezioni max 38 px */
h1{font-size:clamp(31px,4.2vw,50px);line-height:1.1}
h2{font-size:clamp(26px,3.2vw,38px);line-height:1.12}
h3{font-size:clamp(19px,2vw,23px)}
.testo h2{font-size:clamp(25px,3vw,34px)}
.art-corpo h2{font-size:clamp(23px,2.6vw,30px)}
.mano{font-size:clamp(19px,2vw,23px)}
.sottotitolo{font-size:clamp(18px,1.9vw,22px);max-width:36em;margin-inline:auto}
.sez{padding:clamp(48px,6vw,78px) 0}
html,body{overflow-x:clip}

/* testata: marchio vero (immagine) e barra alta pervinca, il colore della copertina */
.topbar{background:var(--pervinca)}
.social a{background:var(--bianco)}
.loghi{text-decoration:none;padding:6px 0}
.marchio{display:block;height:58px;width:auto}
.footer .marchio{height:80px;margin-left:-4px}
.nav{font-size:15px;gap:0}
.nav a{padding:8px 10px}

/* divisore: una barra di caricamento in bianco e nero */
.fascia{height:22px;border-block:var(--bordo);background:repeating-linear-gradient(90deg,var(--ink) 0 16px,var(--bianco) 16px 22px)}

/* fondo a quadretti, come la copertina */
.quadretti{background-image:linear-gradient(rgba(255,255,255,.55) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(255,255,255,.55) 1.5px,transparent 1.5px);background-size:36px 36px}

.elenco-freccia li::before{content:"→";top:0;font-size:18px;font-weight:700}
.elenco-spunta{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:8px;font-size:16px}
.elenco-spunta li{padding-left:26px;position:relative}
.elenco-spunta li::before{content:"✓";position:absolute;left:0;font-weight:700}
.passi-n{list-style:none;counter-reset:passo;padding:0;margin:18px 0 0;display:grid;gap:12px}
.passi-n li{counter-increment:passo;position:relative;padding-left:44px;font-size:17px}
.passi-n li::before{content:counter(passo);position:absolute;left:0;top:-2px;width:30px;height:30px;border:var(--bordo);border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:16px;background:var(--bianco)}

/* nota "anteprima grafica" e stato */
.anteprima{font-size:14px;line-height:1.35;margin:14px 0 0;opacity:.85}
.in-arrivo{font-size:17px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 14px}
.bollo-arrivo{font-family:var(--mano);font-size:17px;line-height:1;background:var(--giallo);border:var(--bordo);border-radius:999px;padding:7px 14px;box-shadow:3px 3px 0 var(--ink)}
.tanti{font-size:15.5px;margin:18px 0 0;padding-top:14px;border-top:2px dashed var(--ink)}

/* la finestra */
.finestra{background:var(--bianco);border:var(--bordo);border-radius:14px;box-shadow:7px 7px 0 var(--ink);overflow:hidden}
.finestra-barra{display:flex;align-items:center;gap:7px;padding:9px 14px;border-bottom:var(--bordo);background:var(--giallo)}
.finestra-barra i{width:12px;height:12px;border-radius:50%;background:var(--ink);border:1.5px solid var(--ink);flex-shrink:0}
.finestra-barra i+i{background:var(--bianco)}
.finestra-barra span{font-family:var(--mano);font-size:16px;line-height:1.1;margin-left:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.finestra-corpo{padding:clamp(16px,2.6vw,26px)}

/* apertura: una finestra con dentro la copertina e quattro fogli veri, composizione piatta */
.hero-nota a{font-weight:600}

/* strappa il foglio e attaccalo al monitor */
.strappa-g{display:grid;grid-template-columns:1.1fr auto auto;gap:clamp(22px,4vw,56px);align-items:center}
.strappa-tasti{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:0}
.blocchetto{position:relative;width:clamp(200px,21vw,260px);aspect-ratio:720/1008;margin:14px 18px 18px 0;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.blocchetto::before{content:"";position:absolute;inset:0;border-radius:4px;background:var(--bianco);border:1.5px solid var(--ink);box-shadow:3px 3px 0 #fff,4.5px 4.5px 0 var(--ink),7px 7px 0 #fff,8.5px 8.5px 0 var(--ink),11px 11px 0 #fff,12.5px 12.5px 0 var(--ink),18px 20px 0 rgba(0,0,0,.16)}
.blocchetto img{position:absolute;inset:0;width:100%;height:100%;border-radius:4px;border:1.5px solid var(--ink);transform-origin:50% 0;cursor:grab;-webkit-user-drag:none}
.blocchetto img.tira{transition:none;cursor:grabbing}
.blocchetto img.torna{transition:transform .25s}
.blocchetto img.via{animation:strappo .7s cubic-bezier(.4,.1,.6,1) forwards;pointer-events:none}
@keyframes strappo{0%{transform:none;opacity:1}18%{transform:rotate(-3deg) translateY(6px)}45%{transform:rotate(6deg) translate(40px,10px)}100%{transform:rotate(14deg) translate(260px,-30px) scale(.4);opacity:0}}
.blocchetto-colla{position:absolute;left:-2px;right:-2px;top:-7px;height:15px;background:#1d1d1b;border-radius:5px 5px 2px 2px;z-index:20}
.blocchetto-fine{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:22px;text-align:center;border-radius:4px;background:var(--giallo);border:1.5px solid var(--ink)}
.blocchetto-fine p{margin:0}
.monitor{position:relative;width:clamp(250px,27vw,340px);margin:70px 26px 0;justify-self:center}
.monitor-schermo{aspect-ratio:16/11;border:12px solid #1d1d1b;border-radius:18px;background-color:var(--pervinca);background-image:linear-gradient(rgba(255,255,255,.5) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(255,255,255,.5) 1.5px,transparent 1.5px);background-size:26px 26px;display:flex;justify-content:center;align-items:flex-start;padding-top:17%}
.notifica{display:flex;flex-direction:column;gap:1px;background:var(--bianco);border:var(--bordo);border-radius:12px;padding:8px 14px 10px;width:66%;box-shadow:3px 3px 0 var(--ink)}
.notifica-app{font-size:12px;opacity:.75}
.notifica b{font-family:var(--serif);font-size:17px;line-height:1.15}
.notifica span:last-child{font-size:13.5px;line-height:1.25}
.monitor-collo{display:block;width:15%;height:26px;margin:0 auto;background:#1d1d1b}
.monitor-base{display:block;width:44%;height:12px;margin:0 auto;background:#1d1d1b;border-radius:10px 10px 2px 2px}
.monitor-fogli{position:absolute;left:0;right:0;top:0;aspect-ratio:16/11;pointer-events:none}
.monitor-fogli figure{position:absolute;width:19%;margin:0;animation:attacca .45s cubic-bezier(.3,1.4,.5,1) both}
.monitor-fogli img{border:1px solid var(--ink);border-radius:2px;box-shadow:2px 3px 0 rgba(0,0,0,.22)}
.monitor-fogli figure::before{content:"";position:absolute;left:50%;top:-5px;width:44%;height:11px;margin-left:-22%;background:rgba(255,255,255,.75);border:1px solid var(--ink);z-index:1;transform:rotate(-3deg)}
.monitor-fogli figure:nth-child(1){left:5%;top:-23%;rotate:-5deg}
.monitor-fogli figure:nth-child(2){left:40.5%;top:-27%;rotate:3deg}
.monitor-fogli figure:nth-child(3){left:76%;top:-23%;rotate:6deg}
.monitor-fogli figure:nth-child(4){left:-12%;top:27%;rotate:-8deg}
.monitor-fogli figure:nth-child(5){left:93%;top:27%;rotate:7deg}
.monitor-fogli figure:nth-child(6){left:7%;top:73%;rotate:4deg}
.monitor-fogli figure:nth-child(7){left:74%;top:73%;rotate:-4deg}
@keyframes attacca{from{opacity:0;scale:1.5}to{opacity:1;scale:1}}

/* il report dell'anno: i tipi di foglio come barre di un grafico */
.report{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(22px,4vw,54px);align-items:center;margin-top:8px}
.report-barre{display:grid;gap:4px}
.report-barre button{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:6px 14px;align-items:center;width:100%;text-align:left;padding:8px 10px;border:2px solid transparent;border-radius:10px;background:none;cursor:pointer;color:var(--ink)}
.report-barre button:hover{background:var(--beige)}
.report-barre button[aria-pressed="true"]{border-color:var(--ink);background:var(--beige)}
.barra-nome{font-family:var(--serif);font-weight:700;font-size:clamp(16px,1.6vw,18px);line-height:1.15}
.barra-riga{display:flex;align-items:center;gap:10px}
.barra-riga i{display:block;height:18px;border:1.5px solid var(--ink);border-radius:3px;background:var(--rosa);min-width:8px}
.report-barre button:nth-child(2) i{background:var(--azzurro)}
.report-barre button:nth-child(3) i{background:var(--verde)}
.report-barre button:nth-child(4) i{background:var(--giallo)}
.report-barre button:nth-child(5) i{background:var(--corallo)}
.report-barre button:nth-child(6) i{background:var(--lilla)}
.report-barre button:nth-child(7) i{background:var(--pervinca)}
.barra-riga b{font-size:16px;font-weight:700}
.report-totale{display:flex;justify-content:space-between;align-items:baseline;border-top:2px solid var(--ink);margin:10px 0 0;padding:12px 10px 0;font-family:var(--mano);font-size:19px}
.report-totale b{font-family:var(--sans);font-size:18px}
.report-lato{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center}
.report-foglio{width:clamp(150px,16vw,200px)}
.report-foglio img{border-radius:4px;border:1.5px solid var(--ink);box-shadow:8px 9px 0 rgba(0,0,0,.18);transform:rotate(2deg);transition:opacity .2s}
.report-foglio img.cambia{opacity:0}
.report-testo{font-size:17px;margin:0}

/* bingo */
.bingo-g{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(22px,4vw,54px);align-items:start}
.bingo-g>*,.strappa-g>*,.report>*,.due>*{min-width:0}
.bingo-scelta{justify-content:flex-start;gap:8px;margin:18px 0 22px}
.bingo-scelta button{background:var(--bianco);padding:7px 14px}
.bingo-foglio{margin:0;display:flex;gap:16px;align-items:center}
.bingo-foglio img{width:120px;border-radius:4px;border:1.5px solid var(--ink);box-shadow:5px 6px 0 rgba(0,0,0,.18);transform:rotate(-3deg)}
.bingo-foglio figcaption{font-size:15px;line-height:1.35}
.bingo-testo{font-size:16.5px;margin:0 0 14px;text-align:center}
.bingo-griglia{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid var(--ink);border-radius:10px;overflow:hidden}
.casella{position:relative;aspect-ratio:1/.72;border:1px solid var(--ink);background:var(--bianco);font-family:var(--mano);font-size:clamp(15px,1.7vw,19px);line-height:1.15;padding:18px 6px 8px;cursor:pointer;color:var(--ink);display:grid;place-items:center;text-align:center;transition:background .15s}
.casella::before{content:"";position:absolute;left:8px;top:8px;width:14px;height:14px;border:1.5px solid var(--ink);border-radius:3px;background:var(--bianco);font:700 12px/11px var(--sans);text-align:center}
.casella:hover{background:var(--beige)}
.casella[aria-pressed="true"]{background:var(--giallo)}
.casella[aria-pressed="true"]::before{content:"✓"}
.casella.tris{background:var(--verde)}
.bingo-esito{min-height:3em;margin:14px 0 6px;font-size:17px;text-align:center}
.bingo-esito b{font-family:var(--serif);font-size:21px;display:block}
.bingo-tasti{text-align:center;margin:0}

/* traduttore dal gergo */
.trad{max-width:860px;margin:0 auto}
.trad-lingue{display:flex;justify-content:center;align-items:center;gap:14px;font-family:var(--mano);font-size:19px;margin-bottom:14px}
.trad-lingue i{font-style:normal;font-family:var(--sans);font-weight:700}
.trad-cerca{display:flex;gap:10px;margin-bottom:12px}
.trad-cerca input{flex:1;min-width:0;font:inherit;font-size:16.5px;padding:10px 16px;border:var(--bordo);border-radius:999px;background:var(--bianco);color:var(--ink)}
.trad-parole{display:flex;flex-wrap:wrap;gap:6px;max-height:122px;overflow-y:auto;padding:4px 2px 8px;margin-bottom:6px}
.trad-parole button{font-family:var(--sans);font-weight:600;font-size:14.5px;padding:5px 12px;border-radius:999px;border:1.5px solid var(--ink);background:var(--beige);cursor:pointer;white-space:nowrap;color:var(--ink)}
.trad-parole button:hover{background:var(--giallo)}
.trad-parole button[aria-pressed="true"]{background:var(--ink);color:var(--bianco)}
.trad-vuoto{font-size:16px;margin:0 0 8px}
.trad-esito{border-top:2px dashed var(--ink);padding-top:16px;margin-top:6px}
.trad-esito h3{font-size:clamp(24px,2.8vw,31px);margin:0 0 10px}
.trad-et{font-family:var(--mano);font-size:17px;margin:0 0 2px}
.trad-esito p{font-size:17.5px;margin:0 0 12px}
.trad-esito .trad-trad{font-family:var(--serif);font-weight:700;font-size:clamp(19px,2.1vw,23px);line-height:1.25;background:var(--beige);border:var(--bordo);border-radius:12px;padding:12px 16px}
.trad-esito .trad-giorno{font-size:14px;margin:0;opacity:.85}
.trad.gira .trad-esito{animation:compare .35s}
@keyframes compare{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* quiz */
.gioco{max-width:680px;margin:0 auto;text-align:center}
.gioco-testa{display:flex;justify-content:space-between;font-size:15px;font-weight:600;border-bottom:2px dashed var(--ink);padding-bottom:10px;margin-bottom:12px}
.gioco-giorno{font-size:14px;margin:0 0 4px;opacity:.8}
.gioco h3{font-size:clamp(22px,2.4vw,27px);margin:0 0 8px}
.gioco-domanda{font-size:18px;margin:0 0 16px}
.gioco-risposte{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gioco-risposte button.scelta{font:inherit;font-size:16.5px;font-weight:500;text-align:left;padding:12px 14px;border:var(--bordo);border-radius:14px;background:var(--beige);cursor:pointer;transition:transform .15s,background .15s;display:flex;gap:10px;align-items:baseline;color:var(--ink)}
.gioco-risposte button.scelta b{font-family:var(--serif)}
.gioco-risposte button.scelta:hover:not([disabled]){background:var(--giallo);transform:translateX(3px)}
.gioco-risposte button.scelta[disabled]{cursor:default;opacity:.7}
.gioco-risposte button.scelta.giusta{background:var(--verde);opacity:1}
.gioco-risposte button.scelta.sbagliata{background:var(--corallo);opacity:1}
.gioco-risposte .btn{grid-column:1/-1;justify-self:center}
.gioco-soluzione{font-size:13.5px;margin:16px 0 0;opacity:.85}
.gioco-soluzione.dritta{transform:none}
.gioco-esito{min-height:1.5em;margin:10px 0 0;font-size:17px}
.gioco-esito b{font-family:var(--serif);font-size:20px}

/* pagina regalo: tre fogli per mestiere */
.ruoli{max-width:940px;margin:0 auto}
.ruoli .filtri{gap:8px;margin-bottom:22px}
.ruoli .filtri button{background:var(--bianco)}
.ruoli .filtri button[aria-pressed="true"]{background:var(--ink);color:var(--bianco)}
.ruoli-corpo{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(20px,4vw,44px);align-items:center;background:var(--bianco);border:var(--bordo);border-radius:var(--r);box-shadow:7px 7px 0 var(--ink);padding:clamp(18px,3vw,30px)}
.ruoli-testo{font-size:18px;margin:0}
.ruoli-fogli{display:flex;gap:clamp(8px,1.6vw,16px);justify-content:center}
.ruoli-fogli figure{margin:0;flex:1;max-width:170px;text-align:center}
.ruoli-fogli img{border-radius:4px;border:1.5px solid var(--ink);box-shadow:5px 6px 0 rgba(0,0,0,.18)}
.ruoli-fogli figure:nth-child(1) img{transform:rotate(-3deg)}
.ruoli-fogli figure:nth-child(3) img{transform:rotate(3deg)}
.ruoli-fogli figcaption{font-size:13px;margin-top:10px;line-height:1.25}
.ruoli-fogli.cambia{opacity:0}
.ruoli-fogli{transition:opacity .2s}

/* pagina aziende: conta le scrivanie */
.conta-finestra{margin-top:22px;max-width:440px}
.conta-riga{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 10px;font-size:17px;font-weight:600}
.conta .qta{display:inline-flex;align-items:center}
.conta .qta input{width:62px;height:42px;text-align:center;font:inherit;font-weight:700;border:0;border-block:var(--bordo);background:var(--bianco);color:var(--ink);-moz-appearance:textfield;appearance:textfield;border-radius:0;padding:0}
.conta .qta input::-webkit-outer-spin-button,.conta .qta input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.conta-totale{display:flex;justify-content:space-between;align-items:baseline;border-top:2px solid var(--ink);padding-top:12px;margin:14px 0 6px;font-family:var(--mano);font-size:20px}
.conta-totale b{font-family:var(--serif);font-size:30px;line-height:1}
.conta-nota{font-size:14.5px;margin:0 0 14px;min-height:2.6em}
.conta p:last-child{margin:0}

/* schede con un foglio vero in testa */
.card.con-foglio{padding-top:0;overflow:hidden}
.card-foglio{margin:0 -12px;border-bottom:var(--bordo);background:var(--beige);display:flex;justify-content:center;align-items:center;padding:20px 0 22px}
.card-foglio img{width:150px;height:auto;max-width:60%;border:1.5px solid var(--ink);border-radius:4px;transform:rotate(-3deg);box-shadow:5px 6px 0 rgba(0,0,0,.16)}
.tre .card h3{font-size:21px;margin:16px 8px 8px}
.tre .card p{font-size:16.5px;margin-inline:8px}
.tre .card.con-foglio p{margin-bottom:18px}
.tre .card.con-foglio .btn{margin:auto auto 0 8px}
.card .numero{font-family:var(--serif);font-weight:900;font-size:34px;line-height:1;display:grid;place-items:center;min-width:84px;height:84px;padding:0 14px;border:var(--bordo);border-radius:999px;background:var(--giallo);margin:10px 0 0 8px;align-self:flex-start}

/* composizioni piatte con copertina e fogli veri */
.composizione{position:relative;width:min(400px,100%);aspect-ratio:1/1.14;margin:0 auto}
.composizione img{position:absolute;border-radius:5px;border:1.5px solid var(--ink);box-shadow:6px 7px 0 rgba(0,0,0,.18);height:auto}
.composizione .c-fronte{width:50%;left:8%;top:6%;transform:rotate(-5deg);box-shadow:9px 10px 0 rgba(0,0,0,.2)}
.composizione .c-retro{width:44%;left:50%;top:2%;transform:rotate(7deg)}
.composizione .c-f1{width:36%;left:56%;top:33%;transform:rotate(12deg)}
.composizione .c-f2{width:36%;left:30%;top:39%;transform:rotate(-8deg)}
.composizione .anteprima{position:absolute;left:0;right:0;bottom:-4px;text-align:center;margin:0}
.composizione.piccola{width:min(420px,100%);aspect-ratio:1/.86}
.composizione.piccola .c-fronte{width:44%;left:28%;top:4%;transform:rotate(-3deg);z-index:2}
.composizione.piccola .c-f1{width:34%;left:1%;top:20%;transform:rotate(-9deg)}
.composizione.piccola .c-f2{width:34%;left:65%;top:20%;transform:rotate(9deg)}
.scheda-tecnica{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.scheda-tecnica li{display:grid;gap:4px 12px;background:var(--bianco);border:var(--bordo);border-radius:12px;padding:10px 16px;font-size:16px}
.scheda-tecnica li b{font-family:var(--serif);font-size:17px}
.intro-fogli{display:flex;justify-content:center;gap:0;padding:10px 0}
.intro-fogli img{width:46%;max-width:230px;border-radius:5px;border:1.5px solid var(--ink);box-shadow:6px 7px 0 rgba(0,0,0,.18)}
.intro-fogli img:first-child{transform:rotate(-5deg) translateX(8%)}
.intro-fogli img:last-child{transform:rotate(5deg) translate(-8%,7%)}
.foglio-solo{width:min(280px,70%);margin:0 auto;border-radius:5px;border:1.5px solid var(--ink);box-shadow:9px 10px 0 rgba(0,0,0,.18);transform:rotate(3deg)}
.misure{list-style:none;padding:0;margin:16px 0;display:grid;gap:8px}
.misure li{display:grid;grid-template-columns:118px 1fr;gap:12px;align-items:baseline;background:var(--bianco);border:var(--bordo);border-radius:12px;padding:9px 16px;font-size:16px}
.misure b{font-family:var(--serif);font-size:18px}

/* scheda prodotto */
.scheda .info h1{font-size:clamp(28px,3.4vw,40px)}
.riquadro .modulo .campi{grid-template-columns:1fr}
.rec footer{font-weight:500}

/* blog: indice, fogli veri, fonti */
.art-indice{background:var(--bianco);border:var(--bordo);border-radius:14px;padding:16px 20px;margin:1.4em 0;font-size:17px}
.art-indice b{font-family:var(--serif);font-size:19px}
.art-indice ol{margin:8px 0 0;padding-left:1.3em}
.art-indice li{margin-bottom:.25em}
.art-fogli{margin:1.8em 0;text-align:center}
.art-fogli div{display:flex;justify-content:center;gap:clamp(8px,2vw,18px);flex-wrap:wrap}
.art-fogli img{border-radius:4px;border:1.5px solid var(--ink);box-shadow:6px 7px 0 rgba(0,0,0,.16);width:min(300px,78%)}
.art-fogli.n2 img{width:min(220px,44%)}
.art-fogli.n3 img{width:min(200px,30%)}
.art-fogli.n3 img:nth-child(1),.art-fogli.n2 img:nth-child(1){transform:rotate(-2deg)}
.art-fogli.n3 img:nth-child(3),.art-fogli.n2 img:nth-child(2){transform:rotate(2deg)}
.art-fogli figcaption{font-size:15px;margin-top:16px;opacity:.85}
.art-corpo table{width:100%;border-collapse:collapse;margin:0 0 1.2em;font-size:16.5px;background:var(--bianco);border:var(--bordo);border-radius:12px;overflow:hidden;display:table}
.art-corpo .tab-scorri{overflow-x:auto;margin:0 0 1.2em}
.art-corpo .tab-scorri table{margin:0;min-width:520px}
.art-corpo th,.art-corpo td{text-align:left;padding:9px 12px;border-bottom:1px solid rgba(0,0,0,.18);vertical-align:top}
.art-corpo th{font-family:var(--serif);background:var(--giallo)}
.art-corpo tr:last-child td{border-bottom:0}
.art-corpo blockquote{margin:1.2em 0;padding:14px 20px;background:var(--bianco);border:var(--bordo);border-radius:14px;font-family:var(--serif);font-size:20px;line-height:1.4}
.art-corpo blockquote p{margin:0}
.art-corpo blockquote small{display:block;font-family:var(--sans);font-size:15px;margin-top:6px}
.art-corpo pre,.art-corpo code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em}
.art-corpo pre{background:var(--bianco);border:var(--bordo);border-radius:12px;padding:14px 16px;overflow-x:auto;white-space:pre-wrap;word-break:break-word}
.art-cta{grid-template-columns:120px 1fr}
.art-cta img{border-radius:5px}
.art-cta .btn{margin:0 8px 8px 0}
.art-fonti{margin-top:2.2em;font-size:15.5px;border-top:2px dashed var(--ink);padding-top:6px}
.art-fonti h2{font-size:21px!important;margin-top:.8em}
.art-fonti a{word-break:break-word}

.footer .famiglia{margin-top:6px}
.fissa .wrap{flex-wrap:nowrap}
.tre .art-card p{margin:0 0 16px}

@media (max-width:1180px){
  .nav{font-size:14.5px}.nav a{padding:8px 8px}
}
@media (max-width:1060px){
  .marchio{height:50px}
  .nav{font-size:16px}
  .strappa-g{grid-template-columns:1fr auto;grid-template-areas:"t b" "m m"}
  .strappa-testo{grid-area:t}.blocchetto{grid-area:b}.monitor{grid-area:m;margin-top:80px}
  .report-lato{grid-template-columns:1fr;justify-items:center;text-align:center}
}
@media (max-width:760px){
  .marchio{height:44px}
  .strappa-g{grid-template-columns:1fr;grid-template-areas:"t" "b" "m"}
  .blocchetto{width:min(230px,64%);margin:26px auto 18px}
  .monitor{width:min(290px,74%);margin:74px auto 0}
  .notifica b{font-size:15.5px}.notifica span:last-child{font-size:12.5px}.notifica{width:70%;padding:6px 10px 8px}
  .report{grid-template-columns:1fr;gap:26px}
  .report-barre button{grid-template-columns:1fr;gap:4px;padding:7px 8px}
  .report-lato{grid-template-columns:auto 1fr;text-align:left;gap:16px;justify-items:start}
  .report-foglio{width:130px}
  .report-testo{font-size:16px}
  .bingo-g{grid-template-columns:1fr}
  .bingo-foglio img{width:92px}
  .casella{aspect-ratio:1/.86;font-size:14.5px;padding:18px 3px 6px}
  .casella::before{left:6px;top:6px;width:12px;height:12px;font-size:10px;line-height:9px}
  .finestra-corpo{padding:14px}
  .trad-cerca{flex-wrap:wrap}.trad-cerca input{flex-basis:100%}
  .trad-parole{max-height:150px}
  .gioco-risposte{grid-template-columns:1fr}
  .ruoli-corpo{grid-template-columns:1fr}
  .composizione{width:min(320px,94%)}
  .composizione.piccola{width:min(330px,92%)}
  .art-corpo table{font-size:15px}
  .art-corpo th,.art-corpo td{padding:8px 10px}
  .art-corpo .tab-scorri table{min-width:0}
  .art-corpo .tab-scorri table:not(:has(th:nth-child(4))){table-layout:fixed}
  .art-corpo td,.art-corpo th{overflow-wrap:anywhere}
  .art-corpo .tab-scorri table:has(th:nth-child(4)){min-width:520px}
  .art-cta{grid-template-columns:1fr}
  .art-cta img{max-width:110px}
  .footer .marchio{height:66px}
  .intro-fogli img{max-width:170px}
  .misure li{grid-template-columns:1fr;gap:2px}
  .topbar span{font-size:13.5px}
  .conta-finestra{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .blocchetto img.via{animation-duration:.01s}
  .monitor-fogli figure,.trad.gira .trad-esito{animation:none}
  .gioco-soluzione,.ruoli-fogli{transition:none}
}
.riquadro .elenco-spunta{margin-top:22px}

/* schede degli articoli: titolo, etichetta e testo sullo stesso filo a sinistra */
.tre .art-card h2,.tre .art-card h3{margin:4px 0 8px}

/* ------------------------------------------------------------------ negozio, preordine, mockup 3D (aggiunte dell'11 ottobre 2026) */
/* modello 3D: è quello del sito degli Scacchi, regole in style.css. Qui solo il retro della base con il logo inciso (foto vera), come là */
.pannello>.k{background:url("../img/base_retro.jpg") center/100% 100% no-repeat}
/* preordine */
.pre-box{background:var(--bianco);border:var(--bordo);border-radius:12px;padding:10px 14px;font-size:16px;margin:0 0 16px}
.pre-box b{display:inline-block;font-family:var(--mano);font-weight:400;font-size:17px;line-height:1;background:var(--giallo);border:1.5px solid var(--ink);border-radius:999px;padding:5px 12px;margin-right:6px}
.centro-box{max-width:720px;margin:0 auto 26px;text-align:left}
.card .prezzo del,.hero-prezzo del{font-weight:400;font-size:.8em;margin-right:4px}
.card .bollo{font-size:15px}
.riquadro .elenco-spunta{margin-top:18px}
.galleria .anteprima{margin:12px 0 0}
/* carrello: preordine e pagamento in attivazione */
.cassetto .pre-nota{background:var(--giallo);border:1.5px solid var(--ink);border-radius:10px;padding:8px 12px;font-size:14px;margin:0 0 12px;text-align:left}
.cassetto .paga-avviso{background:var(--bianco);border:var(--bordo);border-radius:10px;padding:10px 12px;font-size:14px;margin:12px 0 0;text-align:left}
.cassetto .paga-avviso[hidden],.cassetto .pre-nota[hidden]{display:none}
.cassetto .paga-avviso.scuoti{animation:scuoti .3s 2}
#paga.spento{background:var(--beige);color:var(--ink);cursor:not-allowed;box-shadow:none;border-style:dashed}
.riga .dx del{display:block;font-size:13px;font-weight:400}
@media (prefers-reduced-motion:reduce){.modello.gira{animation:none}}
.card h2{font-size:20px;margin:16px 4px 6px}
.card h2 a{text-decoration:none}
#g-cor,#g-regalo{margin-top:30px}
@media (max-width:760px){.card h2{font-size:17px;margin:12px 2px 6px}}
/* negozio con pochi prodotti: le schede stanno al centro */
@media (min-width:761px){.griglia.pochi{grid-template-columns:repeat(auto-fit,minmax(0,270px));justify-content:center}}

/* ------------------------------------------------------------------ revisione del 12 ottobre 2026 */
/* apertura delle pagine regalo e aziende: quella della home, con il suo colore */
.hero.b-lilla{background:var(--lilla)}.hero.b-verde{background:var(--verde)}
.hero-cta .btn{margin:0}
.nota-sotto{font-size:16.5px;margin:28px 0 0}
/* moduli: i campi di una riga restano allineati anche se un'etichetta va a capo */
.modulo .campo{justify-content:flex-end}
.due.modulo-largo{grid-template-columns:1fr 1.1fr;align-items:start}
@media (max-width:1060px){.due.modulo-largo{grid-template-columns:1fr}}
.unito{white-space:nowrap}
@media (max-width:760px){
  .card .numero{font-size:27px;min-width:62px;height:62px;margin-top:6px}
  .tre .card h3{margin-top:12px}
  .card-foglio img{width:124px}
  .solo-largo{display:none}
  /* tre prodotti su due colonne: il terzo non resta solo a sinistra, va al centro */
  .griglia.pochi>.card:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 7px)}
}
/* finché il banner dei cookie è aperto la barra fissa non gli passa sotto */
body:has(.cookie) .fissa{display:none}
.centro-box{max-width:800px}
/* tabelle a quattro colonne su telefono: scorrono di lato, quindi le parole non si spezzano a metà e data e giorno restano su una riga */
@media (max-width:760px){
  .art-corpo .tab-scorri table:has(th:nth-child(4)){min-width:640px}
  .art-corpo .tab-scorri table:has(th:nth-child(4)) :is(td,th){overflow-wrap:normal}
  .art-corpo .tab-scorri table:has(th:nth-child(4)) :is(td,th):nth-child(-n+2){white-space:nowrap}
}
@media (max-width:760px){.art-corpo td{hyphens:auto;-webkit-hyphens:auto}}

/* GEO, 12 ottobre 2026: riquadro "In breve" degli articoli (se c'è), paragrafo dei fatti, riga su chi c'è dietro nel footer, tre tendine in scheda */
.art-breve{background:var(--bianco);border:var(--bordo);border-radius:14px;padding:14px 20px;margin:0 0 1.4em}
.art-breve b{font-family:var(--serif);font-size:19px;display:block;margin-bottom:4px}
.art-breve p{margin:0;font-size:17px}
.fatti{margin:18px 0 0;font-size:17px}
.footer .dietro{font-size:14.5px;margin:30px 0 0;opacity:.9}
.piu+.piu:not(:last-of-type){border-bottom:0}
