/* Private hero rotation study: existing page typography and text remain fixed. */
.petabit-hero[data-rotation] .hero-slides,.petabit-hero[data-rotation] .hero-slide{position:absolute;inset:0;overflow:hidden}
.petabit-hero[data-rotation] .hero-slide[hidden]{display:none}
.petabit-hero[data-rotation] .hero-frame{position:absolute}
body.canonical-site .petabit-hero[data-rotation] .hero-glass{inset:0;width:100%;height:100%;object-fit:fill;animation:none!important;transform:none!important}
.hero-leds{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero-led{opacity:.12;animation:port-activity var(--period) linear var(--delay) infinite}
@keyframes port-activity{0%,13%,16%,42%,46%,100%{opacity:.08}14%,15%,43%,45%{opacity:.9}44%{opacity:.25}}
.petabit-hero[data-rotation].effects-paused .hero-led{animation-play-state:paused;opacity:.12}
.petabit-hero[data-rotation].leds-disabled .hero-leds{display:none}
.hero-controls{position:absolute;z-index:3;right:30px;bottom:135px;display:flex;align-items:center;gap:4px;background:#161a1bdd;border:1px solid #ffffff65;border-radius:4px;padding:4px 7px;color:#fff;backdrop-filter:blur(10px);font:14px 'Source Sans 3',sans-serif}
.hero-controls button{appearance:none;border:0;background:transparent;color:inherit;display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:6px;cursor:pointer;font:inherit}
.petabit-hero[data-rotation] .hero-art::after{z-index:5}
.hero-controls button[hidden]{display:none}
.hero-controls button:hover{background:#ffffff1f}
.hero-controls button:focus-visible{outline:2px solid #fff;outline-offset:1px}
.hero-controls .hero-dot{min-width:28px}
.hero-dot::before{content:'';width:6px;height:6px;border:1px solid #fff;border-radius:50%;background:transparent}
.hero-dot[aria-pressed=true]::before{background:#fff}
.hero-controls .rotation-toggle{border-left:1px solid #ffffff40;margin-left:4px;padding-left:12px;gap:7px;min-width:84px}
.hero-controls svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7}
.rotation-label{position:absolute;z-index:3;right:32px;bottom:192px;margin:0;color:#ffffffd9;font:13px 'Source Sans 3',sans-serif;text-shadow:0 1px 6px #000}
.rotation-announcement{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:600px){.hero-controls{right:22px;bottom:130px;gap:0;padding:3px}.hero-controls button{min-width:36px}.hero-controls .hero-dot{min-width:25px}.hero-controls .rotation-toggle{min-width:77px;padding-left:9px}.rotation-label{right:24px;bottom:185px}}
@media(prefers-reduced-motion:reduce){.hero-led{animation:none!important;opacity:0}.hero-controls .rotation-toggle{display:none}}

/* LED-only comparison candidates; the existing control remains unchanged. */
.hero-led.enhanced-led{opacity:0;animation-name:var(--pattern);animation-timing-function:steps(1,end)}
@keyframes port-burst-0{0%,12%,19%,53%,60%,100%{opacity:0}13%,15%,17%,18%,54%,56%{opacity:1}16%,58%{opacity:.2}}
@keyframes port-burst-1{0%,28%,38%,73%,83%,100%{opacity:0}29%,32%,35%,37%,74%,78%{opacity:1}33%,80%,82%{opacity:.3}}
@keyframes port-burst-2{0%,8%,15%,61%,69%,100%{opacity:0}9%,12%,62%,65%{opacity:1}13%,66%,68%{opacity:.3}}
.petabit-hero.led-detail .hero-frame{transform:scale(1.7);transform-origin:78% 42%}
.petabit-hero.led-detail .hero-inner{visibility:hidden;pointer-events:none}
.petabit-hero.led-detail .hero-art::after{background:none}
body.canonical-site .petabit-hero.led-detail::after{display:none}
.led-detail-view header.scroll-change{visibility:hidden}

/* Emission sits above the photographic shade; tiny sockets provide a real off state. */
.petabit-hero.led-composited .hero-art::after{display:none}
.petabit-hero.led-composited .hero-slide::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(12,15,14,.88) 0%,rgba(12,15,14,.74) 29%,rgba(12,15,14,.38) 49%,rgba(12,15,14,.02) 69%,transparent 100%)}
.petabit-hero.led-composited .hero-leds{z-index:2}
@keyframes port-link-0{0%,18%,35%,62%,80%,100%{opacity:0}9%,24%,50%,69%,88%{opacity:1}}
@keyframes port-link-1{0%,15%,34%,58%,77%,100%{opacity:1}7%,22%,46%,65%,86%{opacity:0}}
@keyframes port-link-2{0%,12%,40%,64%,86%,100%{opacity:0}5%,25%,52%,73%,92%{opacity:1}}
@media(max-width:900px){.petabit-hero.led-composited .hero-slide::after{background:linear-gradient(90deg,#0c0f0ee0,#0c0f0eb8 36%,#0c0f0e22 100%)}}
@media(max-width:600px){.petabit-hero.led-composited .hero-slide::after{background:linear-gradient(180deg,#0c0f0e55,#0c0f0ed1 30%,#0c0f0eb8 65%,#0c0f0e22)}}
.petabit-hero.led-detail .hero-slide::after{display:none}
@media(prefers-reduced-motion:reduce){.hero-leds{display:none}}

/* Requested continuous, synchronized port activity at lower intensity. */
@keyframes port-synchronized{0%{opacity:1}50%,100%{opacity:0}}
/* WBN's original still used a negative art layer; the slide deck needs its own visible layer. */
body.canonical-site .petabit-hero[data-rotation] .hero-art{z-index:0;}
body.canonical-site .petabit-hero[data-rotation] .hero-inner{position:relative;z-index:2;}
body.canonical-site .petabit-hero[data-rotation].led-composited .hero-art::after{display:none;}