Add files via upload

This commit is contained in:
Rosario Moscato
2025-09-08 10:02:03 +02:00
committed by GitHub
commit 10e6e1b3d4
3 changed files with 3687 additions and 0 deletions

583
app.js Normal file
View File

@@ -0,0 +1,583 @@
class PresentationApp {
constructor() {
this.currentSlide = 1;
this.totalSlides = 26;
this.isFullscreen = false;
this.autoAdvance = false;
this.autoAdvanceInterval = null;
this.touchStartX = 0;
this.touchStartY = 0;
this.init();
}
init() {
this.setupElements();
this.setupEventListeners();
this.updateDisplay();
this.preloadSlides();
}
setupElements() {
this.slidesContainer = document.getElementById('slidesContainer');
this.slides = document.querySelectorAll('.slide');
this.prevBtn = document.getElementById('prevBtn');
this.nextBtn = document.getElementById('nextBtn');
this.currentSlideSpan = document.getElementById('currentSlide');
this.totalSlidesSpan = document.getElementById('totalSlides');
this.progressFill = document.querySelector('.progress-fill');
this.fullscreenBtn = document.getElementById('fullscreenBtn');
this.overviewBtn = document.getElementById('overviewBtn');
// Update total slides display
this.totalSlidesSpan.textContent = this.totalSlides;
}
setupEventListeners() {
// Navigation buttons
this.prevBtn.addEventListener('click', () => this.previousSlide());
this.nextBtn.addEventListener('click', () => this.nextSlide());
// Keyboard navigation
document.addEventListener('keydown', (e) => {
switch(e.key) {
case 'ArrowRight':
case ' ':
case 'PageDown':
e.preventDefault();
this.nextSlide();
break;
case 'ArrowLeft':
case 'PageUp':
e.preventDefault();
this.previousSlide();
break;
case 'Home':
e.preventDefault();
this.goToSlide(1);
break;
case 'End':
e.preventDefault();
this.goToSlide(this.totalSlides);
break;
case 'Escape':
if (this.isFullscreen) {
this.exitFullscreen();
}
break;
case 'f':
case 'F':
this.toggleFullscreen();
break;
}
});
// Click to advance
this.slidesContainer.addEventListener('click', (e) => {
// Don't advance if clicking on interactive elements
if (e.target.tagName === 'BUTTON' || e.target.closest('button')) {
return;
}
this.nextSlide();
});
// Touch/swipe support
this.slidesContainer.addEventListener('touchstart', (e) => {
this.touchStartX = e.touches[0].clientX;
this.touchStartY = e.touches[0].clientY;
}, { passive: true });
this.slidesContainer.addEventListener('touchend', (e) => {
if (!this.touchStartX || !this.touchStartY) return;
const touchEndX = e.changedTouches[0].clientX;
const touchEndY = e.changedTouches[0].clientY;
const deltaX = this.touchStartX - touchEndX;
const deltaY = this.touchStartY - touchEndY;
// Check if horizontal swipe is more significant than vertical
if (Math.abs(deltaX) > Math.abs(deltaY)) {
if (Math.abs(deltaX) > 50) { // Minimum swipe distance
if (deltaX > 0) {
this.nextSlide();
} else {
this.previousSlide();
}
}
}
this.touchStartX = 0;
this.touchStartY = 0;
}, { passive: true });
// Control buttons
this.fullscreenBtn.addEventListener('click', () => this.toggleFullscreen());
this.overviewBtn.addEventListener('click', () => this.showOverview());
// Fullscreen change events
document.addEventListener('fullscreenchange', () => {
this.isFullscreen = !this.isFullscreen;
this.updateFullscreenButton();
});
// Prevent context menu on right click
document.addEventListener('contextmenu', (e) => {
e.preventDefault();
});
// Handle window resize
window.addEventListener('resize', () => {
this.handleResize();
});
}
preloadSlides() {
// Add entrance animations to bullet points
this.slides.forEach((slide, index) => {
const bullets = slide.querySelectorAll('.bullet-list li');
bullets.forEach((bullet, bulletIndex) => {
bullet.style.animationDelay = `${(bulletIndex + 1) * 0.1}s`;
});
});
}
nextSlide() {
if (this.currentSlide < this.totalSlides) {
this.goToSlide(this.currentSlide + 1);
}
}
previousSlide() {
if (this.currentSlide > 1) {
this.goToSlide(this.currentSlide - 1);
}
}
goToSlide(slideNumber) {
if (slideNumber < 1 || slideNumber > this.totalSlides) return;
// Remove active class from current slide
const currentSlideElement = document.querySelector('.slide.active');
if (currentSlideElement) {
currentSlideElement.classList.remove('active');
currentSlideElement.classList.add('prev');
}
// Add active class to new slide
const newSlideElement = document.querySelector(`[data-slide="${slideNumber}"]`);
if (newSlideElement) {
// Remove prev class from all slides
this.slides.forEach(slide => slide.classList.remove('prev'));
newSlideElement.classList.add('active');
// Trigger entrance animations
this.triggerSlideAnimations(newSlideElement);
}
this.currentSlide = slideNumber;
this.updateDisplay();
}
triggerSlideAnimations(slideElement) {
// Reset and trigger bullet point animations
const bullets = slideElement.querySelectorAll('.bullet-list li');
bullets.forEach((bullet, index) => {
bullet.style.animation = 'none';
bullet.offsetHeight; // Trigger reflow
bullet.style.animation = `fadeInUp 0.6s ease-out ${(index + 1) * 0.1}s both`;
});
// Trigger other element animations
const animatedElements = slideElement.querySelectorAll('.aspect-card, .transform-item, .mode-card');
animatedElements.forEach((element, index) => {
element.style.transform = 'translateY(20px)';
element.style.opacity = '0';
setTimeout(() => {
element.style.transition = 'all 0.6s ease-out';
element.style.transform = 'translateY(0)';
element.style.opacity = '1';
}, (index + 1) * 100);
});
}
updateDisplay() {
// Update slide counter
this.currentSlideSpan.textContent = this.currentSlide;
// Update progress bar
const progress = (this.currentSlide / this.totalSlides) * 100;
this.progressFill.style.width = `${progress}%`;
// Update navigation buttons
this.prevBtn.disabled = this.currentSlide === 1;
this.nextBtn.disabled = this.currentSlide === this.totalSlides;
// Update button opacity based on state
this.prevBtn.style.opacity = this.currentSlide === 1 ? '0.5' : '1';
this.nextBtn.style.opacity = this.currentSlide === this.totalSlides ? '0.5' : '1';
}
toggleFullscreen() {
if (!this.isFullscreen) {
this.enterFullscreen();
} else {
this.exitFullscreen();
}
}
enterFullscreen() {
const element = document.documentElement;
if (element.requestFullscreen) {
element.requestFullscreen();
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullscreen) {
element.webkitRequestFullscreen();
} else if (element.msRequestFullscreen) {
element.msRequestFullscreen();
}
}
exitFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
}
updateFullscreenButton() {
this.fullscreenBtn.textContent = this.isFullscreen ? '⛶' : '⛶';
this.fullscreenBtn.title = this.isFullscreen ? 'Exit Fullscreen' : 'Enter Fullscreen';
}
showOverview() {
// Create overview modal
const modal = document.createElement('div');
modal.className = 'overview-modal';
modal.innerHTML = `
<div class="overview-content">
<div class="overview-header">
<h2>Slide Overview</h2>
<button class="close-overview">×</button>
</div>
<div class="overview-grid">
${this.generateOverviewThumbnails()}
</div>
</div>
`;
// Add modal styles
const style = document.createElement('style');
style.textContent = `
.overview-modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.9);
z-index: 2000;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
box-sizing: border-box;
}
.overview-content {
background: white;
border-radius: 15px;
padding: 30px;
max-width: 1200px;
max-height: 90vh;
overflow-y: auto;
width: 100%;
}
.overview-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
border-bottom: 2px solid #3498db;
padding-bottom: 15px;
}
.overview-header h2 {
color: #2c3e50;
margin: 0;
}
.close-overview {
background: #e74c3c;
color: white;
border: none;
width: 35px;
height: 35px;
border-radius: 50%;
font-size: 20px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.close-overview:hover {
background: #c0392b;
}
.overview-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 20px;
}
.overview-slide {
background: #f8f9fa;
border: 2px solid #e9ecef;
border-radius: 10px;
padding: 15px;
cursor: pointer;
transition: all 0.3s ease;
text-align: center;
}
.overview-slide:hover {
border-color: #3498db;
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(52, 152, 219, 0.3);
}
.overview-slide.current {
border-color: #27ae60;
background: rgba(39, 174, 96, 0.1);
}
.overview-slide-number {
background: #3498db;
color: white;
border-radius: 50%;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
margin: 0 auto 10px;
}
.overview-slide.current .overview-slide-number {
background: #27ae60;
}
.overview-slide-title {
font-size: 0.9rem;
color: #2c3e50;
font-weight: 600;
line-height: 1.3;
}
`;
document.head.appendChild(style);
document.body.appendChild(modal);
// Add event listeners
modal.querySelector('.close-overview').addEventListener('click', () => {
document.body.removeChild(modal);
document.head.removeChild(style);
});
modal.addEventListener('click', (e) => {
if (e.target === modal) {
document.body.removeChild(modal);
document.head.removeChild(style);
}
});
// Add slide navigation
modal.querySelectorAll('.overview-slide').forEach((slide, index) => {
slide.addEventListener('click', () => {
this.goToSlide(index + 1);
document.body.removeChild(modal);
document.head.removeChild(style);
});
});
}
generateOverviewThumbnails() {
const slideTitles = [
"Title Slide",
"Abstract",
"Introduction: AI in Creation",
"Theological Foundations",
"The Language of Imago Dei",
"Teilhard's Digital Noosphere",
"The Two Books and Digital Code",
"AI as a Semantic System",
"Semantic Grounding",
"Artificial Consciousness",
"Language Bridge",
"Behavioral Transformations",
"Research Changes",
"Philosophical Reasoning",
"AI-Assisted Theology",
"Ethical Dimensions",
"Church's Magisterium",
"Ethics of Algorithms",
"Theological Governance",
"Conclusions",
"Theology for Digital Age",
"Gift and Responsibility",
"Toward Digital Hope",
"Questions and Answers",
"Sample Q&A",
"Continue the Dialogue"
];
return slideTitles.map((title, index) => {
const slideNumber = index + 1;
const currentClass = slideNumber === this.currentSlide ? 'current' : '';
return `
<div class="overview-slide ${currentClass}" data-slide="${slideNumber}">
<div class="overview-slide-number">${slideNumber}</div>
<div class="overview-slide-title">${title}</div>
</div>
`;
}).join('');
}
handleResize() {
// Adjust layout for different screen sizes
const slideContents = document.querySelectorAll('.slide-content');
slideContents.forEach(content => {
if (window.innerWidth < 768) {
content.style.fontSize = '0.9rem';
} else {
content.style.fontSize = '';
}
});
}
// Auto-advance functionality
startAutoAdvance(intervalSeconds = 30) {
this.stopAutoAdvance();
this.autoAdvance = true;
this.autoAdvanceInterval = setInterval(() => {
if (this.currentSlide < this.totalSlides) {
this.nextSlide();
} else {
this.stopAutoAdvance();
}
}, intervalSeconds * 1000);
}
stopAutoAdvance() {
if (this.autoAdvanceInterval) {
clearInterval(this.autoAdvanceInterval);
this.autoAdvanceInterval = null;
}
this.autoAdvance = false;
}
// Utility methods
addCustomEventListeners() {
// Add number key navigation
document.addEventListener('keydown', (e) => {
if (e.key >= '1' && e.key <= '9') {
const slideNumber = parseInt(e.key);
if (slideNumber <= this.totalSlides) {
this.goToSlide(slideNumber);
}
}
});
// Add mouse wheel navigation
document.addEventListener('wheel', (e) => {
if (Math.abs(e.deltaY) > 50) {
if (e.deltaY > 0) {
this.nextSlide();
} else {
this.previousSlide();
}
}
}, { passive: true });
}
// Initialize additional features
initializeAdvancedFeatures() {
this.addCustomEventListeners();
// Add presentation timer
this.startTime = Date.now();
// Add slide visit tracking
this.slideVisits = new Array(this.totalSlides).fill(0);
this.slideVisits[0] = 1; // First slide visited
// Update visit count when slide changes
const originalGoToSlide = this.goToSlide.bind(this);
this.goToSlide = function(slideNumber) {
originalGoToSlide(slideNumber);
if (slideNumber >= 1 && slideNumber <= this.totalSlides) {
this.slideVisits[slideNumber - 1]++;
}
};
}
// Get presentation statistics
getPresentationStats() {
const currentTime = Date.now();
const duration = Math.floor((currentTime - this.startTime) / 1000);
const minutes = Math.floor(duration / 60);
const seconds = duration % 60;
return {
duration: `${minutes}:${seconds.toString().padStart(2, '0')}`,
currentSlide: this.currentSlide,
totalSlides: this.totalSlides,
progress: `${Math.round((this.currentSlide / this.totalSlides) * 100)}%`,
slideVisits: this.slideVisits
};
}
}
// Initialize the presentation when DOM is loaded
document.addEventListener('DOMContentLoaded', () => {
const presentation = new PresentationApp();
presentation.initializeAdvancedFeatures();
// Expose to global scope for debugging
window.presentation = presentation;
// Add some helpful console commands
console.log('Presentation loaded! Available commands:');
console.log('- presentation.goToSlide(n) - Go to slide n');
console.log('- presentation.nextSlide() - Next slide');
console.log('- presentation.previousSlide() - Previous slide');
console.log('- presentation.toggleFullscreen() - Toggle fullscreen');
console.log('- presentation.showOverview() - Show slide overview');
console.log('- presentation.startAutoAdvance(seconds) - Start auto-advance');
console.log('- presentation.stopAutoAdvance() - Stop auto-advance');
console.log('- presentation.getPresentationStats() - Get presentation statistics');
});
// Add some additional utility functions
window.addEventListener('load', () => {
// Smooth scroll behavior for any internal links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
const target = document.querySelector(this.getAttribute('href'));
if (target) {
target.scrollIntoView({
behavior: 'smooth'
});
}
});
});
// Add loading animation completion
setTimeout(() => {
document.body.classList.add('loaded');
}, 100);
});
// Export for potential module use
if (typeof module !== 'undefined' && module.exports) {
module.exports = PresentationApp;
}

676
index.html Normal file
View File

@@ -0,0 +1,676 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AI as a New Language of Creation - Theological Presentation</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="presentation-container">
<!-- Progress Bar -->
<div class="progress-bar">
<div class="progress-fill"></div>
</div>
<!-- Navigation Controls -->
<div class="nav-controls">
<button class="nav-btn prev-btn" id="prevBtn"></button>
<div class="slide-counter">
<span id="currentSlide">1</span> / <span id="totalSlides">26</span>
</div>
<button class="nav-btn next-btn" id="nextBtn"></button>
</div>
<!-- Slide Container -->
<div class="slides-container" id="slidesContainer">
<!-- Slide 1: Title -->
<div class="slide active" data-slide="1">
<div class="slide-content title-slide">
<h1 class="slide-title">Artificial Intelligence as a New Language of Creation</h1>
<h2 class="slide-subtitle">Toward a Theological Understanding of the Dialogue between Machines and Divine Mystery</h2>
<div class="speaker-info">
<p class="speaker-name">Rosario Moscato</p>
<p class="event-details">XII Latin American Congress of Science and Religion</p>
<p class="event-details">September 10-12, 2025</p>
<p class="location">Pontifical Athenaeum Regina Apostolorum, Rome</p>
</div>
</div>
</div>
<!-- Slide 2: Abstract -->
<div class="slide" data-slide="2">
<div class="slide-content">
<h2 class="slide-heading">Abstract</h2>
<div class="content-block">
<p class="abstract-text">This presentation explores artificial intelligence as an emerging <strong>'language of creation'</strong> in the context of the XII Latin American Congress of Science and Religion.</p>
<p class="abstract-text">Through an interdisciplinary approach that integrates <strong>theology</strong>, <strong>philosophy</strong>, and <strong>computational sciences</strong>, we analyze how AI represents a new medium through which humanity, created in God's image, participates in the divine creative act.</p>
</div>
</div>
</div>
<!-- Slide 3: Introduction -->
<div class="slide" data-slide="3">
<div class="slide-content">
<h2 class="slide-heading">Introduction: AI in the Language of Creation</h2>
<div class="content-block">
<p class="intro-text">The theme that brings us together today - <strong>'The languages of creation'</strong> - acquires an extraordinarily current dimension when we consider the emergence of artificial intelligence.</p>
<div class="highlight-box">
<p>AI represents a new language through which humanity interacts with reality and, potentially, with the divine.</p>
</div>
</div>
</div>
</div>
<!-- Slide 4: Theological Foundations -->
<div class="slide" data-slide="4">
<div class="slide-content">
<h2 class="slide-heading">Theological Foundations: AI in the Economy of Creation</h2>
<div class="content-block">
<ul class="bullet-list">
<li>AI as part of God's creative plan</li>
<li>Technology serving human dignity</li>
<li>The co-creative dimension of human nature</li>
<li>Responsibility in technological development</li>
</ul>
<div class="quote-box">
<p>"Technological progress is part of God's plan for creation, but people must take responsibility for using technologies like artificial intelligence to help humanity."</p>
</div>
</div>
</div>
</div>
<!-- Slide 5: Imago Dei -->
<div class="slide" data-slide="5">
<div class="slide-content">
<h2 class="slide-heading">The Language of the Imago Dei</h2>
<div class="content-block">
<p class="main-text">The Christian tradition teaches us that the human being, created in God's image (<em>imago Dei</em>), participates in divine creativity.</p>
<div class="reflection-box">
<h3>Reflection Question:</h3>
<p>When we design artificial intelligence systems, are we not exercising this co-creative dimension of our nature?</p>
</div>
<div class="key-point">
<p><strong>Key Insight:</strong> Human beings are created in the image of God, while AI is created in the image of humanity.</p>
</div>
</div>
</div>
</div>
<!-- Slide 6: Teilhard's Digital Noosphere -->
<div class="slide" data-slide="6">
<div class="slide-content">
<h2 class="slide-heading">Teilhard's Digital Noosphere</h2>
<div class="content-block">
<p class="intro-text">Today, with our interconnected digital reality, Teilhard's vision becomes tangible:</p>
<div class="stats-grid">
<div class="stat-item">
<span class="stat-number">8 billion</span>
<span class="stat-label">Connected devices</span>
</div>
<div class="stat-item">
<span class="stat-number">30 million</span>
<span class="stat-label">Internet servers</span>
</div>
<div class="stat-item">
<span class="stat-number">480 trillion</span>
<span class="stat-label">AI tokens processed monthly</span>
</div>
</div>
<div class="conclusion-text">
<p>The Teilhardian noosphere is no longer a mystical vision, but a <strong>tangible reality</strong>.</p>
</div>
</div>
</div>
</div>
<!-- Slide 7: The Two Books -->
<div class="slide" data-slide="7">
<div class="slide-content">
<h2 class="slide-heading">The Two Books and Digital Code</h2>
<div class="content-block">
<div class="two-books">
<div class="book-item">
<h3>Book of Scripture</h3>
<p>Divine revelation through written word</p>
</div>
<div class="book-item">
<h3>Book of Nature</h3>
<p>Divine revelation through creation</p>
</div>
</div>
<div class="digital-addition">
<h3>+ Digital Code</h3>
<p>A new language of creation emerging through human ingenuity, reflecting the <em>imago Dei</em></p>
</div>
</div>
</div>
</div>
<!-- Slide 8: AI as Semantic System -->
<div class="slide" data-slide="8">
<div class="slide-content">
<h2 class="slide-heading">AI as a Semantic System: Language and Meaning</h2>
<div class="content-block">
<p class="intro-text">Large language models represent a revolution in machine language processing:</p>
<div class="ai-models">
<span class="model-tag">GPT-4</span>
<span class="model-tag">Claude 4</span>
<span class="model-tag">Gemini</span>
</div>
<div class="capabilities-list">
<h3>Beyond 'Stochastic Parrots':</h3>
<ul>
<li>Functional understanding</li>
<li>Social comprehension</li>
<li>Causal reasoning</li>
<li>Semantic grounding</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Slide 9: Semantic Grounding -->
<div class="slide" data-slide="9">
<div class="slide-content">
<h2 class="slide-heading">Semantic Grounding in Large Language Models</h2>
<div class="content-block">
<div class="grounding-aspects">
<div class="aspect-card">
<h3>Functional Grounding</h3>
<p>Understanding purpose and utility</p>
</div>
<div class="aspect-card">
<h3>Social Grounding</h3>
<p>Context-aware communication</p>
</div>
<div class="aspect-card">
<h3>Causal Grounding</h3>
<p>Cause-effect relationships</p>
</div>
</div>
<div class="key-insight">
<p><strong>Intelligence accumulates through thinking machines that process information.</strong></p>
</div>
</div>
</div>
</div>
<!-- Slide 10: Artificial Consciousness -->
<div class="slide" data-slide="10">
<div class="slide-content">
<h2 class="slide-heading">The Question of Artificial Consciousness</h2>
<div class="content-block">
<div class="consciousness-debate">
<div class="debate-side">
<h3>Current AI</h3>
<ul>
<li>Sophisticated information processing</li>
<li>Pattern recognition</li>
<li>Complex responses</li>
</ul>
</div>
<div class="vs-divider">VS</div>
<div class="debate-side">
<h3>True Consciousness</h3>
<ul>
<li>Self-awareness</li>
<li>Subjective experience</li>
<li>Genuine understanding</li>
</ul>
</div>
</div>
<div class="theological-question">
<p><strong>Theological Question:</strong> If AI developed true consciousness, would it have a soul?</p>
</div>
</div>
</div>
</div>
<!-- Slide 11: Language Bridge -->
<div class="slide" data-slide="11">
<div class="slide-content">
<h2 class="slide-heading">Language as a Bridge between Finite and Infinite</h2>
<div class="content-block">
<div class="bridge-concept">
<div class="finite-side">
<h3>Finite</h3>
<p>Human understanding</p>
<p>Limited processing</p>
<p>Temporal existence</p>
</div>
<div class="bridge-arrow"></div>
<div class="infinite-side">
<h3>Infinite</h3>
<p>Divine mystery</p>
<p>Unlimited wisdom</p>
<p>Eternal truth</p>
</div>
</div>
<div class="bridge-text">
<p>AI serves as a new medium for this ancient dialogue between human and divine</p>
</div>
</div>
</div>
</div>
<!-- Slide 12: Behavioral Transformations -->
<div class="slide" data-slide="12">
<div class="slide-content">
<h2 class="slide-heading">Behavioral Transformations: How AI Modifies Human Thought</h2>
<div class="content-block">
<p class="intro-text">AI is radically transforming our cognitive processes:</p>
<div class="transformation-grid-2x2">
<div class="transform-item">
<h3>Information Access</h3>
<p>Instant access to vast knowledge bases</p>
</div>
<div class="transform-item">
<h3>Question Formation</h3>
<p>Modified approach to inquiry</p>
</div>
<div class="transform-item">
<h3>Research Methods</h3>
<p>New pathways to discovery</p>
</div>
<div class="transform-item">
<h3>Information Synthesis</h3>
<p>Enhanced analytical capabilities</p>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 13: Research Changes -->
<div class="slide" data-slide="13">
<div class="slide-content">
<h2 class="slide-heading">Changes in Research and Knowledge Processes</h2>
<div class="content-block">
<div class="research-evolution">
<div class="before-after">
<div class="before">
<h3>Traditional Research</h3>
<ul>
<li>Linear information gathering</li>
<li>Limited source accessibility</li>
<li>Sequential analysis</li>
<li>Individual cognitive limits</li>
</ul>
</div>
<div class="after">
<h3>AI-Enhanced Research</h3>
<ul>
<li>Multi-dimensional exploration</li>
<li>Global knowledge access</li>
<li>Parallel processing</li>
<li>Augmented human intelligence</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 14: Philosophical Reasoning -->
<div class="slide" data-slide="14">
<div class="slide-content">
<h2 class="slide-heading">New Modalities of Philosophical Reasoning</h2>
<div class="content-block">
<div class="reasoning-modes">
<div class="mode-card">
<h3>Computational Philosophy</h3>
<p>Logical processing at scale</p>
</div>
<div class="mode-card">
<h3>Assisted Argumentation</h3>
<p>AI-supported logical structures</p>
</div>
<div class="mode-card">
<h3>Pattern Recognition</h3>
<p>Identifying philosophical connections</p>
</div>
<div class="mode-card">
<h3>Systematic Analysis</h3>
<p>Comprehensive examination of ideas</p>
</div>
</div>
<div class="caution-note">
<p><strong>Important:</strong> AI complements but cannot replace human philosophical intuition and wisdom</p>
</div>
</div>
</div>
</div>
<!-- Slide 15: AI-Assisted Theology -->
<div class="slide" data-slide="15">
<div class="slide-content">
<h2 class="slide-heading">AI-Assisted Theological Speculation</h2>
<div class="content-block">
<div class="theology-applications">
<div class="app-item">
<h3>Scripture Analysis</h3>
<p>Cross-referencing and linguistic analysis</p>
</div>
<div class="app-item">
<h3>Patristic Studies</h3>
<p>Comprehensive Church Father analysis</p>
</div>
<div class="app-item">
<h3>Systematic Theology</h3>
<p>Connecting doctrinal elements</p>
</div>
<div class="app-item">
<h3>Comparative Religion</h3>
<p>Interfaith dialogue enhancement</p>
</div>
</div>
<div class="theological-principle">
<p><strong>Principle:</strong> AI serves the theologian, not the reverse</p>
</div>
</div>
</div>
</div>
<!-- Slide 16: Ethical Dimensions -->
<div class="slide" data-slide="16">
<div class="slide-content">
<h2 class="slide-heading">Ethical Dimensions: Responsibility in Digital Co-Creation</h2>
<div class="content-block">
<div class="vatican-document">
<h3>Vatican Document "Antiqua et Nova" (January 2025)</h3>
<div class="principles-grid">
<div class="principle-card">
<h4>Technological Subsidiarity</h4>
<p>Technology serves human flourishing</p>
</div>
<div class="principle-card">
<h4>Human Dignity Protection</h4>
<p>Preserving the sacred nature of humanity</p>
</div>
<div class="principle-card">
<h4>Shared Responsibility</h4>
<p>Developers, users, and institutions</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 17: Church's Magisterium -->
<div class="slide" data-slide="17">
<div class="slide-content">
<h2 class="slide-heading">The Church's Magisterium and AI</h2>
<div class="content-block">
<div class="magisterium-guidance">
<div class="guidance-item">
<h3>Moral Framework</h3>
<p>Establishing ethical boundaries for AI development</p>
</div>
<div class="guidance-item">
<h3>Pastoral Care</h3>
<p>Addressing AI's impact on human relationships</p>
</div>
<div class="guidance-item">
<h3>Social Teaching</h3>
<p>AI's role in promoting common good</p>
</div>
</div>
<div class="church-role">
<p><strong>The Church's Role:</strong> Providing moral compass for technological advancement</p>
</div>
</div>
</div>
</div>
<!-- Slide 18: Ethics of Algorithms -->
<div class="slide" data-slide="18">
<div class="slide-content">
<h2 class="slide-heading">The Ethics of Algorithms</h2>
<div class="content-block">
<div class="ethical-concerns">
<div class="concern-category">
<h3>Transparency</h3>
<ul>
<li>Explainable AI decisions</li>
<li>Open algorithmic processes</li>
</ul>
</div>
<div class="concern-category">
<h3>Fairness</h3>
<ul>
<li>Bias prevention</li>
<li>Equal treatment</li>
</ul>
</div>
<div class="concern-category">
<h3>Accountability</h3>
<ul>
<li>Clear responsibility chains</li>
<li>Error correction mechanisms</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 19: Theologically Informed Governance -->
<div class="slide" data-slide="19">
<div class="slide-content">
<h2 class="slide-heading">Toward Theologically Informed Governance</h2>
<div class="content-block">
<div class="governance-framework">
<div class="framework-pillar">
<h3>Anthropological Foundation</h3>
<p>Rooted in human dignity and divine image</p>
</div>
<div class="framework-pillar">
<h3>Eschatological Vision</h3>
<p>Oriented toward ultimate human fulfillment</p>
</div>
<div class="framework-pillar">
<h3>Prudential Wisdom</h3>
<p>Practical discernment in implementation</p>
</div>
</div>
<div class="integration-call">
<p><strong>Call to Action:</strong> Integrating theological wisdom into AI governance structures</p>
</div>
</div>
</div>
</div>
<!-- Slide 20: Conclusions -->
<div class="slide" data-slide="20">
<div class="slide-content">
<h2 class="slide-heading">Conclusions: AI as a Language of Hope?</h2>
<div class="content-block">
<div class="conclusion-points">
<div class="point-item">
<h3>Theological Perspective</h3>
<p>AI as part of divine providence when used properly</p>
</div>
<div class="point-item">
<h3>Human Dignity</h3>
<p>Technology must serve human flourishing</p>
</div>
<div class="point-item">
<h3>Co-Creation</h3>
<p>Humans as responsible partners in creation</p>
</div>
</div>
<div class="scriptural-foundation">
<div class="quote-box">
<p>"All things work together for good" (Romans 8:28)</p>
<p class="quote-note">This includes artificial intelligence, when developed according to Gospel criteria</p>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 21: Theology for Digital Age -->
<div class="slide" data-slide="21">
<div class="slide-content">
<h2 class="slide-heading">A Theology for the Digital Age</h2>
<div class="content-block">
<div class="digital-theology">
<div class="theology-aspect">
<h3>Incarnational Perspective</h3>
<p>God's presence in digital spaces</p>
</div>
<div class="theology-aspect">
<h3>Trinitarian Model</h3>
<p>Relational understanding of intelligence</p>
</div>
<div class="theology-aspect">
<h3>Pneumatological Dimension</h3>
<p>The Spirit's work through human creativity</p>
</div>
</div>
<div class="synthesis-text">
<p>A comprehensive theological framework for understanding AI's place in God's creation</p>
</div>
</div>
</div>
</div>
<!-- Slide 22: Gift and Responsibility -->
<div class="slide" data-slide="22">
<div class="slide-content">
<h2 class="slide-heading">AI as Gift and Responsibility</h2>
<div class="content-block">
<div class="dual-nature">
<div class="nature-side">
<h3>AI as Gift</h3>
<ul>
<li>Enhances human capabilities</li>
<li>Solves complex problems</li>
<li>Promotes human welfare</li>
<li>Expands understanding</li>
</ul>
</div>
<div class="nature-side">
<h3>AI as Responsibility</h3>
<ul>
<li>Requires ethical development</li>
<li>Demands wise governance</li>
<li>Needs moral discernment</li>
<li>Calls for human oversight</li>
</ul>
</div>
</div>
<div class="balance-principle">
<p><strong>Balance:</strong> Embracing the gift while accepting the responsibility</p>
</div>
</div>
</div>
</div>
<!-- Slide 23: Digital Hope -->
<div class="slide" data-slide="23">
<div class="slide-content">
<h2 class="slide-heading">Toward Digital Hope</h2>
<div class="content-block">
<div class="hope-dimensions">
<div class="hope-item">
<h3>Technological Optimism</h3>
<p>Grounded in theological anthropology</p>
</div>
<div class="hope-item">
<h3>Cautious Wisdom</h3>
<p>Tempered by moral prudence</p>
</div>
<div class="hope-item">
<h3>Active Engagement</h3>
<p>Participating in AI's development</p>
</div>
</div>
<div class="hope-vision">
<div class="vision-text">
<h3>Vision:</h3>
<p>AI serving the Kingdom of God through human flourishing and cosmic transformation</p>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 24: Q&A Introduction -->
<div class="slide" data-slide="24">
<div class="slide-content">
<h2 class="slide-heading">Questions and Answers</h2>
<div class="content-block qa-intro">
<div class="qa-welcome">
<h3>Discussion Time</h3>
<p>Let's explore together the theological implications of artificial intelligence</p>
</div>
<div class="qa-topics">
<h4>Topics for Discussion:</h4>
<ul>
<li>Theological foundations of AI</li>
<li>Ethical considerations</li>
<li>Consciousness and the soul</li>
<li>Practical applications</li>
<li>Future implications</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Slide 25: Sample Q&A -->
<div class="slide" data-slide="25">
<div class="slide-content">
<h2 class="slide-heading">Frequently Asked Questions</h2>
<div class="content-block">
<div class="qa-item">
<h3 class="question">Q: Doesn't AI risk replacing God in human life?</h3>
<div class="answer">
<p><strong>A:</strong> AI, however sophisticated, remains a tool created by human intelligence, which in turn is a gift from God. AI cannot replicate the transcendent dimension of human intelligence - the capacity for relationship with God, the experience of the sacred, authentic moral freedom.</p>
</div>
</div>
<div class="qa-item">
<h3 class="question">Q: If AI developed true consciousness, would it have a soul?</h3>
<div class="answer">
<p><strong>A:</strong> This is one of the deepest questions of contemporary theology. Catholic tradition teaches that the human soul is created directly by God and does not emerge from material complexity alone.</p>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 26: Thank You -->
<div class="slide" data-slide="26">
<div class="slide-content thank-you-slide">
<h1 class="thank-you-title">Continue the Dialogue</h1>
<h2 class="slide-subtitle">AI as a New Language of Creation in Service of Human Dignity</h2>
<div class="closing-message">
<p class="closing-text">For further discussion and collaboration</p>
</div>
<div class="contact-info">
<h3>Continue the Conversation</h3>
<p>Rosario Moscato</p>
<p>Email: rosario.moscato@etik.com</p>
<p>XII Latin American Congress of Science and Religion</p>
<p>Pontifical Athenaeum Regina Apostolorum, Rome</p>
<p>September 10-12, 2025</p>
</div>
</div>
</div>
</div>
<!-- Additional Controls -->
<div class="bottom-controls">
<button class="control-btn" id="fullscreenBtn"></button>
<button class="control-btn" id="overviewBtn"></button>
</div>
</div>
<script src="app.js"></script>
</body>
</html>

2428
style.css Normal file

File diff suppressed because it is too large Load Diff