:root{--font-family:"Roboto", sans-serif;--font-family-h1:"Julius Sans One", sans-serif;--bg-color-dark:#05050a;--bg-accent:#0b0b14;--primary-violet:#8a2be2;--primary-violet-glow:#8a2be24d;--text-color-white:#ecececf2;--text-muted:#ececec99}html{background-color:var(--bg-color-dark);scroll-behavior:smooth}body{font-family:var(--font-family);color:var(--text-color-white);margin:0;padding:0;line-height:1.6;overflow-x:hidden}#bg-canvas{z-index:-1;pointer-events:none;width:100vw;height:100vh;position:fixed;top:0;left:0}main{z-index:1;position:relative}section{box-sizing:border-box;flex-direction:column;justify-content:center;max-width:1200px;min-height:100vh;margin:0 auto;padding:10rem 2rem;display:flex}h1,h2,h3{margin:0;font-weight:400}h1{font-family:var(--font-family-h1);letter-spacing:.4rem;text-transform:uppercase;font-size:clamp(2.5rem,8vw,4.5rem)}h2{font-family:var(--font-family-h1);letter-spacing:.3rem;text-align:center;margin-bottom:4rem;font-size:2.2rem;position:relative}h2:after{content:"";background:var(--primary-violet);width:60px;height:2px;position:absolute;bottom:-15px;left:50%;transform:translate(-50%)}a{color:var(--primary-violet);text-decoration:none;transition:all .3s}ul{padding:0;list-style:none}footer{text-align:center;color:var(--text-muted);border-top:1px solid #ffffff0d}header{z-index:1000;justify-content:center;width:100%;padding:1.5rem 0;display:flex;position:fixed;top:0;left:0;right:0}header nav{-webkit-backdrop-filter:blur(10px);border:1px solid var(--primary-violet);background:#ffffff05;border-radius:1px;padding:.5rem 2rem}header nav ul{gap:2.5rem;margin:0;padding:0;display:flex}header nav ul li a{text-transform:uppercase;letter-spacing:.2rem;color:#fff9;font-size:.75rem;font-weight:400;text-decoration:none;transition:color .4s,letter-spacing .4s}header nav ul li a:hover{color:#fff}@media (max-width:768px){header{display:none!important}}#introduction{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;display:grid}#introduction .intro-content{flex-direction:column;gap:1.5rem;display:flex}#introduction .intro-content .tagline{color:var(--primary-violet);text-transform:uppercase;letter-spacing:.3rem;font-size:1.1rem}#introduction .intro-content .description{color:var(--text-muted);max-width:500px;font-size:1.1rem}#introduction .intro-content nav menu{gap:2rem;margin-top:1rem;padding:0;display:flex}#introduction .intro-content nav menu a{text-transform:uppercase;letter-spacing:.15rem;border-bottom:1px solid #0000;padding-bottom:5px;font-size:.8rem}#introduction .intro-content nav menu a:hover{border-bottom-color:var(--primary-violet);color:#fff}#introduction .intro-image{justify-self:center;position:relative}#introduction .intro-image img{border:2px solid var(--primary-violet);width:320px;height:320px;box-shadow:0 0 40px var(--primary-violet-glow);object-fit:cover;border-radius:30% 70% 70% 30%/30% 30% 70% 70%;animation:8s ease-in-out infinite morph}@keyframes morph{0%{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}50%{border-radius:66% 34% 33% 67%/65% 57% 43% 35%}to{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}}@media (max-width:768px){#introduction{text-align:center;grid-template-columns:1fr;gap:3rem}#introduction .intro-content .description{margin:0 auto}#introduction nav menu{justify-content:center}#introduction .intro-image img{width:260px;height:260px}}#parcours .git-graph-horizontal{width:100%;max-width:900px;margin:4rem auto 2rem;overflow:visible}#parcours .git-graph-horizontal .draw-line{stroke:var(--primary-violet);filter:drop-shadow(0 0 5px var(--primary-violet-glow))}#parcours .git-graph-horizontal .git-node{fill:var(--bg-color-dark);stroke:var(--primary-violet);stroke-width:3px;filter:drop-shadow(0 0 8px var(--primary-violet-glow))}#parcours ul{grid-template-columns:repeat(4,1fr);gap:2rem;width:100%;margin-top:2rem;display:grid}#parcours ul li{text-align:center;flex-direction:column;gap:.5rem;display:flex}#parcours ul li p:first-child{color:var(--primary-violet);letter-spacing:.1rem;font-size:.8rem;font-weight:600}#parcours ul li h3{margin:0;font-size:1.1rem}#parcours ul li p:last-child{color:var(--text-muted);font-size:.85rem}#parcours ul li abbr{border-bottom:1px dotted var(--primary-violet);text-decoration:none}@media (max-width:768px){#parcours .git-graph-horizontal{display:none}#parcours ul{text-align:left;border-left:1px solid var(--primary-violet-glow);grid-template-columns:1fr;padding-left:2rem}#parcours ul li{text-align:left;padding-bottom:2rem;position:relative}#parcours ul li:before{content:"";background:var(--primary-violet);border-radius:50%;width:10px;height:10px;position:absolute;top:.3rem;left:-2.35rem}}.competence-grid{grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(160px,auto);gap:1.2rem;width:100%;display:grid}.competence-grid .competence-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff08;border:1px solid #ffffff0d;border-radius:1.5rem;flex-direction:column;padding:2rem;display:flex;position:relative;overflow:hidden}.competence-grid .competence-card h3{color:var(--primary-violet);letter-spacing:.1rem;text-transform:uppercase;margin-bottom:1.2rem;font-size:1.2rem}.competence-grid .competence-card ul{flex-wrap:wrap;gap:.5rem;display:flex}.competence-grid .competence-card ul li{color:var(--text-muted);background:#ffffff0a;border:1px solid #ffffff0d;border-radius:8px;padding:.3rem .7rem;font-size:.75rem}.competence-grid .competence-card:first-child{grid-column:span 7}.competence-grid .competence-card:nth-child(2),.competence-grid .competence-card:nth-child(3){grid-column:span 5}.competence-grid .competence-card:nth-child(4){grid-column:span 7}@media (max-width:900px){.competence-grid{grid-template-columns:1fr;gap:1rem}.competence-grid .competence-card{min-height:auto;padding:1.5rem;grid-column:span 1!important}}@media (max-width:480px){.competence-grid .competence-card h3{font-size:1.1rem}}#projets{text-align:center}#projets .project-teaser{background:#ffffff03;border:1px solid #ffffff0d;border-radius:4px;margin-top:3rem;padding:4rem 2rem}#projets .project-teaser h3{letter-spacing:.1rem;margin-bottom:1.5rem;font-size:1.5rem}#projets .project-teaser p{color:var(--text-muted);max-width:600px;margin-bottom:3rem;margin-left:auto;margin-right:auto}#projets .project-teaser .cta-button{color:#000;text-transform:uppercase;letter-spacing:.15rem;box-shadow:none;background:#fff;border-radius:2px;padding:1rem 3rem;font-size:.8rem;font-weight:600;transition:all .4s;display:inline-block}#projets .project-teaser .cta-button:hover{background:var(--primary-violet);color:#fff;transform:translateY(-2px)}@media (max-width:768px){#projets .project-teaser{padding:3rem 1.5rem}#projets .project-teaser .cta-button{width:100%;padding:1rem 2rem}}