.page-container{min-height:100vh;margin:0;display:flex;justify-content:center;align-items:center;background-color:#fff;font-family:inherit;overflow:hidden;width:100%}.lingkaranEmblem{position:relative;width:500px;height:500px;border-radius:50%;background:conic-gradient(#235bb9 0deg 90deg,#1777d9 90deg 180deg,#235bb9 180deg 270deg,#1777d9 270deg 360deg);display:flex;justify-content:center;align-items:center;flex-shrink:0;box-shadow:0 10px 30px #0000001a}.lingkaranEmblem:before{content:"";position:absolute;top:50%;left:50%;width:80%;height:80%;border-radius:50%;background-color:#f5f5f5;transform:translate(-50%,-50%);z-index:0;box-shadow:inset 0 5px 15px #0000000d}.lingkaranEmblem:after{content:"";position:absolute;top:50%;left:50%;width:100%;height:2px;background-color:#e0e0e0;transform:translate(-50%,-50%) rotate(45deg);z-index:1}.garisVertikal{position:absolute;top:50%;left:50%;width:2px;height:100%;background-color:#e0e0e0;transform:translate(-50%,-50%) rotate(45deg);z-index:1}.center-logo-container{position:absolute;top:50%;left:50%;width:70%;height:70%;transform:translate(-50%,-50%);z-index:2;border-radius:50%;background:#fff;box-shadow:0 10px 25px #00000026,inset 0 0 0 10px #f8f9fa;display:flex;justify-content:center;align-items:center;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer}.center-logo-container:hover{transform:translate(-50%,-50%) scale(1.02);box-shadow:0 15px 35px #0003,inset 0 0 0 10px #f8f9fa}.emblem-logo-ion{width:65%;height:65%;object-fit:contain}.lingkaranKecilWrapper{position:absolute;width:120px;height:120px;z-index:3;cursor:pointer;display:flex;align-items:center;justify-content:center}.lingkaranKecilWrapper:hover{z-index:50}.lingkaranKecil{width:110px;height:110px;border-radius:50%;background-color:#fff;border:4px solid #1777d9;box-shadow:0 5px 15px #00000026;display:flex;justify-content:center;align-items:center;transition:transform .3s ease-in-out,box-shadow .3s ease-in-out;position:relative;z-index:2;flex-shrink:0}.lingkaranKecilWrapper:hover .lingkaranKecil{transform:scale(1.1);box-shadow:0 10px 25px #1777d94d}.iconBrandIon{width:65%;height:auto;object-fit:contain;mix-blend-mode:multiply}.kiriAtas{top:calc(14.6% - 60px);left:calc(14.6% - 60px);justify-content:flex-end}.kananAtas{top:calc(14.6% - 60px);right:calc(14.6% - 60px);justify-content:flex-start}.kiriBawah{bottom:calc(14.6% - 60px);left:calc(14.6% - 60px);justify-content:flex-end}.kananBawah{bottom:calc(14.6% - 60px);right:calc(14.6% - 60px);justify-content:flex-start}.textLabel{position:absolute;top:50%;transform:translateY(-50%);width:15vw;max-width:250px;min-width:150px;height:auto;pointer-events:none;transition:transform .3s ease-in-out;z-index:1;object-fit:contain}.lingkaranKecilWrapper:hover .textLabel{transform:translateY(-50%) scale(1.05)}.kiriAtas .textLabel,.kiriBawah .textLabel{right:140px;transform-origin:right center}.kananAtas .textLabel,.kananBawah .textLabel{left:140px;transform-origin:left center}@media screen and (max-width:1440px){.lingkaranEmblem{width:450px;height:450px}.kiriAtas,.kananAtas,.kiriBawah,.kananBawah{width:110px;height:110px}.lingkaranKecil{width:100px;height:100px}.kiriAtas{top:calc(14.6% - 55px);left:calc(14.6% - 55px)}.kananAtas{top:calc(14.6% - 55px);right:calc(14.6% - 55px)}.kiriBawah{bottom:calc(14.6% - 55px);left:calc(14.6% - 55px)}.kananBawah{bottom:calc(14.6% - 55px);right:calc(14.6% - 55px)}.kiriAtas .textLabel,.kiriBawah .textLabel{right:120px}.kananAtas .textLabel,.kananBawah .textLabel{left:120px}}@media screen and (max-width:1024px){.lingkaranEmblem{width:350px;height:350px}.kiriAtas,.kananAtas,.kiriBawah,.kananBawah{width:90px;height:90px}.lingkaranKecil{width:85px;height:85px}.textLabel{width:18vw;min-width:120px;max-width:180px}.kiriAtas .textLabel,.kiriBawah .textLabel{right:100px}.kananAtas .textLabel,.kananBawah .textLabel{left:100px}.kiriAtas{top:calc(14.6% - 45px);left:calc(14.6% - 45px)}.kananAtas{top:calc(14.6% - 45px);right:calc(14.6% - 45px)}.kiriBawah{bottom:calc(14.6% - 45px);left:calc(14.6% - 45px)}.kananBawah{bottom:calc(14.6% - 45px);right:calc(14.6% - 45px)}}@media screen and (max-width:768px){.page-container{padding:120px 0;overflow:hidden}.lingkaranEmblem{width:280px;height:280px}.center-logo-container{width:80%;height:80%}.kiriAtas,.kananAtas,.kiriBawah,.kananBawah{width:85px;height:85px;justify-content:center}.lingkaranKecil{width:80px;height:80px;border-width:4px}.iconBrandIon{width:60%}.kiriAtas{top:calc(14.6% - 42.5px);left:calc(14.6% - 42.5px)}.kananAtas{top:calc(14.6% - 42.5px);right:calc(14.6% - 42.5px)}.kiriBawah{bottom:calc(14.6% - 42.5px);left:calc(14.6% - 42.5px)}.kananBawah{bottom:calc(14.6% - 42.5px);right:calc(14.6% - 42.5px)}.textLabel{width:32vw;max-width:150px;min-width:110px}.kiriAtas .textLabel,.kananAtas .textLabel{top:auto;bottom:calc(100% + 15px);transform:translate(0)}.kiriAtas .textLabel{right:auto;left:50%;transform:translate(-50%);transform-origin:center bottom}.kananAtas .textLabel{left:50%;right:auto;transform:translate(-50%);transform-origin:center bottom}.kiriBawah .textLabel,.kananBawah .textLabel{top:calc(100% + 15px);bottom:auto;transform:translate(0)}.kiriBawah .textLabel{right:auto;left:50%;transform:translate(-50%);transform-origin:center top}.kananBawah .textLabel{left:50%;right:auto;transform:translate(-50%);transform-origin:center top}.lingkaranKecilWrapper:hover .textLabel{transform:translate(-50%) scale(1.05)}}@media screen and (max-width:480px){.page-container{padding:100px 0}.lingkaranEmblem{width:220px;height:220px}.kiriAtas,.kananAtas,.kiriBawah,.kananBawah{width:70px;height:70px}.lingkaranKecil{width:65px;height:65px;border-width:3px}.iconBrandIon{width:65%}.kiriAtas{top:calc(14.6% - 35px);left:calc(14.6% - 35px)}.kananAtas{top:calc(14.6% - 35px);right:calc(14.6% - 35px)}.kiriBawah{bottom:calc(14.6% - 35px);left:calc(14.6% - 35px)}.kananBawah{bottom:calc(14.6% - 35px);right:calc(14.6% - 35px)}.textLabel{width:38vw;min-width:90px;max-width:120px}.kiriAtas .textLabel,.kananAtas .textLabel{bottom:calc(100% + 10px)}.kiriBawah .textLabel,.kananBawah .textLabel{top:calc(100% + 10px)}.center-logo-container{box-shadow:0 5px 15px #0000001a,inset 0 0 0 6px #f8f9fa}.emblem-logo-ion{width:75%;height:75%}}