*{margin:0;padding:0;box-sizing:border-box}body{font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;overflow:hidden;background:#000;min-height:100vh;display:flex;justify-content:center;align-items:center}.video-background{position:fixed;inset:0;z-index:-1;overflow:hidden}.video-background video{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;transform:translate(-50%, -50%);object-fit:cover}.video-background .overlay{position:absolute;inset:0;background:rgba(0,0,0,.6);z-index:1}.menu-container{position:fixed;inset:0;margin:auto;z-index:10;display:grid;place-items:center;width:100vw;height:100vh;pointer-events:none;--icon-size: clamp(6rem, 18vmin, 14rem);--menu-size: 45vmin;--unit-size: 13.5vmin;--menu-radius: 32.4vmin;--offset: calc(var(--menu-size) / 2)}.menu-container .icon{position:relative;pointer-events:auto;background:#fff;cursor:pointer;border-radius:50%;height:var(--icon-size);width:var(--icon-size);text-align:center;font-weight:bold;transition:.24s .2s;box-shadow:0 0 30px rgba(0,0,0,.7);z-index:20}.menu-container .icon img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.menu-container .icon.active{background:hsla(0,0%,100%,.9);transform:scale(1.02);box-shadow:0 0 40px rgba(0,0,0,.5)}.menu-container .icon .menu{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0);transition:transform .6s cubic-bezier(0.4, 0, 0.2, 1);z-index:-5;list-style:none;width:var(--menu-size);height:var(--menu-size)}.menu-container .icon.active .menu{transform:translate(-50%, -50%) scale(1);z-index:5}.menu-container .icon.active .spread:nth-child(1){transition-delay:0.03s;transform:rotate(calc((1 - 1) * calc(360deg / 5))) translateY(calc(-1 * var(--menu-radius)))}.menu-container .icon.active .spread:nth-child(1) .unit{transition-delay:0.04s;transform:rotate(calc(-1 * calc((1 - 1) * calc(360deg / 5))))}.menu-container .icon.active .spread:nth-child(2){transition-delay:0.06s;transform:rotate(calc((2 - 1) * calc(360deg / 5))) translateY(calc(-1 * var(--menu-radius)))}.menu-container .icon.active .spread:nth-child(2) .unit{transition-delay:0.08s;transform:rotate(calc(-1 * calc((2 - 1) * calc(360deg / 5))))}.menu-container .icon.active .spread:nth-child(3){transition-delay:0.09s;transform:rotate(calc((3 - 1) * calc(360deg / 5))) translateY(calc(-1 * var(--menu-radius)))}.menu-container .icon.active .spread:nth-child(3) .unit{transition-delay:0.12s;transform:rotate(calc(-1 * calc((3 - 1) * calc(360deg / 5))))}.menu-container .icon.active .spread:nth-child(4){transition-delay:0.12s;transform:rotate(calc((4 - 1) * calc(360deg / 5))) translateY(calc(-1 * var(--menu-radius)))}.menu-container .icon.active .spread:nth-child(4) .unit{transition-delay:0.16s;transform:rotate(calc(-1 * calc((4 - 1) * calc(360deg / 5))))}.menu-container .icon.active .spread:nth-child(5){transition-delay:0.15s;transform:rotate(calc((5 - 1) * calc(360deg / 5))) translateY(calc(-1 * var(--menu-radius)))}.menu-container .icon.active .spread:nth-child(5) .unit{transition-delay:0.2s;transform:rotate(calc(-1 * calc((5 - 1) * calc(360deg / 5))))}.spread{position:absolute;top:50%;left:50%;transform-origin:center;transition:transform .5s cubic-bezier(0.4, 0, 0.2, 1)}.unit{position:absolute;pointer-events:auto;background:#fff;text-decoration:none;width:var(--unit-size);height:var(--unit-size);display:flex;justify-content:center;align-items:center;color:#1e90ff;border-radius:50%;transition:.6s;box-shadow:0 0 15px rgba(0,0,0,.3);text-align:center;padding:8px;font-weight:bold;text-transform:uppercase;letter-spacing:.5px;font-size:clamp(.7rem,1.5vmin,1rem);background:linear-gradient(135deg, white, #f0f0f0);flex-direction:column;gap:.3rem}.unit i{font-size:1.2em}.unit span{font-size:.8em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.unit:hover{background:linear-gradient(135deg, #1e90ff, #00bfff);color:#fff;transform:scale(1.1);box-shadow:0 0 25px rgba(30,144,255,.5)}.content{position:absolute;bottom:max(5vh,30px);left:0;width:100%;text-align:center;z-index:5;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.5);padding:0 20px}.content h1{display:flex;flex-direction:column;align-items:center;gap:.5rem;font-size:clamp(2rem,5vw,3rem);margin-bottom:1rem;font-weight:700;letter-spacing:1px;line-height:1.2}.content .sjmc{font-size:1.2em;font-weight:800;letter-spacing:.2em;background:linear-gradient(45deg, #FF6B6B, #4ECDC4, #45B7D1);-webkit-background-clip:text;background-clip:text;color:rgba(0,0,0,0);text-shadow:none;margin-bottom:.2em}.content .title-break{display:block;font-size:.9em}.content p{font-size:clamp(1rem,2vw,1.2rem);max-width:600px;margin:0 auto;line-height:1.6;opacity:.9}@media(max-width: 768px){.menu-container{touch-action:none}.menu-container .icon.active .spread:nth-child(1){transform:translate(calc(-1 * var(--menu-radius)), calc((1 - 1.5) * var(--unit-size))) !important}.menu-container .icon.active .spread:nth-child(1) .unit{transform:none !important}.menu-container .icon.active .spread:nth-child(2){transform:translate(calc(-1 * var(--menu-radius)), calc((2 - 1.5) * var(--unit-size))) !important}.menu-container .icon.active .spread:nth-child(2) .unit{transform:none !important}.menu-container .icon.active .spread:nth-child(3){transform:translate(0, calc(-1 * var(--menu-radius))) !important}.menu-container .icon.active .spread:nth-child(3) .unit{transform:none !important}.menu-container .icon.active .spread:nth-child(4){transform:translate(var(--menu-radius), calc((4 - 4.5) * var(--unit-size))) !important}.menu-container .icon.active .spread:nth-child(4) .unit{transform:none !important}.menu-container .icon.active .spread:nth-child(5){transform:translate(var(--menu-radius), calc((5 - 4.5) * var(--unit-size))) !important}.menu-container .icon.active .spread:nth-child(5) .unit{transform:none !important}}/*# sourceMappingURL=styles.css.map */