:root {
  --bg:       #0D0C0B;
  --surface:  #141210;
  --panel:    #1A1714;
  --red:      #C1272D;
  --red-dim:  #8B1A1F;
  --red-glow: rgba(193,39,45,0.18);
  --cream:    #F0EAE0;
  --muted:    #7A7068;
  --border:   rgba(240,234,224,0.08);
  --border-r: rgba(193,39,45,0.3);
  --white:    #FDFAF6;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--cream);
  font-family: 'Outfit', sans-serif;
  font-weight: 300;
  overflow-x: hidden;
  cursor: none;
}

/* Dégradé global inspiré du BG CV */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 0% 0%, rgba(150,10,30,0.55) 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 100% 10%, rgba(120,8,25,0.3) 0%, transparent 55%),
    radial-gradient(ellipse 90% 60% at 15% 100%, rgba(0,140,160,0.45) 0%, transparent 55%),
    radial-gradient(ellipse 50% 40% at 100% 90%, rgba(0,160,175,0.25) 0%, transparent 50%),
    linear-gradient(160deg, #0D0B0A 0%, #100B0D 40%, #090D10 100%);
  pointer-events: none;
  z-index: 0;
}

/* ─── CURSOR ─── */
.cur-dot {
  position:fixed; width:8px; height:8px;
  background:var(--red); border-radius:50%;
  pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%);
  transition: transform .12s ease, opacity .12s;
}
.cur-ring {
  position:fixed; width:36px; height:36px;
  border:1px solid var(--red); border-radius:50%;
  pointer-events:none; z-index:9998;
  transform:translate(-50%,-50%);
  transition: width .3s, height .3s, opacity .3s;
  opacity:.5;
}
body.ch .cur-dot  { transform:translate(-50%,-50%) scale(2.5); }
body.ch .cur-ring { width:52px; height:52px; opacity:.2; }

/* ─── GRAIN ─── */
body::after {
  content:'';
  position:fixed; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.028;
  pointer-events:none;
  z-index:1000;
}

/* ─── NAV ─── */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:600;
  display:flex; justify-content:space-between; align-items:center;
  padding:1.6rem 3rem;
  transition: background .4s, backdrop-filter .4s;
}
#nav.scrolled {
  background:rgba(13,12,11,0.88);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
}
.nav-logo {
  font-family:'Bebas Neue', sans-serif;
  font-size:1.4rem;
  letter-spacing:.12em;
  color:var(--cream);
  text-decoration:none;
}
.nav-logo span { color:var(--red); }
.nav-links { display:flex; gap:2.5rem; list-style:none; }
.nav-links a {
  font-family:'DM Mono', monospace;
  font-size:.6rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--muted);
  text-decoration:none;
  transition:color .3s;
}
.nav-links a:hover { color:var(--red); }
.nav-cta {
  font-family:'DM Mono', monospace;
  font-size:.6rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--red);
  text-decoration:none;
  border:1px solid var(--border-r);
  padding:.55rem 1.3rem;
  transition:background .3s, color .3s;
}
.nav-cta:hover { background:var(--red); color:var(--cream); }

/* ─── HERO ─── */
.hero {
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr 1fr;
  position:relative;
  overflow:hidden;
  background-image: url(img/intro-bg.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  flex:1;
}

/* left column */
.hero-l {
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:1rem 3rem 5rem;
  position:relative;
  z-index:2;
}
.hero-tag {
  font-family:'DM Mono', monospace;
  font-size:.58rem;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--red);
  margin-bottom:2rem;
  opacity:0;
  animation:up .9s .2s forwards;
}
.hero-name {
  font-family:'Bebas Neue', sans-serif;
  font-size:clamp(5rem,9vw,11rem);
  line-height:.92;
  letter-spacing:.01em;
  color:var(--cream);
  opacity:0;
  animation:up .9s .4s forwards;
}
.hero-name .red { color:var(--red); }
.hero-job {
  font-family:'Lora', serif;
  font-style:italic;
  font-size:clamp(1rem,2vw,1.5rem);
  color:var(--muted);
  margin-top:1.5rem;
  opacity:0;
  animation:up .9s .6s forwards;
  font-weight:400;
}
.hero-desc {
  margin-top:2rem;
  max-width:40ch;
  font-size:.9rem;
  line-height:1.85;
  color:rgba(240,234,224,.55);
  opacity:0;
  animation:up .9s .8s forwards;
}
.hero-actions {
  margin-top:3rem;
  display:flex; gap:1.2rem; align-items:center;
  opacity:0;
  animation:up .9s 1s forwards;
}
.btn-r {
  display:inline-block;
  padding:.95rem 2.4rem;
  background:var(--red);
  color:var(--cream);
  font-family:'DM Mono', monospace;
  font-size:.6rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  text-decoration:none;
  transition:background .3s;
}
.btn-r:hover { background:var(--red-dim); }
.btn-ghost {
  font-family:'DM Mono', monospace;
  font-size:.6rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--muted);
  text-decoration:none;
  border-bottom:1px solid rgba(122,112,104,.4);
  padding-bottom:2px;
  transition:color .3s, border-color .3s;
}
.btn-ghost:hover { color:var(--cream); border-color:var(--cream); }

.hero-infos {
  margin-top:3.5rem;
  display:flex; gap:3rem;
  opacity:0;
  animation:up .9s 1.1s forwards;
}
.hero-info-item { display:flex; flex-direction:column; gap:.3rem; }
.hero-info-label {
  font-family:'DM Mono', monospace;
  font-size:.52rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--red);
}
.hero-info-val {
  font-size:.82rem;
  color:rgba(240,234,224,.6);
}

/* right column
.hero-r {
  position:relative;
  display:flex;
  align-items:stretch;
  opacity:0;
  animation:fadeIn 1.2s .6s forwards;
}
.hero-r-inner {
  background-image: url(img/intro-bg.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  flex:1;
}*/
.hr-top {
  background:var(--panel);
  border-left:1px solid var(--border);
  position:relative;
  overflow:hidden;
}
.hr-top::before {
  content:'';
  position:absolute;
  top:-30%; right:-20%;
  width:70%; aspect-ratio:1;
  background:radial-gradient(circle, var(--red-glow) 0%, transparent 70%);
  pointer-events:none;
}
/* big letter watermark */
.hr-top-letter {
  position:absolute;
  bottom:-1rem; left:2rem;
  font-family:'Bebas Neue', sans-serif;
  font-size:22rem;
  line-height:1;
  color:rgba(193,39,45,.06);
  pointer-events:none;
  user-select:none;
}
.hr-available {
  position:absolute;
  top:2rem; left:2.5rem;
  display:flex; align-items:center; gap:.7rem;
}
.dot-blink {
  width:8px; height:8px;
  background:var(--red);
  border-radius:50%;
  animation:blink 1.8s ease-in-out infinite;
}
.avail-text {
  font-family:'DM Mono', monospace;
  font-size:.58rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--red);
}

.hr-bottom {
  /*background:#0A0908;
  border-left:1px solid var(--border);*/
  border-top:1px solid var(--border);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:2.5rem;
  position:relative;
  overflow:hidden;
}
.hr-bottom-badge {
  font-family:'Bebas Neue', sans-serif;
  font-size:5rem;
  line-height:1;
  color:rgba(240,234,224,.04);
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
  white-space:nowrap;
}
.hr-skills {
  display:flex; flex-wrap:wrap; gap:.5rem;
  position:relative; z-index:1;
}
.hr-skill {
  font-family:'DM Mono', monospace;
  font-size:.55rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  padding:.38rem .85rem;
  border:1px solid var(--border);
  color:var(--muted);
  transition:border-color .3s, color .3s;
}
.hr-skill:hover { border-color:var(--red); color:var(--red); }

/* ─── MARQUEE ─── */
.marquee-wrap {
  background:var(--red);
  padding:.85rem 0;
  overflow:hidden;
}
.marquee-track {
  display:flex; gap:3.5rem;
  animation:marquee 22s linear infinite;
  white-space:nowrap;
}
.marquee-item {
  font-family:'Bebas Neue', sans-serif;
  font-size:1.1rem;
  letter-spacing:.12em;
  color:rgba(240,234,224,.85);
  flex-shrink:0;
  display:flex; align-items:center; gap:3.5rem;
}
.marquee-item::after {
  content:'✦';
  color:rgba(240,234,224,.4);
  font-size:.7rem;
}

/* ─── SECTION UTILITY ─── */
.sec-label {
  font-family:'DM Mono', monospace;
  font-size:.58rem;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--red);
  margin-bottom:1rem;
}
.sec-num {
  font-family:'DM Mono', monospace;
  font-size:.55rem;
  letter-spacing:.2em;
  color:rgba(193,39,45,.4);
}
h2.big {
  font-family:'Bebas Neue', sans-serif;
  font-size:clamp(2.8rem,5vw,5.5rem);
  line-height:.95;
  letter-spacing:.02em;
  color:var(--cream);
}
h2.big em {
  font-family:'Lora', serif;
  font-style:italic;
  font-weight:400;
  color:var(--red);
  font-size:.85em;
}

/* ─── ABOUT ─── */
.about {
  padding:5rem 3rem;
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:5rem;
  align-items:start;
}
.about-l { position:sticky; top:7rem; }
.about-watermark {
  font-family:'Bebas Neue', sans-serif;
  font-size:6rem;
  line-height:1;
  color:rgba(193,39,45,.06);
  margin-bottom:-2rem;
  user-select:none;
}

.about-lead {
  font-family:'Lora', serif;
  font-style:italic;
  font-size:1.35rem;
  line-height:1.6;
  color:rgba(240,234,224,.8);
  margin-bottom:2rem;
  font-weight:400;
}
.about-body {
  font-size:.88rem;
  line-height:1.9;
  color:rgba(240,234,224,.5);
  margin-bottom:2rem;
}
.about-dispo {
  /*margin-top:2.5rem;*/
  padding:1.5rem 2rem;
  border:1px solid var(--border-r);
  background:rgba(193,39,45,.05);
  display:flex; flex-direction:column; gap:.6rem;
}
.dispo-head {
  font-family:'DM Mono', monospace;
  font-size:.58rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--red);
}
.dispo-items { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:.4rem; }
.dispo-item {
  font-family:'DM Mono', monospace;
  font-size:.58rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:.35rem .9rem;
  background:rgba(193,39,45,.12);
  color:var(--red);
  border:1px solid var(--border-r);
}

/* ─── COMPÉTENCES ─── */
.skills-sec {
  background:var(--surface);
  padding:4rem 3rem;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.skills-head {
  display:flex; justify-content:space-between; align-items:flex-end;
  margin-bottom:2.5rem;
}
.skills-grid-outer {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--border);
  border-left:1px solid var(--border);
}
.skill-col {
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:2.5rem 2rem;
  transition:background .3s;
}
.skill-col:hover { background:rgba(193,39,45,.04); }
.skill-col-label {
  font-family:'DM Mono', monospace;
  font-size:.55rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--red);
  margin-bottom:1.5rem;
}
.skill-list { display:flex; flex-direction:column; gap:.8rem; }
.skill-row { display:flex; align-items:center; gap:.8rem; padding:.5rem 0; border-bottom:1px solid rgba(240,234,224,.06); }
.skill-row:last-child { border-bottom:none; }
.skill-name {
  font-size:.85rem;
  font-weight:300;
  color:rgba(240,234,224,.75);
  flex:1;
}
.skill-dot {
  width:4px; height:4px;
  background:var(--red);
  border-radius:50%;
  flex-shrink:0;
}

/* ─── EXPERIENCES ─── */
.exps {
  padding:5rem 3rem;
}
.exp-header { margin-bottom:4rem; }
.exp-list { display:flex; flex-direction:column; }
.exp-item {
  display:grid;
  grid-template-columns:220px 1fr;
  gap:3rem;
  padding:2.8rem 0;
  border-bottom:1px solid var(--border);
  transition:background .3s;
}
.exp-item:first-child { border-top:1px solid var(--border); }

.exp-company {
  font-family:'Bebas Neue', sans-serif;
  font-size:1.3rem;
  letter-spacing:.05em;
  color:var(--red);
  margin-bottom:.2rem;
}
.exp-city {
  font-size:.78rem;
  color:var(--muted);
  margin-bottom:.3rem;
}
.exp-period {
  font-family:'DM Mono', monospace;
  font-size:.56rem;
  letter-spacing:.15em;
  color:rgba(193,39,45,.6);
  margin-bottom:.5rem;
}
.exp-mode {
  display:inline-block;
  font-family:'DM Mono', monospace;
  font-size:.5rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  padding:.25rem .6rem;
  border:1px solid var(--border);
  color:var(--muted);
}

.exp-role {
  font-family:'Bebas Neue', sans-serif;
  font-size:1.7rem;
  letter-spacing:.03em;
  color:var(--cream);
  margin-bottom:1rem;
  line-height:1;
}
.exp-bullets {
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:.7rem;
}
.exp-bullets li {
  font-size:.84rem;
  line-height:1.75;
  color:rgba(240,234,224,.5);
  padding-left:1.2rem;
  position:relative;
}
.exp-bullets li::before {
  content:'';
  position:absolute;
  left:0; top:.65em;
  width:5px; height:1px;
  background:var(--red);
}

/* ─── GALERIE ─── */
.gallery-sec {
  background:var(--surface);
  padding:4rem 3rem;
  border-top:1px solid var(--border);
}
.gallery-header {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:2.5rem;
  flex-wrap:wrap;
  gap:2rem;
}

/* TABS */
.gallery-tabs {
  display:flex;
  gap:0;
  position:relative;
  z-index:10;
}
.gtab {
  display:flex;
  flex-direction:column;
  gap:.25rem;
  padding:1.1rem 2rem 1rem;
  background:transparent;
  color:var(--muted);
  border:1px solid var(--border);
  border-right:none;
  cursor:none;
  transition:background .35s, color .35s, border-color .35s;
  position:relative;
  overflow:hidden;
}
.gtab:last-child { border-right:1px solid var(--border); }
.gtab::after {
  content:'';
  position:absolute;
  bottom:0; left:0; right:0;
  height:2px;
  background:var(--red);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.gtab.active::after { transform:scaleX(1); }
.gtab-num {
  font-family:'DM Mono', monospace;
  font-size:.48rem;
  letter-spacing:.2em;
  color:var(--red);
  opacity:.5;
  transition:opacity .3s;
}
.gtab-label {
  font-family:'DM Mono', monospace;
  font-size:.6rem;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.gtab.active {
  background:rgba(193,39,45,.08);
  color:var(--cream);
  border-color:var(--border-r);
}
.gtab.active .gtab-num { opacity:1; }
.gtab:not(.active):hover {
  background:rgba(193,39,45,.04);
  color:rgba(240,234,224,.7);
}

/* ═══════════════════════════════════════
   MODULE PROJET — éditorial magazine
═══════════════════════════════════════ */
.gallery-panels { position:relative; }
.gallery-panel  { display:none; }
.gallery-panel.active {
  display:block;
  animation:panelIn .5s cubic-bezier(.16,1,.3,1);
}
@keyframes panelIn {
  from { opacity:0; transform:translateY(12px); }
  to   { opacity:1; transform:translateY(0); }
}

/* Layout 2 colonnes : image | infos */
.proj-module {
  display:grid;
  grid-template-columns:1fr 380px;
  gap:0;
  border:1px solid var(--border);
  min-height:520px;
}

/* ── IMAGE HERO ── */
.proj-hero {
  display:flex;
  flex-direction:column;
  border-right:1px solid var(--border);
}
.proj-hero-img {
  position:relative;
  flex:1;
  overflow:hidden;
  background:#060404;
  min-height:400px;
}
.proj-hero-img img {
  width:100%; height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  transition:opacity .5s ease, transform .8s cubic-bezier(.16,1,.3,1);
  will-change:transform;
}
.proj-hero-img.changing img {
  opacity:0;
  transform:scale(1.03);
}
.proj-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(6,4,4,.6) 0%, transparent 40%);
  pointer-events:none; z-index:1;
}
.proj-expand-btn {
  position:absolute;
  top:1.2rem; right:1.2rem;
  z-index:3;
  width:34px; height:34px;
  border:1px solid rgba(240,234,224,.2);
  background:rgba(6,4,4,.5);
  color:rgba(240,234,224,.6);
  display:flex; align-items:center; justify-content:center;
  cursor:none;
  transition:border-color .3s, color .3s, background .3s;
  backdrop-filter:blur(4px);
}
.proj-expand-btn:hover {
  border-color:var(--red);
  color:var(--red);
  background:rgba(193,39,45,.15);
}
.proj-hero-nav {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.9rem 1.2rem;
  border-top:1px solid var(--border);
  flex-shrink:0;
}
.ph-arrow {
  width:34px; height:34px;
  border:1px solid rgba(240,234,224,.1);
  background:transparent;
  color:rgba(240,234,224,.4);
  display:flex; align-items:center; justify-content:center;
  cursor:none; font-size:.85rem;
  transition:border-color .3s, color .3s;
  flex-shrink:0;
}
.ph-arrow:hover  { border-color:var(--red); color:var(--red); }
.ph-arrow:disabled { opacity:.15; pointer-events:none; }
.ph-counter {
  font-family:'DM Mono', monospace;
  font-size:.48rem;
  letter-spacing:.15em;
  color:rgba(122,112,104,.5);
  display:flex; align-items:baseline; gap:.4rem;
}
.ph-cur {
  font-size:1rem;
  color:var(--cream);
  letter-spacing:0;
}
.ph-sep { font-size:.5rem; }

/* ── INFOS PROJET ── */
.proj-info {
  display:flex;
  flex-direction:column;
  padding:2.5rem;
  gap:1.8rem;
  overflow:hidden;
  position:relative;
}
.proj-info::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:2px;
  background:var(--red);
}
.proj-info-head {}
.proj-cat {
  font-family:'DM Mono', monospace;
  font-size:.46rem;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--red);
  margin-bottom:.6rem;
}
.proj-title {
  font-family:'Bebas Neue', sans-serif;
  font-size:2.2rem;
  line-height:.95;
  letter-spacing:.02em;
  color:var(--cream);
  transition:opacity .3s ease;
}
.proj-desc {
  font-family:'Outfit', sans-serif;
  font-style:italic;
  font-size:.78rem;
  line-height:1.75;
  color:rgba(240,234,224,.5);
  transition:opacity .3s ease;
}

/* Meta : tableau client/type/rôle/année */
.proj-meta {
  display:flex;
  flex-direction:column;
  gap:0;
  border-top:1px solid var(--border);
  transition:opacity .3s ease;
}
.proj-meta-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:.65rem 0;
  border-bottom:1px solid rgba(240,234,224,.05);
}
.proj-meta-row:last-child { border-bottom:none; }
.pm-label {
  font-family:'DM Mono', monospace;
  font-size:.48rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--muted);
}
.pm-val {
  font-size:.8rem;
  color:rgba(240,234,224,.7);
  text-align:right;
}

/* Miniatures grille */
.proj-thumbs {
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:3px;
  margin-top:auto;
}
.proj-thumb {
  aspect-ratio:1;
  overflow:hidden;
  cursor:none;
  position:relative;
  opacity:.38;
  transition:opacity .3s ease;
  border:1px solid transparent;
}
.proj-thumb:hover { opacity:.7; }
.proj-thumb.active {
  opacity:1;
  border-color:var(--red);
}
.proj-thumb img {
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  transition:transform .5s ease;
}
.proj-thumb:hover img { transform:scale(1.08); }

/* Barre de progression */
.proj-progress {
  height:1px;
  background:rgba(240,234,224,.07);
  position:relative;
  overflow:hidden;
  flex-shrink:0;
}
.proj-progress-fill {
  position:absolute; top:0; left:0; height:100%;
  background:var(--red);
  transition:width .6s cubic-bezier(.77,0,.18,1);
  width:0%;
}

/* Animation fade texte */
.proj-info.changing .proj-cat,
.proj-info.changing .proj-title,
.proj-info.changing .proj-desc,
.proj-info.changing .proj-meta {
  opacity:0;
  transform:translateY(6px);
}
.proj-cat, .proj-title, .proj-desc, .proj-meta {
  transition:opacity .3s ease, transform .3s ease;
}

/* ── RESPONSIVE GALERIE ── */
@media(max-width:1100px) {
  .proj-module { grid-template-columns:1fr 320px; }
  .proj-info { padding:2rem; }
}
@media(max-width:920px) {
  .gallery-sec { padding:4rem 1.5rem; }
  .gallery-header { flex-direction:column; align-items:flex-start; gap:2rem; }
  .gallery-tabs { flex-wrap:wrap; width:100%; gap:0; }
  .gtab { flex:1; border-right:none; border-bottom:1px solid var(--border); padding:.8rem 1rem; min-width:0; }
  .gtab:last-child { border-right:1px solid var(--border); }
  .gtab.active { border-color:var(--border-r); }

  .proj-module {
    grid-template-columns:1fr;
    grid-template-rows:auto auto;
    min-height:unset;
  }
  .proj-hero { border-right:none; border-bottom:1px solid var(--border); }
  .proj-hero-img { min-height:260px; aspect-ratio:16/9; }
  .proj-info { padding:1.5rem; gap:1.2rem; }
  .proj-title { font-size:1.7rem; }
  .proj-thumbs { grid-template-columns:repeat(5, 1fr); gap:2px; }
}
@media(max-width:480px) {
  .proj-hero-img { min-height:200px; }
  .proj-title { font-size:1.4rem; }
  .proj-thumbs { grid-template-columns:repeat(4, 1fr); }
  .proj-info { padding:1.2rem; }
}

/* ─── CONTACT ─── */
.contact {
  padding:5rem 3rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  align-items:start;
}

.contact-intro {
  font-family:'Outfit', sans-serif;
  font-size:0.9rem;
  line-height:1.65;
  color:rgba(240,234,224,.65);
  margin-top:3rem;
  font-weight:400;
}
.contact-infos {
  display:flex;
  flex-direction:column;
  gap:1.4rem;
  margin-bottom:3rem;
}
.c-info {
  display:flex; align-items:flex-start; gap:1.2rem;
  text-decoration:none;
  color:var(--cream);
  transition:color .3s;
}
.c-info:hover { color:var(--red); }
.c-info-lbl {
  font-family:'DM Mono', monospace;
  font-size:.55rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--red);
  width:90px;
  flex-shrink:0;
  padding-top:.15rem;
}
.c-info-val { font-size:.88rem; font-weight:300; }

/* form */
.contact-form {
  display:flex; flex-direction:column; gap:2rem;
}
.f-group { display:flex; flex-direction:column; gap:.5rem; }
.f-label {
  font-family:'DM Mono', monospace;
  font-size:.55rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--red);
}
.f-input, .f-textarea {
  background:transparent;
  border:none;
  border-bottom:1px solid var(--border);
  padding:.8rem 0;
  font-family:'Outfit', sans-serif;
  font-size:.88rem;
  font-weight:300;
  color:var(--cream);
  outline:none;
  width:100%;
  transition:border-color .3s;
}
.f-input:focus, .f-textarea:focus { border-color:var(--red); }
.f-textarea { resize:none; height:90px; }
::placeholder { color:rgba(240,234,224,.18); }
.f-submit {
  padding:1.05rem 0;
  background:var(--red);
  color:var(--cream);
  font-family:'DM Mono', monospace;
  font-size:.6rem;
  letter-spacing:.25em;
  text-transform:uppercase;
  border:none;
  cursor:none;
  transition:background .3s;
  width:100%;
  margin-top:.5rem;
}
.f-submit:hover { background:var(--red-dim); }

/* ─── FOOTER ─── */
footer {
  background:var(--surface);
  border-top:1px solid var(--border);
  position:relative;
  z-index:1;
}
.footer-top {
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:4rem;
  padding:3.5rem 3rem;
  border-bottom:1px solid var(--border);
}
.footer-logo {
  height:32px;
  width:auto;
  display:block;
  margin-bottom:1.2rem;
  opacity:.85;
}
.footer-tagline {
  font-family:'DM Mono', monospace;
  font-size:.54rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
  line-height:1.9;
}
.footer-nav {
  display:flex;
  gap:3rem;
}
.footer-nav-col {
  display:flex;
  flex-direction:column;
  gap:.7rem;
}
.footer-nav-label {
  font-family:'DM Mono', monospace;
  font-size:.48rem;
  letter-spacing:.25em;
  text-transform:uppercase;
  color:var(--red);
  margin-bottom:.4rem;
}
.footer-nav-col a,
.footer-contact a {
  font-family:'DM Mono', monospace;
  font-size:.54rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
  text-decoration:none;
  transition:color .3s;
}
.footer-nav-col a:hover,
.footer-contact a:hover { color:var(--cream); }
.footer-contact {
  display:flex;
  flex-direction:column;
  gap:.7rem;
}
.footer-email {
  font-family:'Outfit', sans-serif !important;
  font-size:.82rem !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  color:var(--cream) !important;
  font-weight:300;
}
.footer-tel {
  font-family:'Outfit', sans-serif !important;
  font-size:.82rem !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  color:var(--muted) !important;
}
.footer-social {
  display:flex;
  align-items:center;
  gap:.6rem;
  margin-top:.4rem;
}
.f-social-sep {
  color:rgba(122,112,104,.3);
  font-size:.7rem;
}
.footer-bottom {
  padding:1.4rem 3rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.f-copy {
  font-family:'DM Mono', monospace;
  font-size:.48rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:rgba(122,112,104,.5);
}

@media (max-width:920px) {
  .footer-top {
    grid-template-columns:1fr;
    gap:2.5rem;
    padding:2.5rem 1.4rem;
  }
  .footer-nav { gap:2rem; }
  .footer-bottom {
    flex-direction:column;
    gap:.6rem;
    padding:1.2rem 1.4rem;
    text-align:center;
  }
}

/* ─── REVEAL ─── */
.rv {
  opacity:0;
  transform:translateY(28px);
  transition:opacity .8s ease, transform .8s ease;
}
.rv.on { 
  opacity:1;
  transform:translateY(0);
}


/* ─── ANIMATIONS ─── */
@keyframes up {
  from { opacity:0; transform:translateY(22px); }
  to   { opacity:1; transform:translateY(0);     }
}
@keyframes fadeIn {
  from { opacity:0; }
  to   { opacity:1; }
}
@keyframes marquee {
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}
@keyframes blink {
  0%,100% { opacity:1; }
  50%      { opacity:.3; }
}

/* ─── SCROLLBAR ─── */
::-webkit-scrollbar { width:2px; }
::-webkit-scrollbar-track { background:var(--bg); }
::-webkit-scrollbar-thumb { background:var(--red); }

/* ═══════════════════════════════════════
   RESPONSIVE — complet & harmonieux
═══════════════════════════════════════ */

/* ── Menu hamburger ── */
.nav-burger {
  display:none;
  flex-direction:column;
  gap:5px;
  background:none;
  border:none;
  cursor:pointer;
  padding:4px;
  z-index:700;
  position:relative;
}
.nav-burger span {
  display:block;
  width:24px; height:1.5px;
  background:var(--cream);
  transition:transform .3s, opacity .3s;
}
.nav-burger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity:0; }
.nav-burger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

/* Drawer mobile */
.nav-drawer {
  position:fixed;
  inset:0; top:0;
  background:rgba(13,12,11,.97);
  backdrop-filter:blur(18px);
  z-index:550;
  display:none;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:2.5rem;
  opacity:0;
  pointer-events:none;
  transition:opacity .35s ease;
}
.nav-drawer.open {
  display:flex;
  opacity:1;
  pointer-events:all;
}
.nav-drawer a {
  font-family:'Bebas Neue', sans-serif;
  font-size:clamp(2rem,8vw,3rem);
  letter-spacing:.1em;
  color:var(--cream);
  text-decoration:none;
  transition:color .3s;
}
.nav-drawer a:hover { color:var(--red); }
.nav-drawer .drawer-cta {
  margin-top:1rem;
  font-family:'DM Mono', monospace;
  font-size:.65rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--red);
  border:1px solid var(--border-r);
  padding:.7rem 1.8rem;
}

/* ── Tablet large ── */
@media (max-width:1100px) {
  .hero-l { padding:1rem 2rem 4rem; }
  .about { padding:6rem 2rem; gap:4rem; }
  .skills-sec { padding:5rem 2rem; }
  .exps { padding:6rem 2rem; }
  .gallery-sec { padding:5rem 2rem; }
  .contact { padding:6rem 2rem; gap:4rem; }
}

/* ── Tablet & Mobile ── */
@media (max-width:920px) {
  body { cursor:auto; }
  .cur-dot,.cur-ring { display:none; }

  /* NAV */
  #nav {
    z-index:1200;
    padding:1.1rem 1.4rem;
    background:rgba(13,12,11,.72);
    backdrop-filter:blur(14px);
  }
  .nav-links,.nav-cta { display:none; }
  .nav-burger {
    display:flex;
    z-index:1300;
  }
  .nav-drawer { z-index:1150; }

  /* HERO — moins haut, plus compact */
  .hero {
    grid-template-columns:1fr;
    min-height:100svh;
  }
  .hero-l {
    padding:6rem 1.4rem 3rem;
    justify-content:center;
  }
  .hero-name { font-size:clamp(4rem,18vw,7rem); }
  .hero-desc { font-size:.82rem; max-width:none; }
  .hero-actions {
    flex-wrap:wrap;
    gap:.8rem;
    margin-top:2rem;
  }
  .btn-r { padding:.75rem 1.6rem; font-size:.55rem; }
  .hero-infos {
    margin-top:2.5rem;
    gap:2rem;
    flex-wrap:wrap;
  }
  .hero-r { display:none; }

  /* ABOUT */
  .about {
    grid-template-columns:1fr;
    gap:2rem;
    padding:4rem 1.4rem;
  }
  .about-l { position:static; }
  .about-watermark { font-size:6rem; margin-bottom:-2rem; }
  .about-lead { font-size:1.1rem; }

  /* COMPÉTENCES */
  .skills-sec { padding:4rem 1.4rem; }
  .skills-head { flex-direction:column; align-items:flex-start; gap:1rem; margin-bottom:2.5rem; }
  .skills-grid-outer { grid-template-columns:1fr 1fr; }
  .skill-col { padding:1.5rem 1.2rem; }

  /* EXPÉRIENCES */
  .exps { padding:4rem 1.4rem; }
  .exp-item { grid-template-columns:1fr; gap:.8rem; padding:2rem 0; }
  .exp-header { margin-bottom:2.5rem; }

  /* GALERIE */
  .gallery-sec { padding:4rem 1.4rem; }
  .gallery-header { flex-direction:column; align-items:flex-start; gap:1.5rem; margin-bottom:2.5rem; }
  .gallery-tabs { flex-wrap:wrap; width:100%; gap:0; }
  .gtab {
    flex:1;
    border-right:none;
    border-bottom:1px solid var(--border);
    padding:.8rem 1rem;
    min-width:0;
  }
  .gtab:last-child { border-right:1px solid var(--border); }
  .gtab.active { border-color:var(--border-r); }

  .gcard {
    flex:0 0 100%;
    aspect-ratio:16/9;
    filter:brightness(1) saturate(1) !important;
  }
  .gcard::before { transform:scaleX(1); }
  .gcard-inner-deco { color:rgba(240,234,224,.35); }

  .carousel-info {
    grid-template-columns:1fr;
    gap:.8rem;
    padding:.8rem 0 0;
  }
  .carousel-nav { justify-content:space-between; }
  .ci-title { font-size:1.1rem; }
  .ci-desc  { font-size:.66rem; max-width:none; }
  .carousel-progress { width:40px; }

  /* CONTACT */
  .contact { grid-template-columns:1fr; gap:2.5rem; padding:4rem 1.4rem; }
  .contact-intro { font-size:1rem; margin-bottom:2rem; }

  /* FOOTER */
  footer { flex-direction:column; gap:1rem; padding:1.8rem 1.4rem; text-align:center; }
}

/* ── Mobile petit ── */
@media (max-width:480px) {
  .hero-l { padding:5.5rem 1.2rem 2.5rem; }
  .hero-tag { margin-bottom:1.2rem; font-size:.5rem; }
  .hero-job { font-size:.95rem; margin-top:1rem; }
  .hero-actions { margin-top:1.5rem; }
  .hero-infos { margin-top:2rem; gap:1.5rem; }

  .skills-grid-outer { grid-template-columns:1fr; }
  .skill-col { padding:1.2rem 1rem; }

  .about { padding:3rem 1.2rem; }
  .skills-sec { padding:3rem 1.2rem; }
  .exps { padding:3rem 1.2rem; }
  .gallery-sec { padding:3rem 1.2rem; }
  .contact { padding:3rem 1.2rem; }

  h2.big { font-size:clamp(2.2rem,10vw,3.5rem); }
  .about-watermark { font-size:4.5rem; }

  .gtab { padding:.65rem .8rem; }
  .gtab-label { font-size:.52rem; }

  .gcard { aspect-ratio:4/3; }
}
/* ─── LIGHTBOX ─── */
.lightbox {
  position:fixed; inset:0;
  z-index:2000;
  display:flex; align-items:center; justify-content:center;
  background:rgba(6,4,4,.96);
  backdrop-filter:blur(12px);
  opacity:0; pointer-events:none;
  transition:opacity .35s ease;
}
.lightbox.open {
  opacity:1; pointer-events:all;
}
.lb-img-wrap {
  position:relative;
  max-width:90vw; max-height:88vh;
  display:flex; align-items:center; justify-content:center;
}
.lb-img-wrap img {
  max-width:90vw; max-height:82vh;
  object-fit:contain;
  display:block;
  transform:scale(.96);
  transition:transform .4s cubic-bezier(.16,1,.3,1);
  border:1px solid var(--border);
}
.lightbox.open .lb-img-wrap img { transform:scale(1); }

.lb-close {
  position:fixed; top:1.5rem; right:1.8rem;
  background:none; border:1px solid var(--border);
  color:var(--cream); font-size:1.1rem;
  width:42px; height:42px;
  display:flex; align-items:center; justify-content:center;
  cursor:none; z-index:2001;
  transition:border-color .3s, color .3s;
}
.lb-close:hover { border-color:var(--red); color:var(--red); }

.lb-arrow {
  position:fixed; top:50%; transform:translateY(-50%);
  background:none; border:1px solid var(--border);
  color:var(--cream); font-size:.9rem;
  width:42px; height:42px;
  display:flex; align-items:center; justify-content:center;
  cursor:none; z-index:2001;
  transition:border-color .3s, color .3s;
}
.lb-arrow:hover { border-color:var(--red); color:var(--red); }
.lb-arrow:disabled { opacity:.15; pointer-events:none; }
.lb-prev { left:1.2rem; }
.lb-next { right:1.2rem; }

.lb-info {
  position:fixed; bottom:1.8rem; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.3rem;
  z-index:2001; text-align:center;
}
.lb-title {
  font-family:'Bebas Neue', sans-serif;
  font-size:1.1rem; letter-spacing:.05em;
  color:var(--cream);
}
.lb-cat {
  font-family:'DM Mono', monospace;
  font-size:.46rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--red);
}
.lb-counter {
  font-family:'DM Mono', monospace;
  font-size:.44rem; letter-spacing:.15em;
  color:rgba(122,112,104,.5);
  margin-top:.2rem;
}

@media(max-width:920px){
  .lb-arrow { display:none; }
  .lb-img-wrap img { max-height:70vh; }
  body.ch .lb-close, body.ch .lb-arrow { cursor:auto; }
}

a:focus-visible, button:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 4px;
}

/* ── SKIP LINK ── */
.skip-link {
  position: absolute;
  top: -100px;
  left: 1rem;
  background: var(--red);
  color: #fff;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  font-family: var(--f-mono);
  z-index: 9999;
  transition: top 0.2s;
  border-radius: 0 0 4px 4px;
}
.skip-link:focus {
  top: 0;
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* ── PREFERS REDUCED MOTION ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .marquee-track { animation: none; }
  .cur-dot, .cur-ring { display: none; }
}