/* Bar Social (header / footer). Berdiri sendiri, tidak bergantung CSS halaman. */
.mysp-hpage-soc{display:block;width:100%;box-sizing:border-box;background:var(--soc-bg,#0b1020);color:var(--soc-fg,#fff);line-height:1;position:relative;z-index:50}
.mysp-hpage-soc *{box-sizing:border-box}
.mysp-hpage-soc-in{max-width:1200px;margin:0 auto;padding:8px 16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.mysp-hpage-soc.is-left .mysp-hpage-soc-in{justify-content:flex-start}
.mysp-hpage-soc.is-center .mysp-hpage-soc-in{justify-content:center}
.mysp-hpage-soc.is-right .mysp-hpage-soc-in{justify-content:flex-end}
.mysp-hpage-soc-footer .mysp-hpage-soc-in{padding:14px 16px}
.mysp-hpage-soc-txt{font-size:.9rem;font-weight:600;letter-spacing:.02em}
.mysp-hpage-soc ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.mysp-hpage-soc li{margin:0;padding:0;list-style:none}
.mysp-hpage-soc a{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:inherit;text-decoration:none;font-size:1rem;transition:background .2s,transform .2s}
.mysp-hpage-soc a:hover,.mysp-hpage-soc a:focus-visible{background:rgba(255,255,255,.18);background:color-mix(in srgb,currentColor 18%,transparent);transform:translateY(-2px);outline:none}
.mysp-hpage-soc a:focus-visible{box-shadow:0 0 0 2px currentColor}
.mysp-hpage-soc i{line-height:1}
@media(prefers-reduced-motion:reduce){.mysp-hpage-soc a{transition:none}.mysp-hpage-soc a:hover{transform:none}}