/* RESET */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

/* THEME */
:root{
  --bg-1:#1a1a1a; --bg-2:#2a2a2a; --txt:#e0e0e0;
  --cyan:#00b7eb; --red:#ff2e2e; --shadow-cyan:rgba(0,183,235,.7);
}

body{
  font-family:'Fira Code', monospace;
  background:linear-gradient(135deg,var(--bg-1),var(--bg-2));
  color:var(--txt); line-height:1.6; overflow-x:hidden; min-height:100dvh;
}

/* Scan glitch */
body::before{
  content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:repeating-linear-gradient(0deg, rgba(0,183,235,.05), rgba(0,183,235,.05) 1px, transparent 1px, transparent 20px);
  animation:glitch 5s infinite linear;
}
@keyframes glitch{
  0%{transform:translateY(-100%);opacity:.4;}50%{opacity:.6;}100%{transform:translateY(100%);opacity:.4;}
}

/* NAV */
.menu{
  display:flex; align-items:center; justify-content:center; gap:16px;
  background:rgba(26,26,26,.9); padding:16px 12px; position:sticky; top:0; z-index:1000;
  border-bottom:2px solid var(--cyan); backdrop-filter:blur(8px);
}
.menu_bouton{
  display:none; align-items:center; justify-content:center; cursor:pointer; height:40px; width:40px;
  border:1px solid var(--cyan); border-radius:8px; background:#222;
}
.menu_bouton img{height:22px;width:22px;}
.menu_links{display:flex; flex-wrap:wrap; gap:6px 12px; justify-content:center;}
.menu a{
  color:var(--txt); text-decoration:none; padding:10px 18px; font-weight:500; border-radius:8px; transition:.25s;
}
.menu a:hover{color:var(--cyan); text-shadow:0 0 10px var(--shadow-cyan); transform:translateY(-1px); background:rgba(0,0,0,.2);}

/* HEADER */
.header{
  padding:80px 20px 40px; text-align:center; background:linear-gradient(180deg,var(--bg-2),var(--bg-1));
  border-bottom:3px solid var(--cyan); margin-bottom:24px;
}
.glow-text{
  font-size:clamp(2rem,5vw,3.5rem); color:var(--txt); margin:0;
  text-shadow:0 0 15px var(--cyan), 0 0 30px var(--red);
  animation:glow 3s infinite alternate;
}
@keyframes glow{
  0%{text-shadow:0 0 15px var(--cyan),0 0 30px var(--red);}
  100%{text-shadow:0 0 25px var(--cyan),0 0 40px var(--red);}
}
.intro-text{font-size:clamp(1rem,2.3vw,1.3rem); color:#b0b0b0; margin-top:16px; text-shadow:0 0 5px rgba(0,183,235,.5);}

/* SECTION WRAPPER */
.realisations{padding:56px 20px; max-width:1300px; margin:0 auto;}
.section-title{
  font-size:2rem; color:var(--cyan); text-align:center; margin:24px 0;
  text-shadow:0 0 10px rgba(0,183,235,.5); border-bottom:2px solid var(--red); padding-bottom:8px;
}

/* FOLDABLE CARDS (BTS / ENTREPRISE / BACHELOR) */
.foldable{
  background:rgba(26,26,26,.9); padding:20px; border-radius:12px; border:2px solid var(--cyan);
  box-shadow:0 0 15px rgba(0,183,235,.3); margin-bottom:24px;
}
.fold-toggle{display:none;}
.fold-button{
  display:block; text-align:center; cursor:pointer; margin-bottom:16px;
  background:linear-gradient(135deg, var(--cyan), var(--red)); color:#111; font-weight:700;
  padding:12px 18px; border-radius:999px; transition:.2s;
}
.fold-button:hover{transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,183,235,.35);}
.fold-content{display:none; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px;}
.fold-toggle:checked + .fold-button + .fold-content{display:grid;}
.fold-note{
  grid-column:1/-1; text-align:center; color:#b0b0b0; margin:4px 0 12px;
}

/* PROJECT CARDS */
.project{
  background:rgba(42,42,42,.9); padding:18px; border-radius:12px; border:2px solid var(--cyan);
  box-shadow:0 0 15px rgba(0,183,235,.25); transition:.2s;
}
.project:hover{transform:translateY(-3px); box-shadow:0 0 22px rgba(0,183,235,.35);}
.project-image img{
  width:100%; height:auto; border-radius:8px; border:2px solid var(--red); transition:.25s;
}
.project:hover .project-image img{transform:scale(1.04);}
.project h3{margin:12px 0 8px; color:var(--cyan); font-size:1.1rem;}
.project p{margin:0 0 12px; color:var(--txt);}
.view-more{
  display:inline-block; text-decoration:none; font-weight:700; text-align:center;
  background:linear-gradient(135deg, var(--cyan), var(--red)); color:#111;
  padding:10px 14px; border-radius:999px; transition:.2s;
}
.view-more:hover{transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,183,235,.35);}

/* FOOTER */
.footer{
  background:rgba(26,26,26,.9); padding:36px 20px; text-align:center; border-top:2px solid var(--cyan);
  backdrop-filter:blur(8px); margin-top:40px;
}
.footer-links a{margin:0 22px;}
.footer-links img{width:50px; height:50px; object-fit:contain; transition:.25s;}
.footer-links a:hover img{transform:scale(1.12); filter:brightness(1.25);}
.legal-links{margin-top:18px;}
.legal-links a{color:#b0b0b0; text-decoration:none; transition:.25s;}
.legal-links a:hover{color:var(--cyan);}
.footer p{margin-top:18px; color:var(--txt); text-shadow:0 0 6px rgba(0,183,235,.4);}

/* RESPONSIVE */
@media (max-width:860px){
  .menu{justify-content:space-between; padding:12px 14px;}
  .menu_bouton{display:flex;}
  .menu_links{display:none; flex-direction:column; width:100%; gap:0; margin-top:12px;}
  .menu_links a{display:block; padding:12px; border-top:1px solid rgba(255,255,255,.06); border-radius:0;}
  .menu.menu_open .menu_links{display:flex;}
}
@media (max-width:480px){
  .glow-text{font-size:2.4rem;}
  .section-title{font-size:1.4rem;}
  .view-more{padding:8px 12px; font-size:.92rem;}
}