:root{--bg-primary:#0f172a;--bg-secondary:#020617;--bg-card:#1e293b;--color-primary:#3656e4;--color-accent:#38bdf8;--color-highlight:#f59e0b;--text-primary:#fff;--text-secondary:#cbd5f5;--radius:12px}*{box-sizing:border-box;margin:0;padding:0;font-family:Segoe UI,sans-serif}html{scroll-behavior:smooth}body{background:var(--bg-primary);color:var(--text-primary)}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}.header{background:var(--color-primary);z-index:10;width:100%;position:sticky;top:0}.header nav{max-width:1200px;margin:0 auto;padding:16px}.header ul{justify-content:center;gap:24px;list-style:none;display:flex}.header a{color:var(--text-primary);font-weight:500;text-decoration:none;transition:all .3s}.header a:hover{color:var(--color-accent)}.about{text-align:left;justify-content:center;align-items:center;gap:3rem;min-height:70vh;padding:60px 0;display:flex}.about img{border:3px dashed var(--color-highlight);border-radius:50%;width:180px;transition:all .3s}.about img:hover{transform:scale(1.05)}.aboutInfos{flex-direction:column;gap:1rem;max-width:500px;display:flex}.aboutInfos h1{font-size:2rem}.aboutInfos p{color:var(--text-secondary);line-height:1.6}.projects{text-align:center;padding:60px 0}.projects h2{font-size:1.8rem}.containerProjects{flex-wrap:wrap;justify-content:center;gap:24px;margin-top:30px;display:flex}.project{background:var(--bg-card);border-radius:var(--radius);flex-direction:column;gap:10px;width:300px;padding:20px;transition:all .3s;display:flex}.project:hover{transform:translateY(-8px);box-shadow:0 10px 30px #0000004d}.project h3{font-size:1.2rem}.project p{color:var(--text-secondary);font-size:.9rem}.project a{color:var(--color-accent);margin-top:10px;font-weight:700;text-decoration:none}.project a:hover{text-decoration:underline}.footer{text-align:center;background:var(--bg-secondary);color:var(--text-secondary);margin-top:60px;padding:20px}@media (width<=768px){.about{text-align:center;flex-direction:column}.aboutInfos{align-items:center}}@media (width<=600px){.header ul{flex-direction:column;align-items:center}.project{width:100%}}