.home-cube-wrap{
  position:fixed;left:50%;top:50%;width:min(34vw,320px);height:min(34vw,320px);
  transform:translate3d(-50%, -50%, 0) scale(1);z-index:9;pointer-events:auto;
  transition:opacity .45s var(--ease), transform .45s var(--ease), visibility .45s var(--ease);
  will-change:transform,left,top;
}
.home-cube-wrap.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.home-cube-shadow{
  position:absolute;left:50%;bottom:5%;width:72%;height:14%;transform:translateX(-50%);
  border-radius:999px;background:radial-gradient(circle at center, rgba(0,0,0,.11), rgba(0,0,0,.03) 52%, transparent 74%);
  filter:blur(16px);animation:homeShadowPulse 6s ease-in-out infinite;pointer-events:none;
}
.home-cube-wrap.is-embedded .home-cube-shadow{
  bottom:-6%;
  width:78%;
  height:10%;
  filter:blur(12px);
  opacity:.78;
}
.home-cube-float{position:absolute;inset:0;animation:homeCubeLevitate 6s ease-in-out infinite;transform-style:preserve-3d}
.home-cube-scene{width:100%;height:100%;perspective:1200px;perspective-origin:50% 50%;touch-action:none;user-select:none}
.home-cube{
  --size:min(24vw,220px);min-width:220px;min-height:220px;--depth:calc(var(--size) / 2);
  position:absolute;left:50%;top:50%;width:var(--size);height:var(--size);
  transform:translate(-50%, -50%) rotateX(-24deg) rotateY(-34deg);transform-style:preserve-3d;will-change:transform;cursor:grab;
}
.home-cube.dragging{cursor:grabbing}
.home-face{
  position:absolute;inset:0;border:1px solid rgba(17,17,17,.36);background:rgba(255,255,255,.015);color:rgba(17,17,17,.56);
  display:flex;align-items:center;justify-content:center;text-align:center;text-transform:uppercase;letter-spacing:.18em;
  font-size:clamp(.72rem, .7vw, .84rem);padding:.35rem;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  transition:background .55s var(--ease), color .55s var(--ease), border-color .55s var(--ease), box-shadow .55s var(--ease), transform .55s var(--ease);
  outline:none;-webkit-tap-highlight-color:transparent;backface-visibility:hidden;
}
.home-face:hover,.home-face:focus-visible,.home-face.is-active{
  background:rgba(255,255,255,.78);color:rgba(17,17,17,.98);border-color:rgba(17,17,17,.5);
  box-shadow:0 18px 44px rgba(17,17,17,.08), inset 0 0 0 1px rgba(255,255,255,.62);
}
.home-front{transform:translateZ(var(--depth))}
.home-back{transform:rotateY(180deg) translateZ(var(--depth))}
.home-right{transform:rotateY(90deg) translateZ(var(--depth))}
.home-left{transform:rotateY(-90deg) translateZ(var(--depth))}
.home-top{transform:rotateX(90deg) translateZ(var(--depth))}
.home-bottom{transform:rotateX(-90deg) translateZ(var(--depth))}
@keyframes homeCubeLevitate{0%,100%{transform:translateY(-14px)}50%{transform:translateY(2px)}}
@keyframes homeShadowPulse{0%,100%{transform:translateX(-50%) scale(.9);opacity:.56}50%{transform:translateX(-50%) scale(1.02);opacity:.34}}

.nav-cube-wrap{position:fixed;top:1rem;left:1rem;z-index:12;width:var(--nav-size);height:var(--nav-size);pointer-events:auto;transform:scale(.9);opacity:.72;transition:transform .55s var(--ease), opacity .55s var(--ease), filter .55s var(--ease), height .3s var(--ease);filter:drop-shadow(0 14px 32px rgba(17,17,17,.08));}
.nav-cube-wrap{transform:scale(.9);opacity:.72;}
.nav-cube-wrap:has(.nav-cube:hover){transform:scale(2);opacity:1;}
.nav-cube-wrap.is-home{transform:scale(.78);opacity:.42}
.nav-cube-wrap.is-home:hover,.nav-cube-wrap.is-home:focus-within{transform:scale(2.0);opacity:1}
.nav-cube-scene{width:100%;height:100%;perspective:620px;touch-action:none;user-select:none}
.nav-cube{
  --size:var(--nav-face);--depth:calc(var(--size)/2);position:absolute;left:50%;top:50%;width:var(--size);height:var(--size);
  transform-style:preserve-3d;transform:translate(-50%,-50%) rotateX(-24deg) rotateY(-32deg);will-change:transform;cursor:grab;
}
.nav-cube.dragging{cursor:grabbing}
.nav-face{
  --fill:#ffffff;
  position:absolute;
  inset:0;

  background: #46413B;              /* TOUJOURS BLANC */
  color:#111;                      /* texte lisible */

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:.48rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  text-align:center;
  padding:.18rem;

  box-shadow:none;                 /* plus clean */
}
.nav-face:hover,.nav-face:focus-visible,.nav-face.is-active{
  --fill:rgba(255,255,255,.9);color:rgba(17,17,17,.98);border-color:rgba(17,17,17,.34);
}
.nav-front{transform:translateZ(var(--depth))}
.nav-back{transform:rotateY(180deg) translateZ(var(--depth))}
.nav-right{transform:rotateY(90deg) translateZ(var(--depth))}
.nav-left{transform:rotateY(-90deg) translateZ(var(--depth))}
.nav-top{transform:rotateX(90deg) translateZ(var(--depth))}
.nav-bottom{transform:rotateX(-90deg) translateZ(var(--depth))}
.nav-cube-handle{display:none}