body{background:linear-gradient(to top,#fffcdd,#fff695);font-family:ador-hairline,sans-serif;font-weight:700;font-style:normal;padding-top:70px;height:100vh;margin:0;overflow:hidden}.site-header{background-color:#fefaec;color:#000;width:100%;padding:1rem 2rem;position:fixed;top:0;left:0}.header-container{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between}.logo{font-size:1.7rem;font-weight:700}.nav-menu ul{list-style:none;display:flex;gap:1.5rem;margin:0;padding:0}.nav-menu a{font-family:ador-hairline,sans-serif;font-weight:700;font-style:normal;color:#000;text-decoration:none;font-size:1.2rem}.nav-menu a:hover{color:#f0c040}.main-scrollable-content{max-height:calc(100vh - 70px);overflow-y:auto;overflow-x:hidden;padding:2rem;box-sizing:border-box}.hero-section{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:2rem;margin-bottom:4rem}.left-panel{flex:1 1 55%;position:relative;min-height:450px;display:block;align-items:flex-start;justify-content:flex-start}.circle-cluster{position:relative;width:450px;height:450px;margin-top:50px;margin-left:120px;margin-right:auto;animation:rotate-clockwise 100s linear infinite}.circle-cluster:hover,.circle-cluster:hover .circle-wrap img{animation-play-state:paused}@keyframes rotate-clockwise{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.circle-wrap{position:absolute;width:160px;height:160px;border-radius:50%;overflow:hidden;box-shadow:0 4px 8px #0000004d;left:50%;top:50%;transform:translate(-50%,-50%);transition:all .3s ease;cursor:pointer;z-index:2}.circle-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease;border-radius:50%;animation:rotate-counter-clockwise 100s linear infinite}@keyframes rotate-counter-clockwise{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.circle-wrap:hover{transform:translate(-50%,-50%) scale(1.1);z-index:20;overflow:visible;box-shadow:0 8px 16px #0006}.circle-wrap:hover img{transform:scale(1.1);animation-play-state:paused}.central-character{position:absolute;top:50%;left:50%;width:160px;height:160px;transform:translate(-50%,-50%);z-index:1;pointer-events:none}#character-canvas{width:100%;height:100%;display:block;pointer-events:none}.circle-wrap.circle-1{transform:translate(-50%,-50%) rotate(0) translate(200px) rotate(0)}.circle-wrap.circle-2{transform:translate(-50%,-50%) rotate(60deg) translate(200px) rotate(-60deg)}.circle-wrap.circle-3{transform:translate(-50%,-50%) rotate(120deg) translate(200px) rotate(-120deg)}.circle-wrap.circle-4{transform:translate(-50%,-50%) rotate(180deg) translate(200px) rotate(-180deg)}.circle-wrap.circle-5{transform:translate(-50%,-50%) rotate(240deg) translate(200px) rotate(-240deg)}.circle-wrap.circle-6{transform:translate(-50%,-50%) rotate(300deg) translate(200px) rotate(-300deg)}.circle-wrap.circle-1:hover{transform:translate(-50%,-50%) rotate(0) translate(200px) rotate(0) scale(1.1);z-index:20}.circle-wrap.circle-2:hover{transform:translate(-50%,-50%) rotate(60deg) translate(200px) rotate(-60deg) scale(1.1);z-index:20}.circle-wrap.circle-3:hover{transform:translate(-50%,-50%) rotate(120deg) translate(200px) rotate(-120deg) scale(1.1);z-index:20}.circle-wrap.circle-4:hover{transform:translate(-50%,-50%) rotate(180deg) translate(200px) rotate(-180deg) scale(1.1);z-index:20}.circle-wrap.circle-5:hover{transform:translate(-50%,-50%) rotate(240deg) translate(200px) rotate(-240deg) scale(1.1);z-index:20}.circle-wrap.circle-6:hover{transform:translate(-50%,-50%) rotate(300deg) translate(200px) rotate(-300deg) scale(1.1);z-index:20}.right-panel{flex:1 1 35%;display:flex;flex-direction:column;align-items:center;text-align:center}.text-area{order:1;margin-bottom:2rem;position:relative;height:120px}.text-area h1{font-family:ador-hairline,sans-serif;font-weight:700;font-style:normal;font-size:5rem;margin:0;position:absolute;top:15px;right:30px;left:auto;transform:none;white-space:nowrap}.text-area p{font-family:ador-hairline,sans-serif;font-weight:700;font-style:normal;font-size:1.9rem;color:#3b3b3b;margin:0;position:absolute;top:160px;right:-200px;left:auto;transform:translate(-50%);white-space:nowrap}.vr-image-area{order:2;margin-top:100px;align-self:flex-end;margin-right:-30px}.vrUser-image{max-width:500px;height:auto}.content-layout{display:flex;justify-content:center;align-items:center;margin-bottom:6rem}#project-description-panel{width:1300px;height:750px;background:#fff;border-radius:1rem;box-shadow:0 8px 24px #0000001a;display:flex;align-items:center;justify-content:center;padding:0;margin:0;overflow:hidden}#default-content{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);border-radius:1rem}.default-message{text-align:center;color:#333;max-width:400px;padding:2rem}.default-message h2{font-size:2rem;margin-bottom:1rem;color:#2c3e50;font-family:ador-hairline,sans-serif;font-weight:700;font-style:normal}.default-message p{font-size:1.1rem;line-height:1.6;color:#7f8c8d;font-family:ador-hairline,sans-serif;font-weight:700;font-style:normal}#panel-iframe{width:100%;height:100%;border:none;border-radius:1rem;background:#fff}.scroll-container{display:flex;transition:transform .5s ease-in-out;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;gap:1.5rem;padding:.5rem 1rem;-webkit-overflow-scrolling:touch}.scroll-container::-webkit-scrollbar{display:none}.scroll-card{flex:0 0 220px;height:70px;overflow:hidden;scroll-snap-align:start;background:linear-gradient(#ffe680,#ffd94d);border-radius:2rem;border:none;padding:1rem 2em;box-shadow:0 4px 8px #00000026,inset 0 4px 4px #fff9,inset 0 -4px 4px #ffc80066;transition:all .2s ease;cursor:pointer}.scroll-card img{width:100%;height:100%;object-fit:cover;display:block}.scroll-card:hover{transform:scale(1.06);box-shadow:0 6px 12px #0003,inset 0 6px 6px #ffffffb3,inset 0 -6px 6px #ffc80080}.scroll-card img{border-radius:16px;box-shadow:0 4px 12px #0003}.scroll-dots{display:flex;justify-content:center;gap:.6rem;margin-top:2rem;padding-bottom:1rem;z-index:10}.scroll-dots button{width:20px;height:20px;border-radius:50%;border:none;background-color:#f0c040;cursor:pointer}.scroll-dots button.active{background-color:#ffe597}