/* A reversible A/B comparison, positioned inside the homepage hero. */
.navbar-variant-control{position:absolute;right:32px;bottom:22px;z-index:9;font-family:Manrope,sans-serif}
.navbar-variant-toggle{display:flex;align-items:center;justify-content:space-between;gap:18px;min-width:154px;min-height:40px;padding:10px 13px;border:1px solid #ffffff52;border-radius:7px;background:linear-gradient(112deg,#dedff330,#b7b8d317 50%,#d8d9f22b);backdrop-filter:blur(26px) saturate(155%);-webkit-backdrop-filter:blur(26px) saturate(155%);color:#f8fbff;box-shadow:inset 0 1px 0 #ffffff57,0 5px 16px #0003;font-size:11px;cursor:pointer}
.navbar-variant-toggle strong{font-weight:700}
.navbar-variant-toggle svg{transition:transform .2s}
.navbar-variant-toggle[aria-expanded=true] svg{transform:rotate(180deg)}
.navbar-variant-options{position:absolute;bottom:calc(100% + 8px);right:0;width:205px;padding:6px;border:1px solid #ffffff40;border-radius:10px;background:rgba(27,31,42,.88);backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px);box-shadow:inset 0 1px 0 #ffffff24,0 8px 26px #0005}
.navbar-variant-options[hidden]{display:none}
.navbar-variant-options button{display:flex;flex-direction:column;gap:4px;width:100%;padding:10px 12px;border:1px solid transparent;border-radius:6px;background:none;color:#f8fbff;text-align:left;cursor:pointer}
.navbar-variant-options button span{font-size:12px;font-weight:700}
.navbar-variant-options button small{font-size:10px;color:#c8d1dd}
.navbar-variant-options button:hover,.navbar-variant-options button[aria-pressed=true]{background:#ffffff12;border-color:#ffffff30}
.navbar-variant-toggle:focus-visible,.navbar-variant-options button:focus-visible{outline:2px solid #c1e8ff;outline-offset:3px}
.hero:has(.navbar-variant-control) .hero-scroll{bottom:84px}
@media(max-width:700px){.navbar-variant-control{right:18px;bottom:19px}.navbar-variant-toggle{min-width:135px;min-height:36px;padding:8px 10px;font-size:10px}.hero:has(.navbar-variant-control) .hero-pagination{max-width:calc(100% - 185px);flex-wrap:wrap;gap:4px;bottom:18px}.hero:has(.navbar-variant-control) .hero-pagination button{width:24px;height:24px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.navbar-variant-toggle svg{transition:none}}
