body { margin: 0; }

/* ===== Splash / Loader — Ataviti (Direction B · Atelier) ===== */
#loading-bg {
  position: fixed;
  inset: 0;
  display: flex;
  font-family: 'Figtree', system-ui, -apple-system, sans-serif;
}

/* Panneau visuel (vert) */
.ld-visual {
  flex: 0 0 42%;
  background: #1c4d4d;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.ld-visual::before {
  content: "";
  position: absolute;
  width: 46vmin;
  height: 60vmin;
  left: -12vmin;
  top: -12vmin;
  background: #fcf5a6;
  opacity: .14;
  border-radius: 44% 56% 50% 50% / 56% 46% 54% 44%;
  transform: rotate(18deg);
}
.ld-emblem {
  width: min(190px, 24vmin);
  height: auto;
  position: relative;
  z-index: 1;
  transform-origin: 50% 50%;
  animation: ld-spin 3.4s linear infinite;
}

/* Panneau texte (beige) */
.ld-panel {
  flex: 1 1 auto;
  background: #fffced;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 22px;
  padding: 0 8vw;
}
.ld-brand { display: flex; align-items: center; gap: 11px; }
.ld-mark { width: 30px; height: 30px; }
.ld-word {
  font-family: 'Fraunces', Georgia, 'Times New Roman', serif;
  font-size: 1.5rem;
  font-weight: 600;
  color: #1c4d4d;
  letter-spacing: .3px;
}
.ld-tag {
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(28, 77, 77, .6);
  border-left: 1px solid rgba(28, 77, 77, .4);
  padding-left: 9px;
}
.ld-cap {
  margin: 0;
  font-size: 1.05rem;
  color: rgba(28, 77, 77, .7);
}
.ld-bar {
  width: min(280px, 60%);
  height: 3px;
  border-radius: 3px;
  background: rgba(28, 77, 77, .16);
  overflow: hidden;
}
.ld-bar > span {
  display: block;
  height: 100%;
  width: 38%;
  border-radius: 3px;
  background: #1c4d4d;
  animation: ld-slide 1.5s cubic-bezier(.6, .05, .3, 1) infinite;
}

@keyframes ld-spin { to { transform: rotate(360deg); } }
@keyframes ld-slide {
  0%   { transform: translateX(-130%); }
  100% { transform: translateX(360%); }
}

@media (max-width: 760px) {
  #loading-bg { flex-direction: column; }
  .ld-visual { flex: 0 0 36%; }
  .ld-panel { padding: 8vw; }
}
@media (prefers-reduced-motion: reduce) {
  .ld-emblem, .ld-bar > span { animation: none; }
}