/* rironbusou.com */
:root {
    --color-black: #000000;
    --color-dark-gray: #1A1A1A;
    --color-gray: #333333;
    --color-light-gray: #888888;
    --color-white: #FFFFFF;
    --color-light-bg: #F5F5F5;
    --color-red: #D42B2B;
    --color-yellow: #FFE14D;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #000000; color: #FFFFFF; font-family: 'Inter', sans-serif; font-weight: 400; line-height: 1.55; }
.hero { background: #000000; padding: 6rem 2rem 4rem; text-align: center; overflow: hidden; }
.hero-kanji { font-family: 'Space Grotesk', sans-serif; font-weight: 800; font-size: 12vw; color: #FFFFFF; white-space: nowrap; line-height: 0.95; letter-spacing: -0.02em; }
.hero-subtitle { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 2rem; color: #FFFFFF; letter-spacing: 0.04em; margin-top: 1rem; margin-bottom: 2rem; }
.hero-link { font-family: 'Inter', sans-serif; font-weight: 500; font-size: 1rem; color: #FFFFFF; text-decoration: underline; transition: color 0.3s ease; }
.hero-link:hover { color: #FFE14D; }
.band { padding: 4rem 2rem; }
.band-black { background: #000000; color: #FFFFFF; }
.band-white { background: #FFFFFF; color: #000000; }
.band-red { background: #D42B2B; color: #FFFFFF; }
.framework-name { font-family: 'Space Grotesk', sans-serif; font-weight: 800; font-size: clamp(3rem, 8vw, 6rem); text-transform: uppercase; letter-spacing: -0.02em; display: block; margin-bottom: 0.5rem; }
.framework-name.dark { color: #000000; }
.framework-desc { font-size: 1rem; color: #FFFFFF; max-width: 600px; margin-bottom: 1rem; }
.framework-desc.dark { color: #333333; }
.framework-desc.light { color: #FFFFFF; }
.framework-link { font-family: 'Inter', sans-serif; font-weight: 500; font-size: 0.9rem; color: #FFFFFF; text-decoration: underline; transition: color 0.3s ease; }
.framework-link:hover { color: #FFE14D; }
.framework-link.dark { color: #000000; }
.framework-link.dark:hover { color: #D42B2B; }
.fallacies { background: #000000; padding: 4rem 2rem; max-width: 900px; margin: 0 auto; }
.thick-rule { border-top: 4px solid #FFFFFF; margin-bottom: 2rem; }
.thick-rule-white { border-top: 4px solid #D42B2B; margin-bottom: 2rem; }
.fallacy-heading { font-family: 'Space Grotesk', sans-serif; font-weight: 800; font-size: 1.5rem; color: #FFFFFF; letter-spacing: 0.04em; margin-bottom: 2rem; }
.fallacy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.fallacy-item { margin-bottom: 0.5rem; }
.fallacy-marker { color: #D42B2B; font-size: 0.7rem; }
.fallacy-name { font-weight: 700; color: #FFFFFF; }
.fallacy-latin { font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; color: #888888; margin-left: 0.5rem; }
.fallacy-def { font-size: 0.85rem; color: #888888; margin-top: 0.25rem; }
.challenges { background: #000000; padding: 4rem 2rem; max-width: 900px; margin: 0 auto; }
.challenge-heading { font-family: 'Space Grotesk', sans-serif; font-weight: 800; font-size: 1.5rem; color: #FFFFFF; letter-spacing: 0.04em; margin-bottom: 2rem; }
.challenge-row { padding: 2rem; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.challenge-row.odd { background: #000000; color: #FFFFFF; }
.challenge-row.even { background: #F5F5F5; color: #000000; border-bottom: 2px solid #1A1A1A; }
.challenge-text { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 1.2rem; font-style: italic; flex: 1; min-width: 200px; }
.challenge-meta { font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; color: #888888; }
.challenge-btn { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 0.85rem; background: #FFFFFF; color: #000000; padding: 0.5rem 1.5rem; text-decoration: none; text-transform: uppercase; letter-spacing: 0.04em; transition: background-color 0.3s ease, color 0.3s ease; }
.challenge-btn:hover { background-color: #FFE14D; color: #000000; }
.challenge-btn.dark { background: #000000; color: #FFFFFF; }
.challenge-btn.dark:hover { background-color: #D42B2B; color: #FFFFFF; }
.footer { background: #000000; padding: 4rem 2rem; text-align: center; border-top: 4px solid #FFFFFF; }
.footer-text { font-family: 'JetBrains Mono', monospace; font-size: 0.9rem; color: #FFFFFF; }
@media (max-width: 640px) {
    .fallacy-grid { grid-template-columns: 1fr; }
    .challenge-row { flex-direction: column; align-items: flex-start; }
}
.fade-in { opacity: 0; transform: translateY(12px); transition: opacity 0.5s ease, transform 0.5s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }
