Files
myprojplanet_vite/_LIMBO/risospiegazione.html
2025-12-05 17:56:05 +01:00

2293 lines
81 KiB
HTML

<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>RISO - Domande Frequenti</title>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
background: linear-gradient(135deg, #667eea08 0%, #764ba208 100%);
color: #333;
font-size: 16px;
line-height: 1.6;
}
.container {
max-width: 1000px;
margin: 0 auto;
padding: 1rem;
}
.page-header {
text-align: center;
padding: 2rem 1rem;
background: white;
border-radius: 16px;
margin-bottom: 1.5rem;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}
.page-icon {
font-size: 3.5rem !important;
color: #667eea;
margin-bottom: 0.5rem;
}
.page-title {
font-size: 1.75rem;
font-weight: 700;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 0.5rem;
}
.page-subtitle {
font-size: 1rem;
color: #666;
}
/* FAQ Accordion */
.faq-item {
background: white;
border-radius: 12px;
margin-bottom: 1rem;
overflow: hidden;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
transition: all 0.3s;
}
.faq-item:hover {
box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}
.faq-question {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 1rem 1.25rem;
background: #f8f9fa;
cursor: pointer;
user-select: none;
transition: all 0.3s;
}
.faq-question:hover {
background: #667eea10;
}
.faq-icon {
font-size: 1.75rem !important;
color: #667eea;
flex-shrink: 0;
}
.faq-title {
flex: 1;
font-size: 1.1rem;
font-weight: 600;
line-height: 1.4;
}
.faq-toggle {
font-size: 1.5rem !important;
color: #667eea;
transition: transform 0.3s;
flex-shrink: 0;
}
.faq-item.active .faq-toggle {
transform: rotate(180deg);
}
.faq-answer {
display: grid;
grid-template-rows: 0fr;
transition: grid-template-rows 0.4s ease, opacity 0.3s ease;
opacity: 0;
overflow: hidden;
}
.faq-item.active .faq-answer {
grid-template-rows: 1fr;
opacity: 1;
}
.faq-content {
min-height: 0;
padding: 1.25rem;
font-size: 0.95rem;
line-height: 1.65;
}
/* Text Styles */
.faq-content p {
margin: 0.75rem 0;
}
.faq-content strong {
color: #667eea;
font-weight: 600;
}
.faq-content ul,
.faq-content ol {
margin: 0.75rem 0;
padding-left: 1.5rem;
}
.faq-content li {
margin: 0.5rem 0;
}
/* Visual Elements */
.value-box {
background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
border: 2px solid #667eea30;
border-radius: 10px;
padding: 1rem;
margin: 1rem 0;
text-align: center;
}
.value-equation {
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
font-size: 1.5rem;
font-weight: 700;
color: #667eea;
flex-wrap: wrap;
margin: 0.75rem 0;
}
.value-equation i {
font-size: 1.75rem !important;
}
.note-box {
background: #fef3c7;
border-left: 4px solid #f59e0b;
padding: 0.875rem;
margin: 1rem 0;
border-radius: 6px;
font-size: 0.9rem;
}
.note-box i {
font-size: 1.25rem !important;
color: #f59e0b;
vertical-align: middle;
margin-right: 0.5rem;
}
.success-box {
background: #d1fae5;
border-left: 4px solid #10b981;
padding: 0.875rem;
margin: 1rem 0;
border-radius: 6px;
font-size: 0.9rem;
}
.success-box i {
font-size: 1.25rem !important;
color: #10b981;
vertical-align: middle;
margin-right: 0.5rem;
}
/* Story Flow */
.story-section {
background: #f8f9fa;
border-radius: 10px;
padding: 1rem;
margin: 1rem 0;
}
.story-title {
font-size: 1rem;
font-weight: 600;
color: #667eea;
margin-bottom: 1rem;
display: flex;
align-items: center;
gap: 0.5rem;
}
.story-title i {
font-size: 1.5rem !important;
}
.story-step {
background: white;
border-radius: 8px;
padding: 1rem;
margin: 0.75rem 0;
border-left: 4px solid #667eea;
}
.step-header {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 0.75rem;
flex-wrap: wrap;
}
.step-number {
width: 32px;
height: 32px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
flex-shrink: 0;
}
.step-title {
font-weight: 600;
font-size: 1rem;
}
.actors-row {
display: flex;
align-items: center;
gap: 0.5rem;
margin: 0.75rem 0;
flex-wrap: wrap;
justify-content: center;
}
.actor {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
min-width: 80px;
}
.actor-avatar {
width: 50px;
height: 50px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem !important;
color: white;
}
.actor-avatar.francesca {
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}
.actor-avatar.mario {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}
.actor-avatar.alice {
background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
}
.actor-name {
font-size: 0.85rem;
font-weight: 600;
}
.actor-balance {
font-size: 0.8rem;
padding: 0.25rem 0.5rem;
border-radius: 10px;
font-weight: 700;
}
.actor-balance.positive {
background: #10b98130;
color: #059669;
}
.actor-balance.negative {
background: #f59e0b30;
color: #d97706;
}
.actor-balance.zero {
background: #6b728030;
color: #4b5563;
}
.arrow {
font-size: 1.5rem !important;
color: #667eea;
}
.step-description {
font-size: 0.9rem;
color: #555;
margin-top: 0.5rem;
line-height: 1.5;
}
/* Responsive Tables/Cards */
.comparison-grid {
display: grid;
gap: 1rem;
margin: 1rem 0;
}
.comparison-card {
background: #f8f9fa;
border-radius: 8px;
padding: 1rem;
border: 2px solid #e5e7eb;
}
.comparison-card.highlight {
background: linear-gradient(135deg, #667eea10 0%, #764ba210 100%);
border-color: #667eea;
}
.card-title {
font-weight: 700;
font-size: 1rem;
color: #667eea;
margin-bottom: 0.75rem;
display: flex;
align-items: center;
gap: 0.5rem;
}
.card-title i {
font-size: 1.5rem !important;
}
.card-items {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.card-item {
display: flex;
align-items: flex-start;
gap: 0.5rem;
font-size: 0.9rem;
}
.card-item i {
font-size: 1.25rem !important;
margin-top: 0.15rem;
flex-shrink: 0;
}
.card-item.yes i {
color: #10b981;
}
.card-item.no i {
color: #ef4444;
}
/* Calc Example */
.calc-example {
background: #f8f9fa;
border-radius: 8px;
padding: 1rem;
margin: 1rem 0;
}
.calc-row {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem 0;
border-bottom: 1px solid #e5e7eb;
font-size: 0.95rem;
}
.calc-row:last-child {
border-bottom: none;
}
.calc-row.total {
border-top: 2px solid #667eea;
font-weight: 700;
margin-top: 0.5rem;
padding-top: 0.75rem;
}
.calc-row.highlight {
background: #667eea15;
padding: 0.75rem;
border-radius: 6px;
font-weight: 700;
color: #667eea;
margin-top: 0.5rem;
}
/* Split Layout */
.split-layout {
display: grid;
gap: 1rem;
margin: 1rem 0;
}
.split-card {
background: white;
border-radius: 8px;
padding: 1rem;
border: 2px solid;
}
.split-card.euro {
border-color: #3b82f6;
}
.split-card.ris {
border-color: #667eea;
}
.split-header {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.split-icon {
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 1.25rem;
color: white;
}
.split-card.euro .split-icon {
background: #3b82f6;
}
.split-card.ris .split-icon {
background: #667eea;
}
.split-title {
font-weight: 700;
font-size: 1rem;
}
.split-list {
list-style: none;
padding: 0;
}
.split-list li {
padding: 0.4rem 0;
font-size: 0.9rem;
padding-left: 1.25rem;
position: relative;
}
.split-list li::before {
content: '•';
position: absolute;
left: 0;
color: #667eea;
font-weight: 700;
}
/* Flow Diagram */
.flow-diagram {
display: flex;
align-items: center;
gap: 0.75rem;
margin: 1rem 0;
padding: 1rem;
background: #f8f9fa;
border-radius: 8px;
flex-wrap: wrap;
justify-content: center;
}
.flow-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
min-width: 80px;
}
.flow-icon {
width: 50px;
height: 50px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.flow-icon i {
font-size: 1.5rem !important;
color: white;
}
.flow-label {
font-size: 0.85rem;
text-align: center;
font-weight: 600;
}
.flow-arrow {
font-size: 1.75rem !important;
color: #667eea;
}
/* Links */
.external-link {
display: inline-flex;
align-items: center;
gap: 0.5rem;
color: #667eea;
font-weight: 600;
text-decoration: none;
margin-top: 0.75rem;
padding: 0.5rem 1rem;
background: #667eea15;
border-radius: 6px;
font-size: 0.9rem;
}
.external-link i {
font-size: 1.25rem !important;
}
.external-link:hover {
background: #667eea;
color: white;
}
/* Limits Visual */
.limits-bar {
margin: 1rem 0;
padding: 1rem;
background: #f8f9fa;
border-radius: 8px;
}
.bar-visual {
display: flex;
height: 40px;
border-radius: 20px;
overflow: hidden;
margin: 1rem 0;
}
.bar-segment {
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: 700;
font-size: 0.85rem;
}
.bar-segment.danger {
background: repeating-linear-gradient(45deg, #f59e0b, #f59e0b 10px, #fb923c 10px, #fb923c 20px);
flex: 1;
}
.bar-segment.safe {
background: linear-gradient(90deg, #10b981 0%, #34d399 100%);
flex: 3;
}
.bar-labels {
display: flex;
justify-content: space-between;
margin-top: 0.5rem;
font-size: 0.85rem;
}
.bar-label {
font-weight: 600;
color: #667eea;
}
/* Mobile Optimization */
@media (max-width: 768px) {
.container {
padding: 0.75rem;
}
.page-header {
padding: 1.5rem 1rem;
}
.page-title {
font-size: 1.5rem;
}
.faq-question {
padding: 0.875rem 1rem;
}
.faq-title {
font-size: 1rem;
}
.faq-content {
padding: 1rem;
font-size: 0.9rem;
}
.actors-row {
justify-content: space-around;
}
.flow-diagram {
flex-direction: column;
}
.flow-arrow {
transform: rotate(90deg);
}
.comparison-grid {
grid-template-columns: 1fr;
}
.split-layout {
grid-template-columns: 1fr;
}
}
@media (min-width: 769px) {
.comparison-grid {
grid-template-columns: repeat(2, 1fr);
}
.split-layout {
grid-template-columns: repeat(2, 1fr);
}
}
.ris-benefits {
max-width: 1200px;
margin: 0 auto;
padding: 1rem;
.benefits-header {
text-align: center;
margin-bottom: 2rem;
}
.benefits-title {
font-size: 1.75rem;
font-weight: 700;
margin-bottom: 0.5rem;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.benefits-subtitle {
font-size: 1rem;
color: #666;
}
.highlights-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1rem;
margin-bottom: 2.5rem;
}
.highlight-card {
background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
border-radius: 12px;
padding: 1.25rem;
text-align: center;
transition: transform 0.2s;
&:hover {
transform: translateY(-4px);
}
}
.highlight-icon {
i {
font-size: 2.5rem;
color: #667eea;
}
}
.highlight-title {
font-size: 1.1rem;
font-weight: 600;
margin: 0.75rem 0 0.5rem;
}
.highlight-text {
font-size: 0.9rem;
color: #666;
margin: 0;
}
.how-it-works {
background: #f8f9fa;
border-radius: 16px;
padding: 1.5rem;
margin-bottom: 2.5rem;
}
.section-title {
font-size: 1.4rem;
font-weight: 600;
margin-bottom: 1.5rem;
text-align: center;
}
.flow-diagram {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 1rem;
}
.flow-step {
text-align: center;
flex: 0 0 auto;
}
.step-number {
width: 32px;
height: 32px;
background: #667eea;
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 0.5rem;
font-weight: 600;
}
.step-icon i {
font-size: 2rem;
color: #667eea;
}
.step-text {
font-size: 0.85rem;
margin-top: 0.5rem;
max-width: 120px;
}
.flow-arrow i {
color: #ccc;
font-size: 1.5rem;
}
.balance-concept {
background: linear-gradient(135deg, #f093fb15 0%, #f5576c15 100%);
border-radius: 16px;
padding: 1.5rem;
margin-bottom: 2.5rem;
}
.concept-description {
text-align: center;
color: #666;
margin-bottom: 1.5rem;
}
.balance-visual {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
flex-wrap: wrap;
}
.balance-side {
flex: 1;
min-width: 200px;
}
.balance-icon i {
font-size: 2rem;
}
.balance-positive {
text-align: left;
.balance-icon i {
color: #10b981;
}
}
.balance-negative {
text-align: right;
.balance-icon i {
color: #f59e0b;
}
}
.balance-label {
font-weight: 600;
margin: 0.5rem 0;
}
.balance-bar {
height: 8px;
border-radius: 4px;
&.positive {
background: linear-gradient(90deg, #10b981 0%, #10b98180 100%);
}
&.negative {
background: linear-gradient(-90deg, #f59e0b 0%, #f59e0b80 100%);
}
}
.balance-center {
text-align: center;
flex: 0 0 auto;
i {
font-size: 2.5rem;
color: #667eea;
}
}
.balance-equals {
font-size: 0.85rem;
font-weight: 600;
color: #667eea;
}
.benefits-list {
margin-bottom: 2.5rem;
}
.benefits-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 1rem;
}
.benefit-item {
display: flex;
gap: 1rem;
padding: 1rem;
background: white;
border-radius: 8px;
border: 1px solid #e5e7eb;
transition: all 0.2s;
&:hover {
border-color: #667eea;
box-shadow: 0 4px 12px rgba(102, 126, 234, 0.1);
}
}
.benefit-icon {
font-size: 1.75rem;
color: #667eea;
flex-shrink: 0;
}
.benefit-content {
flex: 1;
}
.benefit-title {
font-size: 1rem;
font-weight: 600;
margin: 0 0 0.25rem;
}
.benefit-text {
font-size: 0.875rem;
color: #666;
margin: 0;
line-height: 1.4;
}
.stats-section {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-radius: 16px;
padding: 2rem;
color: white;
}
.stats-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1.5rem;
}
.stat-card {
text-align: center;
}
.stat-icon i {
font-size: 2.5rem;
opacity: 0.9;
}
.stat-number {
font-size: 2.5rem;
font-weight: 700;
margin: 0.5rem 0;
}
.stat-label {
font-size: 0.9rem;
opacity: 0.9;
}
@media (max-width: 768px) {
.flow-arrow {
display: none;
}
.balance-visual {
flex-direction: column;
}
.benefits-grid {
grid-template-columns: 1fr;
}
}
.faq-question-text {
display: flex;
align-items: center;
gap: 0.5rem;
i {
color: #667eea;
}
}
.video-container {
position: relative;
padding-bottom: 56.25%;
/* 16:9 ratio */
height: 0;
overflow: hidden;
border-radius: 8px;
background: #000;
margin: 0.75rem;
iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
}
}
.video-description {
padding: 0.5rem 0.75rem 0.75rem;
margin-top: 20px;
font-size: 1.2rem;
color: #666;
text-align: center;
}
@media (max-width: 768px) {
.video-container {
margin: 0.5rem;
border-radius: 6px;
}
.video-description {
font-size: 1rem;
padding: 0.5rem;
}
}
@media (max-width: 480px) {
.video-container {
margin: 0.35rem;
}
}
</style>
</head>
<body>
<div class="container">
<div class="">
<div class="row justify-center align-items-center" style="text-align: center;">
<div> <img src="images/1ris_rosso_100.png" alt="RISO" style="width: 3rem; height: 3rem;">
<h1 class="page-title" style="text-align: center;">Perché usare i RIS? (in breve)</h1>
</div>
</div>
<div class="ris-benefits" style="text-align: center;">
<!-- Header Section -->
<div class="benefits-header">
<p class="benefits-subtitle">Un sistema di scambio semplice, trasparente e orientato alla
comunità</p>
</div>
<!-- Key Highlights (top 3-4 punti più importanti in cards visive) -->
<div class="highlights-grid">
<div class="highlight-card">
<div class="highlight-icon">
<i class="material-icons">account_balance_wallet</i>
</div>
<h3 class="highlight-title">100% Gratuito</h3>
<p class="highlight-text">Iscrizione e utilizzo completamente gratuiti</p>
</div>
<div class="highlight-card">
<div class="highlight-icon">
<i class="material-icons">people</i>
</div>
<h3 class="highlight-title">Parti da Subito</h3>
<p class="highlight-text">Bastano 2 persone per iniziare a scambiare</p>
</div>
<div class="highlight-card">
<div class="highlight-icon">
<i class="material-icons">trending_up</i>
</div>
<h3 class="highlight-title">Crei il Tuo Valore</h3>
<p class="highlight-text">Generi RIS offrendo beni o servizi</p>
</div>
<div class="highlight-card">
<div class="highlight-icon">
<i class="material-icons">verified</i>
</div>
<h3 class="highlight-title">Valore Garantito</h3>
<p class="highlight-text">1 RIS = 1 Euro nel circuito</p>
</div>
</div>
<!-- How it Works Diagram -->
<div class="how-it-works">
<h3 class="section-title">Come Funziona</h3>
<div class="flow-diagram">
<div class="flow-step">
<div class="step-number">1</div>
<div class="step-icon"><i class="material-icons">person_add</i></div>
<p class="step-text">Ti iscrivi gratuitamente</p>
</div>
<div class="flow-arrow"><i class="material-icons">arrow_forward</i></div>
<div class="flow-step">
<div class="step-number">2</div>
<div class="step-icon"><i class="material-icons">handshake</i></div>
<p class="step-text">Offri beni o servizi</p>
</div>
<div class="flow-arrow"><i class="material-icons">arrow_forward</i></div>
<div class="flow-step">
<div class="step-number">3</div>
<div class="step-icon"><i class="material-icons">swap_horiz</i></div>
<p class="step-text">Scambi con RIS</p>
</div>
<div class="flow-arrow"><i class="material-icons">arrow_forward</i></div>
<div class="flow-step">
<div class="step-number">4</div>
<div class="step-icon"><i class="material-icons">account_balance</i></div>
<p class="step-text">Il sistema bilancia tutto</p>
</div>
</div>
</div>
<!-- Balance Visualization -->
<div class="balance-concept">
<h3 class="section-title">Equilibrio Automatico</h3>
<p class="concept-description">Il sistema bilancia automaticamente crediti e debiti della
comunità</p>
<div class="balance-visual">
<div class="balance-side balance-positive">
<div class="balance-icon"><i class="material-icons">add_circle</i></div>
<div class="balance-label">Chi ha dato</div>
<div class="balance-bar positive"></div>
</div>
<div class="balance-center">
<i class="material-icons">compare_arrows</i>
<p class="balance-equals">Sempre in equilibrio</p>
</div>
<div class="balance-side balance-negative">
<div class="balance-icon"><i class="material-icons">remove_circle</i></div>
<div class="balance-label">Chi ha ricevuto</div>
<div class="balance-bar negative"></div>
</div>
</div>
</div>
<!-- All Benefits List -->
<div class="benefits-list">
<h3 class="section-title">Tutti i Vantaggi</h3>
<div class="benefits-grid">
<div class="benefit-item">
<i class="material-icons benefit-icon">store</i>
<div class="benefit-content">
<h4 class="benefit-title">Economia Locale</h4>
<p class="benefit-text">Favorisce lo sviluppo delle attività nella tua zona</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">favorite</i>
<div class="benefit-content">
<h4 class="benefit-title">Relazioni Prima di Tutto</h4>
<p class="benefit-text">Gli scambi creano legami, non solo transazioni economiche
</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">sync</i>
<div class="benefit-content">
<h4 class="benefit-title">Scambi Semplificati</h4>
<p class="benefit-text">Sistema di pagamento alternativo facile da usare</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">shield</i>
<div class="benefit-content">
<h4 class="benefit-title">Valore Sicuro</h4>
<p class="benefit-text">1 RIS = 1 Euro, valore garantito nel circuito</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">account_balance_wallet</i>
<div class="benefit-content">
<h4 class="benefit-title">Autonomia Totale</h4>
<p class="benefit-text">Crei i RIS che ti servono, senza banche centrali</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">balance</i>
<div class="benefit-content">
<h4 class="benefit-title">Sistema Bilanciato</h4>
<p class="benefit-text">Debiti e crediti si equilibrano automaticamente</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">euro_symbol</i>
<div class="benefit-content">
<h4 class="benefit-title">Niente Euro Necessari</h4>
<p class="benefit-text">Scambi senza usare moneta tradizionale</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">rocket_launch</i>
<div class="benefit-content">
<h4 class="benefit-title">Stimola l'Attività</h4>
<p class="benefit-text">I limiti di saldo ti spingono a produrre e scambiare</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">visibility</i>
<div class="benefit-content">
<h4 class="benefit-title">Tutto Trasparente</h4>
<p class="benefit-text">Regole chiare e condivise da tutti</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">block</i>
<div class="benefit-content">
<h4 class="benefit-title">No Accumulo</h4>
<p class="benefit-text">Usa i RIS attivamente invece di tenerli fermi</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">groups</i>
<div class="benefit-content">
<h4 class="benefit-title">Crei Valore Tu</h4>
<p class="benefit-text">Nessuno eroga moneta dal nulla, la generi offrendo qualcosa
</p>
</div>
</div>
<div class="benefit-item">
<i class="material-icons benefit-icon">receipt_long</i>
<div class="benefit-content">
<h4 class="benefit-title">Tracciabilità Totale</h4>
<p class="benefit-text">Tutti i movimenti sono tracciati e trasparenti</p>
</div>
</div>
</div>
</div>
<!-- Stats Visual (optional - se hai dati reali) -->
<div class="stats-section">
<h3 class="section-title">Il Sistema in Numeri</h3>
<div class="stats-grid">
<div class="stat-card">
<div class="stat-icon"><i class="material-icons">people</i></div>
<div class="stat-number">2+</div>
<div class="stat-label">Persone per iniziare</div>
</div>
<div class="stat-card">
<div class="stat-icon"><i class="material-icons">payments</i></div>
<div class="stat-number">1:1</div>
<div class="stat-label">RIS = Euro nel circuito</div>
</div>
<div class="stat-card">
<div class="stat-icon"><i class="material-icons">account_balance</i></div>
<div class="stat-number">0%</div>
<div class="stat-label">Costo di iscrizione</div>
</div>
</div>
</div>
</div>
</div>
<div class="page-header">
<i class="material-icons page-icon">help_center</i>
<h1 class="page-title">Domande Frequenti su RISO</h1>
<p class="page-subtitle">Clicca su ogni domanda per scoprire la risposta</p>
</div>
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">paid</i>
<div class="faq-title">Quanto vale 1 RIS?</div>
<i class="material-icons">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p>Il RIS è l'unità di conto delle Comunità Territoriali (CT) con funzione di moneta di scambio.</p>
<div class="value-box">
<div class="value-equation">
<span>1 RIS</span>
<i class="material-icons">arrow_forward</i>
<span>1 RIS</span>
</div>
<p style="margin: 0.5rem 0; font-size: 0.9rem; color: #666;">Il RIS vale RIS, non è convertibile
in euro</p>
</div>
<div class="value-box" style="background: white; border-color: #667eea;">
<div class="value-equation">
<span>1 RIS</span>
<i class="material-icons"></i>
<span>1 €</span>
</div>
<p style="margin: 0.5rem 0; font-size: 0.9rem; color: #666;"><strong>Valore di
riferimento</strong> per dare valore alle cose negli scambi</p>
</div>
<p>Anche se 1 RIS non è convertibile in euro, usiamo l'euro come riferimento per facilitare gli
scambi. Se vendi una bicicletta a 50€ nel mercato normale, puoi venderla a 50 RIS nel circuito
RISO.</p>
</div>
</div>
</details>
<!-- FAQ 2: Come si crea la moneta -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">account_balance_wallet</i>
<div class="faq-title">Come si crea la moneta autonomamente?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>La moneta non è solo carta o metallo.</strong> È qualsiasi cosa accettata per gli scambi
in una comunità. Il credito funziona quando tutti si fidano che possa essere convertito in beni,
servizi o euro.</p>
<div class="success-box">
<i class="material-icons">info</i>
Usiamo già il credito più spesso di quanto pensiamo! Ogni volta che dici "ti pago dopo" stai
creando un credito.
</div>
<p><strong>Esempio del Caffè:</strong> Vai al bar, prendi un caffè ma non hai soldi. Il barista
segna sul taccuino "mi devi 1 caffè". Hai appena creato un credito! Il barista può cedere questo
credito al giornalaio per comprare il giornale. Il giornalaio può cederlo a te per comprare la
tua farina. Cerchio chiuso, tutti hanno scambiato senza euro!</p>
<p>RISO funziona esattamente così, ma invece del taccuino usa un'app che traccia automaticamente
tutti i crediti e debiti in modo trasparente.</p>
</div>
</div>
</details>
<!-- FAQ 3: Esempio Francesca, Mario, Alice -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">groups</i>
<div class="faq-title">Come funziona nella pratica? Esempio concreto</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<div class="story-section">
<div class="story-title">
<i class="material-icons">menu_book</i>
La Storia di Francesca, Mario e Alice
</div>
<!-- Step 1 -->
<div class="story-step">
<div class="step-header">
<div class="step-number">1</div>
<div class="step-title">Mario Offre Giardinaggio a Francesca</div>
</div>
<div class="actors-row">
<div class="actor">
<div class="actor-avatar mario">
<i class="material-icons">person</i>
</div>
<div class="actor-name">Francesca</div>
<div class="actor-balance negative">-40 RIS</div>
</div>
<i class="material-icons arrow">arrow_forward</i>
<div class="actor">
<div class="actor-avatar francesca">
<i class="material-icons">person</i>
</div>
<div class="actor-name">Mario</div>
<div class="actor-balance positive">+40 RIS</div>
</div>
</div>
<p class="step-description">Mario sistema il giardino di Francesca per 40 RIS. Francesca non
ha
euro subito, ma accetta il "debito" di 40 RIS che Mario può usare con altri.</p>
</div>
<!-- Step 2 -->
<div class="story-step">
<div class="step-header">
<div class="step-number">2</div>
<div class="step-title">Mario Compra Lezioni da Alice</div>
</div>
<div class="actors-row">
<div class="actor">
<div class="actor-avatar mario">
<i class="material-icons">person</i>
</div>
<div class="actor-name">Mario</div>
<div class="actor-balance positive">+10 RIS</div>
</div>
<i class="material-icons arrow">arrow_forward</i>
<div class="actor">
<div class="actor-avatar alice">
<i class="material-icons">person</i>
</div>
<div class="actor-name">Alice</div>
<div class="actor-balance positive">+30 RIS</div>
</div>
</div>
<p class="step-description">Mario usa 30 dei suoi RIS per comprare lezioni di yoga da
Alice. Ora Mario ha +10 RIS, Alice ha +30 RIS, Francesca ha -40 RIS.</p>
</div>
<!-- Step 3 -->
<div class="story-step">
<div class="step-header">
<div class="step-number">3</div>
<div class="step-title">Alice Compra Riparazioni da Francesca</div>
</div>
<div class="actors-row">
<div class="actor">
<div class="actor-avatar alice">
<i class="material-icons">person</i>
</div>
<div class="actor-name">Alice</div>
<div class="actor-balance zero">0 RIS</div>
</div>
<i class="material-icons arrow">arrow_forward</i>
<div class="actor">
<div class="actor-avatar francesca">
<i class="material-icons">person</i>
</div>
<div class="actor-name">Francesca</div>
<div class="actor-balance negative">-10 RIS</div>
</div>
</div>
<p class="step-description">Alice usa i suoi 30 RIS per pagare Francesca che le ripara il
computer. Ora Alice è a 0 RIS, Francesca ha -10 RIS (aveva -40, ha ricevuto 30).</p>
</div>
<!-- Step 4 -->
<div class="story-step">
<div class="step-header">
<div class="step-number">4</div>
<div class="step-title">Francesca Compra Assistenza da Mario</div>
</div>
<div class="actors-row">
<div class="actor">
<div class="actor-avatar francesca">
<i class="material-icons">person</i>
</div>
<div class="actor-name">Francesca</div>
<div class="actor-balance zero">0 RIS</div>
</div>
<i class="material-icons arrow">arrow_forward</i>
<div class="actor">
<div class="actor-avatar mario">
<i class="material-icons">person</i>
</div>
<div class="actor-name">Mario</div>
<div class="actor-balance zero">0 RIS</div>
</div>
</div>
<p class="step-description">Francesca usa i suoi ultimi 10 RIS per pagare Mario che lo aiuta
con le pratiche burocratiche. Tutti tornano a 0 RIS!</p>
</div>
<div class="success-box">
<i class="material-icons">verified</i>
<strong>Cerchio chiuso perfettamente!</strong> Mario, Francesca e Alice hanno tutti
scambiato beni e servizi senza usare un solo euro. I RIS si sono creati e poi distrutti
automaticamente attraverso gli scambi.
</div>
</div>
</div>
</div>
</details>
<!-- FAQ 4: Gli esercenti possono accettare RIS -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">store</i>
<div class="faq-title">Gli esercenti con partita IVA possono accettare RIS?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>Sì!</strong> Gli esercenti possono offrire sconti fino al 30% e farsi pagare quella parte
in RIS.</p>
<div class="calc-example">
<p style="font-weight: 600; margin-bottom: 0.75rem;">Esempio pratico:</p>
<div class="calc-row">
<span>Prezzo prodotto</span>
<span>100 €</span>
</div>
<div class="calc-row">
<span>Sconto 30%</span>
<span>-30 €</span>
</div>
<div class="calc-row total">
<span>Scontrino fiscale</span>
<span>70 €</span>
</div>
<div class="calc-row highlight">
<span>Cliente paga</span>
<span>70 € + 30 RIS</span>
</div>
</div>
<div class="note-box">
<i class="material-icons">info</i>
Consulta sempre il tuo commercialista per la corretta gestione fiscale della tua situazione
specifica.
</div>
<p><strong>Vantaggi per l'esercente:</strong></p>
<ul>
<li>Attiri nuovi clienti che usano RIS</li>
<li>Fidelizzi i membri del circuito</li>
<li>Ottieni sia euro (per tasse) che RIS (per altri scambi)</li>
</ul>
</div>
</div>
</details>
<!-- FAQ 5: I privati possono accettare RIS -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">person</i>
<div class="faq-title">I privati cittadini possono accettare RIS?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>Sì!</strong> Per scambi occasionali sotto una certa soglia annua, come già avviene con
gli euro.</p>
<div class="comparison-grid">
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">check_circle</i>
Scambi OK
</div>
<div class="card-items">
<div class="card-item yes">
<i class="material-icons">check</i>
<span>Vicino ti aggiusta il rubinetto</span>
</div>
<div class="card-item yes">
<i class="material-icons">check</i>
<span>Vendi bici usata</span>
</div>
<div class="card-item yes">
<i class="material-icons">check</i>
<span>Dai ripetizioni occasionali</span>
</div>
<div class="card-item yes">
<i class="material-icons">check</i>
<span>Ortaggi dal tuo orto</span>
</div>
</div>
</div>
<div class="comparison-card">
<div class="card-title">
<i class="material-icons">warning</i>
Verifica con Commercialista
</div>
<div class="card-items">
<div class="card-item">
<i class="material-icons">arrow_forward</i>
<span>Vendi regolarmente grandi quantità</span>
</div>
<div class="card-item">
<i class="material-icons">arrow_forward</i>
<span>Servizi professionali frequenti</span>
</div>
<div class="card-item">
<i class="material-icons">arrow_forward</i>
<span>Introiti continuativi</span>
</div>
</div>
</div>
</div>
</div>
</div>
</details>
<!-- FAQ 6: Convertibilità -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">currency_exchange</i>
<div class="faq-title">Il RIS è convertibile in euro?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>No, e questo è un vantaggio!</strong> Il RIS circola liberamente negli scambi senza
bisogno di conversione.</p>
<div class="flow-diagram">
<div class="flow-item">
<div class="flow-icon">
<i class="material-icons">account_balance_wallet</i>
</div>
<div class="flow-label">Hai +50 RIS</div>
</div>
<i class="material-icons flow-arrow">arrow_forward</i>
<div class="flow-item">
<div class="flow-icon">
<i class="material-icons">shopping_cart</i>
</div>
<div class="flow-label">Compri 30 RIS</div>
</div>
<i class="material-icons flow-arrow">arrow_forward</i>
<div class="flow-item">
<div class="flow-icon">
<i class="material-icons">check</i>
</div>
<div class="flow-label">Hai +20 RIS</div>
</div>
</div>
<div class="success-box">
<i class="material-icons">lightbulb</i>
Il RIS si usa direttamente, non si converte. È questo il suo punto di forza: è fatto per
circolare, non per essere trasformato in euro.
</div>
<p><strong>Unico caso di conversione:</strong> Se esci dal circuito con saldo positivo, chi ha
debiti ti ripaga in euro. Ma questo è un caso estremo, non il funzionamento normale.</p>
</div>
</div>
</details>
<!-- FAQ 7: Bollette e tasse -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">receipt</i>
<div class="faq-title">Posso pagare bollette e tasse con i RIS?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<div class="note-box">
<i class="material-icons">close</i>
<strong>No, non è possibile.</strong> Bollette e tasse richiedono euro.
</div>
<p><strong>Ma ecco la strategia intelligente:</strong></p>
<div class="split-layout">
<div class="split-card euro">
<div class="split-header">
<div class="split-icon"></div>
<div class="split-title">Usa Euro Per</div>
</div>
<ul class="split-list">
<li>Bollette (luce, gas, acqua)</li>
<li>Tasse e imposte</li>
<li>Affitto o mutuo</li>
<li>Assicurazioni</li>
</ul>
</div>
<div class="split-card ris">
<div class="split-header">
<div class="split-icon">R</div>
<div class="split-title">Usa RIS Per</div>
</div>
<ul class="split-list">
<li>Cibo (ortaggi, pane locale)</li>
<li>Servizi (riparazioni, lezioni)</li>
<li>Abbigliamento</li>
<li>Tempo libero</li>
</ul>
</div>
</div>
<div class="success-box">
<i class="material-icons">trending_up</i>
I tuoi euro vanno molto più lontano se usi i RIS per tutto il resto!
</div>
</div>
</div>
</details>
<!-- FAQ 8: Come ottenere RIS senza euro -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">help</i>
<div class="faq-title">Se non ho euro, come posso ottenere RIS?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<div class="success-box">
<i class="material-icons">star</i>
<strong>Questo è il punto rivoluzionario:</strong> Non hai bisogno di avere RIS per iniziare!
</div>
<div class="comparison-grid">
<div class="comparison-card">
<div class="card-title">
<i class="material-icons">block</i>
Sistema Euro
</div>
<div class="card-items">
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Devi prima avere soldi → Lavori
settimane → Aspetti stipendio → Poi compri</p>
</div>
</div>
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">check_circle</i>
Sistema RISO
</div>
<div class="card-items">
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Compri SUBITO (vai in negativo) →
Ripaghi dopo offrendo beni/servizi</p>
</div>
</div>
</div>
<p><strong>Esempio Maria:</strong> Maria non ha euro ma sa cucire. Va da Giorgio e compra ortaggi
per 30 RIS (va a -30). Nei giorni dopo sistema vestiti per vari membri guadagnando 30 RIS. Torna
a zero. Ha mangiato oggi senza avere euro!</p>
<div class="success-box">
<i class="material-icons">lightbulb</i>
La tua capacità di offrire qualcosa diventa potere d'acquisto immediato!
</div>
</div>
</div>
</details>
<!-- FAQ 9: Differenze da altri sistemi -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">compare</i>
<div class="faq-title">Quali sono le differenze da altri sistemi di moneta alternativa?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>Differenza principale:</strong> Il RIS non è moneta "fiat" - ogni RIS rappresenta valore
reale produttivo.</p>
<div class="comparison-grid">
<div class="comparison-card">
<div class="card-title">Altri Sistemi</div>
<div class="card-items">
<div class="card-item yes">
<i class="material-icons">check</i>
<span>Bonus monete all'iscrizione</span>
</div>
<div class="card-item no">
<i class="material-icons">close</i>
<span>Valore basato solo su fiducia</span>
</div>
<div class="card-item no">
<i class="material-icons">close</i>
<span>Rischio schema Ponzi</span>
</div>
<div class="card-item no">
<i class="material-icons">close</i>
<span>Se chiude, perdi tutto</span>
</div>
</div>
</div>
<div class="comparison-card highlight">
<div class="card-title">RISO</div>
<div class="card-items">
<div class="card-item no">
<i class="material-icons">close</i>
<span>Niente bonus, parti da zero</span>
</div>
<div class="card-item yes">
<i class="material-icons">check</i>
<span>Ogni RIS = impegno reale</span>
</div>
<div class="card-item yes">
<i class="material-icons">check</i>
<span>Sempre bilanciato (+/- uguale)</span>
</div>
<div class="card-item yes">
<i class="material-icons">check</i>
<span>Credito garantito in euro</span>
</div>
</div>
</div>
</div>
<div class="success-box">
<i class="material-icons">verified</i>
<strong>Principio chiave:</strong> Ogni saldo positivo ha un corrispondente negativo.
Impossibile creare moneta dal nulla.
</div>
</div>
</div>
</details>
<!-- FAQ 10: Chiusura circuito -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">exit_to_app</i>
<div class="faq-title">Cosa succede se il circuito chiude o voglio uscire?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
```html
<p>Per capire se un sistema è affidabile, la domanda chiave da porsi è: <strong>se chiude domani,
tutti recuperano il
loro credito oppure qualcuno ci perde?</strong></p>
<p><strong>Il tuo credito è sempre garantito</strong> grazie al bilanciamento perfetto del sistema.
</p>
<div class="value-box">
<p style="font-weight: 600; margin-bottom: 0.75rem;">Esempio di chiusura:</p>
<div class="value-equation">
<span style="color: #10b981;">Creditori +1000 RIS</span>
<i class="material-icons">compare_arrows</i>
<span style="color: #f59e0b;">Debitori -1000 RIS</span>
</div>
<p style="font-size: 0.9rem; margin-top: 0.5rem;">Perfettamente bilanciato, sempre!</p>
</div>
<p><strong>Processo di chiusura:</strong></p>
<ol>
<li>Si cerca di compensare tutto con scambi diretti</li>
<li>Chi resta in negativo, se non riesce paga in euro</li>
<li>Chi ha crediti riceve euro</li>
</ol>
<div class="success-box">
<i class="material-icons">shield</i>
Il tuo credito è sempre coperto da impegni reali di persone reali. È una garanzia matematica,
non una promessa vaga.
</div>
</div>
</div>
</details>
<!-- FAQ 11: Accumulo -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">savings</i>
<div class="faq-title">Si può accumulare moneta? Ci sono limiti?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>Il sistema scoraggia l'accumulo</strong> per incentivare la circolazione della moneta.
</p>
<div class="limits-bar">
<p style="font-weight: 600; margin-bottom: 0.75rem;">Limiti di saldo suggeriti:</p>
<div class="bar-visual">
<div class="bar-segment danger">-100</div>
<div class="bar-segment safe">Zona Operativa</div>
<div class="bar-segment danger">+200</div>
</div>
<div class="bar-labels">
<span class="bar-label">Minimo -100 RIS</span>
<span class="bar-label">Massimo +200 RIS</span>
</div>
</div>
<div class="comparison-grid">
<div class="comparison-card">
<div class="card-title">
<i class="material-icons">trending_down</i>
Vicino a -100?
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Offri servizi o beni per guadagnare RIS e
risalire</p>
</div>
<div class="comparison-card">
<div class="card-title">
<i class="material-icons">trending_up</i>
Vicino a +200?
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Spendi i RIS per tornare operativo e far
circolare la moneta</p>
</div>
</div>
<div class="note-box">
<i class="material-icons">info</i>
<strong>Filosofia RISO:</strong> La moneta è uno strumento per scambiare, non ricchezza da
accumulare. La vera ricchezza è il benessere, le relazioni, il tempo libero.
</div>
</div>
</div>
</details>
<!-- FAQ 12: Trasparenza -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">visibility</i>
<div class="faq-title">Come funziona la trasparenza del sistema?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>RISO rende pubblici tutti i dati del circuito in tempo reale.</strong> Puoi sempre
verificare che i conti tornano.</p>
<div class="comparison-grid">
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">account_balance</i>
Totale Circolante
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Quanti RIS esistono nel circuito in questo
momento</p>
</div>
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">swap_horiz</i>
Totale Transato
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Volume di scambi dall'inizio del circuito
</p>
</div>
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">people</i>
Utenti Attivi
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Quanti hanno credito e quanti debito</p>
</div>
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">analytics</i>
Distribuzione
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Come sono distribuiti i saldi tra i membri
</p>
</div>
</div>
<div class="success-box">
<i class="material-icons">verified_user</i>
<strong>Garanzia matematica:</strong> Somma crediti = Somma debiti, SEMPRE. È impossibile che ci
sia squilibrio.
</div>
</div>
</div>
</details>
<!-- FAQ 13: Cosa si può scambiare -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">sync_alt</i>
<div class="faq-title">Cosa si può scambiare nei circuiti RISO?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>Tutto ciò che i partecipanti concordano di scambiarsi!</strong> Non ci sono liste
predefinite.</p>
<div class="comparison-grid">
<div class="comparison-card">
<div class="card-title">
<i class="material-icons">shopping_bag</i>
Beni
</div>
<ul style="font-size: 0.9rem; padding-left: 1.25rem; margin: 0.5rem 0;">
<li>Ortaggi e frutta</li>
<li>Prodotti artigianali</li>
<li>Pane e dolci</li>
<li>Abbigliamento usato</li>
<li>Mobili e oggetti</li>
<li>Libri e media</li>
</ul>
</div>
<div class="comparison-card">
<div class="card-title">
<i class="material-icons">build</i>
Servizi
</div>
<ul style="font-size: 0.9rem; padding-left: 1.25rem; margin: 0.5rem 0;">
<li>Riparazioni (idraulica, elettricità)</li>
<li>Lezioni (musica, lingue, sport)</li>
<li>Pulizie e manutenzioni</li>
<li>Ripetizioni scolastiche</li>
<li>Consulenze</li>
<li>Trasporti</li>
</ul>
</div>
</div>
<p><strong>Come decidere il prezzo?</strong> Usa il riferimento euro (20€ → 20 RIS). Il mercato ti
darà feedback: se nessuno compra, abbassa; se vendi tutto subito, alza leggermente.</p>
</div>
</div>
</details>
<!-- FAQ 14: Comunità Territoriali -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">location_city</i>
<div class="faq-title">Cosa sono le Comunità Territoriali?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>Gruppi di persone vicine fisicamente</strong> che si incontrano regolarmente per
scambiare e costruire relazioni.</p>
<div class="comparison-grid">
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">diversity_3</i>
Incontri Reali
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Non virtuale - persone che si vedono faccia
a faccia e costruiscono fiducia</p>
</div>
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">storefront</i>
Economia Locale
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">La ricchezza resta nel territorio invece di
fuggire verso grandi corporation</p>
</div>
<div class="comparison-card highlight">
<div class="card-title">
<i class="material-icons">account_balance_wallet</i>
Autonomia
</div>
<p style="font-size: 0.9rem; margin: 0.5rem 0;">Ogni CT decide le proprie regole e gestisce
il proprio circuito</p>
</div>
</div>
<p><strong>Dimensioni ideali:</strong></p>
<ul>
<li><strong>5-10 persone:</strong> Micro-CT, ottima per iniziare</li>
<li><strong>20-100 persone:</strong> Ideale - varietà + coesione</li>
<li><strong>100-500 persone:</strong> Grande - serve buona organizzazione</li>
</ul>
</div>
</div>
</details>
<!-- FAQ 15: Come iniziare -->
<details class="faq-item">
<div class="faq-question">
<i class="material-icons faq-icon">rocket_launch</i>
<div class="faq-title">Come posso iniziare o creare un circuito?</div>
<i class="material-icons faq-toggle">expand_more</i>
</div>
<div class="faq-answer">
<div class="faq-content">
<p><strong>Ci sono due modi principali per iniziare:</strong></p>
<div class="story-step">
<div class="step-header">
<div class="step-number">1</div>
<div class="step-title">Crea una Comunità</div>
</div>
<p style="font-size: 0.95rem; margin: 0.5rem 0;">Coinvolgi 10-20 persone della tua zona
interessate a scambiare. Organizza un incontro informativo, spiega il sistema, iniziate
insieme. Più siete, più varietà di scambi potrete fare.</p>
</div>
<div class="story-step">
<div class="step-header">
<div class="step-number">2</div>
<div class="step-title">Inizia da Solo</div>
</div>
<p style="font-size: 0.95rem; margin: 0.5rem 0;">Parti con 1-2 persone fidate, fate i primi
scambi, poi invitate altri man mano che vedono che funziona. Crescita organica e solida.</p>
</div>
<div class="success-box">
<i class="material-icons">info</i>
Iscriversi su <strong>riso.app</strong> è completamente gratuito. Non ci sono costi di adesione
o quote mensili!
</div>
<a href="https://riso.app" class="external-link" target="_blank">
<i class="material-icons">open_in_new</i>
Vai su riso.app per iniziare
</a>
</div>
</div>
</details>
<div class="row justify-center">
<h3 class="video-description">
Guarda il video di APPROFONDIMENTO per capire meglio come funziona il <strong>Sistema di Credito
Comunitario</strong>
</h3>
<div class="video-container">
<iframe src="https://rumble.com/embed/v1y2xfy/?pub=4" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</div>
<script>
// Accordion functionality
document.querySelectorAll('.faq-question').forEach(question => {
question.addEventListener('click', () => {
const faqItem = question.parentElement;
const isActive = faqItem.classList.contains('active');
// Close all other items
document.querySelectorAll('.faq-item').forEach(item => {
item.classList.remove('active');
});
// Toggle current item
if (!isActive) {
faqItem.classList.add('active');
}
});
});
</script>
</body>
</html>