Modulo 7 – Laboratorio Pratico | Autonomia Portami Via<\/title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n body { font-family: 'Segoe UI', sans-serif; background: linear-gradient(135deg, #f2994a, #f2c94c); min-height: 100vh; padding: 20px; line-height: 1.6; }\n .container { max-width: 900px; margin: 0 auto; }\n .header { background: white; border-radius: 20px; padding: 30px; text-align: center; margin-bottom: 20px; }\n .header h1 { color: #f2994a; }\n .module-badge { display: inline-block; background: linear-gradient(135deg, #f2994a, #f2c94c); color: white; padding: 8px 20px; border-radius: 20px; font-weight: bold; margin-bottom: 15px; }\n .tabs { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }\n .tab { flex: 1; min-width: 140px; padding: 15px; background: white; border: none; border-radius: 15px; cursor: pointer; font-weight: bold; color: #f2994a; }\n .tab.active { background: linear-gradient(135deg, #f2994a, #f2c94c); color: white; }\n .content-section { background: white; border-radius: 20px; padding: 30px; display: none; }\n .content-section.active { display: block; }\n .lesson-card { background: #fff8e1; border-radius: 15px; padding: 25px; margin-bottom: 20px; border-left: 5px solid #f2994a; }\n .lesson-card h3 { color: #f2994a; margin-bottom: 15px; }\n .highlight-box { background: #fff3cd; border-radius: 10px; padding: 20px; margin: 15px 0; border-left: 4px solid #ffc107; }\n .highlight-box.tip { background: #d4edda; border-left-color: #28a745; }\n .highlight-box.warning { background: #f8d7da; border-left-color: #dc3545; }\n h2 { color: #f2994a; margin: 25px 0 15px 0; }\n ul { margin-left: 25px; margin-bottom: 15px; }\n li { margin-bottom: 8px; }\n .sim-box { background: #fff8e1; border-radius: 15px; padding: 25px; margin: 20px 0; }\n .sim-month { display: flex; justify-content: space-between; align-items: center; padding: 15px; background: white; border-radius: 10px; margin: 10px 0; }\n .sim-month .label { font-weight: bold; }\n .sim-month input { width: 100px; padding: 8px; border: 2px solid #ddd; border-radius: 8px; text-align: center; }\n .sim-result { background: linear-gradient(135deg, #f2994a, #f2c94c); color: white; border-radius: 15px; padding: 25px; text-align: center; margin-top: 20px; }\n .sim-result .big { font-size: 2.5em; font-weight: bold; }\n .checklist { margin: 20px 0; }\n .check-item { display: flex; align-items: center; gap: 15px; padding: 15px; background: #f5f5f5; border-radius: 10px; margin: 10px 0; cursor: pointer; transition: all 0.3s; }\n .check-item:hover { background: #fff8e1; }\n .check-item.done { background: #d4edda; }\n .check-item .box { width: 30px; height: 30px; border: 3px solid #f2994a; border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 1.2em; }\n .check-item.done .box { background: #28a745; border-color: #28a745; color: white; }\n .project-card { background: white; border-radius: 15px; padding: 20px; margin: 15px 0; border: 2px solid #f2994a; }\n .project-card h4 { color: #f2994a; margin-bottom: 10px; }\n .progress-bar { width: 100%; height: 20px; background: #e0e0e0; border-radius: 10px; margin: 20px 0; overflow: hidden; }\n .progress-fill { height: 100%; background: linear-gradient(90deg, #f2994a, #f2c94c); border-radius: 10px; transition: width 0.5s; display: flex; align-items: center; justify-content: center; color: white; font-weight: bold; }\n .btn { padding: 12px 30px; border: none; border-radius: 10px; font-weight: bold; cursor: pointer; background: linear-gradient(135deg, #f2994a, #f2c94c); color: white; }\n .final-box { background: linear-gradient(135deg, #f2994a, #f2c94c); border-radius: 20px; padding: 30px; text-align: center; color: white; margin: 20px 0; }\n .badge { display: inline-block; background: white; color: #f2994a; padding: 10px 25px; border-radius: 25px; font-weight: bold; margin: 10px; }\n .apartment-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; margin: 20px 0; }\n .apartment-item { background: white; border-radius: 10px; padding: 15px; text-align: center; border: 2px solid #ddd; transition: all 0.3s; }\n .apartment-item:hover { border-color: #f2994a; }\n .apartment-item .icon { font-size: 2em; margin-bottom: 10px; }\n .apartment-item .cost { color: #f2994a; font-weight: bold; font-size: 1.2em; }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <div class=\"header\">\n <div class=\"module-badge\">📚 MODULO 7 – 10 ORE<\/div>\n <h1>🎯 Laboratorio Pratico<\/h1>\n <p>Metti in pratica tutto quello che hai imparato!<\/p>\n <\/div>\n \n <div class=\"tabs\">\n <button class=\"tab active\" onclick=\"showSection('intro')\">📖 Introduzione<\/button>\n <button class=\"tab\" onclick=\"showSection('casa')\">🏠 Vita Autonoma<\/button>\n <button class=\"tab\" onclick=\"showSection('budget')\">💰 Budget Casa<\/button>\n <button class=\"tab\" onclick=\"showSection('checklist')\">✅ Checklist<\/button>\n <button class=\"tab\" onclick=\"showSection('finale')\">🎓 Finale<\/button>\n <\/div>\n \n \n <div id=\"intro\" class=\"content-section active\">\n <h2>🎯 Il Modulo Finale<\/h2>\n <p>Questo \u00e8 il momento di mettere insieme tutto quello che hai imparato! Simuleremo situazioni reali di vita autonoma.<\/p>\n \n <div class=\"lesson-card\">\n <h3>🏠 Cosa significa vivere da soli?<\/h3>\n <p>Vivere in autonomia significa prendersi cura di s\u00e9 stessi in tutto:<\/p>\n <ul>\n <li><strong>Casa<\/strong> – trovare alloggio, pagare affitto e bollette<\/li>\n <li><strong>Soldi<\/strong> – gestire budget, risparmiare<\/li>\n <li><strong>Documenti<\/strong> – contratti, burocrazia<\/li>\n <li><strong>Salute<\/strong> – medico, alimentazione<\/li>\n <li><strong>Relazioni<\/strong> – comunicare, chiedere aiuto<\/li>\n <\/ul>\n <\/div>\n \n <div class=\"lesson-card\">\n <h3>💡 Cosa faremo<\/h3>\n <ul>\n <li>Simulazione: gestire un mese di vita autonoma<\/li>\n <li>Calcolare il budget per una casa<\/li>\n <li>Checklist delle cose da sapere<\/li>\n <li>Riflessione finale sul percorso<\/li>\n <\/ul>\n <\/div>\n \n <div class=\"highlight-box tip\">\n <h4>🌟 Ricorda<\/h4>\n <p>Nessuno nasce sapendo fare tutto! L’importante \u00e8 sapere DOVE cercare aiuto e non aver paura di chiedere.<\/p>\n <\/div>\n <\/div>\n \n \n <div id=\"casa\" class=\"content-section\">\n <h2>🏠 Costi della Vita Autonoma<\/h2>\n <p>Quanto costa vivere da soli? Scopriamolo insieme!<\/p>\n \n <div class=\"apartment-grid\">\n <div class=\"apartment-item\">\n <div class=\"icon\">🏠<\/div>\n <h4>Affitto<\/h4>\n <p>Stanza singola o monolocale<\/p>\n <div class=\"cost\">\u20ac300-600\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">💡<\/div>\n <h4>Bollette<\/h4>\n <p>Luce, gas, acqua, wifi<\/p>\n <div class=\"cost\">\u20ac100-150\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">🍕<\/div>\n <h4>Cibo<\/h4>\n <p>Spesa e qualche uscita<\/p>\n <div class=\"cost\">\u20ac200-300\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">🚌<\/div>\n <h4>Trasporti<\/h4>\n <p>Abbonamento mezzi<\/p>\n <div class=\"cost\">\u20ac35-50\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">📱<\/div>\n <h4>Telefono<\/h4>\n <p>Piano mobile<\/p>\n <div class=\"cost\">\u20ac10-20\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">🎉<\/div>\n <h4>Svago<\/h4>\n <p>Uscite, hobby<\/p>\n <div class=\"cost\">\u20ac50-100\/mese<\/div>\n <\/div>\n <\/div>\n \n <div class=\"highlight-box warning\">\n <h4>⚠️ Il conto totale<\/h4>\n <p>Vivere da soli costa circa <strong>\u20ac800-1200 al mese<\/strong> (dipende dalla citt\u00e0 e dallo stile di vita).<\/p>\n <p>Per vivere tranquilli, il tuo stipendio dovrebbe essere ALMENO \u20ac1000-1300 netti.<\/p>\n <\/div>\n \n <div class=\"highlight-box tip\">\n <h4>💡 Consigli per risparmiare<\/h4>\n <ul>\n <li>Condividi casa con coinquilini<\/li>\n <li>Cucina a casa invece di mangiare fuori<\/li>\n <li>Confronta le offerte di luce e gas<\/li>\n <li>Usa i mezzi pubblici<\/li>\n <\/ul>\n <\/div>\n <\/div>\n \n \n <div id=\"budget\" class=\"content-section\">\n <h2>💰 Simula il Tuo Budget Mensile<\/h2>\n <p>Immagina di avere uno stipendio. Riesci a far quadrare i conti?<\/p>\n \n <div class=\"sim-box\">\n <div class=\"sim-month\">\n <span class=\"label\">💵 Il tuo stipendio (netto)<\/span>\n <input type=\"number\" id=\"stipendio\" value=\"1200\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n \n <h4 style=\"margin: 20px 0 10px; color: #f2994a;\">Spese fisse:<\/h4>\n \n <div class=\"sim-month\">\n <span class=\"label\">🏠 Affitto<\/span>\n <input type=\"number\" id=\"affitto\" value=\"400\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">💡 Bollette (luce, gas, wifi)<\/span>\n <input type=\"number\" id=\"bollette\" value=\"100\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">🍕 Cibo e spesa<\/span>\n <input type=\"number\" id=\"cibo\" value=\"200\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">🚌 Trasporti<\/span>\n <input type=\"number\" id=\"trasporti\" value=\"40\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">📱 Telefono<\/span>\n <input type=\"number\" id=\"telefono\" value=\"15\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">🎉 Svago e uscite<\/span>\n <input type=\"number\" id=\"svago\" value=\"80\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">🐷 Risparmio<\/span>\n <input type=\"number\" id=\"risparmio\" value=\"100\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <\/div>\n \n <div id=\"budget-result\" class=\"sim-result\">\n <p>Ti rimangono:<\/p>\n <div class=\"big\" id=\"rimanente\">\u20ac265<\/div>\n <p id=\"budget-msg\">Ottimo! Stai gestendo bene il budget.<\/p>\n <\/div>\n <\/div>\n \n \n <div id=\"checklist\" class=\"content-section\">\n <h2>✅ Checklist dell’Autonomia<\/h2>\n <p>Quante di queste cose sai fare? Clicca su quelle che hai imparato!<\/p>\n \n <div class=\"checklist\" id=\"checklist-items\">\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So fare un budget mensile<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So leggere un contratto di lavoro<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So dove andare per fare la carta d’identit\u00e0<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So come funziona il medico di base<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>Conosco i miei diritti come consumatore<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So riconoscere una fake news<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So proteggere la mia privacy online<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So gestire le mie emozioni<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So comunicare in modo assertivo<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So dove chiedere aiuto se ho bisogno<\/span><\/div>\n <\/div>\n \n <div class=\"progress-bar\">\n <div class=\"progress-fill\" id=\"check-progress\" style=\"width: 0%\">0%<\/div>\n <\/div>\n \n <div id=\"check-msg\" class=\"highlight-box\" style=\"display:none\"><\/div>\n <\/div>\n \n \n <div id=\"finale\" class=\"content-section\">\n <h2>🎓 Complimenti!<\/h2>\n \n <div class=\"final-box\">\n <h3 style=\"font-size: 2em; margin-bottom: 20px;\">🌟 Ce l’hai fatta! 🌟<\/h3>\n <p style=\"font-size: 1.2em;\">Hai completato il corso “Autonomia Portami Via”!<\/p>\n \n <div style=\"margin: 30px 0;\">\n <p>Hai acquisito competenze in:<\/p>\n <div class=\"badge\">💰 Finanza<\/div>\n <div class=\"badge\">🗺️ Territorio<\/div>\n <div class=\"badge\">🏛️ Civica<\/div>\n <div class=\"badge\">⚖️ Legalit\u00e0<\/div>\n <div class=\"badge\">📱 Digitale<\/div>\n <div class=\"badge\">💝 Emozioni<\/div>\n <\/div>\n <\/div>\n \n <div class=\"lesson-card\">\n <h3>📝 Rifletti sul tuo percorso<\/h3>\n <p>Prenditi un momento per pensare:<\/p>\n <ul>\n <li>Qual \u00e8 stata la cosa pi\u00f9 utile che hai imparato?<\/li>\n <li>Cosa ti ha sorpreso di pi\u00f9?<\/li>\n <li>Su cosa vorresti approfondire?<\/li>\n <li>Come userai queste competenze nella tua vita?<\/li>\n <\/ul>\n <\/div>\n \n <div class=\"highlight-box tip\">\n <h4>🚀 Il futuro \u00e8 tuo!<\/h4>\n <p>Ricorda: l’autonomia non si impara in un giorno. \u00c8 un percorso fatto di piccoli passi. Ogni volta che affronti una situazione nuova, impari qualcosa.<\/p>\n <p><strong>Non aver paura di sbagliare. Non aver paura di chiedere aiuto. Ce la puoi fare!<\/strong><\/p>\n <\/div>\n \n <div style=\"text-align: center; margin-top: 30px;\">\n <p style=\"font-size: 3em;\">🎉🎓🌟<\/p>\n <h3 style=\"color: #f2994a;\">IN BOCCA AL LUPO PER IL TUO FUTURO!<\/h3>\n <\/div>\n <\/div>\n <\/div>\n \n <script>\n function showSection(id) {\n document.querySelectorAll('.content-section').forEach(s => s.classList.remove('active'));\n document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));\n document.getElementById(id).classList.add('active');\n event.target.classList.add('active');\n }\n \n function calcBudget() {\n const stipendio = parseInt(document.getElementById('stipendio').value) || 0;\n const spese = ['affitto', 'bollette', 'cibo', 'trasporti', 'telefono', 'svago', 'risparmio']\n .reduce((sum, id) => sum + (parseInt(document.getElementById(id).value) || 0), 0);\n \n const rimanente = stipendio - spese;\n document.getElementById('rimanente').textContent = '\u20ac' + rimanente;\n \n const msg = document.getElementById('budget-msg');\n const box = document.getElementById('budget-result');\n \n if (rimanente < 0) {\n msg.textContent = '⚠️ Attenzione! Spendi pi\u00f9 di quello che guadagni!';\n box.style.background = 'linear-gradient(135deg, #dc3545, #c82333)';\n } else if (rimanente < 50) {\n msg.textContent = '😰 Sei al limite! Cerca di ridurre qualche spesa.';\n box.style.background = 'linear-gradient(135deg, #ffc107, #e0a800)';\n } else {\n msg.textContent = '✅ Ottimo! Stai gestendo bene il budget.';\n box.style.background = 'linear-gradient(135deg, #28a745, #218838)';\n }\n }\n \n let checkedItems = 0;\n function toggleItem(el) {\n el.classList.toggle('done');\n const box = el.querySelector('.box');\n if (el.classList.contains('done')) {\n box.textContent = '\u2713';\n checkedItems++;\n } else {\n box.textContent = '';\n checkedItems--;\n }\n \n const total = document.querySelectorAll('.check-item').length;\n const percent = Math.round((checkedItems \/ total) * 100);\n document.getElementById('check-progress').style.width = percent + '%';\n document.getElementById('check-progress').textContent = percent + '%';\n \n const msg = document.getElementById('check-msg');\n if (percent >= 80) {\n msg.innerHTML = '<h4>🎉 Fantastico!<\/h4><p>Hai acquisito la maggior parte delle competenze. Sei pronto per l\\'autonomia!<\/p>';\n msg.className = 'highlight-box tip';\n msg.style.display = 'block';\n } else if (percent >= 50) {\n msg.innerHTML = '<h4>👍 Buon lavoro!<\/h4><p>Stai facendo progressi. Continua a imparare!<\/p>';\n msg.className = 'highlight-box';\n msg.style.display = 'block';\n } else {\n msg.style.display = 'none';\n }\n }\n \n calcBudget();\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Modulo 7 – Laboratorio Pratico | Autonomia Portami Via 📚 MODULO 7 – 10 ORE 🎯 Laboratorio Pratico Metti in pratica tutto quello che hai imparato! 📖 Introduzione 🏠 Vita Autonoma 💰 Budget Casa ✅ Checklist 🎓 Finale 🎯 Il Modulo Finale Questo \u00e8 il momento di mettere insieme tutto quello che hai imparato! Simuleremo … <a title=\"Laboratorio Pratico\" class=\"read-more\" href=\"https:\/\/studikis.it\/?p=53\" aria-label=\"Read more about Laboratorio Pratico\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-53","post","type-post","status-publish","format-standard","hentry","category-corsimarzogiugno26"],"_links":{"self":[{"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/posts\/53","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/studikis.it\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=53"}],"version-history":[{"count":1,"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/posts\/53\/revisions"}],"predecessor-version":[{"id":54,"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/posts\/53\/revisions\/54"}],"wp:attachment":[{"href":"https:\/\/studikis.it\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=53"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/studikis.it\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=53"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/studikis.it\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=53"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":53,"date":"2026-03-10T09:21:47","date_gmt":"2026-03-10T09:21:47","guid":{"rendered":"https:\/\/studikis.it\/?p=53"},"modified":"2026-03-10T10:32:04","modified_gmt":"2026-03-10T10:32:04","slug":"laboratorio-pratico","status":"publish","type":"post","link":"https:\/\/studikis.it\/?p=53","title":{"rendered":"Laboratorio Pratico"},"content":{"rendered":"\n\n\n\n \n \n Modulo 7 – Laboratorio Pratico | Autonomia Portami Via<\/title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n body { font-family: 'Segoe UI', sans-serif; background: linear-gradient(135deg, #f2994a, #f2c94c); min-height: 100vh; padding: 20px; line-height: 1.6; }\n .container { max-width: 900px; margin: 0 auto; }\n .header { background: white; border-radius: 20px; padding: 30px; text-align: center; margin-bottom: 20px; }\n .header h1 { color: #f2994a; }\n .module-badge { display: inline-block; background: linear-gradient(135deg, #f2994a, #f2c94c); color: white; padding: 8px 20px; border-radius: 20px; font-weight: bold; margin-bottom: 15px; }\n .tabs { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }\n .tab { flex: 1; min-width: 140px; padding: 15px; background: white; border: none; border-radius: 15px; cursor: pointer; font-weight: bold; color: #f2994a; }\n .tab.active { background: linear-gradient(135deg, #f2994a, #f2c94c); color: white; }\n .content-section { background: white; border-radius: 20px; padding: 30px; display: none; }\n .content-section.active { display: block; }\n .lesson-card { background: #fff8e1; border-radius: 15px; padding: 25px; margin-bottom: 20px; border-left: 5px solid #f2994a; }\n .lesson-card h3 { color: #f2994a; margin-bottom: 15px; }\n .highlight-box { background: #fff3cd; border-radius: 10px; padding: 20px; margin: 15px 0; border-left: 4px solid #ffc107; }\n .highlight-box.tip { background: #d4edda; border-left-color: #28a745; }\n .highlight-box.warning { background: #f8d7da; border-left-color: #dc3545; }\n h2 { color: #f2994a; margin: 25px 0 15px 0; }\n ul { margin-left: 25px; margin-bottom: 15px; }\n li { margin-bottom: 8px; }\n .sim-box { background: #fff8e1; border-radius: 15px; padding: 25px; margin: 20px 0; }\n .sim-month { display: flex; justify-content: space-between; align-items: center; padding: 15px; background: white; border-radius: 10px; margin: 10px 0; }\n .sim-month .label { font-weight: bold; }\n .sim-month input { width: 100px; padding: 8px; border: 2px solid #ddd; border-radius: 8px; text-align: center; }\n .sim-result { background: linear-gradient(135deg, #f2994a, #f2c94c); color: white; border-radius: 15px; padding: 25px; text-align: center; margin-top: 20px; }\n .sim-result .big { font-size: 2.5em; font-weight: bold; }\n .checklist { margin: 20px 0; }\n .check-item { display: flex; align-items: center; gap: 15px; padding: 15px; background: #f5f5f5; border-radius: 10px; margin: 10px 0; cursor: pointer; transition: all 0.3s; }\n .check-item:hover { background: #fff8e1; }\n .check-item.done { background: #d4edda; }\n .check-item .box { width: 30px; height: 30px; border: 3px solid #f2994a; border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 1.2em; }\n .check-item.done .box { background: #28a745; border-color: #28a745; color: white; }\n .project-card { background: white; border-radius: 15px; padding: 20px; margin: 15px 0; border: 2px solid #f2994a; }\n .project-card h4 { color: #f2994a; margin-bottom: 10px; }\n .progress-bar { width: 100%; height: 20px; background: #e0e0e0; border-radius: 10px; margin: 20px 0; overflow: hidden; }\n .progress-fill { height: 100%; background: linear-gradient(90deg, #f2994a, #f2c94c); border-radius: 10px; transition: width 0.5s; display: flex; align-items: center; justify-content: center; color: white; font-weight: bold; }\n .btn { padding: 12px 30px; border: none; border-radius: 10px; font-weight: bold; cursor: pointer; background: linear-gradient(135deg, #f2994a, #f2c94c); color: white; }\n .final-box { background: linear-gradient(135deg, #f2994a, #f2c94c); border-radius: 20px; padding: 30px; text-align: center; color: white; margin: 20px 0; }\n .badge { display: inline-block; background: white; color: #f2994a; padding: 10px 25px; border-radius: 25px; font-weight: bold; margin: 10px; }\n .apartment-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; margin: 20px 0; }\n .apartment-item { background: white; border-radius: 10px; padding: 15px; text-align: center; border: 2px solid #ddd; transition: all 0.3s; }\n .apartment-item:hover { border-color: #f2994a; }\n .apartment-item .icon { font-size: 2em; margin-bottom: 10px; }\n .apartment-item .cost { color: #f2994a; font-weight: bold; font-size: 1.2em; }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <div class=\"header\">\n <div class=\"module-badge\">📚 MODULO 7 – 10 ORE<\/div>\n <h1>🎯 Laboratorio Pratico<\/h1>\n <p>Metti in pratica tutto quello che hai imparato!<\/p>\n <\/div>\n \n <div class=\"tabs\">\n <button class=\"tab active\" onclick=\"showSection('intro')\">📖 Introduzione<\/button>\n <button class=\"tab\" onclick=\"showSection('casa')\">🏠 Vita Autonoma<\/button>\n <button class=\"tab\" onclick=\"showSection('budget')\">💰 Budget Casa<\/button>\n <button class=\"tab\" onclick=\"showSection('checklist')\">✅ Checklist<\/button>\n <button class=\"tab\" onclick=\"showSection('finale')\">🎓 Finale<\/button>\n <\/div>\n \n \n <div id=\"intro\" class=\"content-section active\">\n <h2>🎯 Il Modulo Finale<\/h2>\n <p>Questo \u00e8 il momento di mettere insieme tutto quello che hai imparato! Simuleremo situazioni reali di vita autonoma.<\/p>\n \n <div class=\"lesson-card\">\n <h3>🏠 Cosa significa vivere da soli?<\/h3>\n <p>Vivere in autonomia significa prendersi cura di s\u00e9 stessi in tutto:<\/p>\n <ul>\n <li><strong>Casa<\/strong> – trovare alloggio, pagare affitto e bollette<\/li>\n <li><strong>Soldi<\/strong> – gestire budget, risparmiare<\/li>\n <li><strong>Documenti<\/strong> – contratti, burocrazia<\/li>\n <li><strong>Salute<\/strong> – medico, alimentazione<\/li>\n <li><strong>Relazioni<\/strong> – comunicare, chiedere aiuto<\/li>\n <\/ul>\n <\/div>\n \n <div class=\"lesson-card\">\n <h3>💡 Cosa faremo<\/h3>\n <ul>\n <li>Simulazione: gestire un mese di vita autonoma<\/li>\n <li>Calcolare il budget per una casa<\/li>\n <li>Checklist delle cose da sapere<\/li>\n <li>Riflessione finale sul percorso<\/li>\n <\/ul>\n <\/div>\n \n <div class=\"highlight-box tip\">\n <h4>🌟 Ricorda<\/h4>\n <p>Nessuno nasce sapendo fare tutto! L’importante \u00e8 sapere DOVE cercare aiuto e non aver paura di chiedere.<\/p>\n <\/div>\n <\/div>\n \n \n <div id=\"casa\" class=\"content-section\">\n <h2>🏠 Costi della Vita Autonoma<\/h2>\n <p>Quanto costa vivere da soli? Scopriamolo insieme!<\/p>\n \n <div class=\"apartment-grid\">\n <div class=\"apartment-item\">\n <div class=\"icon\">🏠<\/div>\n <h4>Affitto<\/h4>\n <p>Stanza singola o monolocale<\/p>\n <div class=\"cost\">\u20ac300-600\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">💡<\/div>\n <h4>Bollette<\/h4>\n <p>Luce, gas, acqua, wifi<\/p>\n <div class=\"cost\">\u20ac100-150\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">🍕<\/div>\n <h4>Cibo<\/h4>\n <p>Spesa e qualche uscita<\/p>\n <div class=\"cost\">\u20ac200-300\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">🚌<\/div>\n <h4>Trasporti<\/h4>\n <p>Abbonamento mezzi<\/p>\n <div class=\"cost\">\u20ac35-50\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">📱<\/div>\n <h4>Telefono<\/h4>\n <p>Piano mobile<\/p>\n <div class=\"cost\">\u20ac10-20\/mese<\/div>\n <\/div>\n <div class=\"apartment-item\">\n <div class=\"icon\">🎉<\/div>\n <h4>Svago<\/h4>\n <p>Uscite, hobby<\/p>\n <div class=\"cost\">\u20ac50-100\/mese<\/div>\n <\/div>\n <\/div>\n \n <div class=\"highlight-box warning\">\n <h4>⚠️ Il conto totale<\/h4>\n <p>Vivere da soli costa circa <strong>\u20ac800-1200 al mese<\/strong> (dipende dalla citt\u00e0 e dallo stile di vita).<\/p>\n <p>Per vivere tranquilli, il tuo stipendio dovrebbe essere ALMENO \u20ac1000-1300 netti.<\/p>\n <\/div>\n \n <div class=\"highlight-box tip\">\n <h4>💡 Consigli per risparmiare<\/h4>\n <ul>\n <li>Condividi casa con coinquilini<\/li>\n <li>Cucina a casa invece di mangiare fuori<\/li>\n <li>Confronta le offerte di luce e gas<\/li>\n <li>Usa i mezzi pubblici<\/li>\n <\/ul>\n <\/div>\n <\/div>\n \n \n <div id=\"budget\" class=\"content-section\">\n <h2>💰 Simula il Tuo Budget Mensile<\/h2>\n <p>Immagina di avere uno stipendio. Riesci a far quadrare i conti?<\/p>\n \n <div class=\"sim-box\">\n <div class=\"sim-month\">\n <span class=\"label\">💵 Il tuo stipendio (netto)<\/span>\n <input type=\"number\" id=\"stipendio\" value=\"1200\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n \n <h4 style=\"margin: 20px 0 10px; color: #f2994a;\">Spese fisse:<\/h4>\n \n <div class=\"sim-month\">\n <span class=\"label\">🏠 Affitto<\/span>\n <input type=\"number\" id=\"affitto\" value=\"400\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">💡 Bollette (luce, gas, wifi)<\/span>\n <input type=\"number\" id=\"bollette\" value=\"100\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">🍕 Cibo e spesa<\/span>\n <input type=\"number\" id=\"cibo\" value=\"200\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">🚌 Trasporti<\/span>\n <input type=\"number\" id=\"trasporti\" value=\"40\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">📱 Telefono<\/span>\n <input type=\"number\" id=\"telefono\" value=\"15\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">🎉 Svago e uscite<\/span>\n <input type=\"number\" id=\"svago\" value=\"80\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <div class=\"sim-month\">\n <span class=\"label\">🐷 Risparmio<\/span>\n <input type=\"number\" id=\"risparmio\" value=\"100\" onchange=\"calcBudget()\"> \u20ac\n <\/div>\n <\/div>\n \n <div id=\"budget-result\" class=\"sim-result\">\n <p>Ti rimangono:<\/p>\n <div class=\"big\" id=\"rimanente\">\u20ac265<\/div>\n <p id=\"budget-msg\">Ottimo! Stai gestendo bene il budget.<\/p>\n <\/div>\n <\/div>\n \n \n <div id=\"checklist\" class=\"content-section\">\n <h2>✅ Checklist dell’Autonomia<\/h2>\n <p>Quante di queste cose sai fare? Clicca su quelle che hai imparato!<\/p>\n \n <div class=\"checklist\" id=\"checklist-items\">\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So fare un budget mensile<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So leggere un contratto di lavoro<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So dove andare per fare la carta d’identit\u00e0<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So come funziona il medico di base<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>Conosco i miei diritti come consumatore<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So riconoscere una fake news<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So proteggere la mia privacy online<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So gestire le mie emozioni<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So comunicare in modo assertivo<\/span><\/div>\n <div class=\"check-item\" onclick=\"toggleItem(this)\"><div class=\"box\"><\/div><span>So dove chiedere aiuto se ho bisogno<\/span><\/div>\n <\/div>\n \n <div class=\"progress-bar\">\n <div class=\"progress-fill\" id=\"check-progress\" style=\"width: 0%\">0%<\/div>\n <\/div>\n \n <div id=\"check-msg\" class=\"highlight-box\" style=\"display:none\"><\/div>\n <\/div>\n \n \n <div id=\"finale\" class=\"content-section\">\n <h2>🎓 Complimenti!<\/h2>\n \n <div class=\"final-box\">\n <h3 style=\"font-size: 2em; margin-bottom: 20px;\">🌟 Ce l’hai fatta! 🌟<\/h3>\n <p style=\"font-size: 1.2em;\">Hai completato il corso “Autonomia Portami Via”!<\/p>\n \n <div style=\"margin: 30px 0;\">\n <p>Hai acquisito competenze in:<\/p>\n <div class=\"badge\">💰 Finanza<\/div>\n <div class=\"badge\">🗺️ Territorio<\/div>\n <div class=\"badge\">🏛️ Civica<\/div>\n <div class=\"badge\">⚖️ Legalit\u00e0<\/div>\n <div class=\"badge\">📱 Digitale<\/div>\n <div class=\"badge\">💝 Emozioni<\/div>\n <\/div>\n <\/div>\n \n <div class=\"lesson-card\">\n <h3>📝 Rifletti sul tuo percorso<\/h3>\n <p>Prenditi un momento per pensare:<\/p>\n <ul>\n <li>Qual \u00e8 stata la cosa pi\u00f9 utile che hai imparato?<\/li>\n <li>Cosa ti ha sorpreso di pi\u00f9?<\/li>\n <li>Su cosa vorresti approfondire?<\/li>\n <li>Come userai queste competenze nella tua vita?<\/li>\n <\/ul>\n <\/div>\n \n <div class=\"highlight-box tip\">\n <h4>🚀 Il futuro \u00e8 tuo!<\/h4>\n <p>Ricorda: l’autonomia non si impara in un giorno. \u00c8 un percorso fatto di piccoli passi. Ogni volta che affronti una situazione nuova, impari qualcosa.<\/p>\n <p><strong>Non aver paura di sbagliare. Non aver paura di chiedere aiuto. Ce la puoi fare!<\/strong><\/p>\n <\/div>\n \n <div style=\"text-align: center; margin-top: 30px;\">\n <p style=\"font-size: 3em;\">🎉🎓🌟<\/p>\n <h3 style=\"color: #f2994a;\">IN BOCCA AL LUPO PER IL TUO FUTURO!<\/h3>\n <\/div>\n <\/div>\n <\/div>\n \n <script>\n function showSection(id) {\n document.querySelectorAll('.content-section').forEach(s => s.classList.remove('active'));\n document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));\n document.getElementById(id).classList.add('active');\n event.target.classList.add('active');\n }\n \n function calcBudget() {\n const stipendio = parseInt(document.getElementById('stipendio').value) || 0;\n const spese = ['affitto', 'bollette', 'cibo', 'trasporti', 'telefono', 'svago', 'risparmio']\n .reduce((sum, id) => sum + (parseInt(document.getElementById(id).value) || 0), 0);\n \n const rimanente = stipendio - spese;\n document.getElementById('rimanente').textContent = '\u20ac' + rimanente;\n \n const msg = document.getElementById('budget-msg');\n const box = document.getElementById('budget-result');\n \n if (rimanente < 0) {\n msg.textContent = '⚠️ Attenzione! Spendi pi\u00f9 di quello che guadagni!';\n box.style.background = 'linear-gradient(135deg, #dc3545, #c82333)';\n } else if (rimanente < 50) {\n msg.textContent = '😰 Sei al limite! Cerca di ridurre qualche spesa.';\n box.style.background = 'linear-gradient(135deg, #ffc107, #e0a800)';\n } else {\n msg.textContent = '✅ Ottimo! Stai gestendo bene il budget.';\n box.style.background = 'linear-gradient(135deg, #28a745, #218838)';\n }\n }\n \n let checkedItems = 0;\n function toggleItem(el) {\n el.classList.toggle('done');\n const box = el.querySelector('.box');\n if (el.classList.contains('done')) {\n box.textContent = '\u2713';\n checkedItems++;\n } else {\n box.textContent = '';\n checkedItems--;\n }\n \n const total = document.querySelectorAll('.check-item').length;\n const percent = Math.round((checkedItems \/ total) * 100);\n document.getElementById('check-progress').style.width = percent + '%';\n document.getElementById('check-progress').textContent = percent + '%';\n \n const msg = document.getElementById('check-msg');\n if (percent >= 80) {\n msg.innerHTML = '<h4>🎉 Fantastico!<\/h4><p>Hai acquisito la maggior parte delle competenze. Sei pronto per l\\'autonomia!<\/p>';\n msg.className = 'highlight-box tip';\n msg.style.display = 'block';\n } else if (percent >= 50) {\n msg.innerHTML = '<h4>👍 Buon lavoro!<\/h4><p>Stai facendo progressi. Continua a imparare!<\/p>';\n msg.className = 'highlight-box';\n msg.style.display = 'block';\n } else {\n msg.style.display = 'none';\n }\n }\n \n calcBudget();\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Modulo 7 – Laboratorio Pratico | Autonomia Portami Via 📚 MODULO 7 – 10 ORE 🎯 Laboratorio Pratico Metti in pratica tutto quello che hai imparato! 📖 Introduzione 🏠 Vita Autonoma 💰 Budget Casa ✅ Checklist 🎓 Finale 🎯 Il Modulo Finale Questo \u00e8 il momento di mettere insieme tutto quello che hai imparato! Simuleremo … <a title=\"Laboratorio Pratico\" class=\"read-more\" href=\"https:\/\/studikis.it\/?p=53\" aria-label=\"Read more about Laboratorio Pratico\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-53","post","type-post","status-publish","format-standard","hentry","category-corsimarzogiugno26"],"_links":{"self":[{"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/posts\/53","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/studikis.it\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=53"}],"version-history":[{"count":1,"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/posts\/53\/revisions"}],"predecessor-version":[{"id":54,"href":"https:\/\/studikis.it\/index.php?rest_route=\/wp\/v2\/posts\/53\/revisions\/54"}],"wp:attachment":[{"href":"https:\/\/studikis.it\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=53"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/studikis.it\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=53"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/studikis.it\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=53"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}