/* Why choose 360 Digital — 360° wheel */
.wy{background:var(--paper);position:relative;overflow:hidden;isolation:isolate}
.wy::before{content:"360";position:absolute;z-index:-1;left:-1%;bottom:-.18em;right:auto;top:auto;font:700 clamp(9rem,26vw,24rem)/1 var(--font-display);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px rgba(18,20,15,.07)}
.wy::after{display:none}
.wy-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,5vw,64px);align-items:center}
.wy-intro h2{margin:18px 0 16px}
.wy-intro h2 em{font-style:normal;color:var(--coral);background:linear-gradient(transparent 64%,var(--lime) 64% 92%,transparent 92%);padding:0 .06em}
.wy-intro p{color:var(--muted);max-width:30em;line-height:1.7}
.wy-intro .wy-facts{margin:20px 0 28px;color:var(--ink);font:500 .9rem var(--font-mono)}
.wy-facts b{font-size:1.4rem;font-family:var(--font-display);color:var(--coral)}
/* wheel */
.wh{--R:min(220px,36vw);position:relative;width:100%;max-width:600px;aspect-ratio:1;margin:0 auto;display:grid;place-items:center}
.wh-orbit{position:absolute;inset:0;width:100%;height:100%;animation:whSpin 60s linear infinite}
.wh-orbit circle{fill:none;stroke:var(--ink);stroke-width:.35;stroke-dasharray:1.2 1.8;opacity:.55}
@keyframes whSpin{to{transform:rotate(360deg)}}
.wh-core{position:relative;z-index:2;width:46%;aspect-ratio:1;border-radius:50%;background:var(--ink);color:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:7%;box-shadow:8px 8px 0 var(--coral)}
.wh-num{font:600 .8rem var(--font-mono);color:var(--lime);letter-spacing:.1em}
.wh-core h3{font:600 clamp(1rem,1.7vw,1.3rem)/1.15 var(--font-display);margin:6px 0 8px;color:#fff}
.wh-core p{margin:0;font-size:clamp(.72rem,1.05vw,.86rem);line-height:1.5;color:var(--muted-lt)}
.wh-core.swap>*{animation:whIn .45s var(--ease,ease) both}
@keyframes whIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.wh-node{position:absolute;left:50%;top:50%;z-index:3;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;border:0;background:none;cursor:pointer;font:inherit;color:var(--ink);transform:translate(-50%,-50%) rotate(var(--a)) translateX(var(--R)) rotate(calc(var(--a) * -1))}
.wh-ico{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:#fff;border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-size:1.5rem;transition:transform .3s var(--ease,ease),background .3s,color .3s,box-shadow .3s}
.wh-lb{font:600 .72rem var(--font-mono);text-transform:uppercase;letter-spacing:.05em;background:var(--paper);padding:2px 6px;border-radius:6px;white-space:nowrap}
.wh-node:hover .wh-ico{transform:scale(1.08)}
.wh-node.on .wh-ico{background:var(--coral);color:#fff;transform:scale(1.18);box-shadow:5px 5px 0 var(--ink)}
.wh-node:focus-visible .wh-ico{outline:2px solid var(--cobalt);outline-offset:3px}
@media(max-width:991px){.wy-grid{grid-template-columns:1fr}.wh{max-width:560px}}
@media(max-width:640px){
  .wh{aspect-ratio:auto;display:grid;grid-template-columns:repeat(6,1fr);gap:10px;place-items:center}
  .wh-orbit{display:none}
  .wh-node{position:static;transform:none;grid-row:1}
  .wh-lb{display:none}
  .wh-ico{width:46px;height:46px;font-size:1.1rem;box-shadow:2px 2px 0 var(--ink)}
  .wh-node.on .wh-ico{transform:scale(1.1);box-shadow:3px 3px 0 var(--ink)}
  .wh-core{grid-row:2;grid-column:1/-1;width:100%;aspect-ratio:auto;border-radius:22px;padding:24px;align-items:flex-start;text-align:left;box-shadow:5px 5px 0 var(--coral);min-height:170px;justify-content:flex-start;margin-top:10px}
  .wh-core p{font-size:.9rem}
}
@media(prefers-reduced-motion:reduce){.wh-orbit{animation:none}.wh-core.swap>*{animation:none}}