/* Rotate front to back around a fixed vertical axis immediately, then every 15 seconds. */
body>header>a:has(>img[src*="king-diy-logo"]){display:block;flex-shrink:0;perspective:900px;line-height:0;}
body>header>a>img[src*="king-diy-logo"],body.collection-store>header:has(.menu-toggle) .brand-logo{
 display:block;object-fit:contain;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;
 transform-origin:center center;animation:king-logo-flip 15s linear infinite;backface-visibility:visible;
}
@keyframes king-logo-flip{0%{transform:rotateY(0deg)}6.666667%{transform:rotateY(180deg)}13.333333%,100%{transform:rotateY(360deg)}}
@media(prefers-reduced-motion:reduce){body>header>a>img[src*="king-diy-logo"],body.collection-store>header:has(.menu-toggle) .brand-logo{animation:none;transition:none;transform:none!important;}}

/* Larger logo; preserve surrounding navigation and the same two-second flip. */
body>header>a>img[src*="king-diy-logo"],body.collection-store>header:has(.menu-toggle) .brand-logo{width:112px;height:112px;max-width:none}
@media(max-width:700px){body>header>a>img[src*="king-diy-logo"],body.collection-store>header:has(.menu-toggle) .brand-logo{width:92px;height:92px}}
@media(max-width:360px){body>header>a>img[src*="king-diy-logo"],body.collection-store>header:has(.menu-toggle) .brand-logo{width:82px;height:82px}}