/* The supplied portrait and the lettering turn in opposite directions. */
html.is-content-loading::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: #ee2c3d;
  pointer-events: none;
}
html.is-content-loading[data-loading-theme="light"]::after { background: #fff; }
html.is-content-loading[data-loading-state="revealing"]::after { display: none; }
html.is-content-loading :is(.menu-toggle,.site-language-switcher,.site-shop-link,.magnetic-cursor) { visibility: hidden; }
/* Blog and work previously hid the home-only loader. */
html.is-content-loading .site-loader.content-loader { display: block; }
.site-loader.content-loader {
  position: fixed;
  inset: 0;
  z-index: 10000;
  overflow: hidden;
  background: #ee2c3d;
  color: #fff;
  opacity: 1;
  transition: opacity 180ms ease-out;
  pointer-events: auto;
}
.content-loader[data-theme="light"] { background: #fff; color: #ee2c3d; }
.content-loader.is-dismissing { opacity: 0; }
.content-loader__wheel {
  position: absolute;
  left: 50%;
  top: 47%;
  width: clamp(224px, 16.5vw, 320px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
}
.content-loader__ring {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  fill: currentColor;
  font-family: "Instrument Sans", Arial, sans-serif;
  font-size: 20px;
  font-weight: 500;
  animation: loading-ring-spin 8s linear infinite;
}
.content-loader__face {
  position: absolute;
  left: 15%;
  top: 15%;
  display: block;
  width: 70%;
  height: 70%;
  object-fit: contain;
  animation: loading-head-spin 4.8s linear infinite;
}
.content-loader__signature {
  position: absolute;
  top: calc(100% + clamp(30px, 4.5vh, 48px));
  left: 50%;
  display: block;
  width: clamp(84px, 6.3vw, 120px);
  height: auto;
  transform: translateX(-50%);
}
@keyframes loading-head-spin { to { transform: rotate(360deg); } }
@keyframes loading-ring-spin { to { transform: rotate(-360deg); } }
@media (max-height: 480px) {
  .content-loader__wheel { width: 176px; top: 39%; }
  .content-loader__signature { top: calc(100% + 14px); width: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  .content-loader__ring,.content-loader__face { animation: none; }
  .site-loader.content-loader { transition: none; }
}
