/* ============================================================
   Physical Formula, shared loader module.
   Self-injected by loader.js on every page that includes it.
   Mirrors the loader baked into the homepage so the transition
   feels identical no matter where the visitor lands.
   ============================================================ */

.pf-loader{
  position:fixed;
  inset:0;
  background:#0A0A0A;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:24px;
  transition:opacity .8s cubic-bezier(.22,1,.36,1), visibility 0s linear .8s;
}
.pf-loader.is-done{opacity:0;visibility:hidden;pointer-events:none;}

.pf-loader__line{
  width:120px;
  height:1px;
  background:#F4F2EE;
  transform:scaleX(0);
  transform-origin:left;
  animation:pfLoaderLine 1.5s cubic-bezier(.22,1,.36,1) forwards;
}
@keyframes pfLoaderLine{
  0%   {transform:scaleX(0); transform-origin:left;}
  45%  {transform:scaleX(1); transform-origin:left;}
  55%  {transform:scaleX(1); transform-origin:right;}
  100% {transform:scaleX(0); transform-origin:right;}
}

.pf-loader__mark{
  font-family:'Inter', system-ui, sans-serif;
  font-size:13px;
  letter-spacing:0.42em;
  text-transform:uppercase;
  color:#F4F2EE;
  opacity:0;
  animation:pfLoaderMark 1.7s cubic-bezier(.22,1,.36,1) .25s forwards;
}
@keyframes pfLoaderMark{
  0%   {opacity:0; transform:translateY(8px);}
  20%, 75% {opacity:1; transform:translateY(0);}
  100% {opacity:0; transform:translateY(-4px);}
}
.pf-loader__mark .pf-logo-thin{font-weight:400;letter-spacing:inherit;}
.pf-loader__mark .pf-logo-bold{font-weight:800;letter-spacing:inherit;}

@media (prefers-reduced-motion: reduce){
  .pf-loader{display:none;}
}
