/* (Sir, Nov 1: "the border thingy, make it different and unique, check insta") the big section frames get the
   2026 "border beam": a polished chrome rim with a bright silver glint that glides slowly all the way round. */
@property --mv-beam { syntax:'<angle>'; initial-value:0deg; inherits:false; }
@keyframes mv-beam { to { --mv-beam:360deg; } }
html body.about .abv > section::after,
html body:is(.repairs,.storepage) .stx > :is(.stx-top,section)::after,
html body.book .bk::after,
html body.contact .cox > section::after,
html body.accessories .acx > :is(.acx-top,section)::after,
html body:not(.staff):not(.home) .foot::after{
  content:"" !important;display:block !important;position:absolute;z-index:-1;pointer-events:none;inset:var(--pan-y) var(--pan-x);
  border-radius:clamp(26px,3vw,40px);padding:2px;
  background:
    conic-gradient(from var(--mv-beam),rgba(255,255,255,0) 0deg,rgba(255,255,255,0) 120deg,rgba(205,203,202,.4) 150deg,
      #F2F1EF 172deg,#FFFFFF 178deg,rgba(222,220,219,0) 182deg,rgba(255,255,255,0) 300deg,rgba(205,203,202,.4) 330deg,
      #F2F1EF 352deg,#FFFFFF 358deg,rgba(222,220,219,0) 360deg),
    linear-gradient(160deg,rgba(222,220,219,.55) 0%,rgba(142,140,139,.18) 30%,rgba(205,203,202,.08) 55%,rgba(142,140,139,.22) 80%,rgba(222,220,219,.4) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:mv-beam 9s linear infinite}
html body:not(.staff):not(.home) .foot::after{inset:clamp(10px,1.4vw,18px) clamp(10px,2.4vw,32px) clamp(14px,2vw,24px)}
@media (prefers-reduced-motion:reduce){html body *::after{animation-name:none}}
/* (Sir, Nov 1: "too laggy") beams rest while the page scrolls and when their section is off screen (js/smooth.js) */
html body .mv-off::after{animation-play-state:paused !important}   /* (Nov 1) no page-wide pause on scroll: it restyled every element at each scroll start */
