@font-face {
  font-family: 'Satoshi';
  src: url('../fonts/satoshi-variable.woff2') format('woff2');
  font-weight: 300 900;
  font-style: normal;
  font-display: block;
}

:root {
  --preloader-bg: #f7f7f7;
  --preloader-ink: #131224;
  --preloader-light: #faf8f2;
  --preloader-ease: cubic-bezier(0.76, 0, 0.24, 1);
  --preloader-out-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

html.preloader-pending,
html.preloader-pending body {
  overscroll-behavior: none;
  overflow: hidden !important;
}

html.preloader-pending body {
  background: var(--preloader-bg);
}

html.preloader-pending body > :not(#sitePreloader):not(script) {
  pointer-events: none !important;
}

/* Les anciens rideaux restent neutralisés sous le preloader. Le seul fond
   visible pendant le chargement et le wipe est désormais #sitePreloader. */
html.preloader-pending .fade-curtain {
  visibility: hidden !important;
  opacity: 0 !important;
  transition: none !important;
}

html.preloader-pending .pointer-cursor {
  opacity: 0 !important;
  visibility: hidden !important;
}

/* Le header réel reste mesurable mais invisible jusqu'au raccord final. */
html.preloader-pending .site-header {
  opacity: 0 !important;
  transform: none !important;
  animation: none !important;
}

html.preloader-exiting .site-header {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

html.preloader-exiting .site-header .brand-logo {
  opacity: 0 !important;
}

html.preloader-pending:not(.preloader-exiting) .site-header .header-actions {
  opacity: 0 !important;
}

html.preloader-exiting .site-header .header-actions {
  opacity: 1 !important;
  transition: opacity 360ms var(--preloader-out-ease) 300ms !important;
}

html.preloader-complete .site-header {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

.site-preloader {
  position: fixed;
  z-index: 2147483646;
  inset: 0;
  display: block;
  overflow: hidden;
  contain: strict;
  color: var(--preloader-ink);
  background: var(--preloader-bg);
  pointer-events: auto;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
}

.site-preloader[hidden] {
  display: none;
}

.site-preloader-bands {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
}

.site-preloader-band {
  position: absolute;
  left: 0;
  top: calc(var(--preloader-band-index) * 100% / 6);
  width: 100%;
  height: calc(100% / 6 + 1px);
  overflow: hidden;
  background: transparent;
}

.site-preloader-band-panel {
  position: absolute;
  inset: -1px 0;
  display: block;
  background: var(--preloader-bg);
  transform: translate3d(
    0,
    calc((1 - var(--preloader-band-progress, 1)) * 110%),
    0
  );
  will-change: transform;
}

.site-preloader.is-exiting {
  background: transparent;
}

.site-preloader-word {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: inline-flex;
  align-items: center;
  gap: 0.328125em;
  color: var(--preloader-ink);
  font-family: 'Satoshi', sans-serif;
  font-size: clamp(42px, 3.3334vw, 64px);
  font-weight: 600;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.01em;
  white-space: nowrap;
  transform: translate3d(-50%, -50%, 0);
  transform-origin: center center;
  will-change: transform, color, opacity, filter;
}

.site-preloader-mark {
  position: relative;
  display: block;
  flex: 0 0 1.15625em;
  width: 1.15625em;
  height: 0.890625em;
  margin-top: 0;
  opacity: 1;
  filter: none;
  transform: none;
  will-change: transform;
}

.site-preloader-mark-shape {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  color: inherit;
}

.site-preloader-label {
  display: inline-flex;
  align-items: baseline;
  min-height: 1em;
}

.site-preloader-letter {
  display: inline-block;
  opacity: 0;
  filter: blur(12.5px);
  transform: translate3d(10px, 0, 0);
  will-change: opacity, filter, transform;
}

.site-preloader-letter.is-space {
  width: 0.28em;
}

.site-preloader.is-home.is-exiting .site-preloader-word {
  color: var(--preloader-light);
}

.site-preloader:not(.is-home).is-exiting .site-preloader-word {
  opacity: 0;
  filter: blur(7px);
  transform: translate3d(-50%, calc(-50% - 7px), 0);
  transition:
    opacity 420ms ease,
    filter 460ms var(--preloader-out-ease),
    transform 500ms var(--preloader-out-ease);
}

.site-preloader-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 760px) {
  .site-preloader-word {
    gap: 0.27em;
    font-size: clamp(38px, 11.2vw, 52px);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --preloader-exit-ms: 220ms;
  }

  .site-preloader,
  .site-preloader-band,
  .site-preloader-word,
  .site-preloader-mark,
  .site-preloader-letter,
  html.preloader-exiting .site-header .header-actions {
    animation: none !important;
    transition-delay: 0ms !important;
  }

}