/* Page projet — extension du système Morphesys
   Chaque page intérieure est une petite expérience sensible,
   pas une fiche descriptive. */

.project-page{
  position: relative;
  min-height: 100vh;
  z-index: 2;
}

/* Retour discret, présent toujours */
.back-link{
  position: fixed;
  top: 1.6rem;
  left: 2.5rem;
  z-index: 20;
  color: var(--ink-mute);
  text-decoration: none;
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  transition: color .8s var(--ease);
  mix-blend-mode: multiply;
}
.back-link:hover{ color: var(--ink); }
.back-link .arrow-back{ display: inline-block; transition: transform .8s var(--ease); }
.back-link:hover .arrow-back{ transform: translateX(-4px); }

/* Fil d'Ariane minimal en haut à droite */
.page-meta{
  position: fixed;
  top: 1.8rem;
  right: 2.5rem;
  z-index: 20;
  font-size: .62rem;
  letter-spacing: .32em;
  text-transform: lowercase;
  color: var(--ink-faint);
  display: flex;
  gap: .55rem;
  align-items: center;
  mix-blend-mode: multiply;
}
.page-meta__crumb{ color: var(--ink-faint); }
.page-meta__crumb:last-child{ color: var(--ink-mute); }
.page-meta__sep{ color: var(--gold); opacity: .5; }

@media (max-width: 720px){
  .back-link{ top: 1.1rem; left: 1.3rem; }
  .page-meta{ display: none; }
}

/* =========================================================
   EXHA VOCALIS — une page qui respire
   ========================================================= */

.page-exha{ background: var(--bg); }

.exha{
  position: relative;
  z-index: 2;
}

/* --- Souffle 1 : le hero respirant --- */
.exha-breath{
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 4rem;
  padding: 8rem 6vw 6rem;
  position: relative;
  overflow: hidden;
}

.exha-breath__halo{
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 30% 50%, rgba(160,124,63,0.06), transparent 70%),
    radial-gradient(ellipse 40% 35% at 70% 60%, rgba(15,13,10,0.04), transparent 70%);
  pointer-events: none;
  animation: exhaHalo 14s ease-in-out infinite;
}
@keyframes exhaHalo{
  0%, 100%{ opacity: .8; transform: scale(1); }
  50%{ opacity: 1; transform: scale(1.05); }
}

.exha-breath__matter{
  position: relative;
  width: min(560px, 92%);
  aspect-ratio: 16 / 11;
  justify-self: end;
  margin: 0;
  overflow: hidden;
  border-radius: 2px;
  box-shadow:
    0 1px 0 rgba(15,13,10,0.06),
    0 30px 60px -25px rgba(15,13,10,0.18);
  animation: exhaBreathe 11s ease-in-out infinite;
}
/* Bouton son discret — haut droite de la vidéo */
.exha-breath__sound{
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .5rem .85rem;
  border: 1px solid rgba(15,13,10,0.18);
  border-radius: 999px;
  background: rgba(250,250,246,0.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  font-family: var(--sans);
  font-size: .58rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  color: var(--ink-soft);
  cursor: pointer;
  transition: all .6s var(--ease);
  opacity: 0;
  transform: translateY(-4px);
}
.exha-breath.is-in .exha-breath__sound{
  opacity: 1;
  transform: translateY(0);
  transition-delay: 1.2s;
}
.exha-breath__sound:hover{
  border-color: var(--ink);
  color: var(--ink);
}
.exha-breath__sound svg{ display: block; }
.exha-breath__sound .exha-sound-on{ opacity: 0; transition: opacity .4s var(--ease); }
.exha-breath__sound .exha-sound-off{ opacity: 1; transition: opacity .4s var(--ease); }
.exha-breath__sound.is-on{
  border-color: var(--line-gold);
  color: var(--gold-deep);
  background: rgba(250,250,246,0.85);
}
.exha-breath__sound.is-on .exha-sound-on{ opacity: 1; }
.exha-breath__sound.is-on .exha-sound-off{ opacity: 0; }
.exha-breath__sound-label{ line-height: 1; }
@media (max-width: 540px){
  .exha-breath__sound{ padding: .45rem .7rem; }
  .exha-breath__sound-label{ display: none; }
}

.exha-breath__matter img,
.exha-breath__matter video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: contrast(1.02) saturate(1.05);
  transform: scale(1.02);
  transition: transform 2.4s var(--ease);
}
.exha-breath__matter::after{
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(250,250,246,0) 60%, rgba(250,250,246,0.35) 100%),
    radial-gradient(ellipse at 50% 50%, rgba(250,250,246,0) 55%, rgba(250,250,246,0.18) 100%);
  pointer-events: none;
}
.exha-breath__caption{
  position: absolute;
  bottom: 1rem;
  left: 1.2rem;
  font-family: var(--sans);
  font-size: .62rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  color: var(--ink-mute);
  mix-blend-mode: multiply;
}

@keyframes exhaBreathe{
  0%, 100%{ transform: scale(1) translateY(0); }
  50%{ transform: scale(1.012) translateY(-4px); }
}

.exha-breath__text{
  max-width: 480px;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.4s var(--ease), transform 1.4s var(--ease);
}
.exha-breath.is-in .exha-breath__text{
  opacity: 1;
  transform: translateY(0);
}

.exha-eyebrow{
  display: block;
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 2rem;
}

.exha-title{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(3.2rem, 7vw, 5.6rem);
  line-height: .98;
  letter-spacing: .01em;
  color: var(--ink);
  margin: 0 0 2rem;
}
.exha-title__line{ display: block; }
.exha-title__line--italic{
  font-style: italic;
  color: var(--ink-soft);
  margin-left: 1.6em;
}

.exha-lede{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.15rem, 1.6vw, 1.4rem);
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 380px;
}

@media (max-width: 880px){
  .exha-breath{
    grid-template-columns: 1fr;
    gap: 2.5rem;
    padding: 7rem 1.5rem 4rem;
    text-align: center;
  }
  .exha-breath__matter{ justify-self: center; width: min(420px, 92%); order: -1; }
  .exha-breath__text{ margin: 0 auto; }
  .exha-title__line--italic{ margin-left: 1em; }
  .exha-lede{ margin: 0 auto; }
}

/* --- Souffle 2 : fragments scrollés --- */
.exha-scroll{
  position: relative;
  min-height: 70vh;
  display: flex;
  align-items: center;
  padding: 6rem 6vw;
}
.exha-scroll--right{ justify-content: flex-end; }
.exha-scroll--left{ justify-content: flex-start; }

.exha-fragment{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.4rem, 2.4vw, 2.1rem);
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 540px;
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 1.8s var(--ease), transform 1.8s var(--ease);
}
.exha-fragment.is-in{
  opacity: 1;
  transform: translateY(0);
}

.exha-marker{
  position: absolute;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: 1rem;
  color: var(--gold);
  opacity: .55;
  letter-spacing: .15em;
}
.exha-scroll--right .exha-marker{ top: 2.5rem; left: 6vw; }
.exha-scroll--left .exha-marker{ bottom: 2.5rem; right: 6vw; }

@media (max-width: 720px){
  .exha-scroll{ padding: 4rem 1.5rem; min-height: 50vh; }
  .exha-scroll--right, .exha-scroll--left{ justify-content: flex-start; }
}

/* --- Souffle 3 : matière --- */
.exha-matter{
  padding: 8rem 6vw;
  background: linear-gradient(180deg, transparent, rgba(244,241,233,0.6) 30%, rgba(244,241,233,0.6) 70%, transparent);
  position: relative;
}
.exha-matter__inner{
  max-width: 1000px;
  margin: 0 auto;
}
.exha-h2{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  letter-spacing: .02em;
  color: var(--ink);
  margin: 0 0 3.5rem;
  position: relative;
  display: inline-block;
}
.exha-h2::after{
  content: '';
  position: absolute;
  bottom: -.8rem;
  left: 0;
  width: 2.4rem;
  height: 1px;
  background: var(--gold);
}

.exha-matter__grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem 4rem;
}

.exha-matter__cell{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.2s var(--ease), transform 1.2s var(--ease);
}
.exha-matter__cell.is-in{
  opacity: 1;
  transform: translateY(0);
}
.exha-matter__cell:nth-child(2){ transition-delay: .15s; }
.exha-matter__cell:nth-child(3){ transition-delay: .3s; }
.exha-matter__cell:nth-child(4){ transition-delay: .45s; }

.exha-cell-tag{
  display: block;
  font-size: .64rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 1rem;
}
.exha-matter__cell p{
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--ink-soft);
  margin: 0;
}

@media (max-width: 720px){
  .exha-matter{ padding: 5rem 1.5rem; }
  .exha-matter__grid{ grid-template-columns: 1fr; gap: 2.5rem; }
}

/* --- Souffle 4 : coda --- */
.exha-coda{
  padding: 9rem 6vw;
  text-align: center;
  position: relative;
}
.exha-coda__line{
  width: 1px;
  height: 4rem;
  background: linear-gradient(to bottom, transparent, var(--gold), transparent);
  margin: 0 auto 3rem;
  opacity: 0;
  transition: opacity 2s var(--ease);
}
.exha-coda.is-in .exha-coda__line{ opacity: .7; }

.exha-coda__text{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  line-height: 2.2;
  color: var(--ink-soft);
  max-width: 540px;
  margin: 0 auto;
}
.exha-coda__text em{
  font-style: italic;
  color: var(--ink);
  font-weight: 400;
}
.exha-coda__breath{
  display: block;
  margin-top: 1.5rem;
  color: var(--ink-mute);
  font-style: italic;
  font-size: .95em;
}

/* --- Sortie --- */
.exha-exit{
  padding: 4rem 6vw 8rem;
  text-align: center;
}
.exha-exit__link{
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  color: var(--ink-mute);
  text-decoration: none;
  font-size: .72rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--line);
  transition: color .8s var(--ease), border-color .8s var(--ease), gap .8s var(--ease);
}
.exha-exit__link:hover{
  color: var(--ink);
  border-color: var(--ink);
  gap: 1.4rem;
}
.exha-exit__arrow{ transition: transform .8s var(--ease); }
.exha-exit__link:hover .exha-exit__arrow{ transform: translateX(-6px); }

/* =========================================================
   FEMMES EN MÉMOIRE — page-dépôt
   Même ossature qu'Exha, accents spécifiques (sable, archive)
   ========================================================= */

.page-fm{ background: var(--bg); }

.fm{ position: relative; z-index: 2; }

/* --- Souffle 1 : hero dépôt --- */
.fm-hero{
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 4rem;
  padding: 8rem 6vw 6rem;
  position: relative;
  overflow: hidden;
}

.fm-hero__halo{
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 55% 45% at 25% 55%, rgba(160,124,63,0.05), transparent 70%),
    radial-gradient(ellipse 45% 40% at 75% 50%, rgba(122,93,44,0.04), transparent 70%);
  pointer-events: none;
  animation: fmHalo 18s ease-in-out infinite;
}
@keyframes fmHalo{
  0%, 100%{ opacity: .8; transform: scale(1); }
  50%{ opacity: 1; transform: scale(1.04); }
}

.fm-hero__matter{
  position: relative;
  width: min(620px, 94%);
  aspect-ratio: 16 / 9;
  justify-self: end;
  margin: 0;
  overflow: hidden;
  border-radius: 2px;
  box-shadow:
    0 1px 0 rgba(15,13,10,0.06),
    0 30px 60px -25px rgba(15,13,10,0.18);
}
.fm-hero__matter img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: contrast(1.02);
}
.fm-hero__matter::after{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(250,250,246,0) 70%, rgba(250,250,246,0.4) 100%);
  pointer-events: none;
}
.fm-hero__caption{
  position: absolute;
  bottom: 1rem;
  left: 1.2rem;
  font-family: var(--sans);
  font-size: .62rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  color: var(--ink-mute);
  mix-blend-mode: multiply;
}

.fm-hero__text{
  max-width: 500px;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.4s var(--ease), transform 1.4s var(--ease);
}
.fm-hero.is-in .fm-hero__text{
  opacity: 1;
  transform: translateY(0);
}

.fm-eyebrow{
  display: block;
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 2rem;
}

.fm-title{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(3rem, 6.4vw, 5.2rem);
  line-height: 1;
  letter-spacing: .01em;
  color: var(--ink);
  margin: 0 0 2rem;
}
.fm-title__line{ display: block; }
.fm-title__line--italic{
  font-style: italic;
  color: var(--ink-soft);
  margin-left: 1.4em;
}

.fm-lede{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.1rem, 1.55vw, 1.35rem);
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 420px;
  margin: 0 0 2.5rem;
}

/* Statut déploiement dans le hero (petit, discret) */
.fm-status{
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  padding: .55rem .95rem;
  border: 1px solid var(--line-gold);
  border-radius: 999px;
  background: rgba(250,250,246,0.5);
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .25em;
  text-transform: lowercase;
}
.fm-status__dot{
  display: inline-block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 0 rgba(160,124,63,0.5);
  animation: fmPulse 2.6s ease-out infinite;
}
@keyframes fmPulse{
  0%{ box-shadow: 0 0 0 0 rgba(160,124,63,0.4); }
  70%{ box-shadow: 0 0 0 10px rgba(160,124,63,0); }
  100%{ box-shadow: 0 0 0 0 rgba(160,124,63,0); }
}
.fm-status__label{ color: var(--ink-mute); }
.fm-status__date{
  color: var(--ink);
  font-weight: 500;
  letter-spacing: .14em;
}

@media (max-width: 880px){
  .fm-hero{
    grid-template-columns: 1fr;
    gap: 2.5rem;
    padding: 7rem 1.5rem 4rem;
    text-align: center;
  }
  .fm-hero__matter{ justify-self: center; width: min(440px, 94%); order: -1; }
  .fm-hero__text{ margin: 0 auto; }
  .fm-title__line--italic{ margin-left: 1em; }
  .fm-lede{ margin: 0 auto 2.5rem; }
  .fm-status{ margin: 0 auto; }
}

/* --- Souffle 2 : fragments scrollés --- */
.fm-scroll{
  position: relative;
  min-height: 60vh;
  display: flex;
  align-items: center;
  padding: 5rem 6vw;
}
.fm-scroll--right{ justify-content: flex-end; }
.fm-scroll--left{ justify-content: flex-start; }

.fm-fragment{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.4rem, 2.4vw, 2.1rem);
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 540px;
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 1.8s var(--ease), transform 1.8s var(--ease);
}
.fm-fragment.is-in{ opacity: 1; transform: translateY(0); }

.fm-marker{
  position: absolute;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: 1rem;
  color: var(--gold);
  opacity: .55;
  letter-spacing: .15em;
}
.fm-scroll--right .fm-marker{ top: 2.5rem; left: 6vw; }
.fm-scroll--left .fm-marker{ bottom: 2.5rem; right: 6vw; }

@media (max-width: 720px){
  .fm-scroll{ padding: 4rem 1.5rem; min-height: 45vh; }
  .fm-scroll--right, .fm-scroll--left{ justify-content: flex-start; }
}

/* --- Souffle 3 : matière --- */
.fm-matter{
  padding: 8rem 6vw;
  background: linear-gradient(180deg, transparent, rgba(244,241,233,0.55) 30%, rgba(244,241,233,0.55) 70%, transparent);
}
.fm-matter__inner{ max-width: 1000px; margin: 0 auto; }

.fm-h2{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  letter-spacing: .02em;
  color: var(--ink);
  margin: 0 0 3.5rem;
  position: relative;
  display: inline-block;
}
.fm-h2::after{
  content: '';
  position: absolute;
  bottom: -.8rem;
  left: 0;
  width: 2.4rem;
  height: 1px;
  background: var(--gold);
}

.fm-matter__grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem 4rem;
}
.fm-matter__cell{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.2s var(--ease), transform 1.2s var(--ease);
}
.fm-matter__cell.is-in{ opacity: 1; transform: translateY(0); }
.fm-matter__cell:nth-child(2){ transition-delay: .15s; }
.fm-matter__cell:nth-child(3){ transition-delay: .3s; }
.fm-matter__cell:nth-child(4){ transition-delay: .45s; }

.fm-cell-tag{
  display: block;
  font-size: .64rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 1rem;
}
.fm-matter__cell p{
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--ink-soft);
  margin: 0;
}

@media (max-width: 720px){
  .fm-matter{ padding: 5rem 1.5rem; }
  .fm-matter__grid{ grid-template-columns: 1fr; gap: 2.5rem; }
}

/* --- Bloc déploiement (souffle 4) --- */
.fm-launch{
  padding: 8rem 6vw 6rem;
  text-align: center;
}
.fm-launch__inner{
  max-width: 720px;
  margin: 0 auto;
  padding: 4rem 3rem 4rem;
  border: 1px solid var(--line-gold);
  border-radius: 4px;
  background: rgba(250,250,246,0.5);
  position: relative;
}
.fm-launch__line{
  position: absolute;
  top: -2.5rem;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 2.2rem;
  background: linear-gradient(to bottom, transparent, var(--gold));
}
.fm-launch__tag{
  display: inline-block;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 1.4rem;
}
.fm-launch__date{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(2.2rem, 4.5vw, 3.6rem);
  line-height: 1.1;
  color: var(--ink);
  letter-spacing: .015em;
  margin: 0 0 1.6rem;
}
.fm-launch__text{
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.1rem;
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 480px;
  margin: 0 auto 2.5rem;
}
.fm-launch__meta{
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.4rem;
  padding-top: 1.6rem;
  border-top: 1px solid var(--line);
}
.fm-launch__meta-item{
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: .25rem;
}
.fm-launch__meta-label{
  font-family: var(--sans);
  font-size: .6rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  color: var(--ink-faint);
}
.fm-launch__meta-value{
  font-family: var(--serif);
  font-style: italic;
  font-size: .98rem;
  color: var(--ink-soft);
}
.fm-launch__meta-sep{
  color: var(--gold);
  opacity: .55;
  align-self: center;
}

@media (max-width: 720px){
  .fm-launch{ padding: 5rem 1.5rem 4rem; }
  .fm-launch__inner{ padding: 3rem 1.6rem; }
  .fm-launch__meta{ flex-direction: column; gap: 1.2rem; }
  .fm-launch__meta-sep{ display: none; }
}

/* --- Coda --- */
.fm-coda{
  padding: 7rem 6vw;
  text-align: center;
}
.fm-coda__line{
  width: 1px;
  height: 4rem;
  background: linear-gradient(to bottom, transparent, var(--gold), transparent);
  margin: 0 auto 3rem;
  opacity: 0;
  transition: opacity 2s var(--ease);
}
.fm-coda.is-in .fm-coda__line{ opacity: .7; }

.fm-coda__text{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  line-height: 2.2;
  color: var(--ink-soft);
  max-width: 560px;
  margin: 0 auto;
}
.fm-coda__text em{
  font-style: italic;
  color: var(--ink);
  font-weight: 400;
}
.fm-coda__breath{
  display: block;
  margin-top: 1.5rem;
  color: var(--ink-mute);
  font-style: italic;
  font-size: .95em;
}

/* --- Sortie --- */
.fm-exit{
  padding: 3rem 6vw 8rem;
  text-align: center;
}
.fm-exit__link{
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  color: var(--ink-mute);
  text-decoration: none;
  font-size: .72rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--line);
  transition: color .8s var(--ease), border-color .8s var(--ease), gap .8s var(--ease);
}
.fm-exit__link:hover{
  color: var(--ink);
  border-color: var(--ink);
  gap: 1.4rem;
}
.fm-exit__arrow{ transition: transform .8s var(--ease); }
.fm-exit__link:hover .fm-exit__arrow{ transform: translateX(-6px); }

/* =========================================================
   PSAÏ — Page-poème (dispositif · IA locale · pensée par briques)
   ========================================================= */

body.page-psai{ background: var(--bg); }

.psai{
  position: relative;
  z-index: 2;
  max-width: 100%;
  overflow: hidden;
}

/* --- Souffle 1 : hero --- */
.psai-hero{
  min-height: 100vh;
  padding: 9rem 6vw 4rem;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 4rem;
  align-items: center;
  position: relative;
}
.psai-hero__halo{
  position: absolute;
  top: 14%;
  right: 8%;
  width: 36rem;
  height: 36rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(160,124,63,0.06), transparent 65%);
  filter: blur(40px);
  pointer-events: none;
  animation: psaiHaloPulse 14s ease-in-out infinite;
}
@keyframes psaiHaloPulse{
  0%, 100%{ opacity: .6; transform: scale(1); }
  50%{ opacity: 1; transform: scale(1.06); }
}

.psai-hero__text{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.6s var(--ease), transform 1.6s var(--ease);
}
.psai-hero.is-in .psai-hero__text{
  opacity: 1;
  transform: translateY(0);
}

.psai-eyebrow{
  display: block;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 2rem;
}

.psai-title{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(3.2rem, 7.5vw, 6rem);
  line-height: 1;
  letter-spacing: .015em;
  color: var(--ink);
  margin: 0 0 1.4rem;
}
.psai-title__umlaut{
  font-style: italic;
  color: var(--ink);
}

.psai-formula{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.05rem, 1.6vw, 1.25rem);
  color: var(--ink-soft);
  line-height: 1.55;
  margin: 0 0 2rem;
  max-width: 460px;
}
/* Signature en bas de hero : sceau discret */
.psai-signature{
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  margin: 2.4rem 0 0;
  padding-top: 1.6rem;
  border-top: 1px solid var(--line);
  font-family: var(--sans);
  font-size: .62rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  color: var(--ink-faint);
}
.psai-signature__mark{
  color: var(--gold-deep);
  letter-spacing: .18em;
  font-weight: 500;
}
.psai-signature__sep{
  color: var(--gold);
  opacity: .5;
}
.psai-signature__expand{
  font-style: italic;
  font-family: var(--serif);
  font-size: 1.15em;
  letter-spacing: .02em;
  text-transform: none;
  color: var(--ink-mute);
}
@media (max-width: 900px){
  .psai-signature{ justify-content: center; }
}
@media (max-width: 540px){
  .psai-signature{
    flex-direction: column;
    gap: .4rem;
    align-items: center;
  }
  .psai-signature__sep{ display: none; }
}

.psai-lede{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.05rem, 1.5vw, 1.2rem);
  line-height: 1.8;
  color: var(--ink-soft);
  max-width: 460px;
  margin: 0 0 2.5rem;
}

.psai-status{
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  padding: .55rem 1.1rem;
  border: 1px solid var(--line-gold);
  border-radius: 999px;
  background: rgba(250,250,246,0.6);
  font-family: var(--sans);
  font-size: .66rem;
  letter-spacing: .32em;
  text-transform: lowercase;
}
.psai-status__dot{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
  position: relative;
  animation: psaiPulse 2.6s ease-in-out infinite;
}
.psai-status__dot::after{
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1px solid var(--gold);
  opacity: .4;
  animation: psaiPulseRing 2.6s ease-out infinite;
}
@keyframes psaiPulse{
  0%, 100%{ opacity: .9; }
  50%{ opacity: .5; }
}
@keyframes psaiPulseRing{
  0%{ transform: scale(.8); opacity: .5; }
  100%{ transform: scale(2); opacity: 0; }
}
.psai-status__label{ color: var(--ink-mute); }
.psai-status__sep{ color: var(--gold); opacity: .5; }
.psai-status__value{
  color: var(--ink-soft);
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.05em;
  text-transform: none;
  letter-spacing: 0;
}

/* Hero visual : onde → réseau de briques */
.psai-hero__visual{
  position: relative;
  width: 100%;
  aspect-ratio: 5 / 4;
  border-radius: 4px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(244,241,233,0.7), rgba(238,230,216,0.45));
  border: 1px solid var(--line);
  box-shadow: 0 30px 80px -50px rgba(15,13,10,0.35);
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.8s var(--ease) .2s, transform 1.8s var(--ease) .2s;
}
.psai-hero.is-in .psai-hero__visual{
  opacity: 1;
  transform: translateY(0);
}
.psai-hero__visual svg{
  width: 100%;
  height: 100%;
  display: block;
}
.psai-hero__caption{
  position: absolute;
  bottom: 1.2rem;
  left: 1.4rem;
  font-family: var(--serif);
  font-style: italic;
  font-size: .82rem;
  color: var(--ink-mute);
  letter-spacing: .02em;
}

@media (max-width: 900px){
  .psai-hero{
    grid-template-columns: 1fr;
    text-align: center;
    padding: 7rem 1.5rem 3rem;
    gap: 3rem;
  }
  .psai-hero__visual{ order: -1; max-width: 460px; margin: 0 auto; }
  .psai-formula, .psai-lede{ margin-left: auto; margin-right: auto; }
  .psai-hero__halo{ width: 22rem; height: 22rem; right: -10%; }
}

/* --- Souffle 2 : fragments scrollés --- */
.psai-scroll{
  position: relative;
  min-height: 55vh;
  display: flex;
  align-items: center;
  padding: 5rem 6vw;
}
.psai-scroll--right{ justify-content: flex-end; }
.psai-scroll--left{ justify-content: flex-start; }

.psai-fragment{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.4rem, 2.4vw, 2.1rem);
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 540px;
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 1.8s var(--ease), transform 1.8s var(--ease);
}
.psai-fragment.is-in{ opacity: 1; transform: translateY(0); }
.psai-fragment em{ color: var(--ink); font-style: italic; }

.psai-marker{
  position: absolute;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: 1rem;
  color: var(--gold);
  opacity: .55;
  letter-spacing: .15em;
}
.psai-scroll--right .psai-marker{ top: 2.5rem; left: 6vw; }
.psai-scroll--left .psai-marker{ bottom: 2.5rem; right: 6vw; }

@media (max-width: 720px){
  .psai-scroll{ padding: 4rem 1.5rem; min-height: 45vh; }
  .psai-scroll--right, .psai-scroll--left{ justify-content: flex-start; }
}

/* --- Souffle 3 : les quatre gestes --- */
.psai-matter{
  padding: 8rem 6vw;
  background: linear-gradient(180deg, transparent, rgba(244,241,233,0.55) 30%, rgba(244,241,233,0.55) 70%, transparent);
}
.psai-matter__inner{ max-width: 1000px; margin: 0 auto; }

.psai-h2{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  letter-spacing: .02em;
  color: var(--ink);
  margin: 0 0 3.5rem;
  position: relative;
  display: inline-block;
}
.psai-h2::after{
  content: '';
  position: absolute;
  bottom: -.8rem;
  left: 0;
  width: 2.4rem;
  height: 1px;
  background: var(--gold);
}

.psai-matter__grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem 4rem;
}
.psai-matter__cell{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.2s var(--ease), transform 1.2s var(--ease);
  position: relative;
  padding-left: 1.4rem;
  border-left: 1px solid var(--line);
}
.psai-matter__cell.is-in{ opacity: 1; transform: translateY(0); }
.psai-matter__cell:nth-child(2){ transition-delay: .15s; }
.psai-matter__cell:nth-child(3){ transition-delay: .3s; }
.psai-matter__cell:nth-child(4){ transition-delay: .45s; }

.psai-matter__cell::before{
  content: '';
  position: absolute;
  left: -1px;
  top: 0;
  width: 1px;
  height: 2rem;
  background: var(--gold);
}

.psai-cell-num{
  display: block;
  font-family: var(--serif);
  font-style: italic;
  font-size: .9rem;
  color: var(--gold-deep);
  margin-bottom: .4rem;
  letter-spacing: .04em;
}
.psai-cell-tag{
  display: block;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  color: var(--ink);
  margin-bottom: 1rem;
}
.psai-matter__cell p{
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--ink-soft);
  margin: 0;
}

@media (max-width: 720px){
  .psai-matter{ padding: 5rem 1.5rem; }
  .psai-matter__grid{ grid-template-columns: 1fr; gap: 2.5rem; }
}

/* --- Souffle 4 : pensée par briques --- */
.psai-bricks{
  padding: 8rem 6vw 6rem;
  text-align: center;
}
.psai-bricks__inner{
  max-width: 720px;
  margin: 0 auto;
  padding: 4rem 3rem;
  border: 1px solid var(--line-gold);
  border-radius: 4px;
  background: rgba(250,250,246,0.5);
  position: relative;
}
.psai-bricks__line{
  position: absolute;
  top: -2.5rem;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 2.2rem;
  background: linear-gradient(to bottom, transparent, var(--gold));
}
.psai-bricks__tag{
  display: inline-block;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 1.4rem;
}
.psai-bricks__title{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.15;
  color: var(--ink);
  letter-spacing: .015em;
  margin: 0 0 1.6rem;
}
.psai-bricks__text{
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.1rem;
  line-height: 1.75;
  color: var(--ink-soft);
  max-width: 520px;
  margin: 0 auto 2.5rem;
}

/* Petits modules visuels : briques empilables */
.psai-bricks__stack{
  display: flex;
  justify-content: center;
  gap: .6rem;
  margin-top: 1.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--line);
}
.psai-brick{
  width: 14px;
  height: 28px;
  background: var(--ink-soft);
  opacity: .14;
  border-radius: 1px;
  animation: psaiBrickBreathe 5s ease-in-out infinite;
}
.psai-brick:nth-child(1){ animation-delay: 0s; }
.psai-brick:nth-child(2){ animation-delay: .25s; }
.psai-brick:nth-child(3){ animation-delay: .5s; }
.psai-brick:nth-child(4){ animation-delay: .75s; background: var(--gold); opacity: .35; }
.psai-brick:nth-child(5){ animation-delay: 1s; }
.psai-brick:nth-child(6){ animation-delay: 1.25s; }
.psai-brick:nth-child(7){ animation-delay: 1.5s; }
@keyframes psaiBrickBreathe{
  0%, 100%{ opacity: .14; transform: scaleY(1); }
  50%{ opacity: .4; transform: scaleY(1.15); }
}
.psai-brick:nth-child(4){
  animation-name: psaiBrickBreatheGold;
}
@keyframes psaiBrickBreatheGold{
  0%, 100%{ opacity: .35; transform: scaleY(1); }
  50%{ opacity: .7; transform: scaleY(1.15); }
}

.psai-bricks__whisper{
  display: block;
  margin-top: 1.4rem;
  font-family: var(--serif);
  font-style: italic;
  font-size: .88rem;
  color: var(--ink-faint);
  letter-spacing: .02em;
}

@media (max-width: 720px){
  .psai-bricks{ padding: 5rem 1.5rem 4rem; }
  .psai-bricks__inner{ padding: 3rem 1.6rem; }
}

/* --- Coda --- */
.psai-coda{
  padding: 7rem 6vw;
  text-align: center;
}
.psai-coda__line{
  width: 1px;
  height: 4rem;
  background: linear-gradient(to bottom, transparent, var(--gold), transparent);
  margin: 0 auto 3rem;
  opacity: 0;
  transition: opacity 2s var(--ease);
}
.psai-coda.is-in .psai-coda__line{ opacity: .7; }

.psai-coda__text{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  line-height: 2.1;
  color: var(--ink-soft);
  max-width: 580px;
  margin: 0 auto;
}
.psai-coda__text em{
  font-style: italic;
  color: var(--ink);
  font-weight: 400;
}
.psai-coda__breath{
  display: block;
  margin-top: 1.5rem;
  color: var(--ink-mute);
  font-style: italic;
  font-size: .95em;
}
.psai-coda__bridge{
  display: block;
  margin-top: 2.6rem;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  color: var(--ink-mute);
}
.psai-coda__bridge a{
  color: var(--gold-deep);
  text-decoration: none;
  border-bottom: 1px solid var(--line-gold);
  padding-bottom: 2px;
  transition: color .7s var(--ease), border-color .7s var(--ease);
}
.psai-coda__bridge a:hover{
  color: var(--ink);
  border-color: var(--ink);
}

/* --- Sortie --- */
.psai-exit{
  padding: 3rem 6vw 8rem;
  text-align: center;
}
.psai-exit__link{
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  color: var(--ink-mute);
  text-decoration: none;
  font-size: .72rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--line);
  transition: color .8s var(--ease), border-color .8s var(--ease), gap .8s var(--ease);
}
.psai-exit__link:hover{
  color: var(--ink);
  border-color: var(--ink);
  gap: 1.4rem;
}
.psai-exit__arrow{ transition: transform .8s var(--ease); }
.psai-exit__link:hover .psai-exit__arrow{ transform: translateX(-6px); }

/* =========================================================
   ANKA GIRLS — Page-poème (atelier partagé · street art in utero)
   ========================================================= */

body.page-anka{ background: var(--bg); }

.anka{
  position: relative;
  z-index: 2;
}

/* --- Souffle 1 : hero --- */
.anka-hero{
  min-height: 95vh;
  padding: 9rem 6vw 4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
}
.anka-hero__halo{
  position: absolute;
  top: 12%;
  left: 50%;
  transform: translateX(-50%);
  width: 48rem;
  height: 48rem;
  max-width: 90vw;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 45%, rgba(192, 92, 130, 0.06), transparent 40%),
    radial-gradient(circle at 65% 55%, rgba(72, 156, 168, 0.06), transparent 40%),
    radial-gradient(circle, rgba(160,124,63,0.04), transparent 65%);
  filter: blur(50px);
  pointer-events: none;
  animation: ankaHaloPulse 17s ease-in-out infinite;
}
@keyframes ankaHaloPulse{
  0%, 100%{ opacity: .7; transform: translateX(-50%) scale(1); }
  50%{ opacity: 1; transform: translateX(-50%) scale(1.05); }
}

.anka-hero__text{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.6s var(--ease), transform 1.6s var(--ease);
  position: relative;
  z-index: 1;
}
.anka-hero.is-in .anka-hero__text{
  opacity: 1;
  transform: translateY(0);
}

.anka-eyebrow{
  display: block;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 2.5rem;
}

.anka-title{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(3.2rem, 7.5vw, 6rem);
  line-height: 1;
  letter-spacing: .025em;
  color: var(--ink);
  margin: 0 0 1.8rem;
}
.anka-title__amp{
  font-style: italic;
  font-weight: 400;
  color: var(--gold-deep);
  margin: 0 .15em;
}

.anka-slogan{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.8rem, 3.2vw, 2.6rem);
  line-height: 1.25;
  color: var(--ink-soft);
  margin: 0 0 3rem;
  letter-spacing: .015em;
}
.anka-slogan__amp{
  display: inline-block;
  color: var(--gold);
  font-style: normal;
  margin: 0 .3em;
  opacity: .7;
}

.anka-status{
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  padding: .55rem 1.1rem;
  border: 1px solid var(--line-gold);
  border-radius: 999px;
  background: rgba(250,250,246,0.6);
  font-family: var(--sans);
  font-size: .66rem;
  letter-spacing: .32em;
  text-transform: lowercase;
  margin-bottom: 2rem;
}
.anka-status__dot{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
  opacity: .8;
}
.anka-status__label{ color: var(--ink-mute); }
.anka-status__sep{ color: var(--gold); opacity: .5; }
.anka-status__value{
  color: var(--ink-soft);
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.05em;
  text-transform: none;
  letter-spacing: 0;
}

.anka-hero__link{
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  margin-top: 2.2rem;
  margin-left: auto;
  margin-right: auto;
  color: var(--gold-deep);
  text-decoration: none;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  padding-bottom: .35rem;
  border-bottom: 1px solid var(--line-gold);
  transition: color .7s var(--ease), border-color .7s var(--ease), gap .7s var(--ease);
}
.anka-hero__link:hover{
  color: var(--ink);
  border-color: var(--ink);
  gap: 1.2rem;
}
.anka-hero__link-arrow{ transition: transform .7s var(--ease); }
.anka-hero__link:hover .anka-hero__link-arrow{ transform: translateX(4px); }
.anka-hero__link-wrap{ display: block; margin-top: 2.2rem; }

@media (max-width: 720px){
  .anka-hero{ padding: 7rem 1.5rem 3rem; }
}

/* --- Souffle 2 : citation manifeste --- */
.anka-scroll{
  position: relative;
  min-height: 55vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 6vw;
}
.anka-fragment{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.5rem, 2.6vw, 2.3rem);
  line-height: 1.5;
  color: var(--ink-soft);
  max-width: 720px;
  text-align: center;
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 1.8s var(--ease), transform 1.8s var(--ease);
}
.anka-fragment.is-in{ opacity: 1; transform: translateY(0); }
.anka-fragment em{ color: var(--ink); font-style: italic; }
.anka-fragment__source{
  display: block;
  margin-top: 1.4rem;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  color: var(--ink-faint);
  font-style: normal;
}

@media (max-width: 720px){
  .anka-scroll{ padding: 4rem 1.5rem; min-height: 40vh; }
}

/* --- Souffle 3 : Le gang des U mutants (empilé vertical) --- */
.anka-gang{
  padding: 8rem 6vw;
  background: linear-gradient(180deg,
    transparent,
    rgba(244,241,233,0.45) 25%,
    rgba(244,241,233,0.45) 75%,
    transparent);
  position: relative;
}
.anka-gang__inner{
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}
.anka-gang__tag{
  display: inline-block;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 1.4rem;
}
.anka-gang__title{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(2.2rem, 4.5vw, 3.4rem);
  line-height: 1.1;
  color: var(--ink);
  letter-spacing: .015em;
  margin: 0 0 1.6rem;
}
.anka-gang__title em{
  font-style: italic;
  font-weight: 400;
  color: var(--gold-deep);
}
.anka-gang__lede{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 540px;
  margin: 0 auto 4rem;
}

/* Empilement vertical des U — chaque U s'élève depuis le bas */
.anka-gang__stack{
  display: flex;
  flex-direction: column-reverse; /* le premier item en bas, on s'empile vers le haut */
  align-items: center;
  gap: 1.2rem;
  position: relative;
  padding: 2rem 0;
}
.anka-gang__item{
  position: relative;
  width: min(460px, 92%);
  aspect-ratio: 3 / 4;
  border-radius: 4px;
  overflow: hidden;
  background: transparent;
  border: none;
  box-shadow: none;
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 1.4s var(--ease), transform 1.4s var(--ease);
}
.anka-gang__item.is-in{ opacity: 1; transform: translateY(0); }
.anka-gang__item:nth-child(1){ transition-delay: 0s; }
.anka-gang__item:nth-child(2){ transition-delay: .15s; }
.anka-gang__item:nth-child(3){ transition-delay: .3s; }
.anka-gang__item:nth-child(4){ transition-delay: .45s; }

.anka-gang__item img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  filter: drop-shadow(0 25px 35px rgba(15,13,10,0.18));
}

/* Placeholder visible quand pas d'image */
.anka-gang__item--placeholder{
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 50% 60%, rgba(192, 92, 130, 0.06), transparent 60%),
    linear-gradient(135deg, rgba(244,241,233,0.7), rgba(238,230,216,0.45));
}
.anka-gang__item--placeholder::before{
  content: 'image à venir';
  font-family: var(--sans);
  font-size: .6rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--ink-faint);
}

.anka-gang__caption{
  display: block;
  margin-top: 2.5rem;
  font-family: var(--serif);
  font-style: italic;
  font-size: .95rem;
  color: var(--ink-mute);
  letter-spacing: .02em;
}

@media (max-width: 720px){
  .anka-gang{ padding: 5rem 1.5rem; }
  .anka-gang__stack{ gap: 1rem; }
}

/* --- Souffle 4 : présence partagée (bloc bordé doré) --- */
.anka-shared{
  padding: 8rem 6vw 6rem;
  text-align: center;
}
.anka-shared__inner{
  max-width: 720px;
  margin: 0 auto;
  padding: 4rem 3rem;
  border: 1px solid var(--line-gold);
  border-radius: 4px;
  background: rgba(250,250,246,0.5);
  position: relative;
}
.anka-shared__line{
  position: absolute;
  top: -2.5rem;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 2.2rem;
  background: linear-gradient(to bottom, transparent, var(--gold));
}
.anka-shared__tag{
  display: inline-block;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 1.4rem;
}
.anka-shared__title{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.8rem, 3.6vw, 2.6rem);
  line-height: 1.2;
  color: var(--ink);
  letter-spacing: .015em;
  margin: 0 0 1.6rem;
}
.anka-shared__text{
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.08rem;
  line-height: 1.8;
  color: var(--ink-soft);
  max-width: 540px;
  margin: 0 auto 2.5rem;
}
.anka-shared__text em{ color: var(--ink); font-style: italic; }

.anka-shared__cta{
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  color: var(--gold-deep);
  text-decoration: none;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .38em;
  text-transform: lowercase;
  padding: .8rem 1.4rem;
  border: 1px solid var(--line-gold);
  border-radius: 999px;
  transition: all .7s var(--ease);
}
.anka-shared__cta:hover{
  color: var(--ink);
  border-color: var(--ink);
  background: rgba(250,250,246,0.85);
}
.anka-shared__cta-arrow{ transition: transform .7s var(--ease); }
.anka-shared__cta:hover .anka-shared__cta-arrow{ transform: translateX(4px); }

@media (max-width: 720px){
  .anka-shared{ padding: 5rem 1.5rem 4rem; }
  .anka-shared__inner{ padding: 3rem 1.6rem; }
}

/* --- Coda --- */
.anka-coda{
  padding: 7rem 6vw;
  text-align: center;
}
.anka-coda__line{
  width: 1px;
  height: 4rem;
  background: linear-gradient(to bottom, transparent, var(--gold), transparent);
  margin: 0 auto 3rem;
  opacity: 0;
  transition: opacity 2s var(--ease);
}
.anka-coda.is-in .anka-coda__line{ opacity: .7; }
.anka-coda__text{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  line-height: 2.1;
  color: var(--ink-soft);
  max-width: 580px;
  margin: 0 auto;
}
.anka-coda__text em{ color: var(--ink); font-style: italic; font-weight: 400; }
.anka-coda__breath{
  display: block;
  margin-top: 1.5rem;
  color: var(--ink-mute);
  font-style: italic;
  font-size: .95em;
}

/* --- Sortie --- */
.anka-exit{
  padding: 3rem 6vw 8rem;
  text-align: center;
}
.anka-exit__link{
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  color: var(--ink-mute);
  text-decoration: none;
  font-size: .72rem;
  letter-spacing: .4em;
  text-transform: lowercase;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--line);
  transition: color .8s var(--ease), border-color .8s var(--ease), gap .8s var(--ease);
}
.anka-exit__link:hover{
  color: var(--ink);
  border-color: var(--ink);
  gap: 1.4rem;
}
.anka-exit__arrow{ transition: transform .8s var(--ease); }
.anka-exit__link:hover .anka-exit__arrow{ transform: translateX(-6px); }

/* =========================================================
   Anciennes classes — archive (toutes les pages projet sont refaites)
   ========================================================= */

.project-hero{
  min-height: 90vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 6rem 2rem 4rem;
  position: relative;
}

.project-tag-hero{
  font-size: .7rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  color: var(--ink-mute);
  margin-bottom: 2rem;
}

.project-title{
  font-family: var(--serif);
  font-size: clamp(2.4rem, 6vw, 4.8rem);
  font-weight: 300;
  letter-spacing: .04em;
  color: var(--ink);
  line-height: 1.05;
  margin-bottom: 1.6rem;
  max-width: 900px;
}

.project-subtitle{
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.2rem;
  color: var(--ink-soft);
  max-width: 620px;
  line-height: 1.7;
  margin-bottom: 3rem;
}

.project-visual-hero{
  width: min(720px, 90vw);
  height: 360px;
  margin: 2rem auto 0;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid var(--line);
}
.project-visual-hero svg{
  width: 100%;
  height: 100%;
  display: block;
}

.project-body{
  width: min(720px, 90vw);
  margin: 0 auto;
  padding: 4rem 0 8rem;
}

.project-body h3{
  font-family: var(--serif);
  font-weight: 300;
  font-size: 1.8rem;
  color: var(--ink);
  margin: 3rem 0 1.2rem;
  letter-spacing: .02em;
}
.project-body h3:first-child{ margin-top: 0; }

.project-body p{
  color: var(--ink-soft);
  font-size: 1.02rem;
  line-height: 1.85;
  margin-bottom: 1.4rem;
}

.project-body .ambiance{
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.4rem;
  margin: 1.5rem 0 2.5rem;
  font-size: .7rem;
  letter-spacing: .3em;
  text-transform: lowercase;
  color: var(--ink-faint);
}

.project-cta{
  margin-top: 4rem;
  text-align: center;
}
.project-cta a{
  color: var(--ink);
  text-decoration: none;
  font-size: .75rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  padding-bottom: .4rem;
  border-bottom: 1px solid var(--line);
  transition: border-color .8s var(--ease);
}
.project-cta a:hover{ border-color: var(--ink); }

/* =========================================================
   PAGE CONTACT
   Hero centré, halo or très discret, email mis en valeur
   ========================================================= */

.contact{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.contact-hero{
  flex: 1;
  min-height: 88vh;
  padding: 9rem 6vw 5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
}
.contact-hero__halo{
  position: absolute;
  top: 18%;
  left: 50%;
  transform: translateX(-50%);
  width: 42rem;
  height: 42rem;
  max-width: 88vw;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(160,124,63,0.05), transparent 65%);
  filter: blur(40px);
  pointer-events: none;
  animation: contactHalo 18s ease-in-out infinite;
}
@keyframes contactHalo{
  0%, 100%{ opacity: .7; transform: translateX(-50%) scale(1); }
  50%{ opacity: 1; transform: translateX(-50%) scale(1.04); }
}

.contact-hero__text{
  position: relative;
  z-index: 1;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.6s var(--ease), transform 1.6s var(--ease);
  max-width: 38rem;
}
.contact-hero.is-in .contact-hero__text{
  opacity: 1;
  transform: translateY(0);
}

.contact-eyebrow{
  display: block;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .42em;
  text-transform: lowercase;
  color: var(--gold-deep);
  margin-bottom: 2.5rem;
}

.contact-title{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(2.6rem, 5.5vw, 4.4rem);
  line-height: 1.15;
  letter-spacing: .015em;
  color: var(--ink);
  margin: 0 0 2.2rem;
}
.contact-title em{
  font-style: italic;
  color: var(--gold-deep);
  font-weight: 400;
}

.contact-intro{
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(1.15rem, 1.6vw, 1.35rem);
  line-height: 1.65;
  color: var(--ink-soft);
  margin: 0 0 3.2rem;
  font-style: italic;
}

.contact-email-wrap{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin: 0 0 3rem;
}
.contact-email-tag{
  font-family: var(--sans);
  font-size: .66rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  color: var(--ink-mute);
}
.contact-email{
  font-family: var(--serif);
  font-size: clamp(1.3rem, 2.2vw, 1.8rem);
  font-weight: 400;
  color: var(--ink);
  text-decoration: none;
  letter-spacing: .01em;
  padding: .3rem 0 .55rem;
  border-bottom: 1px solid var(--line-gold);
  transition: color .7s var(--ease), border-color .7s var(--ease), letter-spacing .8s var(--ease);
}
.contact-email:hover{
  color: var(--gold-deep);
  border-color: var(--gold);
  letter-spacing: .025em;
}

.contact-place{
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  padding: .55rem 1.2rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(250,250,246,0.5);
  font-family: var(--sans);
  font-size: .66rem;
  letter-spacing: .32em;
  text-transform: lowercase;
  color: var(--ink-mute);
}
.contact-place__dot{
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--gold);
  opacity: .7;
}
.contact-place__sep{ color: var(--gold); opacity: .7; }
.contact-place__value{ color: var(--ink-soft); }

.contact-note{
  margin-top: 3.5rem;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: 1rem;
  color: var(--ink-faint);
  letter-spacing: .01em;
}

.contact-exit{
  padding: 2rem 0 4rem;
  text-align: center;
}
.contact-exit__link{
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  color: var(--ink-mute);
  text-decoration: none;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .35em;
  text-transform: lowercase;
  padding-bottom: .35rem;
  border-bottom: 1px solid transparent;
  transition: color .7s var(--ease), border-color .7s var(--ease), gap .7s var(--ease);
}
.contact-exit__link:hover{
  color: var(--ink);
  border-color: var(--line);
  gap: 1.2rem;
}
.contact-exit__arrow{ transition: transform .8s var(--ease); }
.contact-exit__link:hover .contact-exit__arrow{ transform: translateX(-6px); }

@media (max-width: 720px){
  .contact-hero{ padding: 7rem 1.5rem 3rem; }
  .contact-place{ flex-wrap: wrap; justify-content: center; gap: .6rem; }
}
