/* Pagina "Prova l'Editor" (it/prova-editor.php, en/try-the-editor.php): video
   delle funzioni, elenco delle funzioni da provare e riquadro con la demo
   dell'Editor, piu' largo del testo per lasciare spazio alla tavola. */
.video-prova-editor { margin: 28px 0 36px; }
.elenco-prova-editor { margin: 0 0 8px; padding-left: 22px; }
.elenco-prova-editor li { margin-bottom: 10px; line-height: 1.55; }

.sezione-demo-editor { padding: 0 0 56px; }
.contenitore-demo-editor {
    width: min(1480px, calc(100% - 48px));
    margin: 0 auto;
}
.testata-demo-editor {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}
.testata-demo-editor p { margin: 0; font-size: 14px; color: var(--testo-muto); }
.btn-ricomincia-demo {
    flex: none;
    padding: 8px 18px;
    border: 1px solid var(--bordo);
    border-radius: 999px;
    background: var(--carta);
    color: var(--testo);
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}
.btn-ricomincia-demo:hover { border-color: var(--accento-scuro); }
.riquadro-demo-editor {
    display: block;
    width: 100%;
    height: clamp(560px, calc((min(1480px, 100vw - 48px)) * 0.56), 820px);
    border: 1px solid var(--bordo);
    border-radius: 16px;
    background: var(--bg);
}
.nota-telefono-demo { display: none; }
@media (max-width: 760px) {
    .contenitore-demo-editor { width: calc(100% - 32px); }
    .testata-demo-editor { display: none; }
    .riquadro-demo-editor { display: none; }
    .nota-telefono-demo {
        display: block;
        padding: 20px;
        border: 1px solid var(--bordo);
        border-radius: 16px;
        background: var(--carta);
        text-align: center;
        color: var(--testo-muto);
    }
}