:root{--bg-color: #030712;--card-bg: rgba(255, 255, 255, .03);--card-border: rgba(255, 255, 255, .1);--card-hover-bg: rgba(255, 255, 255, .07);--card-hover-border: rgba(255, 255, 255, .2);--text-primary: #f9fafb;--text-secondary: #9ca3af;--accent-color: #6366f1;--accent-glow: rgba(99, 102, 241, .2);--font-main: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--transition: all .3s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}html,body{overflow-x:hidden;width:100%;margin:0;padding:0}.page-wrapper{overflow:hidden;width:100%;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-main);overflow:hidden}.page-wrapper:before{content:"";position:absolute;top:0;left:0;width:50%;height:50%;background:radial-gradient(circle,var(--accent-glow) 0%,transparent 70%);z-index:-1;filter:blur(60px)}.page-wrapper:after{content:"";position:absolute;bottom:0;right:0;width:50%;height:50%;background:radial-gradient(circle,rgba(139,92,246,.15) 0%,transparent 70%);z-index:-1;filter:blur(80px)}.container{max-width:1000px;width:90%;margin:2rem 0;z-index:1}header{text-align:center;margin-bottom:4rem;opacity:0;transform:translateY(20px);animation:fadeIn .8s forwards}h1{font-size:3rem;font-weight:700;letter-spacing:-.02em;margin-bottom:1rem;background:linear-gradient(135deg,#fff,#9ca3af);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;word-wrap:break-word;overflow-wrap:break-word}.subtitle{color:var(--text-secondary);font-size:1.1rem;font-weight:300}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;width:100%}.project-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:20px;padding:2rem;text-decoration:none;color:inherit;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:var(--transition);display:flex;flex-direction:column;gap:1rem;opacity:0;transform:translateY(20px);position:relative;overflow:hidden}.project-card:before,.back-home:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(800px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.06),transparent 40%);opacity:0;transition:opacity .5s;pointer-events:none;z-index:3}.project-card:hover:before,.back-home:hover:before{opacity:1}.project-card:hover{background:var(--card-hover-bg);border-color:var(--card-hover-border);transform:translateY(-8px) scale(1.02);box-shadow:0 20px 40px #0006}.project-card{animation:fadeIn .8s forwards .2s}.icon-wrapper{width:48px;height:48px;background:var(--accent-glow);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:.5rem;color:var(--accent-color)}.project-title{font-size:1.5rem;font-weight:600}.project-description{color:var(--text-secondary);font-size:.95rem;line-height:1.6}.project-link-indicator{margin-top:auto;display:flex;align-items:center;gap:.5rem;font-size:.85rem;font-weight:500;color:var(--accent-color);opacity:.8}.project-card:hover .project-link-indicator{gap:.8rem;opacity:1}@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}footer{margin-top:4rem;color:var(--text-secondary);font-size:.9rem;opacity:.6;text-align:center}@media (max-width: 640px){h1{font-size:2.2rem}}@media (min-width: 641px) and (max-width: 900px){h1{font-size:2.4rem}}@media (min-width: 901px){h1{font-size:3rem}}@media (max-width: 480px){h1{font-size:1.8rem}.container{width:95%;margin:1.5rem 0}.project-card{padding:1.5rem}}.error-container{text-align:center;max-width:600px;margin:0 auto;animation:fadeIn .8s forwards;display:flex;flex-direction:column;align-items:center}.error-code{font-size:8rem;font-weight:800;line-height:1;margin-bottom:2rem;background:linear-gradient(135deg,var(--accent-color) 0%,#fff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 20px var(--accent-glow))}.error-title{font-size:2rem;margin-bottom:1.5rem}.error-description{color:var(--text-secondary);font-size:1.1rem;margin-bottom:3rem;line-height:1.6}.back-home{display:inline-flex;align-items:center;gap:.75rem;padding:1rem 2rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px;color:var(--text-primary);text-decoration:none;font-weight:500;transition:var(--transition);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.back-home:hover{background:var(--card-hover-bg);border-color:var(--accent-color);transform:translateY(-3px);box-shadow:0 10px 20px #0003}.back-home svg{transition:transform .3s ease}.back-home:hover svg{transform:translate(-4px)}.scroll-to-top{position:fixed;bottom:2rem;right:2rem;width:52px;height:52px;border-radius:50%;background:#ffffff0d;border:1px solid var(--card-border);color:var(--text-primary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;visibility:hidden;transform:translateY(20px);z-index:100}.scroll-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.scroll-to-top:hover{background:var(--card-hover-bg);border-color:var(--accent-color);box-shadow:0 0 20px var(--accent-glow);transform:translateY(-4px)}.scroll-to-top:active{transform:translateY(-2px)}.scroll-to-top svg{width:22px;height:22px;transition:transform .3s ease}.scroll-to-top:hover svg{transform:translateY(-2px)}@media (max-width: 480px){.scroll-to-top{bottom:1.2rem;right:1.2rem;width:46px;height:46px}.scroll-to-top svg{width:18px;height:18px}}