JL Kruger
5422131782
Homepage (site/index.html): integration-v14 promoted, Writings section integrated with 33 pieces clustered by type (stories/essays/miscellany), Writings welcome lightbox, content frame at 98% opacity. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
798 lines
35 KiB
HTML
798 lines
35 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Digital Safety for Parents | 12-Week Course</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700&family=Noto+Emoji:wght@400;500;600&display=swap" rel="stylesheet">
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
:root {
|
|
--bg-primary: #0a0e1a;
|
|
--bg-secondary: #111827;
|
|
--glass-bg: rgba(17, 24, 39, 0.7);
|
|
--glass-border: rgba(255, 255, 255, 0.1);
|
|
--accent-green: #10b981;
|
|
--accent-blue: #3b82f6;
|
|
--accent-green-soft: rgba(16, 185, 129, 0.15);
|
|
--accent-blue-soft: rgba(59, 130, 246, 0.15);
|
|
--text-primary: #f9fafb;
|
|
--text-secondary: #d1d5db;
|
|
--text-muted: #9ca3af;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Noto Sans', 'Noto Emoji', sans-serif;
|
|
background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
|
|
background-attachment: fixed;
|
|
color: var(--text-primary);
|
|
line-height: 1.6;
|
|
min-height: 100vh;
|
|
padding: 20px;
|
|
}
|
|
|
|
.container {
|
|
max-width: 900px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
/* Header Section */
|
|
.header {
|
|
text-align: center;
|
|
margin-bottom: 3rem;
|
|
padding: 2rem 1rem;
|
|
}
|
|
|
|
.header h1 {
|
|
font-size: clamp(1.75rem, 5vw, 2.5rem);
|
|
font-weight: 700;
|
|
margin-bottom: 1rem;
|
|
background: linear-gradient(135deg, var(--accent-green) 0%, var(--accent-blue) 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
.header .subtitle {
|
|
font-size: clamp(1rem, 3vw, 1.25rem);
|
|
color: var(--text-secondary);
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
|
|
.header .tagline {
|
|
font-size: clamp(0.875rem, 2.5vw, 1rem);
|
|
color: var(--text-muted);
|
|
max-width: 600px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
/* Glass Card */
|
|
.glass-card {
|
|
background: var(--glass-bg);
|
|
backdrop-filter: blur(10px);
|
|
-webkit-backdrop-filter: blur(10px);
|
|
border-radius: 16px;
|
|
border: 1px solid var(--glass-border);
|
|
padding: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
/* Stats Section */
|
|
.stats {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
|
gap: 1rem;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.stat-card {
|
|
background: var(--glass-bg);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 12px;
|
|
border: 1px solid var(--glass-border);
|
|
padding: 1.25rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.stat-card .value {
|
|
font-size: 1.75rem;
|
|
font-weight: 700;
|
|
background: linear-gradient(135deg, var(--accent-green) 0%, var(--accent-blue) 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.stat-card .label {
|
|
font-size: 0.875rem;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
/* CTA Section */
|
|
.cta-section {
|
|
background: linear-gradient(135deg, var(--accent-green-soft) 0%, var(--accent-blue-soft) 100%);
|
|
border: 1px solid var(--glass-border);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 16px;
|
|
padding: 2rem;
|
|
text-align: center;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.cta-section h2 {
|
|
font-size: clamp(1.25rem, 4vw, 1.75rem);
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.cta-section p {
|
|
color: var(--text-secondary);
|
|
margin-bottom: 1.5rem;
|
|
font-size: clamp(0.875rem, 2.5vw, 1rem);
|
|
}
|
|
|
|
.btn-primary {
|
|
display: inline-block;
|
|
background: linear-gradient(135deg, var(--accent-green) 0%, var(--accent-blue) 100%);
|
|
color: white;
|
|
padding: 0.875rem 2rem;
|
|
border-radius: 8px;
|
|
text-decoration: none;
|
|
font-weight: 600;
|
|
font-size: 1rem;
|
|
transition: transform 0.2s, box-shadow 0.2s;
|
|
box-shadow: 0 4px 14px 0 rgba(16, 185, 129, 0.3);
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 6px 20px 0 rgba(16, 185, 129, 0.4);
|
|
}
|
|
|
|
/* Section Headers */
|
|
.section-header {
|
|
font-size: clamp(1.25rem, 3.5vw, 1.5rem);
|
|
font-weight: 600;
|
|
margin-bottom: 1.5rem;
|
|
padding-left: 1rem;
|
|
border-left: 4px solid var(--accent-green);
|
|
}
|
|
|
|
/* Accordion */
|
|
.accordion-item {
|
|
background: var(--glass-bg);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 12px;
|
|
border: 1px solid var(--glass-border);
|
|
margin-bottom: 0.75rem;
|
|
overflow: hidden;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.accordion-item:hover {
|
|
border-color: rgba(16, 185, 129, 0.3);
|
|
}
|
|
|
|
.accordion-header {
|
|
padding: 1.25rem;
|
|
cursor: pointer;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
user-select: none;
|
|
}
|
|
|
|
.accordion-header:hover {
|
|
background: rgba(255, 255, 255, 0.05);
|
|
}
|
|
|
|
.accordion-title {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.75rem;
|
|
flex: 1;
|
|
}
|
|
|
|
.session-number {
|
|
font-size: 0.875rem;
|
|
font-weight: 600;
|
|
color: var(--accent-green);
|
|
background: var(--accent-green-soft);
|
|
padding: 0.25rem 0.625rem;
|
|
border-radius: 6px;
|
|
min-width: 60px;
|
|
text-align: center;
|
|
}
|
|
|
|
.session-title {
|
|
font-weight: 600;
|
|
font-size: clamp(0.875rem, 2.5vw, 1rem);
|
|
color: var(--text-primary);
|
|
flex: 1;
|
|
}
|
|
|
|
.accordion-icon {
|
|
font-size: 1.25rem;
|
|
transition: transform 0.3s ease;
|
|
color: var(--accent-blue);
|
|
}
|
|
|
|
.accordion-item.active .accordion-icon {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
.accordion-content {
|
|
max-height: 0;
|
|
overflow: hidden;
|
|
transition: max-height 0.4s ease, padding 0.4s ease;
|
|
}
|
|
|
|
.accordion-item.active .accordion-content {
|
|
max-height: 2000px;
|
|
padding: 0 1.25rem 1.25rem 1.25rem;
|
|
}
|
|
|
|
.accordion-body {
|
|
color: var(--text-secondary);
|
|
font-size: clamp(0.875rem, 2.5vw, 0.9375rem);
|
|
}
|
|
|
|
.accordion-body h4 {
|
|
color: var(--text-primary);
|
|
font-size: 1rem;
|
|
margin-top: 1rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.accordion-body ul {
|
|
margin-left: 1.5rem;
|
|
margin-top: 0.5rem;
|
|
}
|
|
|
|
.accordion-body li {
|
|
margin-bottom: 0.5rem;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.duration {
|
|
font-size: 0.75rem;
|
|
color: var(--text-muted);
|
|
margin-top: 0.5rem;
|
|
}
|
|
|
|
/* Key Topics Pills */
|
|
.topics {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 0.5rem;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.topic-pill {
|
|
background: var(--accent-blue-soft);
|
|
border: 1px solid rgba(59, 130, 246, 0.3);
|
|
color: var(--accent-blue);
|
|
padding: 0.375rem 0.75rem;
|
|
border-radius: 20px;
|
|
font-size: 0.8125rem;
|
|
font-weight: 500;
|
|
}
|
|
|
|
/* Footer */
|
|
.footer {
|
|
text-align: center;
|
|
margin-top: 3rem;
|
|
padding: 2rem 1rem;
|
|
color: var(--text-muted);
|
|
font-size: 0.875rem;
|
|
}
|
|
|
|
.footer .framework {
|
|
margin-top: 1rem;
|
|
padding: 1rem;
|
|
background: var(--glass-bg);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 8px;
|
|
border: 1px solid var(--glass-border);
|
|
}
|
|
|
|
/* Responsive adjustments */
|
|
@media (max-width: 640px) {
|
|
body {
|
|
padding: 15px;
|
|
}
|
|
|
|
.header {
|
|
margin-bottom: 2rem;
|
|
padding: 1rem 0.5rem;
|
|
}
|
|
|
|
.glass-card {
|
|
padding: 1.25rem;
|
|
}
|
|
|
|
.stat-card {
|
|
padding: 1rem;
|
|
}
|
|
|
|
.cta-section {
|
|
padding: 1.5rem;
|
|
}
|
|
|
|
.accordion-header {
|
|
padding: 1rem;
|
|
}
|
|
|
|
.accordion-item.active .accordion-content {
|
|
padding: 0 1rem 1rem 1rem;
|
|
}
|
|
|
|
.session-number {
|
|
font-size: 0.75rem;
|
|
min-width: 50px;
|
|
}
|
|
|
|
.session-title {
|
|
font-size: 0.875rem;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<!-- Header -->
|
|
<header class="header">
|
|
<h1>🛡️ Digital Safety for Parents</h1>
|
|
<p class="subtitle">Protecting Preteens & Teens in a Converged World</p>
|
|
<p class="tagline">A 12-session course on the intersection of smartphones, social media, and AI—where threats multiply and traditional safety advice fails.</p>
|
|
</header>
|
|
|
|
<!-- Stats -->
|
|
<div class="stats">
|
|
<div class="stat-card">
|
|
<div class="value">12</div>
|
|
<div class="label">Sessions</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="value">25min</div>
|
|
<div class="label">Per Session</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="value">3SC</div>
|
|
<div class="label">Framework</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="value">Practical</div>
|
|
<div class="label">Action Items</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CTA Section -->
|
|
<div class="cta-section">
|
|
<h2>Why This Course Matters Now</h2>
|
|
<p>$16.6 billion in losses in 2024. 442% surge in voice phishing attacks. 79% of attacks now operate malware-free through AI-powered social engineering. Your teen faces threats you didn't grow up with—and traditional advice doesn't work anymore.</p>
|
|
<a href="#contact" class="btn-primary">Enroll Your Community</a>
|
|
</div>
|
|
|
|
<!-- What You'll Learn -->
|
|
<div class="glass-card">
|
|
<h2 class="section-header">What You'll Master</h2>
|
|
<ul style="list-style: none; color: var(--text-secondary);">
|
|
<li style="margin-bottom: 0.75rem;">✅ Configure critical security settings across iOS and Android</li>
|
|
<li style="margin-bottom: 0.75rem;">✅ Recognize AI-powered scams targeting your family (deepfakes, voice cloning)</li>
|
|
<li style="margin-bottom: 0.75rem;">✅ Navigate platform governance documents and identify high-risk features</li>
|
|
<li style="margin-bottom: 0.75rem;">✅ Build communication patterns that encourage disclosure, not secrecy</li>
|
|
<li style="margin-bottom: 0.75rem;">✅ Establish sustainable family digital agreements that evolve with maturity</li>
|
|
<li style="margin-bottom: 0.75rem;">✅ Understand AI systems your teen uses daily—capabilities and limitations</li>
|
|
<li style="margin-bottom: 0.75rem;">✅ Respond effectively to cyberbullying, predatory contact, and crisis situations</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Course Structure -->
|
|
<h2 class="section-header" style="margin-top: 2rem;">Course Structure</h2>
|
|
|
|
<!-- Introduction -->
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 1</span>
|
|
<span class="session-title">The Convergence Crisis</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>Understand why smartphone + social internet + AI creates multiplicative (not additive) threats. Recognize the current landscape facing teens in 2024-2025.</p>
|
|
<h4>Key Topics:</h4>
|
|
<div class="topics">
|
|
<span class="topic-pill">$16.6B in 2024 losses</span>
|
|
<span class="topic-pill">Malware-free attacks</span>
|
|
<span class="topic-pill">Three-domain framework</span>
|
|
<span class="topic-pill">Teen vulnerability</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Smartphones Section -->
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 2</span>
|
|
<span class="session-title">📱 The Invisible Data Collectors</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>Your teen's phone contains 11+ sensors collecting data you don't see. Accelerometers infer passwords. Motion sensors map daily routines. AI turns "innocuous" sensors into surveillance tools.</p>
|
|
<h4>What You'll Do:</h4>
|
|
<ul>
|
|
<li>Audit location permissions across iOS/Android</li>
|
|
<li>Disable cross-app tracking</li>
|
|
<li>Configure Screen Time and Family Link</li>
|
|
<li>Review which apps access cameras, microphones, sensors</li>
|
|
</ul>
|
|
<div class="topics">
|
|
<span class="topic-pill">11+ sensor types</span>
|
|
<span class="topic-pill">AI inference threats</span>
|
|
<span class="topic-pill">Platform settings</span>
|
|
<span class="topic-pill">Privacy audit</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Complete security checklist</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 3</span>
|
|
<span class="session-title">🔐 Account Security & Attack Vectors</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>24% increase in account takeovers. 26 billion credential stuffing attempts monthly. The average person has 146 exposed credentials on dark web marketplaces. AI bots test them all simultaneously.</p>
|
|
<h4>What You'll Learn:</h4>
|
|
<ul>
|
|
<li>Why SMS-based 2FA fails (SIM swapping, MFA fatigue attacks)</li>
|
|
<li>Better authentication: authenticator apps, security keys, passkeys</li>
|
|
<li>Compromise indicators and immediate response protocols</li>
|
|
<li>Which accounts need MFA immediately (email = master key)</li>
|
|
</ul>
|
|
<div class="topics">
|
|
<span class="topic-pill">Account takeover crisis</span>
|
|
<span class="topic-pill">Multi-factor auth</span>
|
|
<span class="topic-pill">Compromise response</span>
|
|
<span class="topic-pill">Dark web credentials</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Set up authenticator app</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 4</span>
|
|
<span class="session-title">⚖️ Family Agreements & Sustainable Monitoring</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>Heavy restrictions correlate with increased risky behavior. The goal: communication over control, negotiation over restriction. Build agreements that preserve trust while providing appropriate oversight.</p>
|
|
<h4>Framework Components:</h4>
|
|
<ul>
|
|
<li>Device-free zones and times (negotiated, not dictated)</li>
|
|
<li>App approval processes that explain risks</li>
|
|
<li>Problem reporting without fear of device confiscation</li>
|
|
<li>Age-appropriate gradients (10-12 vs. 13-15 vs. 16-17)</li>
|
|
<li>Monitoring tools: benefits, costs, and trust trade-offs</li>
|
|
</ul>
|
|
<div class="topics">
|
|
<span class="topic-pill">Trust building</span>
|
|
<span class="topic-pill">Family agreements</span>
|
|
<span class="topic-pill">Age-appropriate rules</span>
|
|
<span class="topic-pill">Monitoring options</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Draft family agreement</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Social Internet Section -->
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 5</span>
|
|
<span class="session-title">📄 Platform Governance & Terms of Service</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>Your teen clicked "I Agree" to 50+ legal documents they never read. Meta's 2025 update: all private messages are now AI training data. No opt-out. Retroactive application to existing content.</p>
|
|
<h4>Deceptive Patterns:</h4>
|
|
<ul>
|
|
<li>"Including but not limited to" = unlimited permission grants</li>
|
|
<li>"We may share with third parties" = your data is sold</li>
|
|
<li>"You waive the right to" = you can't sue us</li>
|
|
<li>Platform-specific high-risk features (Snap Map, Discord servers, TikTok algorithm)</li>
|
|
</ul>
|
|
<div class="topics">
|
|
<span class="topic-pill">ToS deception</span>
|
|
<span class="topic-pill">Privacy policies</span>
|
|
<span class="topic-pill">Platform risks</span>
|
|
<span class="topic-pill">AI training rights</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: ToS scavenger hunt</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 6</span>
|
|
<span class="session-title">🎮 Current Threat Landscape</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>Gaming platforms are now the primary attack vector. Roblox receives 10,000+ monthly sextortion reports. Discord serves as migration platform for predators. Voice chat bypasses safety filters.</p>
|
|
<h4>Critical Threats:</h4>
|
|
<ul>
|
|
<li><strong>AI-Enhanced Attacks:</strong> "Nudify" apps, deepfake harassment (Lancaster County: 20 students targeted)</li>
|
|
<li><strong>Voice Cloning Scams:</strong> Family impersonation with 85% accuracy from 20 seconds of audio</li>
|
|
<li><strong>Sextortion Patterns:</strong> Why teens don't report (37% never tell anyone)</li>
|
|
<li><strong>Cyberbullying 2.0:</strong> AI amplification, synthetic content, platform hopping</li>
|
|
</ul>
|
|
<div class="topics">
|
|
<span class="topic-pill">Gaming dangers</span>
|
|
<span class="topic-pill">Deepfakes</span>
|
|
<span class="topic-pill">Voice cloning</span>
|
|
<span class="topic-pill">Sextortion</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Review teen's gaming contacts</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 7</span>
|
|
<span class="session-title">🧠 Algorithm Awareness & Information Quality</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>TikTok can create user dependency within 260 videos (35 minutes). Algorithms can push harmful content within 2.6-8 minutes. AI-generated misinformation receives 8% more engagement than human content.</p>
|
|
<h4>The STOP Method (Teach This to Teens):</h4>
|
|
<ul>
|
|
<li><strong>S</strong>ource: Who created this? Why? What's their motivation?</li>
|
|
<li><strong>T</strong>iming: When was this created? Current or recycled?</li>
|
|
<li><strong>O</strong>ther sources: What do credible sources say?</li>
|
|
<li><strong>P</strong>urpose: What is this trying to make me think or do?</li>
|
|
</ul>
|
|
<div class="topics">
|
|
<span class="topic-pill">Filter bubbles</span>
|
|
<span class="topic-pill">Radicalization</span>
|
|
<span class="topic-pill">AI misinformation</span>
|
|
<span class="topic-pill">STOP verification</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Practice STOP method</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 8</span>
|
|
<span class="session-title">💬 Family Communication & Crisis Response</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>Why teens don't tell parents: fear of losing device, shame, belief you won't understand. Build disclosure-friendly communication that encourages help-seeking instead of secrecy.</p>
|
|
<h4>The Five Cs Framework:</h4>
|
|
<ul>
|
|
<li><strong>Child-Centered:</strong> Adapt to individual temperament, acknowledge emotions</li>
|
|
<li><strong>Content:</strong> Discuss quality and appropriateness without immediate prohibition</li>
|
|
<li><strong>Context:</strong> When, where, and how digital interactions occur matters</li>
|
|
<li><strong>Connection:</strong> Emphasize healthy relationships over platform features</li>
|
|
<li><strong>Calm:</strong> Your emotional regulation enables their disclosure</li>
|
|
</ul>
|
|
<div class="topics">
|
|
<span class="topic-pill">Five Cs</span>
|
|
<span class="topic-pill">Crisis protocols</span>
|
|
<span class="topic-pill">Disclosure patterns</span>
|
|
<span class="topic-pill">Professional help</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Identify crisis resources</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- AI Systems Section -->
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 9</span>
|
|
<span class="session-title">🤖 Understanding "Pattern Creatures"</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>AI systems are pattern-matching creatures, not thinking beings. Trained on billions of examples, they predict likely outputs—but hallucinate false information 16-48% of the time.</p>
|
|
<h4>Four Types Teens Encounter:</h4>
|
|
<ul>
|
|
<li><strong>Conversational AI:</strong> ChatGPT, Snapchat My AI (54% use for homework)</li>
|
|
<li><strong>Recommendation AI:</strong> TikTok, YouTube algorithms (optimize engagement, not wellbeing)</li>
|
|
<li><strong>Voice AI:</strong> Siri, Alexa (struggle with teen speech, lack safety filtering)</li>
|
|
<li><strong>Generative AI:</strong> Image/video creators ("nudify" apps, deepfake tools)</li>
|
|
</ul>
|
|
<div class="topics">
|
|
<span class="topic-pill">AI limitations</span>
|
|
<span class="topic-pill">Hallucinations</span>
|
|
<span class="topic-pill">Pattern matching</span>
|
|
<span class="topic-pill">Four types</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Audit AI use</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 10</span>
|
|
<span class="session-title">🔍 AI Detection & Critical Evaluation</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>Humans detect high-quality deepfakes only 24.5% of the time—worse than random chance. Detection is hard. Verification is essential.</p>
|
|
<h4>The Paradigm Shift:</h4>
|
|
<ul>
|
|
<li>OLD: "Can I tell if this is AI?"</li>
|
|
<li>NEW: "How can I verify this is authentic?"</li>
|
|
<li>Visual artifacts: anatomical impossibilities, lighting issues, over-perfection</li>
|
|
<li>Text patterns: overly formal, no personal details, perfect grammar</li>
|
|
<li>Audio/video: unnatural prosody, sync issues, blurring</li>
|
|
</ul>
|
|
<p><strong>Focus: STOP verification method > artifact detection</strong></p>
|
|
<div class="topics">
|
|
<span class="topic-pill">Detection limits</span>
|
|
<span class="topic-pill">Verification focus</span>
|
|
<span class="topic-pill">Visual artifacts</span>
|
|
<span class="topic-pill">STOP method</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Practice detection</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 11</span>
|
|
<span class="session-title">✅ Safe & Productive AI Use</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>54% of children use AI for homework. Teachers use detection tools. Colleges treat AI plagiarism seriously. Establish clear family policies before problems arise.</p>
|
|
<h4>Family AI Use Agreement:</h4>
|
|
<ul>
|
|
<li><strong>Disclosure:</strong> "I used AI to help with [specific task]"</li>
|
|
<li><strong>Authorship:</strong> Final product must reflect student learning</li>
|
|
<li><strong>Verification:</strong> All AI information verified through reliable sources</li>
|
|
<li><strong>Age-Appropriate:</strong> 10-12 requires supervision, 13-15 guided use, 16-17 comprehensive attribution</li>
|
|
</ul>
|
|
<h4>Legitimate Uses:</h4>
|
|
<p>Brainstorming, outlining, research starting points, editing assistance, learning support—with verification and disclosure.</p>
|
|
<div class="topics">
|
|
<span class="topic-pill">Academic integrity</span>
|
|
<span class="topic-pill">AI policies</span>
|
|
<span class="topic-pill">Productive use</span>
|
|
<span class="topic-pill">Emerging platforms</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Action: Draft AI use policy</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Wrap-Up -->
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" onclick="toggleAccordion(this)">
|
|
<div class="accordion-title">
|
|
<span class="session-number">Session 12</span>
|
|
<span class="session-title">🎯 Sustainable Practices & Long-Term Strategy</span>
|
|
</div>
|
|
<span class="accordion-icon">▼</span>
|
|
</div>
|
|
<div class="accordion-content">
|
|
<div class="accordion-body">
|
|
<p>Review the 3SC framework. Create sustainable weekly routines. Develop adaptability for emerging technologies. Establish ongoing education and support networks.</p>
|
|
<h4>Your Commitments:</h4>
|
|
<ul>
|
|
<li><strong>This Week:</strong> Implement one security change per device, have one disclosure-friendly conversation</li>
|
|
<li><strong>This Month:</strong> Weekly family tech check-ins, complete security audit, practice STOP method</li>
|
|
<li><strong>Long-Term:</strong> Communication over control, evolving rules, staying informed, seeking help when needed</li>
|
|
</ul>
|
|
<h4>The Goal:</h4>
|
|
<p>Graduating a capable digital citizen who doesn't need you hovering. You cannot create perfect safety. You can build a relationship where they come to you with problems.</p>
|
|
<div class="topics">
|
|
<span class="topic-pill">3SC review</span>
|
|
<span class="topic-pill">Sustainable routines</span>
|
|
<span class="topic-pill">Community support</span>
|
|
<span class="topic-pill">Ongoing learning</span>
|
|
</div>
|
|
<p class="duration">Duration: 25 minutes | Outcome: Confident, adaptive parenting</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Bottom CTA -->
|
|
<div class="cta-section" style="margin-top: 3rem;">
|
|
<h2>Ready to Protect Your Teen?</h2>
|
|
<p>This course provides foundations, not comprehensive expertise. Technology evolves constantly—commit to ongoing learning, community support, and adaptive parenting that prioritizes relationship over rules.</p>
|
|
<a href="#contact" class="btn-primary">Bring This Course to Your Community</a>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer">
|
|
<div class="framework">
|
|
<strong>Built on the 3SC Framework</strong><br>
|
|
<span style="color: var(--accent-green);">SAFE</span> (Caution) •
|
|
<span style="color: var(--accent-blue);">SANE</span> (Courage) •
|
|
<span style="color: var(--text-primary);">SAGE</span> (Competence)
|
|
</div>
|
|
<p style="margin-top: 1rem;">Digital Safety Foundations | 12-Session Parent Education Course</p>
|
|
<p style="font-size: 0.75rem; margin-top: 0.5rem;">Course materials designed for non-technical community facilitators delivering evidence-based digital literacy education</p>
|
|
</footer>
|
|
</div>
|
|
|
|
<script>
|
|
function toggleAccordion(header) {
|
|
const item = header.parentElement;
|
|
const wasActive = item.classList.contains('active');
|
|
|
|
// Close all accordion items
|
|
document.querySelectorAll('.accordion-item').forEach(i => {
|
|
i.classList.remove('active');
|
|
});
|
|
|
|
// Open clicked item if it wasn't active
|
|
if (!wasActive) {
|
|
item.classList.add('active');
|
|
}
|
|
}
|
|
|
|
// Optional: Open first accordion item by default on desktop
|
|
if (window.innerWidth > 768) {
|
|
document.querySelector('.accordion-item .accordion-header')?.click();
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |