:root{--color-primary: #00F2FE;--color-secondary: #EE00FF;--color-success: #00FF88;--color-bg-dark: #0a0e27;--color-text: #ffffff;--color-text-secondary: #b8c5d6;--glass-bg: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1);--shadow: 0 8px 32px rgba(0, 0, 0, .3)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--color-bg-dark);color:var(--color-text);overflow-x:hidden;min-height:100vh}.gradient-bg{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,var(--color-primary) 0%,#4a00e0 50%,var(--color-secondary) 100%);opacity:.15;z-index:-2;animation:gradientShift 15s ease infinite}@keyframes gradientShift{0%,to{transform:scale(1) rotate(0)}50%{transform:scale(1.1) rotate(5deg)}}#flockingCanvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none;opacity:.7}.glass-card{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--shadow)}.container{max-width:1400px;margin:0 auto;padding:3rem 2rem;position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column}.header{text-align:center;margin-bottom:4rem;animation:fadeInDown .8s ease}.title{font-size:4rem;font-weight:800;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem;text-shadow:0 0 30px rgba(0,242,254,.3);letter-spacing:-.02em}.subtitle{font-size:1.3rem;color:var(--color-text-secondary);font-weight:300;letter-spacing:.2em;text-transform:uppercase;margin-bottom:1rem}.description{font-size:1.1rem;color:var(--color-text-secondary);font-weight:300;opacity:.8}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;margin-bottom:auto;animation:fadeIn 1s ease}.project-card{padding:2.5rem;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden;transition:all .3s ease;cursor:pointer}.project-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#00f2fe1a,#ee00ff1a);opacity:0;transition:opacity .3s}.project-card:hover:before{opacity:1}.project-card:hover{transform:translateY(-10px);box-shadow:0 20px 60px #00f2fe4d}.project-card.available{text-decoration:none;color:inherit}.project-card.available:hover{border-color:var(--color-primary)}.project-card.available .card-icon{color:var(--color-primary)}.project-card.coming-soon{opacity:.6;cursor:not-allowed}.project-card.coming-soon:hover{transform:translateY(-5px)}.project-card.coming-soon .card-icon{color:var(--color-text-secondary)}.project-card.new-feature{position:relative;overflow:visible}.project-card.new-feature:after{content:"NEW";position:absolute;top:-10px;right:-10px;background:linear-gradient(135deg,#00f2fe,#e0f);color:#fff;padding:5px 15px;border-radius:20px;font-size:.75rem;font-weight:700;box-shadow:0 4px 12px #e0f6;animation:newFeaturePulse 2s ease-in-out infinite}@keyframes newFeaturePulse{0%,to{transform:scale(1);box-shadow:0 4px 12px #e0f6}50%{transform:scale(1.05);box-shadow:0 6px 16px #e0f9}}.version-tag{position:absolute;top:15px;right:15px;background:#a0aec026;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(160,174,192,.3);color:#a0aec0cc;padding:4px 12px;border-radius:12px;font-size:.7rem;font-weight:600;letter-spacing:.5px;z-index:10;pointer-events:none;transition:all .3s ease}.project-card:hover .version-tag{background:#a0aec033;border-color:#a0aec066;color:#a0aec0e6}.version-tag.recommended{background:linear-gradient(135deg,#00f2fe33,#e0f3);border:1px solid rgba(0,242,254,.5);color:#00f2fe;box-shadow:0 0 15px #00f2fe4d;animation:recommendedGlow 2s ease-in-out infinite}.project-card:hover .version-tag.recommended{background:linear-gradient(135deg,#00f2fe4d,#ee00ff4d);border-color:#00f2feb3;color:#00f2fe;box-shadow:0 0 20px #00f2fe80}@keyframes recommendedGlow{0%,to{box-shadow:0 0 15px #00f2fe4d}50%{box-shadow:0 0 25px #00f2fe80}}.compatibility-note{margin-top:15px;padding:10px 15px;background:#ffc1071a;border:1px solid rgba(255,193,7,.3);border-radius:8px;font-size:.85rem;color:#ffc107;text-align:center}.card-icon{width:100px;height:100px;display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;transition:all .3s}.project-card:hover .card-icon{transform:scale(1.1) rotate(5deg)}.card-icon svg{filter:drop-shadow(0 0 20px currentColor)}.project-card h2{font-size:1.8rem;margin-bottom:1rem;font-weight:700}.project-desc{font-size:1rem;color:var(--color-text-secondary);line-height:1.6;margin-bottom:1.5rem}.features{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1.5rem}.feature-tag{font-size:.85rem;padding:.4rem .8rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:20px;white-space:nowrap}.status-badge{position:absolute;top:1.5rem;right:1.5rem;padding:.5rem 1rem;border-radius:20px;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.status-badge.available{background:linear-gradient(135deg,#0f83,#00f2fe33);border:1px solid var(--color-success);color:var(--color-success)}.status-badge.coming-soon{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:var(--color-text-secondary)}.footer{text-align:center;margin-top:4rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1);animation:fadeInUp 1s ease}.footer p{margin:4px 0}.copyright{font-size:.9em}.tech-stack{font-size:.8em;opacity:.7}.footer-links{margin:12px 0;font-size:.8em;opacity:.6}.footer-links a,.footer-links button{color:#fff;text-decoration:none;background:none;border:none;cursor:pointer;padding:0;font-family:inherit;font-size:inherit;transition:opacity .3s ease}.footer-links a:hover,.footer-links button:hover{opacity:1;text-decoration:underline}.footer-links .separator{margin:0 10px;opacity:.5}.bio-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;z-index:1000;opacity:0;transition:opacity .4s ease}.bio-modal-overlay.visible{opacity:1}.bio-panel{width:90%;max-width:600px;padding:30px 40px;position:relative;transform:scale(.95);opacity:0;transition:transform .4s ease,opacity .4s ease}.bio-modal-overlay.visible .bio-panel{transform:scale(1);opacity:1}.bio-panel .close-btn{position:absolute;top:15px;right:20px;background:none;border:none;color:#fff;font-size:28px;line-height:1;opacity:.6;cursor:pointer;transition:opacity .3s ease,transform .3s ease}.bio-panel .close-btn:hover{opacity:1;transform:rotate(90deg)}.bio-title{margin-top:0;margin-bottom:20px;font-size:1.8em;font-weight:600;color:#fff;text-align:center}.bio-content p{font-size:1em;line-height:1.8;text-align:justify;margin-bottom:1em;opacity:.9}.bio-content p:last-child{margin-bottom:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 1024px){.projects-grid{grid-template-columns:1fr;max-width:600px;margin-left:auto;margin-right:auto}}@media (max-width: 768px){.title{font-size:2.5rem}.subtitle{font-size:1rem}.description{font-size:.95rem}.container{padding:2rem 1rem}.header{margin-bottom:3rem}.project-card{padding:2rem}.projects-grid{gap:1.5rem}}@media (max-width: 480px){.title{font-size:2rem}.project-card h2{font-size:1.5rem}.card-icon{width:80px;height:80px}.card-icon svg{width:60px;height:60px}}
