.page-loader {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  background: #fff;
  color: #20221e;
  opacity: 1;
  transition: opacity 320ms cubic-bezier(.22,1,.36,1), visibility 320ms;
  /* Even if JavaScript stops, the loader must never block the page. */
  animation: loader-failsafe 0s 5s forwards;
}
.page-loader[hidden] { display: none !important; }
.page-loader.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.loader-content { text-align: center; padding: 24px; width: min(100%, 380px); }
.loader-logo { width: 260px; height: 105px; overflow: hidden; margin: 0 auto 30px; }
.loader-logo img { display: block; width: 300px; height: 120px; object-fit: cover; object-position: center; margin-left: -20px; }
.loader-track { height: 3px; width: 130px; margin: 0 auto 28px; border-radius: 8px; overflow: hidden; background: #edf1e5; }
.loader-track span { display: block; height: 100%; width: 45%; background: #a7e300; border-radius: inherit; animation: loader-travel 1.2s ease-in-out infinite; }
.loader-content p { font-family: 'Manrope', Arial, sans-serif; font-size: 16px; font-weight: 600; letter-spacing: -.3px; margin: 0 0 9px; }
.loader-content p span { color: #82b400; }
.loader-content small { color: #828b74; font-size: 11px; }
.loader-signature { position: absolute; bottom: 32px; font-size: 8px; letter-spacing: 3px; color: #90987f; }
@keyframes loader-travel { 0% { transform: translateX(-105%); } 100% { transform: translateX(325%); } }
@keyframes loader-failsafe { to { visibility: hidden; pointer-events: none; opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .page-loader { transition: none; }
  .loader-track span { animation: none; width: 100%; opacity: .65; }
}
