:root { --carta: #fcfbf8; --inchiostro: #16140f; --grigio: #5c5647; --tenue: #77705f; --sabbia: #f1ebe0; --filetto: #d9cfbd;
  --serif: "Newsreader", Georgia, serif; --sans: "Inter", system-ui, sans-serif; }
html, body { background: var(--carta); }
.reveal { font-family: var(--serif); font-size: 38px; color: var(--inchiostro); line-height: 1.4; }
.reveal .slides { text-align: left; }
.reveal .slides section { height: 100%; padding: 0; }
.reveal h1 { font-size: 2.4em; font-weight: 600; line-height: 1.05; margin: .15em 0 .2em; }
.reveal h2 { font-size: 1.3em; font-weight: 600; margin: 0 0 .5em; }
.reveal a { color: var(--accento); }
.reveal .kicker, .reveal .blocco-etichetta { display: block; margin: 0 0 .4em; font-family: var(--sans); font-weight: 700; font-size: .5em; letter-spacing: .08em; text-transform: uppercase; color: var(--accento); }
.reveal h2.blocco-etichetta .passo-numero { display: block; }
.reveal .passo-sep { display: none; }
.reveal section[data-blocco="passo"] > h2.blocco-etichetta { font-family: var(--serif); font-size: 1.3em; letter-spacing: 0; text-transform: none; color: var(--inchiostro); }
.reveal .passo-numero { font-family: var(--sans); font-size: .4em; letter-spacing: .08em; text-transform: uppercase; color: var(--accento); }
.reveal .sottotitolo { font-style: italic; color: var(--grigio); margin: 0 0 .8em; }
.reveal ul { margin: 0; padding-left: 1.1em; }
.reveal li { margin: .15em 0; }
.reveal .fragment { transition: opacity .2s; }

/* Solo sulla schermata corrente: reveal nasconde le altre con display: none. */
.reveal .slides section.apertura.con-reperto.present { display: grid !important; grid-template-columns: 1fr 44%; gap: 1.2em; align-items: start; }
.apertura .obiettivo { margin-top: .8em; padding-top: .4em; border-top: 2px solid var(--inchiostro); font-family: var(--sans); font-size: .72em; line-height: 1.45; }
.apertura .obiettivo p { margin: 0; }
.apertura-reperto { margin: 0; }
.apertura-reperto img { width: 100%; height: 680px; object-fit: cover; }
.apertura-reperto figcaption { font-family: var(--sans); font-size: .35em; color: var(--tenue); }

section[data-blocco="do-now"], section[data-blocco="uscita"], section[data-blocco="padronanza"] { background: var(--sabbia); padding: .8em 1em !important; box-sizing: border-box; }
.lavagna { min-height: 480px; padding: .5em .7em; border: 2px solid var(--filetto); background: #fff; white-space: pre-wrap; outline: none; font-size: .9em; }
.lavagna:focus { border-color: var(--inchiostro); }
.lavagna-pulisci { margin-top: .3em; font-family: var(--sans); font-size: .4em; background: none; border: 1px solid var(--filetto); padding: .2em .6em; cursor: pointer; opacity: 0; }
.mouse-attivo .lavagna-pulisci, .lavagna-pulisci:focus { opacity: 1; }
.reveal iframe.interattiva { display: block; width: 100%; height: 720px; border: 1px solid var(--filetto); background: #fff; }
section[data-blocco="interattivo"] iframe { width: 100%; height: 760px; border: 1px solid var(--filetto); background: #fff; }
.interattivo-apri { font-family: var(--sans); font-size: .45em; }

.quiz-domanda { font-weight: 600; margin: 0 0 .4em; }
.quiz-opzioni { list-style: none; padding: 0 !important; display: grid; gap: .3em; }
.quiz-opzione { width: 100%; text-align: left; font: inherit; font-size: .9em; padding: .3em .6em; background: #fff; color: var(--inchiostro); border: 2px solid var(--filetto); border-radius: 4px; cursor: pointer; }
.quiz-opzione.giusta { border-color: #2f6b3a; background: #e6f1e7; }
.quiz-opzione.sbagliata { border-color: #9b2c1f; background: #f7e3df; }
.quiz-esito { font-family: var(--sans); font-size: .5em; margin-top: .4em; }
.quiz-riprova { font: inherit; background: none; border: 0; padding: 0; color: var(--accento); text-decoration: underline; cursor: pointer; }

.reveal .controls, .reveal .progress, .reveal .slide-number { opacity: 0; transition: opacity .3s; }
.mouse-attivo .reveal .controls, .mouse-attivo .reveal .progress, .mouse-attivo .reveal .slide-number { opacity: 1; }
.reveal .slide-number { background: none; color: var(--tenue); font-family: var(--sans); }
.reveal .controls { color: var(--accento); }
.reveal .progress { color: var(--accento); }

/* Foto dentro i passi: a destra del testo, mai più alta della schermata. */
.reveal section:not(.apertura) img { float: right; width: auto; max-width: 36%; max-height: 470px; object-fit: contain; margin: 0 0 .4em 1em; }
.reveal h3 { font-size: 1em; font-weight: 600; margin: 0 0 .3em; }
.reveal p { margin: 0 0 .5em; }
.reveal blockquote { margin: 0 0 .5em; padding-left: .8em; border-left: 3px solid var(--filetto); }
.reveal table { font-size: .75em; border-collapse: collapse; }
.reveal th, .reveal td { padding: .2em .6em; border-bottom: 1px solid var(--filetto); text-align: left; }
/* Opzioni dei quiz in riga: tre domande entrano in una schermata. */
.quiz-opzioni { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
.reveal .quiz { margin: 0 0 .6em; }

/* Leggibilità alla LIM (indicazioni di reveal.js: poco testo per schermata, immagini grandi, frammento corrente in evidenza). */
/* Righe non più lunghe di circa 70 caratteri, anche quando la schermata non ha foto. */
.reveal section:not(.apertura) > p, .reveal section:not(.apertura) > ul, .reveal section:not(.apertura) > ol, .reveal section:not(.apertura) > blockquote { max-width: 34em; }
.reveal li { margin: .35em 0; }
/* Foto più grandi; le carte ancora di più, perché vanno lette. */
/* Il paragrafo della foto va a destra; la foto e la sua didascalia si allineano al margine destro. */
.reveal section:not(.apertura) p:has(> img) { float: right; clear: right; width: 42%; margin: 0 0 .3em 1em; text-align: right; }
.reveal section:not(.apertura) p:has(> img) img { float: none; display: inline-block; max-width: 100%; max-height: 620px; margin: 0; }
.reveal section:not(.apertura) p:has(> img[src*="/carta"]) { width: 50%; }
.reveal section:not(.apertura) p:has(> img[src*="/carta"]) img { max-height: 720px; }
/* Didascalia e crediti sotto la foto: piccoli e grigi, non concorrono con il testo. */
.reveal section:not(.apertura) p:has(> img) + p:has(> em:only-child) { float: right; clear: right; width: 42%; margin: 0 0 .8em 1em; text-align: right; font-family: var(--sans); font-size: .42em; line-height: 1.3; color: var(--tenue); }
.reveal section:not(.apertura) p:has(> img[src*="/carta"]) + p:has(> em:only-child) { width: 50%; }
.reveal section:not(.apertura) p:has(> img) + p:has(> em:only-child) em { font-style: normal; }
/* Il punto appena comparso ha il pallino nel colore della materia. */
.reveal li.fragment.current-fragment::marker { color: var(--accento); }
/* Il biglietto d'uscita raccoglie più quiz: un po' più compatto, perché ne stiano quattro in una schermata. */
section[data-blocco="uscita"] { font-size: .84em; }
section[data-blocco="uscita"] .quiz { margin: 0 0 .35em; }
section[data-blocco="uscita"] .quiz-domanda { margin: 0 0 .25em; }
section[data-blocco="uscita"] .quiz-opzione { padding: .2em .5em; }
