:root{color-scheme:light;--font-body: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--color-bg: #f4f6ff;--color-accent: #3056d3;--color-accent-soft: rgba(48, 86, 211, .12)}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%}body{display:flex;align-items:center;justify-content:center;font-family:var(--font-body);background:radial-gradient(circle at top,rgba(48,86,211,.18),transparent 50%),linear-gradient(180deg,#ffffff 0%,var(--color-bg) 60%,#e9ecfb 100%)}main{width:100%}.hero{position:relative;display:flex;align-items:center;justify-content:center;min-height:100vh;padding:2rem;overflow:hidden}.hero:before{content:"";position:absolute;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,rgba(48,86,211,.16),transparent 70%);filter:blur(6px);z-index:0}.hero-graphic{position:relative;width:min(360px,70vw);pointer-events:auto;z-index:1;animation:float 8s ease-in-out infinite;filter:drop-shadow(0 26px 48px rgba(48,86,211,.25))}.hero-graphic:after{content:"";position:absolute;left:50%;bottom:-2rem;width:12rem;height:12rem;border-radius:50%;background:conic-gradient(from 120deg,rgba(48,86,211,.2) 0deg,rgba(48,86,211,.05) 120deg,transparent 280deg,rgba(48,86,211,.2) 360deg);transform:translate(-50%) scaleY(.65) rotate(0);animation:swirl 7s linear infinite;opacity:.7;filter:blur(6px);pointer-events:none;z-index:0}.hero-graphic img{width:100%;height:auto;display:block;opacity:.92}.hero-options{position:absolute;inset:0}.hero-option{position:absolute;display:inline-flex;align-items:center;justify-content:center;width:9rem;height:9rem;padding:0;border-radius:50%;background:#f0f3f9eb;color:#1f2430;font-weight:600;letter-spacing:.02em;text-transform:uppercase;font-size:.7rem;text-align:center;line-height:1.1;box-shadow:0 16px 32px #1f243029;border:1px solid rgba(48,86,211,.2);opacity:0;transform:translateY(12px) scale(.96);transition:opacity .25s ease,transform .25s ease,box-shadow .25s ease,border-color .25s ease;pointer-events:none}.hero-option span{pointer-events:none;padding:0 .75rem}.hero-option--left{top:-6.5rem;left:-3.5rem}.hero-option--right{top:-6.5rem;right:-3.5rem}.hero-graphic:hover .hero-option,.hero-graphic:focus-within .hero-option{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.hero-option:focus-visible,.hero-option:hover{box-shadow:0 20px 44px #3056d333;border-color:#3056d373;background:#ffccccf2;outline:none}@keyframes float{0%,to{transform:translateY(-12px)}50%{transform:translateY(12px)}}@keyframes swirl{0%{transform:translate(-50%) scaleY(.65) rotate(0)}to{transform:translate(-50%) scaleY(.65) rotate(1turn)}}@media(max-width:600px){.hero{padding:1.5rem}.hero:before{width:340px;height:340px}.hero-option{width:7rem;height:7rem;font-size:.65rem}.hero-graphic:after{bottom:-1.6rem;width:9.5rem;height:9.5rem}.hero-option--left{top:-4.6rem;left:-2.4rem}.hero-option--right{top:-4.6rem;right:-2.4rem}}