/* IOOI logo in the Anbudskollen header (owner 2026-10-15). Geometry, stroke, timing and easing as in the owner's file
   "IOOI - Phi till IOOI": two lines and two circles start together as Phi and move apart to I O O I, 0.25 s after load,
   1.4 s, cubic-bezier(.65,0,.35,1). CSS only (no script, CSP style-src 'self'); with reduced motion the final IOOI
   is shown at once. The viewBox is cropped to the final IOOI so the logo never changes size. */
.brand-logo { display: block; align-self: center; height: 1.4rem; width: auto; color: #000; overflow: visible; }
.phi-part {
  fill: none; stroke: currentColor; stroke-width: 10; stroke-linecap: round; stroke-linejoin: round;
  animation-duration: 1.4s; animation-timing-function: cubic-bezier(.65, 0, .35, 1); animation-delay: .25s;
  animation-fill-mode: both;
}
.phi-i-left { animation-name: phi-i-left; }
.phi-o-left { animation-name: phi-o-left; }
.phi-o-right { animation-name: phi-o-right; }
.phi-i-right { animation-name: phi-i-right; }
@keyframes phi-i-left { from { transform: translateX(0); } to { transform: translateX(-135px); } }
@keyframes phi-o-left { from { transform: translateX(0); } to { transform: translateX(-59px); } }
@keyframes phi-o-right { from { transform: translateX(0); } to { transform: translateX(59px); } }
@keyframes phi-i-right { from { transform: translateX(0); } to { transform: translateX(135px); } }
@media (prefers-reduced-motion: reduce) {
  .phi-part { animation: none; }
  .phi-i-left { transform: translateX(-135px); }
  .phi-o-left { transform: translateX(-59px); }
  .phi-o-right { transform: translateX(59px); }
  .phi-i-right { transform: translateX(135px); }
}
