.concept-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;padding:2rem 1rem;max-width:1000px;margin:0 auto}.concept-card{background:var(--secondary);padding:1.2rem;border-radius:1rem;box-shadow:0 4px 12px #00000014;text-decoration:none;color:inherit;transition:background-color .3s ease,color .3s ease,transform .2s ease,box-shadow .2s ease}.concept-card:hover{transform:translateY(-3px);box-shadow:0 6px 16px #0000001f}.concept-card h3{margin-bottom:.5rem;font-size:1.25rem;color:var(--text);transition:color .3s ease}.concept-card p{font-size:.95rem;color:var(--text);transition:background-color .3s ease,color .3s ease}[data-theme=dark] .concept-card{box-shadow:0 4px 12px #0006}[data-theme=dark] .concept-card:hover{box-shadow:0 6px 16px #00000080}@media (max-width: 600px){.concept-grid{grid-template-columns:1fr;padding:1rem}.concept-card h3{font-size:1.1rem}.concept-card p{font-size:.85rem}main{padding-inline:1rem!important}}*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #f9fafb;--text: #111111;--primary: #3b82f6;--secondary: #ffffff}[data-theme=dark]{--bg: #121212;--text: #f0f0f0;--primary: #60a5fa;--secondary: #1f1f1f}body{background-color:var(--bg);color:var(--text);font-family:system-ui,sans-serif;padding:2rem;transition:background-color .3s ease,color .3s ease}a{outline:none}a:focus{outline:none}html,body{height:100%;width:100%;transition:background-color .3s ease,color .3s ease}#root{display:flex;flex-direction:column;min-height:100%}.nav-button{text-decoration:none;padding:.4rem .9rem;border-radius:999px;background-color:transparent;transition:background-color .2s ease;color:var(--primary);border:2px solid var(--outline);font-weight:500}.nav-button:hover{background-color:#0000000d}[data-theme=dark] .nav-button:hover{background-color:#ffffff1a}.nav-button:focus{outline:2px solid var(--primary);outline-offset:2px}.btn{background-color:var(--primary);color:#fff;font-weight:500;padding:.5rem 1.2rem;font-size:1rem;border:none;border-radius:.5rem;cursor:pointer;transition:background-color .2s ease,transform .2s ease;box-shadow:0 2px 6px #00000014}.btn:hover{background-color:#2563eb}.btn:active{transform:scale(.97)}.btn:focus{outline:2px solid var(--primary);outline-offset:2px}[data-theme=dark] .btn{background-color:var(--primary);color:#fff}[data-theme=dark] .btn:hover{background-color:#60a5fa}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.page-enter{animation:fadeUp .4s ease-out both}:focus:not(:focus-visible){outline:none}@media (max-width: 600px){body{padding:1rem}h1,h2,h3{font-size:1rem}p,a,button{font-size:.9rem}header{flex-direction:column;align-items:stretch;text-align:center;gap:.5rem}.nav-button{font-size:.9rem;padding:.3rem .8rem}}
