The Five Layers is a framework for examining your beliefs. Not to judge them or dismiss them, but to understand where they came from, whether they’re still serving you, and what they protect you from.
Use this interactive tool to work through each layer. Be specific. The more honest you get, the more you’ll learn about yourself.
The Five Layers – Belief Examination Framework * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: ‘Georgia’, serif; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); min-height: 100vh; padding: 40px 20px; color: #333; } .container { max-width: 900px; margin: 0 auto; background: white; border-radius: 12px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); overflow: hidden; } .header { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 50px 40px; text-align: center; } .header h1 { font-size: 2.5em; margin-bottom: 10px; } .header p { font-size: 1.1em; opacity: 0.95; font-style: italic; } .content { padding: 40px; } .intro { background: #f8f9ff; padding: 25px; border-left: 5px solid #667eea; margin-bottom: 40px; border-radius: 4px; line-height: 1.8; } .intro p { margin-bottom: 12px; } .layers { display: grid; gap: 30px; margin-bottom: 40px; } .layer { border: 2px solid #e0e0e0; border-radius: 8px; padding: 30px; transition: all 0.3s ease; background: #fafafa; } .layer:hover { border-color: #667eea; box-shadow: 0 5px 20px rgba(102, 126, 234, 0.15); transform: translateY(-2px); } .layer-number { display: inline-block; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; width: 45px; height: 45px; border-radius: 50%; text-align: center; line-height: 45px; font-size: 1.3em; font-weight: bold; margin-bottom: 15px; } .layer-title { font-size: 1.5em; color: #764ba2; margin-bottom: 12px; font-weight: bold; } .layer-description { color: #555; line-height: 1.7; margin-bottom: 15px; } .layer-example { background: white; padding: 15px; border-left: 4px solid #667eea; margin-top: 15px; font-style: italic; color: #666; border-radius: 4px; } .example-label { font-weight: bold; color: #764ba2; font-style: normal; display: block; margin-bottom: 8px; } .final-question { background: linear-gradient(135deg, #fff5e6 0%, #ffe8cc 100%); padding: 35px; border-radius: 8px; border: 2px solid #ffd699; margin-bottom: 30px; text-align: center; } .final-question h3 { font-size: 1.5em; color: #d97706; margin-bottom: 15px; } .final-question p { font-size: 1.1em; color: #b45309; line-height: 1.8; } .button-group { display: flex; gap: 15px; justify-content: center; margin-top: 20px; } .btn { padding: 12px 30px; border: none; border-radius: 6px; font-size: 1em; cursor: pointer; transition: all 0.3s ease; font-weight: bold; } .btn-love { background: #10b981; color: white; } .btn-love:hover { background: #059669; transform: scale(1.05); } .btn-fear { background: #ef4444; color: white; } .btn-fear:hover { background: #dc2626; transform: scale(1.05); } .result { margin-top: 30px; padding: 20px; border-radius: 8px; text-align: center; font-size: 1.1em; font-weight: bold; display: none; } .result.show { display: block; } .result.love { background: #d1fae5; color: #065f46; border: 2px solid #10b981; } .result.fear { background: #fee2e2; color: #7f1d1d; border: 2px solid #ef4444; } .footer { background: #f0f4ff; padding: 30px 40px; text-align: center; color: #666; border-top: 1px solid #e0e0e0; font-size: 0.95em; } @media (max-width: 600px) { .header h1 { font-size: 1.8em; } .content { padding: 25px; } .layer { padding: 20px; } }The Five Layers
A Framework for Examining Your Beliefs
What is this? This framework helps you understand where your beliefs come from and whether they’re still serving you. It’s not about being right or wrong. It’s about getting honest with yourself.
Work through each layer. Be specific. The more real you get, the more you’ll learn.
The Final Question
Is this belief rooted in LOVE or FEAR?
Love means: doing something because it matters, because you care, because it’s connected to what you actually want.
Fear means: doing something to protect yourself from pain, to stay safe, to avoid risk.
${result.message}`; resultDiv.className = `result show ${type}`; resultDiv.scrollIntoView({ behavior: ‘smooth’, block: ‘nearest’ }); }
Leave a comment