.elementor-5462 .elementor-element.elementor-element-708187e2{--display:flex;--min-height:0px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;box-shadow:0px -3px 10px 0px rgba(0, 0, 0, 0.4);--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:12px;--padding-bottom:12px;--padding-left:055px;--padding-right:055px;--z-index:95;}.elementor-5462 .elementor-element.elementor-element-708187e2:not(.elementor-motion-effects-element-type-background), .elementor-5462 .elementor-element.elementor-element-708187e2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-708187e2.e-con{--flex-grow:0;--flex-shrink:1;}.elementor-5462 .elementor-element.elementor-element-67cf872{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-5462 .elementor-element.elementor-element-4010076e{text-align:start;}.elementor-5462 .elementor-element.elementor-element-4010076e img{width:100%;height:45px;object-fit:contain;object-position:center center;}.elementor-5462 .elementor-element.elementor-element-40dca001{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--flex-wrap:nowrap;--padding-top:0%;--padding-bottom:0%;--padding-left:0%;--padding-right:0%;}.elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title, .elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container, .elementor-widget-mega-menu > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container > span{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-mega-menu{--n-menu-divider-color:var( --e-global-color-text );}.elementor-5462 .elementor-element.elementor-element-31172f74{--display:flex;}.elementor-5462 .elementor-element.elementor-element-31172f74:not(.elementor-motion-effects-element-type-background), .elementor-5462 .elementor-element.elementor-element-31172f74 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#02010100;}.elementor-5462 .elementor-element.elementor-element-41ce0a7{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:1px 1px;--row-gap:1px;--column-gap:1px;--border-radius:20px 20px 20px 20px;box-shadow:-3px 0px 10px 0px rgba(148.99999999999994, 154.99999999999994, 165.99999999999994, 0.38);--margin-top:10px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-41ce0a7:not(.elementor-motion-effects-element-type-background), .elementor-5462 .elementor-element.elementor-element-41ce0a7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-widget-nested-tabs.elementor-widget-n-tabs > .e-n-tabs[data-touch-mode='false'] > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:hover{background:var( --e-global-color-accent );}.elementor-widget-nested-tabs.elementor-widget-n-tabs > .e-n-tabs > .e-n-tabs-heading > .e-n-tab-title[aria-selected="true"], .elementor-widget-nested-tabs.elementor-widget-n-tabs > .e-n-tabs[data-touch-mode='true'] > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:hover{background:var( --e-global-color-accent );}.elementor-widget-nested-tabs.elementor-widget-n-tabs > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-5462 .elementor-element.elementor-element-45f1323c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--border-radius:0px 30px 30px 0px;--padding-top:30px;--padding-bottom:20px;--padding-left:40px;--padding-right:40px;}.elementor-5462 .elementor-element.elementor-element-45f1323c:not(.elementor-motion-effects-element-type-background), .elementor-5462 .elementor-element.elementor-element-45f1323c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-5462 .elementor-element.elementor-element-4cdde903{width:100%;max-width:100%;}.elementor-5462 .elementor-element.elementor-element-4cdde903 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:19px;font-weight:700;color:var( --e-global-color-4eca4e1 );}.elementor-5462 .elementor-element.elementor-element-730b8c9a{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-27600ab4{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--background-transition:0.3s;--border-radius:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-27600ab4:hover{background-color:#F0FAFF;}.elementor-5462 .elementor-element.elementor-element-27600ab4.e-con{--align-self:center;}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-5462 .elementor-element.elementor-element-6ac4206{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-6ac4206.elementor-element{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-6ac4206 .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-6ac4206.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-6ac4206.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-6ac4206.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-6ac4206.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-6ac4206.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-6ac4206 .elementor-icon{font-size:14px;}.elementor-5462 .elementor-element.elementor-element-6ac4206 .elementor-icon svg{height:14px;}.elementor-5462 .elementor-element.elementor-element-15dfbbc7{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:5px 5px;--row-gap:5px;--column-gap:5px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-46a11c73{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-46a11c73.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-46a11c73 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:15px;font-weight:700;color:var( --e-global-color-bd8ac1b );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-5462 .elementor-element.elementor-element-634b1b14{width:auto;max-width:auto;margin:-5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Plus Jakarta Sans", Sans-serif;font-size:12px;font-weight:600;color:var( --e-global-color-4eca4e1 );}.elementor-5462 .elementor-element.elementor-element-634b1b14.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-634b1b14 p{margin-block-end:0px;}.elementor-5462 .elementor-element.elementor-element-39aa9f29{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--background-transition:0.3s;--border-radius:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-39aa9f29:hover{background-color:#F0FAFF;}.elementor-5462 .elementor-element.elementor-element-39aa9f29.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-7b55e570{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-7b55e570.elementor-element{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-7b55e570 .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-7b55e570.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-7b55e570.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-7b55e570.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-7b55e570.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-7b55e570.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-7b55e570 .elementor-icon{font-size:14px;}.elementor-5462 .elementor-element.elementor-element-7b55e570 .elementor-icon svg{height:14px;}.elementor-5462 .elementor-element.elementor-element-3c5e3d5c{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:5px 5px;--row-gap:5px;--column-gap:5px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-7c8689b1{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-7c8689b1.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-7c8689b1 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:15px;font-weight:700;color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-1798fba1{width:auto;max-width:auto;margin:-5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Plus Jakarta Sans", Sans-serif;font-size:12px;font-weight:600;color:var( --e-global-color-4eca4e1 );}.elementor-5462 .elementor-element.elementor-element-1798fba1.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-1798fba1 p{margin-block-end:0px;}.elementor-5462 .elementor-element.elementor-element-4b0e4858{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--background-transition:0.3s;--border-radius:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-4b0e4858:hover{background-color:#F0FAFF;}.elementor-5462 .elementor-element.elementor-element-4b0e4858.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-118386bc{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-118386bc.elementor-element{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-118386bc .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-118386bc.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-118386bc.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-118386bc.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-118386bc.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-118386bc.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-118386bc .elementor-icon{font-size:14px;}.elementor-5462 .elementor-element.elementor-element-118386bc .elementor-icon svg{height:14px;}.elementor-5462 .elementor-element.elementor-element-611c4da8{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:5px 5px;--row-gap:5px;--column-gap:5px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-467f1205{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-467f1205.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-467f1205 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:15px;font-weight:700;color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-4992a96b{width:auto;max-width:auto;margin:-5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Plus Jakarta Sans", Sans-serif;font-size:12px;font-weight:600;color:var( --e-global-color-4eca4e1 );}.elementor-5462 .elementor-element.elementor-element-4992a96b.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-4992a96b p{margin-block-end:0px;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-5462 .elementor-element.elementor-element-1ad1dba8{--divider-border-style:solid;--divider-color:var( --e-global-color-astglobalcolor7 );--divider-border-width:1px;}.elementor-5462 .elementor-element.elementor-element-1ad1dba8 .elementor-divider-separator{width:100%;}.elementor-5462 .elementor-element.elementor-element-1ad1dba8 .elementor-divider{padding-block-start:6px;padding-block-end:6px;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-5462 .elementor-element.elementor-element-3ed3e08b .elementor-button{background-color:var( --e-global-color-bd8ac1b );font-family:"Plus Jakarta Sans", Sans-serif;font-size:13px;font-weight:600;fill:var( --e-global-color-astglobalcolor4 );color:var( --e-global-color-astglobalcolor4 );box-shadow:0px 8px 20px -3px rgba(27.999999999999968, 98.00000000000004, 230, 0.38);border-radius:6px 6px 6px 6px;padding:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-3ed3e08b .elementor-button:hover, .elementor-5462 .elementor-element.elementor-element-3ed3e08b .elementor-button:focus{background-color:#08448B;color:var( --e-global-color-astglobalcolor4 );box-shadow:0px 0px 0px 0px rgba(0,0,0,0.5);}.elementor-5462 .elementor-element.elementor-element-3ed3e08b{width:auto;max-width:auto;margin:-15px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-3ed3e08b.elementor-element{--align-self:flex-end;}.elementor-5462 .elementor-element.elementor-element-3ed3e08b .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-5462 .elementor-element.elementor-element-3ed3e08b .elementor-button:hover svg, .elementor-5462 .elementor-element.elementor-element-3ed3e08b .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor4 );}.elementor-5462 .elementor-element.elementor-element-6a10ec9a{--display:flex;--border-radius:0px 030px 030px 0px;--padding-top:30px;--padding-bottom:20px;--padding-left:40px;--padding-right:40px;}.elementor-5462 .elementor-element.elementor-element-7b22daf8{width:100%;max-width:100%;}.elementor-5462 .elementor-element.elementor-element-7b22daf8 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:19px;font-weight:700;color:var( --e-global-color-4eca4e1 );}.elementor-5462 .elementor-element.elementor-element-1aa3ac04{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-66182b64{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--background-transition:0.3s;--border-radius:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-66182b64:hover{background-color:#F0FAFF;}.elementor-5462 .elementor-element.elementor-element-66182b64.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f.elementor-element{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-3e15fb1f.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-3e15fb1f.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f .elementor-icon{font-size:14px;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f .elementor-icon svg{height:14px;}.elementor-5462 .elementor-element.elementor-element-2fe8f81{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:5px 5px;--row-gap:5px;--column-gap:5px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-240b0838{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-240b0838.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-240b0838 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:15px;font-weight:700;color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-795b8058{width:auto;max-width:auto;margin:-5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Plus Jakarta Sans", Sans-serif;font-size:12px;font-weight:600;color:var( --e-global-color-4eca4e1 );}.elementor-5462 .elementor-element.elementor-element-795b8058.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-795b8058 p{margin-block-end:0px;}.elementor-5462 .elementor-element.elementor-element-2df80526{--divider-border-style:solid;--divider-color:var( --e-global-color-astglobalcolor7 );--divider-border-width:1px;}.elementor-5462 .elementor-element.elementor-element-2df80526 .elementor-divider-separator{width:100%;}.elementor-5462 .elementor-element.elementor-element-2df80526 .elementor-divider{padding-block-start:6px;padding-block-end:6px;}.elementor-5462 .elementor-element.elementor-element-983a342 .elementor-button{background-color:var( --e-global-color-bd8ac1b );font-family:"Plus Jakarta Sans", Sans-serif;font-size:13px;font-weight:600;fill:var( --e-global-color-astglobalcolor4 );color:var( --e-global-color-astglobalcolor4 );box-shadow:0px 8px 20px -3px rgba(27.999999999999968, 98.00000000000004, 230, 0.38);border-radius:6px 6px 6px 6px;padding:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-983a342 .elementor-button:hover, .elementor-5462 .elementor-element.elementor-element-983a342 .elementor-button:focus{background-color:#08448B;color:var( --e-global-color-astglobalcolor4 );box-shadow:0px 0px 0px 0px rgba(0,0,0,0.5);}.elementor-5462 .elementor-element.elementor-element-983a342{width:auto;max-width:auto;margin:-15px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-983a342.elementor-element{--align-self:flex-end;}.elementor-5462 .elementor-element.elementor-element-983a342 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-5462 .elementor-element.elementor-element-983a342 .elementor-button:hover svg, .elementor-5462 .elementor-element.elementor-element-983a342 .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor4 );}.elementor-5462 .elementor-element.elementor-element-701809ab{--display:flex;border-style:solid;--border-style:solid;border-width:0px 0px 0px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-61a8989 );--border-color:var( --e-global-color-61a8989 );--border-radius:0px 30px 30px 0px;--padding-top:30px;--padding-bottom:20px;--padding-left:40px;--padding-right:40px;}.elementor-5462 .elementor-element.elementor-element-701809ab:not(.elementor-motion-effects-element-type-background), .elementor-5462 .elementor-element.elementor-element-701809ab > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:radial-gradient(at top left, var( --e-global-color-astglobalcolor4 ) 0%, var( --e-global-color-astglobalcolor4 ) 100%);}.elementor-5462 .elementor-element.elementor-element-676a872c{width:100%;max-width:100%;}.elementor-5462 .elementor-element.elementor-element-676a872c .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:19px;font-weight:700;color:var( --e-global-color-4eca4e1 );}.elementor-5462 .elementor-element.elementor-element-3acd49fa{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-1d478f1{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--background-transition:0.3s;--border-radius:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-1d478f1:hover{background-color:#F0FAFF;}.elementor-5462 .elementor-element.elementor-element-1d478f1.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-159e03cb{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-159e03cb.elementor-element{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-159e03cb .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-159e03cb.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-159e03cb.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-159e03cb.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-159e03cb.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-159e03cb.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-159e03cb .elementor-icon{font-size:14px;}.elementor-5462 .elementor-element.elementor-element-159e03cb .elementor-icon svg{height:14px;}.elementor-5462 .elementor-element.elementor-element-5029aaf8{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:5px 5px;--row-gap:5px;--column-gap:5px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-452d2262{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-452d2262.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-452d2262 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:15px;font-weight:700;color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-41567{width:auto;max-width:auto;margin:-5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Plus Jakarta Sans", Sans-serif;font-size:12px;font-weight:600;color:var( --e-global-color-4eca4e1 );}.elementor-5462 .elementor-element.elementor-element-41567.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-41567 p{margin-block-end:0px;}.elementor-5462 .elementor-element.elementor-element-2e042b27{--divider-border-style:solid;--divider-color:var( --e-global-color-astglobalcolor7 );--divider-border-width:1px;}.elementor-5462 .elementor-element.elementor-element-2e042b27 .elementor-divider-separator{width:100%;}.elementor-5462 .elementor-element.elementor-element-2e042b27 .elementor-divider{padding-block-start:6px;padding-block-end:6px;}.elementor-5462 .elementor-element.elementor-element-71bf5545 .elementor-button{background-color:var( --e-global-color-bd8ac1b );font-family:"Plus Jakarta Sans", Sans-serif;font-size:13px;font-weight:600;fill:var( --e-global-color-astglobalcolor4 );color:var( --e-global-color-astglobalcolor4 );box-shadow:0px 8px 20px -3px rgba(27.999999999999968, 98.00000000000004, 230, 0.38);border-radius:6px 6px 6px 6px;padding:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-71bf5545 .elementor-button:hover, .elementor-5462 .elementor-element.elementor-element-71bf5545 .elementor-button:focus{background-color:#08448B;color:var( --e-global-color-astglobalcolor4 );box-shadow:0px 0px 0px 0px rgba(0,0,0,0.5);}.elementor-5462 .elementor-element.elementor-element-71bf5545{width:auto;max-width:auto;margin:-15px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-71bf5545.elementor-element{--align-self:flex-end;}.elementor-5462 .elementor-element.elementor-element-71bf5545 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-5462 .elementor-element.elementor-element-71bf5545 .elementor-button:hover svg, .elementor-5462 .elementor-element.elementor-element-71bf5545 .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor4 );}.elementor-5462 .elementor-element.elementor-element-54fd4be6{--n-tabs-direction:row;--n-tabs-heading-direction:column;--n-tabs-heading-width:22%;--n-tabs-title-flex-basis:initial;--n-tabs-title-flex-shrink:initial;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;border-radius:30px 0px 0px 30px;--n-tabs-title-gap:0px;--n-tabs-gap:0px;--n-tabs-title-font-size:15px;--n-tabs-title-color:#182D54;--n-tabs-title-color-active:var( --e-global-color-bd8ac1b );--n-tabs-title-direction:row;--n-tabs-icon-order:initial;--n-tabs-title-justify-content-toggle:initial;--n-tabs-title-align-items-toggle:center;--n-tabs-icon-color:var( --e-global-color-4eca4e1 );--n-tabs-icon-color-active:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-54fd4be6 > .e-n-tabs > .e-n-tabs-heading > .e-n-tab-title[aria-selected='false']:not( :hover ){background:#02010100;}.elementor-5462 .elementor-element.elementor-element-54fd4be6.elementor-widget-n-tabs > .e-n-tabs[data-touch-mode='false'] > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:hover{background:#F0F5FA;}.elementor-5462 .elementor-element.elementor-element-54fd4be6.elementor-widget-n-tabs > .e-n-tabs > .e-n-tabs-heading > .e-n-tab-title[aria-selected="true"], .elementor-5462 .elementor-element.elementor-element-54fd4be6.elementor-widget-n-tabs > .e-n-tabs[data-touch-mode='true'] > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:hover{background:#F0F5FA;}.elementor-5462 .elementor-element.elementor-element-54fd4be6.elementor-widget-n-tabs > .e-n-tabs > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:not( :hover ){border-style:none;}.elementor-5462 .elementor-element.elementor-element-54fd4be6.elementor-widget-n-tabs > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-family:"Plus Jakarta Sans", Sans-serif;font-weight:600;}.elementor-5462 .elementor-element.elementor-element-54fd4be6 [data-touch-mode="false"] .e-n-tab-title[aria-selected="false"]:hover{--n-tabs-title-color-hover:var( --e-global-color-f0d7054 );--n-tabs-icon-color-hover:var( --e-global-color-f0d7054 );}.elementor-5462 .elementor-element.elementor-element-5e25a42b{--display:flex;}.elementor-5462 .elementor-element.elementor-element-1b57c865{--display:flex;}.elementor-5462 .elementor-element.elementor-element-3ca509a7{--display:flex;}.elementor-5462 .elementor-element.elementor-element-29b4806b{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:400px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-29b4806b:not(.elementor-motion-effects-element-type-background), .elementor-5462 .elementor-element.elementor-element-29b4806b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#02010100;}.elementor-5462 .elementor-element.elementor-element-7fc0ab9c{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:1px 1px;--row-gap:1px;--column-gap:1px;--border-radius:20px 20px 20px 20px;box-shadow:-3px 0px 10px 0px rgba(148.99999999999994, 154.99999999999994, 165.99999999999994, 0.38);--margin-top:24px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-7fc0ab9c:not(.elementor-motion-effects-element-type-background), .elementor-5462 .elementor-element.elementor-element-7fc0ab9c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-1011acc4{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 15px;--row-gap:0px;--column-gap:15px;--background-transition:0.3s;--border-radius:20px 20px 0px 0px;--padding-top:17px;--padding-bottom:10px;--padding-left:20px;--padding-right:20px;}.elementor-5462 .elementor-element.elementor-element-1011acc4:hover{background-color:#F0FAFF;}.elementor-5462 .elementor-element.elementor-element-3593715b{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-3593715b.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-3593715b .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-3593715b.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-3593715b.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-3593715b.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-3593715b.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-3593715b.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-3593715b .elementor-icon{font-size:24px;}.elementor-5462 .elementor-element.elementor-element-3593715b .elementor-icon svg{height:24px;}.elementor-5462 .elementor-element.elementor-element-5bd81027{--display:flex;--gap:5px 5px;--row-gap:5px;--column-gap:5px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-20aad3ef{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-20aad3ef.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-20aad3ef .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:15px;font-weight:700;color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-642d8f6e{width:auto;max-width:auto;margin:-5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-642d8f6e.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-642d8f6e .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:12px;font-weight:600;color:var( --e-global-color-secondary );}.elementor-5462 .elementor-element.elementor-element-43d6869a{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 15px;--row-gap:0px;--column-gap:15px;--background-transition:0.3s;--padding-top:17px;--padding-bottom:17px;--padding-left:20px;--padding-right:20px;}.elementor-5462 .elementor-element.elementor-element-43d6869a:hover{background-color:#F0FAFF;--border-radius:0px 0px 20px 20px;--border-top-left-radius:0px;--border-top-right-radius:0px;--border-bottom-right-radius:20px;--border-bottom-left-radius:20px;}.elementor-5462 .elementor-element.elementor-element-43d6869a, .elementor-5462 .elementor-element.elementor-element-43d6869a::before{--border-transition:0.3s;}.elementor-5462 .elementor-element.elementor-element-35a77514{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-35a77514.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-35a77514 .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-35a77514.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-35a77514.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-35a77514.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-35a77514.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-35a77514.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-5462 .elementor-element.elementor-element-35a77514 .elementor-icon{font-size:24px;}.elementor-5462 .elementor-element.elementor-element-35a77514 .elementor-icon svg{height:24px;}.elementor-5462 .elementor-element.elementor-element-67602eaa{--display:flex;--gap:5px 5px;--row-gap:5px;--column-gap:5px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-6a18fe24{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-6a18fe24.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-6a18fe24 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:15px;font-weight:700;color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-32a365e2{width:auto;max-width:auto;margin:-5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-5462 .elementor-element.elementor-element-32a365e2.elementor-element{--align-self:flex-start;}.elementor-5462 .elementor-element.elementor-element-32a365e2 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:12px;font-weight:600;color:var( --e-global-color-secondary );}.elementor-5462 .elementor-element.elementor-element-4c81d405{--display:flex;}.elementor-5462 .elementor-element.elementor-element-6710babe{--display:flex;}.elementor-5462 .elementor-element.elementor-element-46b07a6{--n-menu-dropdown-content-max-width:initial;--n-menu-heading-wrap:wrap;--n-menu-heading-overflow-x:initial;--n-menu-title-distance-from-content:0px;--n-menu-open-animation-duration:500ms;--n-menu-toggle-icon-wrapper-animation-duration:500ms;--n-menu-title-space-between:0px;--n-menu-title-font-size:14px;--n-menu-title-transition:0ms;--n-menu-icon-size:15px;--n-menu-toggle-icon-size:20px;--n-menu-toggle-icon-hover-duration:500ms;--n-menu-toggle-icon-distance-from-dropdown:0px;}.elementor-5462 .elementor-element.elementor-element-46b07a6 > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title, .elementor-5462 .elementor-element.elementor-element-46b07a6 > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container, .elementor-5462 .elementor-element.elementor-element-46b07a6 > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container > span{font-family:"Plus Jakarta Sans", Sans-serif;font-weight:600;}.elementor-5462 .elementor-element.elementor-element-46b07a6 {--n-menu-title-color-hover:var( --e-global-color-bd8ac1b );--n-menu-title-color-active:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-46b07a6 > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title:hover:not( .e-current ){border-style:solid;border-width:0px 0px 2px 0px;border-color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-46b07a6 > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title.e-current{border-style:solid;border-width:0px 0px 2px 0px;border-color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-7d3029dd{margin:0px -17px calc(var(--kit-widget-spacing, 0px) + -5px) 0px;}.elementor-5462 .elementor-element.elementor-element-7d3029dd .ekit_navsearch-button :is(i, svg){font-size:16px;}.elementor-5462 .elementor-element.elementor-element-7d3029dd .ekit_navsearch-button{margin:5px 5px 5px 5px;padding:0px 0px 0px 0px;text-align:center;}.elementor-5462 .elementor-element.elementor-element-65c5a7f5 .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-65c5a7f5.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor6 );}.elementor-5462 .elementor-element.elementor-element-65c5a7f5.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-65c5a7f5.elementor-view-default .elementor-icon{color:var( --e-global-color-astglobalcolor6 );border-color:var( --e-global-color-astglobalcolor6 );}.elementor-5462 .elementor-element.elementor-element-65c5a7f5.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-65c5a7f5.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-astglobalcolor6 );}.elementor-5462 .elementor-element.elementor-element-2ab82cc4 .e-off-canvas__content{background-color:var( --e-global-color-astglobalcolor4 );}.elementor-5462 .elementor-element.elementor-element-2ab82cc4 .e-off-canvas__overlay{background-color:rgba(0,0,0,.8);}.elementor-5462 .elementor-element.elementor-element-2ab82cc4{--e-off-canvas-height:100vh;--e-off-canvas-content-overflow:auto;--e-off-canvas-overlay-opacity:1;}.elementor-5462 .elementor-element.elementor-element-7e1508f1{--display:flex;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-5462 .elementor-element.elementor-element-133dc2af{--display:flex;}.elementor-5462 .elementor-element.elementor-element-56e94767 img{width:32%;}.elementor-5462 .elementor-element.elementor-element-6ecf4f32 .elementor-icon-wrapper{text-align:center;}.elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor6 );}.elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-default .elementor-icon{color:var( --e-global-color-astglobalcolor6 );border-color:var( --e-global-color-astglobalcolor6 );}.elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-framed .elementor-icon, .elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-astglobalcolor6 );}.elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-stacked .elementor-icon:hover{background-color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-framed .elementor-icon:hover, .elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-default .elementor-icon:hover{color:var( --e-global-color-bd8ac1b );border-color:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-framed .elementor-icon:hover, .elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-view-default .elementor-icon:hover svg{fill:var( --e-global-color-bd8ac1b );}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted, .elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before, .elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before, .elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-5462 .elementor-element.elementor-element-5996915c .elementor-nav-menu .elementor-item{font-family:"Plus Jakarta Sans", Sans-serif;font-weight:600;}.elementor-5462 .elementor-element.elementor-element-5996915c .elementor-nav-menu--main .elementor-item:hover, .elementor-5462 .elementor-element.elementor-element-5996915c .elementor-nav-menu--main .elementor-item.elementor-item-active, .elementor-5462 .elementor-element.elementor-element-5996915c .elementor-nav-menu--main .elementor-item.highlighted, .elementor-5462 .elementor-element.elementor-element-5996915c .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-bd8ac1b );fill:var( --e-global-color-bd8ac1b );}.elementor-5462 .elementor-element.elementor-element-5996915c .elementor-nav-menu--main .elementor-item.elementor-item-active{color:var( --e-global-color-48c3704 );}.elementor-5462 .elementor-element.elementor-element-49c1172a .elementor-button{background-color:#0C67D5;font-family:"Plus Jakarta Sans", Sans-serif;font-size:14px;font-weight:700;text-transform:capitalize;font-style:normal;text-decoration:none;line-height:1em;letter-spacing:0px;word-spacing:0em;fill:#FFFFFF;color:#FFFFFF;box-shadow:0px 8px 20px -3px rgba(27.73644701086957, 98.35369055706532, 229.5, 0.38);transition-duration:0.3s;border-style:solid;border-width:1px 1px 1px 1px;border-color:#467FF7;border-radius:10px 10px 10px 10px;padding:12px 12px 12px 12px;}.elementor-5462 .elementor-element.elementor-element-49c1172a .elementor-button:hover, .elementor-5462 .elementor-element.elementor-element-49c1172a .elementor-button:focus{background-color:#08448D;color:var( --e-global-color-astglobalcolor4 );border-color:var( --e-global-color-48c3704 );box-shadow:0px 0px 0px 0px #FFFFFF;}.elementor-5462 .elementor-element.elementor-element-49c1172a.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-5462 .elementor-element.elementor-element-49c1172a .elementor-button:hover svg, .elementor-5462 .elementor-element.elementor-element-49c1172a .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor4 );}.elementor-widget-icon-list .elementor-icon-list-item:not(:last-child):after{border-color:var( --e-global-color-text );}.elementor-widget-icon-list .elementor-icon-list-icon i{color:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-icon svg{fill:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-icon-list .elementor-icon-list-text{color:var( --e-global-color-secondary );}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-icon i{color:var( --e-global-color-bd8ac1b );transition:color 0.3s;}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-icon svg{fill:var( --e-global-color-bd8ac1b );transition:fill 0.3s;}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-item:hover .elementor-icon-list-icon i{color:var( --e-global-color-61a8989 );}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-item:hover .elementor-icon-list-icon svg{fill:var( --e-global-color-61a8989 );}.elementor-5462 .elementor-element.elementor-element-4fcc4319{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-icon{padding-inline-end:0px;}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-item > a{font-family:"Plus Jakarta Sans", Sans-serif;font-weight:500;}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-text{transition:color 0.3s;}.elementor-5462 .elementor-element.elementor-element-114b932f .elementor-button{background-color:#0C67D5;font-family:"Plus Jakarta Sans", Sans-serif;font-size:14px;font-weight:600;text-transform:capitalize;font-style:normal;text-decoration:none;line-height:1em;letter-spacing:0px;word-spacing:0em;fill:#FFFFFF;color:#FFFFFF;box-shadow:0px 8px 20px -3px rgba(27.999999999999968, 98.00000000000004, 230, 0.38);transition-duration:0.3s;border-style:solid;border-width:1px 1px 1px 1px;border-color:#467FF7;border-radius:10px 10px 10px 10px;padding:12px 12px 12px 12px;}.elementor-5462 .elementor-element.elementor-element-114b932f .elementor-button:hover, .elementor-5462 .elementor-element.elementor-element-114b932f .elementor-button:focus{background-color:#08448D;color:var( --e-global-color-astglobalcolor4 );box-shadow:0px 0px 0px 0px #FFFFFF;}.elementor-5462 .elementor-element.elementor-element-114b932f.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-5462 .elementor-element.elementor-element-114b932f .elementor-button:hover svg, .elementor-5462 .elementor-element.elementor-element-114b932f .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor4 );}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-5462 .elementor-element.elementor-element-708187e2{--min-height:58px;--padding-top:0px;--padding-bottom:0px;--padding-left:10px;--padding-right:10px;}.elementor-5462 .elementor-element.elementor-element-4010076e img{height:27px;}.elementor-5462 .elementor-element.elementor-element-41ce0a7{--border-radius:20px 20px 20px 20px;}.elementor-5462 .elementor-element.elementor-element-45f1323c{--padding-top:20px;--padding-bottom:20px;--padding-left:10px;--padding-right:20px;}.elementor-5462 .elementor-element.elementor-element-4cdde903 .elementor-heading-title{font-size:12px;}.elementor-5462 .elementor-element.elementor-element-730b8c9a{--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-27600ab4{--gap:6px 6px;--row-gap:6px;--column-gap:6px;--flex-wrap:wrap;--border-radius:10px 10px 10px 10px;--padding-top:10px;--padding-bottom:10px;--padding-left:010px;--padding-right:00px;}.elementor-5462 .elementor-element.elementor-element-27600ab4.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-6ac4206 .elementor-icon{font-size:13px;}.elementor-5462 .elementor-element.elementor-element-6ac4206 .elementor-icon svg{height:13px;}.elementor-5462 .elementor-element.elementor-element-15dfbbc7{--justify-content:center;}.elementor-5462 .elementor-element.elementor-element-46a11c73 .elementor-heading-title{font-size:11px;}.elementor-5462 .elementor-element.elementor-element-634b1b14{font-size:9px;}.elementor-5462 .elementor-element.elementor-element-39aa9f29{--gap:6px 6px;--row-gap:6px;--column-gap:6px;--flex-wrap:wrap;--border-radius:10px 10px 10px 10px;--padding-top:10px;--padding-bottom:10px;--padding-left:010px;--padding-right:00px;}.elementor-5462 .elementor-element.elementor-element-39aa9f29.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-7b55e570 .elementor-icon{font-size:13px;}.elementor-5462 .elementor-element.elementor-element-7b55e570 .elementor-icon svg{height:13px;}.elementor-5462 .elementor-element.elementor-element-3c5e3d5c{--justify-content:center;}.elementor-5462 .elementor-element.elementor-element-7c8689b1 .elementor-heading-title{font-size:11px;}.elementor-5462 .elementor-element.elementor-element-1798fba1{font-size:9px;}.elementor-5462 .elementor-element.elementor-element-4b0e4858{--gap:6px 6px;--row-gap:6px;--column-gap:6px;--flex-wrap:wrap;--border-radius:10px 10px 10px 10px;--padding-top:10px;--padding-bottom:10px;--padding-left:010px;--padding-right:00px;}.elementor-5462 .elementor-element.elementor-element-4b0e4858.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-118386bc .elementor-icon{font-size:13px;}.elementor-5462 .elementor-element.elementor-element-118386bc .elementor-icon svg{height:13px;}.elementor-5462 .elementor-element.elementor-element-611c4da8{--justify-content:center;}.elementor-5462 .elementor-element.elementor-element-467f1205 .elementor-heading-title{font-size:11px;}.elementor-5462 .elementor-element.elementor-element-4992a96b{font-size:9px;}.elementor-5462 .elementor-element.elementor-element-3ed3e08b .elementor-button{font-size:10px;}.elementor-5462 .elementor-element.elementor-element-6a10ec9a{--padding-top:20px;--padding-bottom:20px;--padding-left:10px;--padding-right:20px;}.elementor-5462 .elementor-element.elementor-element-7b22daf8 .elementor-heading-title{font-size:12px;}.elementor-5462 .elementor-element.elementor-element-1aa3ac04{--gap:3px 3px;--row-gap:3px;--column-gap:3px;--flex-wrap:wrap;}.elementor-5462 .elementor-element.elementor-element-66182b64{--gap:6px 6px;--row-gap:6px;--column-gap:6px;--flex-wrap:wrap;--border-radius:10px 10px 10px 10px;--padding-top:10px;--padding-bottom:10px;--padding-left:010px;--padding-right:00px;}.elementor-5462 .elementor-element.elementor-element-66182b64.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f .elementor-icon{font-size:13px;}.elementor-5462 .elementor-element.elementor-element-3e15fb1f .elementor-icon svg{height:13px;}.elementor-5462 .elementor-element.elementor-element-2fe8f81{--justify-content:center;}.elementor-5462 .elementor-element.elementor-element-240b0838 .elementor-heading-title{font-size:11px;}.elementor-5462 .elementor-element.elementor-element-795b8058{font-size:9px;}.elementor-5462 .elementor-element.elementor-element-983a342 .elementor-button{font-size:10px;}.elementor-5462 .elementor-element.elementor-element-701809ab{--padding-top:20px;--padding-bottom:20px;--padding-left:10px;--padding-right:20px;}.elementor-5462 .elementor-element.elementor-element-676a872c .elementor-heading-title{font-size:12px;}.elementor-5462 .elementor-element.elementor-element-3acd49fa{--gap:3px 3px;--row-gap:3px;--column-gap:3px;--flex-wrap:wrap;}.elementor-5462 .elementor-element.elementor-element-1d478f1{--gap:6px 6px;--row-gap:6px;--column-gap:6px;--flex-wrap:wrap;--border-radius:10px 10px 10px 10px;--padding-top:10px;--padding-bottom:10px;--padding-left:010px;--padding-right:00px;}.elementor-5462 .elementor-element.elementor-element-1d478f1.e-con{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-159e03cb .elementor-icon{font-size:13px;}.elementor-5462 .elementor-element.elementor-element-159e03cb .elementor-icon svg{height:13px;}.elementor-5462 .elementor-element.elementor-element-5029aaf8{--justify-content:center;}.elementor-5462 .elementor-element.elementor-element-452d2262 .elementor-heading-title{font-size:11px;}.elementor-5462 .elementor-element.elementor-element-41567{font-size:9px;}.elementor-5462 .elementor-element.elementor-element-71bf5545 .elementor-button{font-size:10px;}.elementor-5462 .elementor-element.elementor-element-54fd4be6{padding:0px 0px 0px 0px;--n-tabs-heading-width:149px;--n-tabs-title-font-size:11px;}.elementor-5462 .elementor-element.elementor-element-29b4806b{--padding-top:0px;--padding-bottom:0px;--padding-left:0200px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-7fc0ab9c{--border-radius:20px 20px 20px 20px;}.elementor-5462 .elementor-element.elementor-element-3593715b .elementor-icon{font-size:13px;}.elementor-5462 .elementor-element.elementor-element-3593715b .elementor-icon svg{height:13px;}.elementor-5462 .elementor-element.elementor-element-20aad3ef .elementor-heading-title{font-size:11px;}.elementor-5462 .elementor-element.elementor-element-642d8f6e .elementor-heading-title{font-size:9px;}.elementor-5462 .elementor-element.elementor-element-35a77514 .elementor-icon{font-size:12px;}.elementor-5462 .elementor-element.elementor-element-35a77514 .elementor-icon svg{height:12px;}.elementor-5462 .elementor-element.elementor-element-6a18fe24 .elementor-heading-title{font-size:11px;}.elementor-5462 .elementor-element.elementor-element-32a365e2 .elementor-heading-title{font-size:9px;}.elementor-5462 .elementor-element.elementor-element-46b07a6{--n-menu-title-font-size:9px;--n-menu-title-padding:4px 4px 4px 4px;--n-menu-icon-size:11px;}.elementor-5462 .elementor-element.elementor-element-7d3029dd{margin:0px -35px calc(var(--kit-widget-spacing, 0px) + -5px) -31px;}.elementor-5462 .elementor-element.elementor-element-7d3029dd .ekit_navsearch-button :is(i, svg){font-size:13px;}.elementor-5462 .elementor-element.elementor-element-7d3029dd .ekit_navsearch-button{margin:0px 0px 0px 0px;}.elementor-5462 .elementor-element.elementor-element-49c1172a .elementor-button{font-size:10px;border-radius:6px 6px 6px 6px;padding:10px 10px 10px 10px;}.elementor-5462 .elementor-element.elementor-element-114b932f .elementor-button{font-size:10px;border-radius:6px 6px 6px 6px;padding:10px 10px 10px 10px;}}@media(max-width:767px){.elementor-5462 .elementor-element.elementor-element-708187e2{--min-height:0px;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0%;--padding-bottom:0%;--padding-left:05%;--padding-right:05%;--z-index:95;}.elementor-5462 .elementor-element.elementor-element-67cf872{--width:38%;--min-height:61px;}.elementor-5462 .elementor-element.elementor-element-4010076e img{width:583px;max-width:100%;height:26px;}.elementor-5462 .elementor-element.elementor-element-40dca001{--width:58%;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:15px 15px;--row-gap:15px;--column-gap:15px;--padding-top:0%;--padding-bottom:0%;--padding-left:0%;--padding-right:0%;}.elementor-5462 .elementor-element.elementor-element-7d3029dd{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:3px 0px 0px 0px;}.elementor-5462 .elementor-element.elementor-element-7d3029dd .ekit_navsearch-button :is(i, svg){font-size:17px;}.elementor-5462 .elementor-element.elementor-element-65c5a7f5{padding:4px 0px 0px 0px;}.elementor-5462 .elementor-element.elementor-element-65c5a7f5 .elementor-icon{font-size:18px;}.elementor-5462 .elementor-element.elementor-element-65c5a7f5 .elementor-icon svg{height:18px;}.elementor-5462 .elementor-element.elementor-element-2ab82cc4{--e-off-canvas-justify-content:flex-start;--e-off-canvas-width:75%;--e-off-canvas-height:100vh;--e-off-canvas-content-overflow:auto;}.elementor-5462 .elementor-element.elementor-element-7e1508f1{--width:100%;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:30px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-5462 .elementor-element.elementor-element-133dc2af{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5462 .elementor-element.elementor-element-56e94767{width:var( --container-widget-width, 186px );max-width:186px;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:186px;--container-widget-flex-grow:0;text-align:start;}.elementor-5462 .elementor-element.elementor-element-56e94767 img{width:77%;}.elementor-5462 .elementor-element.elementor-element-6ecf4f32{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-6ecf4f32.elementor-element{--align-self:center;}.elementor-5462 .elementor-element.elementor-element-6ecf4f32 .elementor-icon-wrapper{text-align:end;}.elementor-5462 .elementor-element.elementor-element-6ecf4f32 .elementor-icon{font-size:21px;}.elementor-5462 .elementor-element.elementor-element-6ecf4f32 .elementor-icon svg{height:21px;}.elementor-5462 .elementor-element.elementor-element-5996915c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) -14px;}.elementor-5462 .elementor-element.elementor-element-5996915c .elementor-nav-menu .elementor-item{font-size:13px;}.elementor-5462 .elementor-element.elementor-element-49c1172a{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-49c1172a.elementor-element{--flex-grow:0;--flex-shrink:1;}.elementor-5462 .elementor-element.elementor-element-49c1172a .elementor-button{font-size:14px;padding:9px 9px 9px 9px;}.elementor-5462 .elementor-element.elementor-element-4fcc4319{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 6px;--e-icon-list-icon-size:15px;}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(5px/2);}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(5px/2);}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(5px/2);}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-5px/2);}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-5px/2);}.elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-5462 .elementor-element.elementor-element-4fcc4319 .elementor-icon-list-item > a{font-size:12px;}.elementor-5462 .elementor-element.elementor-element-114b932f{width:auto;max-width:auto;}.elementor-5462 .elementor-element.elementor-element-114b932f.elementor-element{--flex-grow:0;--flex-shrink:1;}.elementor-5462 .elementor-element.elementor-element-114b932f .elementor-button{padding:9px 9px 9px 9px;}}@media(min-width:768px){.elementor-5462 .elementor-element.elementor-element-708187e2{--width:100%;}.elementor-5462 .elementor-element.elementor-element-67cf872{--width:20%;}.elementor-5462 .elementor-element.elementor-element-40dca001{--width:100%;}.elementor-5462 .elementor-element.elementor-element-31172f74{--content-width:76%;}.elementor-5462 .elementor-element.elementor-element-41ce0a7{--width:100%;}.elementor-5462 .elementor-element.elementor-element-27600ab4{--width:30%;}.elementor-5462 .elementor-element.elementor-element-15dfbbc7{--width:80%;}.elementor-5462 .elementor-element.elementor-element-39aa9f29{--width:30%;}.elementor-5462 .elementor-element.elementor-element-3c5e3d5c{--width:80%;}.elementor-5462 .elementor-element.elementor-element-4b0e4858{--width:30%;}.elementor-5462 .elementor-element.elementor-element-611c4da8{--width:80%;}.elementor-5462 .elementor-element.elementor-element-66182b64{--width:30%;}.elementor-5462 .elementor-element.elementor-element-2fe8f81{--width:80%;}.elementor-5462 .elementor-element.elementor-element-1d478f1{--width:30%;}.elementor-5462 .elementor-element.elementor-element-5029aaf8{--width:80%;}.elementor-5462 .elementor-element.elementor-element-29b4806b{--content-width:24%;}.elementor-5462 .elementor-element.elementor-element-7fc0ab9c{--width:100%;}.elementor-5462 .elementor-element.elementor-element-5bd81027{--width:70%;}.elementor-5462 .elementor-element.elementor-element-67602eaa{--width:70%;}}@media(max-width:1024px) and (min-width:768px){.elementor-5462 .elementor-element.elementor-element-67cf872{--width:15%;}.elementor-5462 .elementor-element.elementor-element-40dca001{--width:85%;}.elementor-5462 .elementor-element.elementor-element-27600ab4{--width:50%;}.elementor-5462 .elementor-element.elementor-element-15dfbbc7{--width:74%;}.elementor-5462 .elementor-element.elementor-element-39aa9f29{--width:50%;}.elementor-5462 .elementor-element.elementor-element-3c5e3d5c{--width:74%;}.elementor-5462 .elementor-element.elementor-element-4b0e4858{--width:50%;}.elementor-5462 .elementor-element.elementor-element-611c4da8{--width:74%;}.elementor-5462 .elementor-element.elementor-element-66182b64{--width:50%;}.elementor-5462 .elementor-element.elementor-element-2fe8f81{--width:74%;}.elementor-5462 .elementor-element.elementor-element-1d478f1{--width:50%;}.elementor-5462 .elementor-element.elementor-element-5029aaf8{--width:74%;}.elementor-5462 .elementor-element.elementor-element-29b4806b{--content-width:35%;}}/* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1011acc4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-43d6869a *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1011acc4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-43d6869a *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1011acc4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-43d6869a *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1011acc4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-43d6869a *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1011acc4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-43d6869a *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1011acc4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-43d6869a *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1011acc4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-43d6869a *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-27600ab4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-27600ab4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-27600ab4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-39aa9f29 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-39aa9f29 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-39aa9f29:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4b0e4858 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-4b0e4858 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-4b0e4858:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-66182b64 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-66182b64 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-66182b64:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1d478f1 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1d478f1 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1d478f1:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1011acc4 *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-1011acc4 .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-1011acc4:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-43d6869a *//* 1. Base style untuk elemen ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; /* Gradien khas Astranova (#2abaf9 ke #0c67d5) */ background: linear-gradient( 145deg, #2abaf9 0%, #0c67d5 45%, #0c67d5 100% ); position: relative; overflow: visible; /* Transisi halus untuk pergerakan */ transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); } /* 2. Ukuran & warna ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon i, .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon svg { font-size: 15px; color: #ffffff; z-index: 2; transition: transform 0.35s ease; } /* 3. Efek Glow Biru di bawah ikon */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::before { content: ""; position: absolute; width: 25px; height: 25px; border-radius: 50%; /* Menggunakan warna #2abaf9 & #0c67d5 transparan */ background: radial-gradient( circle, rgba(42, 186, 249, 0.7) 0%, rgba(12, 103, 213, 0.4) 45%, rgba(12, 103, 213, 0) 75% ); filter: blur(14px); bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 0; opacity: 0.6; transition: all 0.35s ease; } /* 4. Highlight kilau di kiri atas */ .elementor-5462 .elementor-element.elementor-element-43d6869a .astranova-icon::after { content: ""; position: absolute; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.15); top: 1px; left: 1px; filter: blur(4px); pointer-events: none; } /* ========================================================= HOVER STATE (Aktif saat KONTAINER induk disorot) ========================================================= */ /* Ikon naik ke atas & sedikit membesar */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon { transform: translateY(-3px) scale(1.08); } /* Efek Glow menjadi lebih terang dan menyebar saat kontainer di-hover */ .elementor-5462 .elementor-element.elementor-element-43d6869a:hover .astranova-icon::before { opacity: 1; filter: blur(20px); bottom: -14px; width: 32px; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-708187e2 *//* ======================================================== Astranova Sticky Header Glassmorphism (Safe for Off-Canvas) ======================================================== */ /* 1. Tampilan Awal (Awal Halaman - Solid White) */ .elementor-5462 .elementor-element.elementor-element-708187e2 { width: 100% !important; max-width: 100% !important; background-color: #ffffff !important; border-bottom: 1px solid transparent; transition: all 0.4s ease-in-out !important; box-sizing: border-box !important; } /* 2. Tampilan Saat Di-scroll Down (Agak Transparan + Blur) */ .elementor-5462 .elementor-element.elementor-element-708187e2.elementor-sticky--active { width: 100% !important; max-width: 100% !important; /* Putih transparan solid (Tanpa backdrop-filter yang bikin stacking context rusak) */ background-color: rgba(255, 255, 255, 0.92) !important; /* Efek Blur Kaca (Glassmorphism) */ backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px) !important; /* Garis pemisah tipis dan bayangan halus */ border-bottom: 1px solid rgba(24, 45, 84, 0.08) !important; box-shadow: 0 4px 20px rgba(24, 45, 84, 0.06) !important; box-sizing: border-box !important; }/* End custom CSS */