.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px,1fr)); gap: 2rem; }
.card { background: var(--bg-panel); border: 1px solid var(--border-card); padding: 2.5rem; transition: transform 0.2s ease, box-shadow 0.2s ease; display: flex; flex-direction: column; box-shadow: 0 8px 24px rgba(12,18,28,0.04); border-radius: 6px; }
.card:hover { transform: translateY(-4px); border-color: #aebfd1; box-shadow: 0 12px 32px rgba(12,18,28,0.08); }
.card-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 1.5rem; }
.card h3 { font-size: 1.4rem; margin-bottom: 1.5rem; color: var(--text-main); }
.card-content { flex-grow: 1; margin-bottom: 2rem; display: flex; flex-direction: column; gap: 0.8rem; }
.card-line { font-size: 1rem; color: var(--text-muted); line-height: 1.5; }
.card-line strong { color: var(--text-main); font-weight: 700; }
.card .btn { margin-top: auto; }

.cert-showcase { background: var(--bg-panel); border: 1px solid var(--border-card); border-top: 4px solid var(--accent-gold); padding: 4rem 3rem; border-radius: 6px; box-shadow: 0 8px 24px rgba(12,18,28,0.04); max-width: 800px; margin: 0 auto; text-align: left; }
.cert-showcase h2 { font-size: 2.2rem; margin-bottom: 1rem; color: var(--text-main); text-align: center; }
.cert-showcase p { font-size: 1.1rem; color: var(--text-muted); line-height: 1.7; margin-bottom: 1.2rem; }
.cert-showcase ul { padding-left: 1.5rem; margin-bottom: 1.2rem; }
.cert-showcase ul li { font-size: 1.1rem; color: var(--text-muted); line-height: 1.7; margin-bottom: 0.5rem; }
.cert-showcase > p.intro { font-size: 1.15rem; color: var(--text-main); line-height: 1.7; margin-bottom: 1.5rem; }
.manifesto-box { background: var(--bg-panel); border: 1px solid var(--border-card); padding: 3.5rem; border-radius: 6px; box-shadow: 0 8px 24px rgba(12,18,28,0.04); max-width: 900px; margin: 0 auto; }
.manifesto-text { font-size: 1.2rem; color: var(--text-main); line-height: 1.8; }
.manifesto-highlight { font-family: var(--font-mono); font-size: 0.95rem; text-transform: uppercase; letter-spacing: 1px; color: var(--accent-gold-dark); font-weight: 700; display: block; margin-top: 1.5rem; }

.story-block { margin-bottom: 2.5rem; }
.story-block:last-of-type { margin-bottom: 0; }
.story-block h3 { font-family: var(--font-mono); font-size: 1.2rem; color: var(--text-main); margin-bottom: 1rem; text-transform: uppercase; letter-spacing: 1px; border-bottom: 1px solid var(--border-faint); padding-bottom: 0.5rem; }
.story-block p { font-size: 1.15rem; color: var(--text-muted); line-height: 1.8; margin-bottom: 1rem; }
.story-block ul { margin-bottom: 1.5rem; padding-left: 2rem; }
.story-block ul li { font-size: 1.15rem; color: var(--text-muted); line-height: 1.8; margin-bottom: 0.6rem; }

.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: -5rem; position: relative; z-index: 10; }
.tier-card { background: var(--bg-panel); border: 1px solid var(--border-card); border-radius: 6px; padding: 2.5rem; display: flex; flex-direction: column; box-shadow: 0 8px 24px rgba(12,18,28,0.04); transition: transform 0.2s ease; }
.tier-card:hover { transform: translateY(-5px); }
.tier-card.featured { border: 2px solid var(--accent-gold); box-shadow: 0 12px 32px rgba(212,175,55,0.15); position: relative; transform: scale(1.02); }
.tier-card.featured:hover { transform: scale(1.02) translateY(-5px); }
.featured-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--accent-gold); color: var(--bg-dark-edge); font-family: var(--font-mono); font-size: 0.75rem; font-weight: 700; padding: 0.3rem 1rem; border-radius: 20px; text-transform: uppercase; letter-spacing: 1px; }
.tier-name { font-family: var(--font-mono); font-size: 1rem; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); margin-bottom: 1rem; font-weight: 700; }
.featured .tier-name { color: var(--accent-gold-dark); }
.tier-price { font-size: 3rem; font-weight: 800; color: var(--text-main); line-height: 1; margin-bottom: 0.5rem; }
.tier-desc { font-size: 0.95rem; color: var(--text-muted); margin-bottom: 2rem; min-height: 45px; }
.feature-list { list-style: none; margin-bottom: 2.5rem; flex-grow: 1; }
.feature-list li { margin-bottom: 1rem; font-size: 0.95rem; display: flex; gap: 0.8rem; color: var(--text-main); }
.feature-list li::before { content: "✓"; color: #1e5c3a; font-weight: bold; }
.feature-list li.disabled { color: #a9bed6; }
.feature-list li.disabled::before { content: "—"; color: #c4d4e6; }
.pricing-grid .btn { padding: 1.1rem; border: 2px solid var(--text-main); width: 100%; }
.btn-featured { background: var(--accent-gold); color: var(--bg-dark-edge); border-color: var(--accent-gold) !important; }
.btn-featured:hover { background: var(--bg-panel); color: var(--accent-gold-dark); }
.class-btn-current-disabled { opacity: 0.5 !important; cursor: not-allowed !important; }

.cert-meta { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.cert-meta h3 { font-size: 1.3rem; color: var(--text-main); margin: 0; }
.cert-meta p { font-family: var(--font-mono); font-size: 0.9rem; color: var(--text-muted); }
.rule-block { margin-bottom: 2.5rem; }
.rule-block:last-of-type { margin-bottom: 0; }
.rule-block h3 { font-size: 1.3rem; color: var(--text-main); margin-bottom: 0.8rem; display: flex; align-items: baseline; gap: 0.6rem; }
.rule-block p { font-size: 1.1rem; color: var(--text-muted); line-height: 1.7; }
.rule-number { font-family: var(--font-mono); color: var(--accent-gold-dark); font-size: 1rem; font-weight: 700; }
.syllabus-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin: 2rem 0; }
.syllabus-col h4 { font-family: var(--font-mono); font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px; color: var(--text-main); margin-bottom: 1rem; border-bottom: 1px solid var(--border-faint); padding-bottom: 0.5rem; }
.syllabus-col ul { list-style: none; padding: 0; }
.syllabus-col ul li { position: relative; padding-left: 1.5rem; margin-bottom: 0.8rem; color: var(--text-muted); font-size: 1.05rem; }
.syllabus-col ul li::before { content: "→"; position: absolute; left: 0; color: var(--accent-gold-dark); font-family: var(--font-mono); }

.bottom-cta { text-align: center; border-top: 1px solid var(--border-card); border-bottom: 1px solid var(--border-card); background: rgba(255,255,255,0.7); backdrop-filter: blur(8px); padding: 5rem 0; }
.bottom-cta h2 { font-size: 2.8rem; margin-bottom: 1rem; color: var(--text-main); }
.bottom-cta p { color: var(--text-muted); font-size: 1.15rem; max-width: 600px; margin: 0 auto 3rem; }
.bottom-cta .hero-actions { justify-content: center; gap: 1.5rem; }

.legal-block { margin-bottom: 2.5rem; }
.legal-block:last-of-type { margin-bottom: 0; }
.legal-block h3 { font-size: 1.4rem; margin-bottom: 0.8rem; color: var(--text-main); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 1px; }
.legal-block p, .legal-block ul { font-size: 1.1rem; color: var(--text-muted); line-height: 1.7; margin-bottom: 1rem; }
.legal-block ul { padding-left: 2rem; }
.legal-block li { margin-bottom: 0.5rem; }

.discord-box { background: var(--bg-panel); border: 1px solid var(--border-card); border-top: 4px solid #5865F2; padding: 4rem 3rem; border-radius: 6px; box-shadow: 0 8px 24px rgba(12,18,28,0.04); max-width: 750px; margin: 0 auto; text-align: center; }
.discord-box h2 { font-size: 2.2rem; margin-bottom: 1rem; color: var(--text-main); }
.discord-box p { font-size: 1.1rem; color: var(--text-muted); margin-bottom: 2.5rem; line-height: 1.7; max-width: 600px; margin-left: auto; margin-right: auto; }
.discord-icon { width: 24px; height: 24px; fill: currentColor; }
.btn-discord { display: inline-flex; align-items: center; justify-content: center; gap: 0.8rem; background-color: #5865F2; color: #ffffff; border: 2px solid #5865F2; font-family: var(--font-mono); font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px; padding: 1.1rem 2.4rem; border-radius: 4px; font-weight: 700; text-decoration: none; transition: all 0.2s; box-shadow: 0 4px 15px rgba(88,101,242,0.25); }
.btn-discord:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(88,101,242,0.35); background-color: #4752C4; border-color: #4752C4; color: white; }
.discord-icon-mask { display: inline-block; width: 24px; height: 24px; background-color: currentColor; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 97'><path d='M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a67.55,67.55,0,0,1-10.87,5.19,77.7,77.7,0,0,0,6.89,11.1,105.25,105.25,0,0,0,32.19-16.14h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.31,60,73.31,53s5-12.74,11.43-12.74S96.2,46,96.1,53,91.08,65.69,84.69,65.69Z'/></svg>") no-repeat center/contain; -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 97'><path d='M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a67.55,67.55,0,0,1-10.87,5.19,77.7,77.7,0,0,0,6.89,11.1,105.25,105.25,0,0,0,32.19-16.14h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.31,60,73.31,53s5-12.74,11.43-12.74S96.2,46,96.1,53,91.08,65.69,84.69,65.69Z'/></svg>") no-repeat center/contain; }

.error-layout { background: radial-gradient(circle at center, var(--bg-dark-center) 0%, var(--bg-dark-edge) 100%); color: var(--text-light); height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; text-align: center; }
.error-container { position: relative; z-index: 10; padding: 2rem; max-width: 600px; }
.error-container h1 { font-size: 3.5rem; font-weight: 800; letter-spacing: -1px; margin-bottom: 1.5rem; text-shadow: 0 4px 20px rgba(0,0,0,0.4); }
.error-container p { color: var(--text-muted-dark); font-size: 1.2rem; line-height: 1.6; margin-bottom: 3rem; }
.error-container .btn { display: inline-block; background-color: var(--accent-gold); color: #000000; border: 2px solid var(--accent-gold); box-shadow: 0 4px 15px rgba(212,175,55,0.25); }
.error-container .btn:hover { background-color: #ffffff; border-color: #ffffff; color: var(--bg-dark-edge); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(255,255,255,0.2); }

.section-pb-8 { padding-bottom: 8rem; }
.section-py-4-8 { padding-top: 4rem; padding-bottom: 8rem; }
.hero-py-4 { padding-top: 4rem; padding-bottom: 4rem; }
.cta-wrapper { text-align: center; margin-top: 3rem; }

@media (max-width: 900px) { .pricing-grid { grid-template-columns: 1fr; margin-top: 2rem; } .tier-card.featured { transform: none; } .tier-card.featured:hover { transform: translateY(-5px); } }

@media (max-width: 768px) { .grid-3 { grid-template-columns: 1fr; } .cert-showcase { padding: 2.5rem 1.5rem; } .cert-meta { flex-direction: column; align-items: flex-start; gap: 1rem; } .syllabus-grid { grid-template-columns: 1fr; gap: 1.5rem; } .hero-actions, .bottom-cta .hero-actions { flex-direction: column; width: 100%; } }