.elementor-1287 .elementor-element.elementor-element-c1c8c46:not(.elementor-motion-effects-element-type-background), .elementor-1287 .elementor-element.elementor-element-c1c8c46 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:radial-gradient(at center right, #11579DF2 29%, #001D39F2 69%);}.elementor-1287 .elementor-element.elementor-element-c1c8c46 > .elementor-background-overlay{background-color:#13254B00;background-image:url("https://www.chicagocomforthvac.com/wp-content/uploads/2026/05/future-of-HVAC.webp");background-position:center center;background-size:cover;opacity:0.78;mix-blend-mode:overlay;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-1287 .elementor-element.elementor-element-c1c8c46{overflow:hidden;border-style:solid;border-width:4px 0px 0px 0px;border-color:#FFFFFF;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0vw;margin-bottom:0vw;padding:0vw 0vw 0vw 0vw;z-index:1;}.elementor-1287 .elementor-element.elementor-element-c1c8c46 .elementor-background-overlay{filter:brightness( 82% ) contrast( 160% ) saturate( 0% ) blur( 0px ) hue-rotate( 0deg );}.elementor-bc-flex-widget .elementor-1287 .elementor-element.elementor-element-4a4c5c1.elementor-column .elementor-widget-wrap{align-items:flex-start;}.elementor-1287 .elementor-element.elementor-element-4a4c5c1.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-start;align-items:flex-start;}.elementor-1287 .elementor-element.elementor-element-4a4c5c1 > .elementor-element-populated{padding:0vw 0vw 0vw 4vw;}.elementor-1287 .elementor-element.elementor-element-4a4c5c1{z-index:25;}.elementor-1287 .elementor-element.elementor-element-c290b80{--spacer-size:2vh;}.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-1287 .elementor-element.elementor-element-6cfa0b3{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;z-index:15;text-align:start;}.elementor-1287 .elementor-element.elementor-element-6cfa0b3 > .elementor-widget-container{margin:1.5vw 0vw -1.5vw 0vw;padding:0vw 0vw 1vw 0vw;}.elementor-1287 .elementor-element.elementor-element-6cfa0b3 .elementor-heading-title{font-family:"Kaushan Script", Sans-serif;font-size:8vw;font-weight:300;text-transform:capitalize;line-height:1.025em;letter-spacing:-4px;-webkit-text-stroke-width:1px;stroke-width:1px;-webkit-text-stroke-color:#FFEC21;stroke:#FFEC21;text-shadow:-6px 3px 0px #000000;color:#FBD60B;}.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-1287 .elementor-element.elementor-element-aef05d3{--divider-border-style:solid;--divider-color:#FFBA0F;--divider-border-width:4px;}.elementor-1287 .elementor-element.elementor-element-aef05d3 .elementor-divider-separator{width:72%;margin:0 auto;margin-left:0;}.elementor-1287 .elementor-element.elementor-element-aef05d3 .elementor-divider{text-align:left;padding-block-start:2px;padding-block-end:2px;}.elementor-1287 .elementor-element.elementor-element-e9076e5{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;z-index:5;text-align:start;}.elementor-1287 .elementor-element.elementor-element-e9076e5 > .elementor-widget-container{margin:-1vw 0vw 0vw 0vw;padding:0vw 0vw 00.5vw 0vw;}.elementor-1287 .elementor-element.elementor-element-e9076e5 .elementor-heading-title{font-family:"Anton", Sans-serif;font-size:5vw;font-weight:200;text-transform:uppercase;line-height:1em;letter-spacing:-1px;-webkit-text-stroke-width:1px;stroke-width:1px;-webkit-text-stroke-color:#000000;stroke:#000000;text-shadow:-4px 3px 0px rgba(0, 0, 0, 0.93);color:var( --e-global-color-5a2622d );}.elementor-1287 .elementor-element.elementor-element-d7e5355{--divider-border-style:solid;--divider-color:#FFBA0F;--divider-border-width:4px;}.elementor-1287 .elementor-element.elementor-element-d7e5355 .elementor-divider-separator{width:100%;}.elementor-1287 .elementor-element.elementor-element-d7e5355 .elementor-divider{padding-block-start:2px;padding-block-end:2px;}.elementor-1287 .elementor-element.elementor-element-da5a364{--spacer-size:1vh;}.elementor-1287 .elementor-element.elementor-element-c280435{--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;}.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-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button{background-color:#83000100;font-family:"Antonio", Sans-serif;font-size:2vw;font-weight:600;text-transform:uppercase;font-style:normal;letter-spacing:0px;text-shadow:0px 0px 33px rgba(0,0,0,0.3);fill:#ECECEC;color:#ECECEC;border-style:solid;border-color:#AE0001;border-radius:0em 0em 0em 0em;padding:0.75vw 2.5vw 0.350725vw 2.5vw;}.elementor-1287 .elementor-element.elementor-element-f6e11c9{width:var( --container-widget-width, 48% );max-width:48%;--container-widget-width:48%;--container-widget-flex-grow:0;z-index:19;}.elementor-1287 .elementor-element.elementor-element-f6e11c9 > .elementor-widget-container{margin:-0.5vw 0vw 00.5vw 0vw;padding:0vw 0vw 0vw 0vw;border-style:none;}.elementor-1287 .elementor-element.elementor-element-f6e11c9.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1287 .elementor-element.elementor-element-f6e11c9:hover .elementor-widget-container{border-style:none;}.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button-content-wrapper{flex-direction:row;}.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button .elementor-button-content-wrapper{gap:10px;}.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button:hover, .elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button:focus{border-color:#000000;}.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button{background-color:#83000100;font-family:"Antonio", Sans-serif;font-size:2vw;font-weight:600;text-transform:uppercase;font-style:normal;letter-spacing:0px;text-shadow:0px 0px 33px rgba(0,0,0,0.3);fill:#ECECEC;color:#ECECEC;border-style:solid;border-color:#AE0001;border-radius:0em 0em 0em 0em;padding:0.75vw 2.5vw 0.350725vw 2.5vw;}.elementor-1287 .elementor-element.elementor-element-ca6806e > .elementor-widget-container{margin:-0.5vw 0vw 00.5vw 0vw;padding:0vw 0vw 0vw 0vw;border-style:none;}.elementor-1287 .elementor-element.elementor-element-ca6806e.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1287 .elementor-element.elementor-element-ca6806e{z-index:19;}.elementor-1287 .elementor-element.elementor-element-ca6806e:hover .elementor-widget-container{border-style:none;}.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button-content-wrapper{flex-direction:row;}.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button .elementor-button-content-wrapper{gap:10px;}.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button:hover, .elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button:focus{border-color:#000000;}.elementor-1287 .elementor-element.elementor-element-d736388:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-1287 .elementor-element.elementor-element-d736388 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:radial-gradient(at center center, #02A9F9 47%, #F2295B00 79%);}.elementor-1287 .elementor-element.elementor-element-d736388 > .elementor-element-populated >  .elementor-background-overlay{background-image:url("https://www.chicagocomforthvac.com/wp-content/uploads/2026/05/sgbr-1-1-1.png");opacity:0.27;filter:brightness( 0% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate( 0deg );}.elementor-bc-flex-widget .elementor-1287 .elementor-element.elementor-element-d736388.elementor-column .elementor-widget-wrap{align-items:flex-start;}.elementor-1287 .elementor-element.elementor-element-d736388.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-start;align-items:flex-start;}.elementor-1287 .elementor-element.elementor-element-d736388.elementor-column > .elementor-widget-wrap{justify-content:flex-start;}.elementor-1287 .elementor-element.elementor-element-d736388 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:8px;}.elementor-1287 .elementor-element.elementor-element-d736388 > .elementor-element-populated > .elementor-background-overlay{mix-blend-mode:overlay;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-1287 .elementor-element.elementor-element-d736388 > .elementor-element-populated{border-style:none;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-d736388{z-index:5;}.elementor-1287 .elementor-element.elementor-element-19dae89{--spacer-size:9vh;}.elementor-widget-image .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 );}body:not(.rtl) .elementor-1287 .elementor-element.elementor-element-02461bf{left:1vw;}body.rtl .elementor-1287 .elementor-element.elementor-element-02461bf{right:1vw;}.elementor-1287 .elementor-element.elementor-element-02461bf{top:1vw;z-index:4;text-align:center;}.elementor-1287 .elementor-element.elementor-element-02461bf img{width:100%;opacity:1;}body:not(.rtl) .elementor-1287 .elementor-element.elementor-element-a1e1064{left:0vw;}body.rtl .elementor-1287 .elementor-element.elementor-element-a1e1064{right:0vw;}.elementor-1287 .elementor-element.elementor-element-a1e1064{top:0vw;z-index:1;text-align:center;}.elementor-1287 .elementor-element.elementor-element-a1e1064 img{width:91%;opacity:0.1;filter:brightness( 112% ) contrast( 116% ) saturate( 117% ) blur( 0px ) hue-rotate( 230deg );}.elementor-1287 .elementor-element.elementor-element-a6de0fe > .elementor-widget-container{margin:-2vw 4vw -9vw 0vw;}.elementor-1287 .elementor-element.elementor-element-a6de0fe{z-index:9;text-align:start;}.elementor-1287 .elementor-element.elementor-element-a6de0fe img{width:100%;filter:brightness( 105% ) contrast( 106% ) saturate( 117% ) blur( 0px ) hue-rotate( 0deg );}.elementor-1287 .elementor-element.elementor-element-f3892ea{--spacer-size:2vh;}.elementor-1287 .elementor-element.elementor-element-e642045:not(.elementor-motion-effects-element-type-background), .elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#011C3D;}.elementor-1287 .elementor-element.elementor-element-e642045 .elementor-background-overlay{filter:brightness( 100% ) contrast( 100% ) saturate( 0% ) blur( 0px ) hue-rotate( 0deg );}.elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-background-overlay{mix-blend-mode:multiply;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-1287 .elementor-element.elementor-element-e642045{border-style:none;box-shadow:0px 0px 44px 5px rgba(0, 0, 0, 0.42);transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:00.5vw;margin-bottom:00.5vw;padding:00vw 00vw 00vw 00vw;z-index:6;}.elementor-1287 .elementor-element.elementor-element-e642045, .elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-background-overlay{border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-shape-top .elementor-shape-fill{fill:#FEFB30;}.elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-shape-top svg{width:calc(0% + 1.3px);height:0px;}.elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-shape-top{z-index:2;pointer-events:none;}.elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-shape-bottom .elementor-shape-fill{fill:#FFFFFF;}.elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-shape-bottom svg{width:calc(0% + 1.3px);height:0px;}.elementor-1287 .elementor-element.elementor-element-e15a39a:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#001D3D;}.elementor-bc-flex-widget .elementor-1287 .elementor-element.elementor-element-e15a39a.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-1287 .elementor-element.elementor-element-e15a39a.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-1287 .elementor-element.elementor-element-e15a39a.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-element-populated > .elementor-background-overlay{mix-blend-mode:multiply;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-element-populated, .elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-element-populated > .elementor-background-overlay, .elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-background-slideshow{border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:0vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;padding:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-d6c37fd{--e-image-carousel-slides-to-show:3;width:var( --container-widget-width, 68% );max-width:68%;--container-widget-width:68%;--container-widget-flex-grow:0;}.elementor-1287 .elementor-element.elementor-element-d6c37fd > .elementor-widget-container{padding:1vw 0vw 00.5vw 0vw;}.elementor-1287 .elementor-element.elementor-element-d6c37fd .swiper-wrapper{display:flex;align-items:center;}.elementor-1287 .elementor-element.elementor-element-0338481:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFBE19;}.elementor-bc-flex-widget .elementor-1287 .elementor-element.elementor-element-0338481.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-1287 .elementor-element.elementor-element-0338481.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-1287 .elementor-element.elementor-element-0338481.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-element-populated > .elementor-background-overlay{mix-blend-mode:multiply;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-element-populated, .elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-element-populated > .elementor-background-overlay, .elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-background-slideshow{border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:0vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;padding:.250vw .250vw .250vw .250vw;}.elementor-1287 .elementor-element.elementor-element-257b7e1{width:var( --container-widget-width, 43% );max-width:43%;--container-widget-width:43%;--container-widget-flex-grow:0;z-index:5;text-align:start;}.elementor-1287 .elementor-element.elementor-element-257b7e1 > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;padding:00.5vw 0vw 0.5vw 0vw;}.elementor-1287 .elementor-element.elementor-element-257b7e1 .elementor-heading-title{font-family:"Anton", Sans-serif;font-size:4.5vw;font-weight:200;text-transform:uppercase;line-height:1em;letter-spacing:-1px;color:#183166;}.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button{background-color:#83000100;font-family:"Antonio", Sans-serif;font-size:2vw;font-weight:600;text-transform:uppercase;font-style:normal;letter-spacing:0px;text-shadow:0px 0px 33px rgba(0,0,0,0.3);fill:#ECECEC;color:#ECECEC;border-style:solid;border-color:#AE0001;border-radius:0em 0em 0em 0em;padding:0.5075vw 2.5vw 0.2350725vw 2.5vw;}.elementor-1287 .elementor-element.elementor-element-710622d{width:var( --container-widget-width, 46% );max-width:46%;--container-widget-width:46%;--container-widget-flex-grow:0;z-index:19;}.elementor-1287 .elementor-element.elementor-element-710622d > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;padding:0vw 0vw 0vw 0vw;border-style:none;}.elementor-1287 .elementor-element.elementor-element-710622d.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1287 .elementor-element.elementor-element-710622d:hover .elementor-widget-container{border-style:none;}.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button-content-wrapper{flex-direction:row;}.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button .elementor-button-content-wrapper{gap:10px;}.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button:hover, .elementor-1287 .elementor-element.elementor-element-710622d .elementor-button:focus{border-color:#000000;}.elementor-1287 .elementor-element.elementor-element-0242721{--display:flex;--padding-top:20px;--padding-bottom:20px;--padding-left:40px;--padding-right:40px;}.elementor-widget-posts .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-widget-posts .elementor-post__title, .elementor-widget-posts .elementor-post__title a{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-posts .elementor-post__meta-data{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .elementor-post__excerpt p{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-posts .elementor-post__read-more{color:var( --e-global-color-accent );}.elementor-widget-posts a.elementor-post__read-more{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-post__card .elementor-post__badge{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-widget-posts .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-1287 .elementor-element.elementor-element-0a32480{--grid-row-gap:35px;--grid-column-gap:30px;}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.72 * 100% );}.elementor-1287 .elementor-element.elementor-element-0a32480:after{content:"0.72";}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__thumbnail__link{width:100%;}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__meta-data span + span:before{content:"•";}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__card{background-color:var( --e-global-color-7db569f );border-radius:30px;}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__text{margin-top:0px;}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__title, .elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__title a{color:#FFFFFF;font-family:"Roboto", Sans-serif;font-weight:600;}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__meta-data{color:#FFFFFF;}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__excerpt p{color:#FFFFFF;}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__read-more{color:var( --e-global-color-5a2622d );}.elementor-1287 .elementor-element.elementor-element-fb59438{overflow:hidden;border-style:none;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:-5vw;margin-bottom:0vw;padding:5vw 0vw 5vw 0vw;}.elementor-1287 .elementor-element.elementor-element-fb59438 > .elementor-background-overlay{mix-blend-mode:overlay;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-1287 .elementor-element.elementor-element-fb59438, .elementor-1287 .elementor-element.elementor-element-fb59438 > .elementor-background-overlay{border-radius:0em 0em 0em 0em;}.elementor-bc-flex-widget .elementor-1287 .elementor-element.elementor-element-53fc11e.elementor-column .elementor-widget-wrap{align-items:flex-end;}.elementor-1287 .elementor-element.elementor-element-53fc11e.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-end;align-items:flex-end;}.elementor-1287 .elementor-element.elementor-element-53fc11e.elementor-column > .elementor-widget-wrap{justify-content:flex-end;}.elementor-1287 .elementor-element.elementor-element-53fc11e > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-1287 .elementor-element.elementor-element-53fc11e > .elementor-element-populated{margin:0vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;padding:0vw 6vw 0vw 4vw;}.elementor-1287 .elementor-element.elementor-element-53fc11e{z-index:5;}.elementor-1287 .elementor-element.elementor-element-6103a3e{--spacer-size:6vh;}.elementor-1287 .elementor-element.elementor-element-ed584f8 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-1287 .elementor-element.elementor-element-ed584f8:not(.elementor-motion-effects-element-type-background), .elementor-1287 .elementor-element.elementor-element-ed584f8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(104deg, #FFCF16 0%, #E9C100 78%);}.elementor-1287 .elementor-element.elementor-element-ed584f8 > .elementor-background-overlay{background-image:url("https://www.chicagocomforthvac.com/wp-content/uploads/2026/05/13533.jpg");background-size:cover;opacity:0.6;mix-blend-mode:overlay;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-1287 .elementor-element.elementor-element-ed584f8 .elementor-background-overlay{filter:brightness( 100% ) contrast( 100% ) saturate( 0% ) blur( 0px ) hue-rotate( 0deg );}.elementor-1287 .elementor-element.elementor-element-ed584f8{border-style:solid;border-width:1px 1px 1px 1px;border-color:#FFFFFF;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:1vw;margin-bottom:2vw;padding:0vw 0vw 0vw 1vw;z-index:2;}.elementor-1287 .elementor-element.elementor-element-ed584f8, .elementor-1287 .elementor-element.elementor-element-ed584f8 > .elementor-background-overlay{border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-a046e54.elementor-column > .elementor-widget-wrap{justify-content:flex-start;}.elementor-1287 .elementor-element.elementor-element-a046e54 > .elementor-element-populated{padding:0vw 0vw 0vw 00.5vw;}.elementor-1287 .elementor-element.elementor-element-b651a7f{width:var( --container-widget-width, 5% );max-width:5%;--container-widget-width:5%;--container-widget-flex-grow:0;z-index:15;text-align:center;}.elementor-1287 .elementor-element.elementor-element-b651a7f > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-b651a7f img{width:100%;opacity:1;filter:brightness( 27% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate( 145deg );}.elementor-1287 .elementor-element.elementor-element-0d74473{width:var( --container-widget-width, 79% );max-width:79%;--container-widget-width:79%;--container-widget-flex-grow:0;z-index:5;text-align:start;}.elementor-1287 .elementor-element.elementor-element-0d74473 > .elementor-widget-container{margin:00.5vw 0vw 00.25vw 00.5vw;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-0d74473 .elementor-heading-title{font-family:"Anton", Sans-serif;font-size:4.5vw;font-weight:300;text-transform:uppercase;line-height:1.3em;letter-spacing:-1.7505px;color:#143058;}.elementor-bc-flex-widget .elementor-1287 .elementor-element.elementor-element-5e53c3a.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-1287 .elementor-element.elementor-element-5e53c3a.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-1287 .elementor-element.elementor-element-5e53c3a.elementor-column > .elementor-widget-wrap{justify-content:flex-end;}.elementor-1287 .elementor-element.elementor-element-5e53c3a > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button{background-color:#83000100;font-family:"Antonio", Sans-serif;font-size:2vw;font-weight:600;text-transform:uppercase;font-style:normal;letter-spacing:0px;text-shadow:0px 0px 33px rgba(0,0,0,0.3);fill:#ECECEC;color:#ECECEC;border-style:solid;border-color:#AE0001;border-radius:0em 0em 0em 0em;padding:0.75vw 2.5vw 0.350725vw 2.5vw;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1{width:100%;max-width:100%;z-index:19;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;padding:0vw 0vw 0vw 0vw;border-style:none;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1:hover .elementor-widget-container{border-style:none;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button-content-wrapper{flex-direction:row;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button .elementor-button-content-wrapper{gap:10px;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button:hover, .elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button:focus{border-color:#000000;}.elementor-1287 .elementor-element.elementor-element-30b4ddd > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-1287 .elementor-element.elementor-element-30b4ddd{margin-top:0vw;margin-bottom:4vw;padding:0px 0px 0px 0px;z-index:35;}.elementor-bc-flex-widget .elementor-1287 .elementor-element.elementor-element-0db3f6c.elementor-column .elementor-widget-wrap{align-items:flex-start;}.elementor-1287 .elementor-element.elementor-element-0db3f6c.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-start;align-items:flex-start;}.elementor-1287 .elementor-element.elementor-element-0db3f6c.elementor-column > .elementor-widget-wrap{justify-content:flex-start;}.elementor-1287 .elementor-element.elementor-element-0db3f6c > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:8px;}.elementor-1287 .elementor-element.elementor-element-0db3f6c > .elementor-element-populated{border-style:none;margin:0vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;padding:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-0db3f6c > .elementor-element-populated, .elementor-1287 .elementor-element.elementor-element-0db3f6c > .elementor-element-populated > .elementor-background-overlay, .elementor-1287 .elementor-element.elementor-element-0db3f6c > .elementor-background-slideshow{border-radius:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-ad3ee1a{--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:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.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-1287 .elementor-element.elementor-element-822511f{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"Bai Jamjuree", Sans-serif;font-size:1vw;font-weight:500;line-height:1.35em;letter-spacing:-0.25px;color:#363636;}.elementor-1287 .elementor-element.elementor-element-822511f > .elementor-widget-container{background-color:#FFFFFF45;margin:0vw 0vw 0vw 0vw;padding:2vw 2vw 2vw 2vw;border-style:none;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-822511f a{color:#222222;}.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-1287 .elementor-element.elementor-element-8d09f28{width:auto;max-width:auto;--e-icon-list-icon-size:1vw;--icon-vertical-offset:0px;}.elementor-1287 .elementor-element.elementor-element-8d09f28 > .elementor-widget-container{background-color:#0D3F6E;margin:-1vw 00.5vw 00.5vw 0vw;padding:.250vw 0.7555vw .15250vw 0.7555vw;border-style:dashed;border-width:2px 2px 2px 2px;border-color:#FFFFFF;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-icon i{color:#E9DE06;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-icon svg{fill:#E9DE06;transition:fill 0.3s;}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-item > a{font-family:"Work Sans", Sans-serif;font-size:0.9vw;font-weight:500;text-transform:uppercase;letter-spacing:4px;}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-4120206{--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:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1287 .elementor-element.elementor-element-ff07d56{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"Bai Jamjuree", Sans-serif;font-size:1vw;font-weight:500;line-height:1.35em;letter-spacing:-0.25px;color:#363636;}.elementor-1287 .elementor-element.elementor-element-ff07d56 > .elementor-widget-container{background-color:#FFFFFF45;margin:0vw 0vw 0vw 0vw;padding:2vw 2vw 2vw 2vw;border-style:none;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-ff07d56 a{color:#222222;}.elementor-1287 .elementor-element.elementor-element-bddb05f{width:auto;max-width:auto;--e-icon-list-icon-size:1vw;--icon-vertical-offset:0px;}.elementor-1287 .elementor-element.elementor-element-bddb05f > .elementor-widget-container{background-color:#0D3F6E;margin:-1vw 00.5vw 00.5vw 0vw;padding:.250vw 0.7555vw .15250vw 0.7555vw;border-style:dashed;border-width:2px 2px 2px 2px;border-color:#FFFFFF;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-icon i{color:#E9DE06;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-icon svg{fill:#E9DE06;transition:fill 0.3s;}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-item > a{font-family:"Work Sans", Sans-serif;font-size:0.9vw;font-weight:500;text-transform:uppercase;letter-spacing:4px;}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-b56e451{--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:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1287 .elementor-element.elementor-element-6390eed{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"Bai Jamjuree", Sans-serif;font-size:1vw;font-weight:500;line-height:1.35em;letter-spacing:-0.25px;color:#363636;}.elementor-1287 .elementor-element.elementor-element-6390eed > .elementor-widget-container{background-color:#FFFFFF45;margin:0vw 0vw 0vw 0vw;padding:2vw 2vw 2vw 2vw;border-style:none;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-6390eed a{color:#222222;}.elementor-1287 .elementor-element.elementor-element-1d25289{width:auto;max-width:auto;--e-icon-list-icon-size:1vw;--icon-vertical-offset:0px;}.elementor-1287 .elementor-element.elementor-element-1d25289 > .elementor-widget-container{background-color:#0D3F6E;margin:-1vw 00.5vw 00.5vw 0vw;padding:.250vw 0.7555vw .15250vw 0.7555vw;border-style:dashed;border-width:2px 2px 2px 2px;border-color:#FFFFFF;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-icon i{color:#E9DE06;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-icon svg{fill:#E9DE06;transition:fill 0.3s;}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-item > a{font-family:"Work Sans", Sans-serif;font-size:0.9vw;font-weight:500;text-transform:uppercase;letter-spacing:4px;}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-d5d61bd{--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:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1287 .elementor-element.elementor-element-1a9d284{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"Bai Jamjuree", Sans-serif;font-size:1vw;font-weight:500;line-height:1.35em;letter-spacing:-0.25px;color:#363636;}.elementor-1287 .elementor-element.elementor-element-1a9d284 > .elementor-widget-container{background-color:#FFFFFF45;margin:0vw 0vw 0vw 0vw;padding:2vw 2vw 2vw 2vw;border-style:none;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-1a9d284 a{color:#222222;}.elementor-1287 .elementor-element.elementor-element-b515435{width:auto;max-width:auto;--e-icon-list-icon-size:1vw;--icon-vertical-offset:0px;}.elementor-1287 .elementor-element.elementor-element-b515435 > .elementor-widget-container{background-color:#0D3F6E;margin:-1vw 00.5vw 00.5vw 0vw;padding:.250vw 0.7555vw .15250vw 0.7555vw;border-style:dashed;border-width:2px 2px 2px 2px;border-color:#FFFFFF;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-icon i{color:#E9DE06;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-icon svg{fill:#E9DE06;transition:fill 0.3s;}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-item > a{font-family:"Work Sans", Sans-serif;font-size:0.9vw;font-weight:500;text-transform:uppercase;letter-spacing:4px;}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-201ff4e{--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:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1287 .elementor-element.elementor-element-664a748{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"Bai Jamjuree", Sans-serif;font-size:1vw;font-weight:500;line-height:1.35em;letter-spacing:-0.25px;color:#363636;}.elementor-1287 .elementor-element.elementor-element-664a748 > .elementor-widget-container{background-color:#FFFFFF45;margin:0vw 0vw 0vw 0vw;padding:2vw 2vw 2vw 2vw;border-style:none;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-664a748 a{color:#222222;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7{width:auto;max-width:auto;--e-icon-list-icon-size:1vw;--icon-vertical-offset:0px;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 > .elementor-widget-container{background-color:#0D3F6E;margin:-1vw 00.5vw 00.5vw 0vw;padding:.250vw 0.7555vw .15250vw 0.7555vw;border-style:dashed;border-width:2px 2px 2px 2px;border-color:#FFFFFF;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-icon i{color:#E9DE06;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-icon svg{fill:#E9DE06;transition:fill 0.3s;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-item > a{font-family:"Work Sans", Sans-serif;font-size:0.9vw;font-weight:500;text-transform:uppercase;letter-spacing:4px;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-9783de0{--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:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1287 .elementor-element.elementor-element-3428f4e{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"Bai Jamjuree", Sans-serif;font-size:1vw;font-weight:500;line-height:1.35em;letter-spacing:-0.25px;color:#363636;}.elementor-1287 .elementor-element.elementor-element-3428f4e > .elementor-widget-container{background-color:#FFFFFF45;margin:0vw 0vw 0vw 0vw;padding:2vw 2vw 2vw 2vw;border-style:none;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-3428f4e a{color:#222222;}.elementor-1287 .elementor-element.elementor-element-907ec40{width:auto;max-width:auto;--e-icon-list-icon-size:1vw;--icon-vertical-offset:0px;}.elementor-1287 .elementor-element.elementor-element-907ec40 > .elementor-widget-container{background-color:#0D3F6E;margin:-1vw 00.5vw 00.5vw 0vw;padding:.250vw 0.7555vw .15250vw 0.7555vw;border-style:dashed;border-width:2px 2px 2px 2px;border-color:#FFFFFF;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-icon i{color:#E9DE06;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-icon svg{fill:#E9DE06;transition:fill 0.3s;}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-item > a{font-family:"Work Sans", Sans-serif;font-size:0.9vw;font-weight:500;text-transform:uppercase;letter-spacing:4px;}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-5c51dff{--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:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1287 .elementor-element.elementor-element-dde9afd{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"Bai Jamjuree", Sans-serif;font-size:1vw;font-weight:500;line-height:1.35em;letter-spacing:-0.25px;color:#363636;}.elementor-1287 .elementor-element.elementor-element-dde9afd > .elementor-widget-container{background-color:#FFFFFF45;margin:0vw 0vw 0vw 0vw;padding:2vw 2vw 2vw 2vw;border-style:none;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-dde9afd a{color:#222222;}.elementor-1287 .elementor-element.elementor-element-b80dd28{width:auto;max-width:auto;--e-icon-list-icon-size:1vw;--icon-vertical-offset:0px;}.elementor-1287 .elementor-element.elementor-element-b80dd28 > .elementor-widget-container{background-color:#0D3F6E;margin:-1vw 00.5vw 00.5vw 0vw;padding:.250vw 0.7555vw .15250vw 0.7555vw;border-style:dashed;border-width:2px 2px 2px 2px;border-color:#FFFFFF;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-icon i{color:#E9DE06;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-icon svg{fill:#E9DE06;transition:fill 0.3s;}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-item > a{font-family:"Work Sans", Sans-serif;font-size:0.9vw;font-weight:500;text-transform:uppercase;letter-spacing:4px;}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-5ae3bcf{--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:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1287 .elementor-element.elementor-element-d1d2d41{width:var( --container-widget-width, 90% );max-width:90%;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"Bai Jamjuree", Sans-serif;font-size:1vw;font-weight:500;line-height:1.35em;letter-spacing:-0.25px;color:#363636;}.elementor-1287 .elementor-element.elementor-element-d1d2d41 > .elementor-widget-container{background-color:#FFFFFF45;margin:0vw 0vw 0vw 0vw;padding:2vw 2vw 2vw 2vw;border-style:none;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-d1d2d41 a{color:#222222;}.elementor-1287 .elementor-element.elementor-element-e69a40e{width:auto;max-width:auto;--e-icon-list-icon-size:1vw;--icon-vertical-offset:0px;}.elementor-1287 .elementor-element.elementor-element-e69a40e > .elementor-widget-container{background-color:#0D3F6E;margin:-1vw 00.5vw 00.5vw 0vw;padding:.250vw 0.7555vw .15250vw 0.7555vw;border-style:dashed;border-width:2px 2px 2px 2px;border-color:#FFFFFF;border-radius:0em 0em 0em 0em;}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(50px/2);}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-50px/2);}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-icon i{color:#E9DE06;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-icon svg{fill:#E9DE06;transition:fill 0.3s;}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-item > a{font-family:"Work Sans", Sans-serif;font-size:0.9vw;font-weight:500;text-transform:uppercase;letter-spacing:4px;}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-1287 .elementor-element.elementor-element-20f0818{--e-n-carousel-swiper-slides-to-display:2;--e-n-carousel-swiper-slides-gap:10px;--e-n-carousel-arrow-prev-left-position:0px;--e-n-carousel-arrow-prev-top-align:50%;--e-n-carousel-arrow-prev-translate-y:-50%;--e-n-carousel-arrow-prev-top-position:0px;--e-n-carousel-arrow-next-right-align:0%;--e-n-carousel-arrow-next-translate-x:0%;--e-n-carousel-arrow-next-right-position:0px;--e-n-carousel-arrow-next-top-align:50%;--e-n-carousel-arrow-next-translate-y:-50%;--e-n-carousel-arrow-next-top-position:0px;--e-n-carousel-arrow-normal-color:#4E5267;--e-n-carousel-arrow-hover-color:#807F7D;}.elementor-1287 .elementor-element.elementor-element-20f0818 :is(.elementor-swiper-button-prev, .elementor-swiper-button-next) {background-color:#FFFFFF00;border-style:none;border-radius:0em 0em 0em 0em;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-20f0818 :is(.elementor-swiper-button-prev:hover, .elementor-swiper-button-next:hover) {background-color:#3C3D4000;border-style:none;}.elementor-1287 .elementor-element.elementor-element-20f0818 > .elementor-widget-container{margin:-1vw 0vw 0vw 0vw;padding:1vw 0vw 0vw 0vw;border-style:none;}:where( .elementor-1287 .elementor-element.elementor-element-20f0818 .swiper-slide ) > .e-con{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;}:where( [data-core-v316-plus="true"] .elementor-element.elementor-widget-n-carousel .swiper-slide ) > .e-con{--padding-block-start:0px;--padding-inline-end:0px;--padding-block-end:0px;--padding-inline-start:0px;}.elementor-1287 .elementor-element.elementor-element-813dbc8 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-1287 .elementor-element.elementor-element-813dbc8{margin-top:-1vw;margin-bottom:1vw;padding:0px 0px 0px 0px;z-index:35;}.elementor-1287 .elementor-element.elementor-element-c9c2f1a > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-ceceef1{--e-image-carousel-slides-to-show:5;width:100%;max-width:100%;}.elementor-1287 .elementor-element.elementor-element-ceceef1 > .elementor-widget-container{padding:1vw 0vw 00.5vw 0vw;}.elementor-1287 .elementor-element.elementor-element-ceceef1 .swiper-wrapper{display:flex;align-items:center;}body.elementor-page-1287:not(.elementor-motion-effects-element-type-background), body.elementor-page-1287 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}@media(max-width:1024px){.elementor-1287 .elementor-element.elementor-element-c1c8c46{padding:5vw 3vw 0vw 3vw;}.elementor-1287 .elementor-element.elementor-element-4a4c5c1 > .elementor-element-populated{padding:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-6cfa0b3 > .elementor-widget-container{margin:0vw 0vw -1vw 0vw;}.elementor-1287 .elementor-element.elementor-element-6cfa0b3{text-align:start;}.elementor-1287 .elementor-element.elementor-element-6cfa0b3 .elementor-heading-title{font-size:10vw;}.elementor-1287 .elementor-element.elementor-element-aef05d3 .elementor-divider-separator{width:96%;}.elementor-1287 .elementor-element.elementor-element-e9076e5 > .elementor-widget-container{margin:-2vw 0vw 1vw 0vw;}.elementor-1287 .elementor-element.elementor-element-e9076e5{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;text-align:start;}.elementor-1287 .elementor-element.elementor-element-e9076e5 .elementor-heading-title{font-size:6.6vw;}.elementor-1287 .elementor-element.elementor-element-f6e11c9 > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button{font-size:2.5vw;line-height:1.5em;padding:0vw 2vw 0vw 2vw;}.elementor-1287 .elementor-element.elementor-element-ca6806e > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button{font-size:2.5vw;line-height:1.5em;padding:0vw 2vw 0vw 2vw;}.elementor-1287 .elementor-element.elementor-element-02461bf > .elementor-widget-container{margin:7vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-a1e1064 > .elementor-widget-container{margin:2vw 0vw -1vw 0vw;}.elementor-1287 .elementor-element.elementor-element-a6de0fe > .elementor-widget-container{margin:-3vw -2vw -9vw 3vw;}.elementor-1287 .elementor-element.elementor-element-e642045{margin-top:0px;margin-bottom:0px;padding:2vw 1vw 2vw 3vw;}.elementor-1287 .elementor-element.elementor-element-e15a39a.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-d6c37fd{--e-image-carousel-slides-to-show:4;--container-widget-width:83%;--container-widget-flex-grow:0;width:var( --container-widget-width, 83% );max-width:83%;}.elementor-1287 .elementor-element.elementor-element-d6c37fd > .elementor-widget-container{padding:0vw 0vw 1vw 0vw;}.elementor-1287 .elementor-element.elementor-element-0338481.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0vw 0vw 0vw 2vw;}.elementor-1287 .elementor-element.elementor-element-257b7e1 > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-257b7e1{--container-widget-width:43%;--container-widget-flex-grow:0;width:var( --container-widget-width, 43% );max-width:43%;text-align:start;}.elementor-1287 .elementor-element.elementor-element-257b7e1 .elementor-heading-title{font-size:8vw;}.elementor-1287 .elementor-element.elementor-element-710622d > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button{font-size:3vw;line-height:1.5em;padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-fb59438{padding:8vw 3vw 4vw 3vw;}.elementor-1287 .elementor-element.elementor-element-53fc11e > .elementor-element-populated{margin:0vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;padding:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-ed584f8{margin-top:3vw;margin-bottom:0vw;padding:2vw 0vw 2vw 1vw;}.elementor-1287 .elementor-element.elementor-element-b651a7f{--container-widget-width:12%;--container-widget-flex-grow:0;width:var( --container-widget-width, 12% );max-width:12%;}.elementor-1287 .elementor-element.elementor-element-0d74473 > .elementor-widget-container{margin:0vw 0vw 0vw 1vw;}.elementor-1287 .elementor-element.elementor-element-0d74473{--container-widget-width:82%;--container-widget-flex-grow:0;width:var( --container-widget-width, 82% );max-width:82%;text-align:start;}.elementor-1287 .elementor-element.elementor-element-0d74473 .elementor-heading-title{font-size:4.2vw;letter-spacing:0em;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button{font-size:2.4vw;line-height:1.5em;padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-30b4ddd{margin-top:1vw;margin-bottom:0vw;padding:4vw 0vw 4vw 0vw;}.elementor-1287 .elementor-element.elementor-element-822511f > .elementor-widget-container{padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-822511f{font-size:2vw;line-height:1.2em;}.elementor-1287 .elementor-element.elementor-element-8d09f28 > .elementor-widget-container{margin:-2vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-8d09f28{--e-icon-list-icon-size:2vw;}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-item > a{font-size:2vw;}.elementor-1287 .elementor-element.elementor-element-ff07d56 > .elementor-widget-container{padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-ff07d56{font-size:2vw;line-height:1.2em;}.elementor-1287 .elementor-element.elementor-element-bddb05f > .elementor-widget-container{margin:-2vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-bddb05f{--e-icon-list-icon-size:2vw;}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-item > a{font-size:2vw;}.elementor-1287 .elementor-element.elementor-element-6390eed > .elementor-widget-container{padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-6390eed{font-size:2vw;line-height:1.2em;}.elementor-1287 .elementor-element.elementor-element-1d25289 > .elementor-widget-container{margin:-2vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-1d25289{--e-icon-list-icon-size:2vw;}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-item > a{font-size:2vw;}.elementor-1287 .elementor-element.elementor-element-1a9d284 > .elementor-widget-container{padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-1a9d284{font-size:2vw;line-height:1.2em;}.elementor-1287 .elementor-element.elementor-element-b515435 > .elementor-widget-container{margin:-2vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-b515435{--e-icon-list-icon-size:2vw;}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-item > a{font-size:2vw;}.elementor-1287 .elementor-element.elementor-element-664a748 > .elementor-widget-container{padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-664a748{font-size:2vw;line-height:1.2em;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 > .elementor-widget-container{margin:-2vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7{--e-icon-list-icon-size:2vw;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-item > a{font-size:2vw;}.elementor-1287 .elementor-element.elementor-element-3428f4e > .elementor-widget-container{padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-3428f4e{font-size:2vw;line-height:1.2em;}.elementor-1287 .elementor-element.elementor-element-907ec40 > .elementor-widget-container{margin:-2vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-907ec40{--e-icon-list-icon-size:2vw;}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-item > a{font-size:2vw;}.elementor-1287 .elementor-element.elementor-element-dde9afd > .elementor-widget-container{padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-dde9afd{font-size:2vw;line-height:1.2em;}.elementor-1287 .elementor-element.elementor-element-b80dd28 > .elementor-widget-container{margin:-2vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-b80dd28{--e-icon-list-icon-size:2vw;}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-item > a{font-size:2vw;}.elementor-1287 .elementor-element.elementor-element-d1d2d41 > .elementor-widget-container{padding:2vw 2vw 2vw 2vw;}.elementor-1287 .elementor-element.elementor-element-d1d2d41{font-size:2vw;line-height:1.2em;}.elementor-1287 .elementor-element.elementor-element-e69a40e > .elementor-widget-container{margin:-2vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-e69a40e{--e-icon-list-icon-size:2vw;}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-item > a{font-size:2vw;}.elementor-1287 .elementor-element.elementor-element-20f0818{--e-n-carousel-swiper-slides-to-display:2;}.elementor-1287 .elementor-element.elementor-element-813dbc8{padding:0vw 0vw 4vw 0vw;}.elementor-1287 .elementor-element.elementor-element-ceceef1{--e-image-carousel-slides-to-show:4;}}@media(max-width:767px){.elementor-1287 .elementor-element.elementor-element-c1c8c46:not(.elementor-motion-effects-element-type-background), .elementor-1287 .elementor-element.elementor-element-c1c8c46 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:radial-gradient(at center center, #11579DF2 -50%, #001D39F2 23%);}.elementor-1287 .elementor-element.elementor-element-c1c8c46{padding:38vw 6vw 0vw 6vw;}.elementor-1287 .elementor-element.elementor-element-4a4c5c1 > .elementor-element-populated{margin:-6vw 0vw 0vw 1vw;--e-column-margin-right:0vw;--e-column-margin-left:1vw;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-c290b80{--spacer-size:0.1rem;}.elementor-1287 .elementor-element.elementor-element-6cfa0b3 > .elementor-widget-container{margin:0vw 0vw 0vw 0vw;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-6cfa0b3{z-index:15;text-align:start;}.elementor-1287 .elementor-element.elementor-element-6cfa0b3 .elementor-heading-title{font-size:16vw;line-height:1em;letter-spacing:0em;}.elementor-1287 .elementor-element.elementor-element-e9076e5 > .elementor-widget-container{margin:-5vw 0vw 3vw 0vw;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-e9076e5{z-index:15;text-align:start;}.elementor-1287 .elementor-element.elementor-element-e9076e5 .elementor-heading-title{font-size:12vw;line-height:1em;letter-spacing:0em;}.elementor-1287 .elementor-element.elementor-element-f6e11c9 > .elementor-widget-container{margin:0vw 0vw 0vw 0.215vw;}.elementor-1287 .elementor-element.elementor-element-f6e11c9{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button{font-size:5vw;line-height:1.6em;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-ca6806e{width:100%;max-width:100%;}.elementor-1287 .elementor-element.elementor-element-ca6806e > .elementor-widget-container{margin:0vw 0vw 0vw 0.215vw;}.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button{font-size:5vw;line-height:1.6em;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-d736388 > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-02461bf > .elementor-widget-container{margin:-19vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-02461bf img{width:85%;}.elementor-1287 .elementor-element.elementor-element-a6de0fe > .elementor-widget-container{margin:-17vw 0vw 0vw 7vw;}.elementor-1287 .elementor-element.elementor-element-e642045, .elementor-1287 .elementor-element.elementor-element-e642045 > .elementor-background-overlay{border-radius:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-e642045{margin-top:0px;margin-bottom:0px;padding:2vw 0vw 2vw -1vw;z-index:5;}.elementor-1287 .elementor-element.elementor-element-e15a39a.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-1287 .elementor-element.elementor-element-e15a39a > .elementor-element-populated{margin:0vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-d6c37fd{--e-image-carousel-slides-to-show:2;}.elementor-1287 .elementor-element.elementor-element-d6c37fd > .elementor-widget-container{padding:2vw 0vw 2vw 0vw;}.elementor-1287 .elementor-element.elementor-element-0338481.elementor-column > .elementor-widget-wrap{justify-content:center;}.elementor-1287 .elementor-element.elementor-element-0338481 > .elementor-element-populated{margin:0vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-257b7e1 > .elementor-widget-container{margin:2vw 0vw 0vw 0vw;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-257b7e1{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;z-index:15;text-align:center;}.elementor-1287 .elementor-element.elementor-element-257b7e1 .elementor-heading-title{font-size:13vw;line-height:1em;letter-spacing:0em;}.elementor-1287 .elementor-element.elementor-element-710622d{width:100%;max-width:100%;}.elementor-1287 .elementor-element.elementor-element-710622d > .elementor-widget-container{margin:2vw 0vw 2vw 0.215vw;}.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button{font-size:7vw;line-height:1.6em;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-1287 .elementor-element.elementor-element-0a32480:after{content:"0.5";}.elementor-1287 .elementor-element.elementor-element-0a32480 .elementor-post__thumbnail__link{width:100%;}.elementor-1287 .elementor-element.elementor-element-fb59438{margin-top:-29vw;margin-bottom:0vw;padding:0vw 5vw 17vw 5vw;z-index:5;}.elementor-1287 .elementor-element.elementor-element-53fc11e > .elementor-element-populated{margin:0vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;padding:0vw 0vw 0vw 0vw;}.elementor-1287 .elementor-element.elementor-element-ed584f8:not(.elementor-motion-effects-element-type-background), .elementor-1287 .elementor-element.elementor-element-ed584f8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(360deg, #FFCF16 61%, #E9C100 97%);}.elementor-1287 .elementor-element.elementor-element-ed584f8{margin-top:10vw;margin-bottom:0vw;padding:4vw 4vw 4vw 4vw;}.elementor-1287 .elementor-element.elementor-element-b651a7f{--container-widget-width:21%;--container-widget-flex-grow:0;width:var( --container-widget-width, 21% );max-width:21%;}.elementor-1287 .elementor-element.elementor-element-0d74473 > .elementor-widget-container{margin:0vw 0vw 1vw 2vw;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-0d74473{--container-widget-width:76%;--container-widget-flex-grow:0;width:var( --container-widget-width, 76% );max-width:76%;z-index:15;text-align:start;}.elementor-1287 .elementor-element.elementor-element-0d74473 .elementor-heading-title{font-size:9vw;line-height:1.15em;letter-spacing:0em;}.elementor-1287 .elementor-element.elementor-element-5e53c3a > .elementor-element-populated{margin:2vw 0vw 0vw 0vw;--e-column-margin-right:0vw;--e-column-margin-left:0vw;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 > .elementor-widget-container{margin:0vw 0vw 0vw 0.215vw;}.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button{font-size:5vw;line-height:1.6em;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-30b4ddd{margin-top:10vw;margin-bottom:0vw;padding:0vw 0vw 15vw 0vw;}.elementor-1287 .elementor-element.elementor-element-0db3f6c > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-822511f > .elementor-widget-container{margin:0vw 0vw 0vw 3vw;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-822511f{font-size:4.2vw;}.elementor-1287 .elementor-element.elementor-element-8d09f28 > .elementor-widget-container{margin:-5vw 0vw 0vw 0vw;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-8d09f28{--e-icon-list-icon-size:4vw;}.elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-8d09f28 .elementor-icon-list-item > a{font-size:4vw;}.elementor-1287 .elementor-element.elementor-element-ff07d56 > .elementor-widget-container{margin:0vw 0vw 0vw 3vw;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-ff07d56{font-size:4.2vw;}.elementor-1287 .elementor-element.elementor-element-bddb05f > .elementor-widget-container{margin:-5vw 0vw 0vw 0vw;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-bddb05f{--e-icon-list-icon-size:4vw;}.elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-bddb05f .elementor-icon-list-item > a{font-size:4vw;}.elementor-1287 .elementor-element.elementor-element-6390eed > .elementor-widget-container{margin:0vw 0vw 0vw 3vw;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-6390eed{font-size:4.2vw;}.elementor-1287 .elementor-element.elementor-element-1d25289 > .elementor-widget-container{margin:-5vw 0vw 0vw 0vw;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-1d25289{--e-icon-list-icon-size:4vw;}.elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-1d25289 .elementor-icon-list-item > a{font-size:4vw;}.elementor-1287 .elementor-element.elementor-element-1a9d284 > .elementor-widget-container{margin:0vw 0vw 0vw 3vw;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-1a9d284{font-size:4.2vw;}.elementor-1287 .elementor-element.elementor-element-b515435 > .elementor-widget-container{margin:-5vw 0vw 0vw 0vw;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-b515435{--e-icon-list-icon-size:4vw;}.elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-b515435 .elementor-icon-list-item > a{font-size:4vw;}.elementor-1287 .elementor-element.elementor-element-664a748 > .elementor-widget-container{margin:0vw 0vw 0vw 3vw;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-664a748{font-size:4.2vw;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 > .elementor-widget-container{margin:-5vw 0vw 0vw 0vw;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7{--e-icon-list-icon-size:4vw;}.elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-ff9b0f7 .elementor-icon-list-item > a{font-size:4vw;}.elementor-1287 .elementor-element.elementor-element-3428f4e > .elementor-widget-container{margin:0vw 0vw 0vw 3vw;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-3428f4e{font-size:4.2vw;}.elementor-1287 .elementor-element.elementor-element-907ec40 > .elementor-widget-container{margin:-5vw 0vw 0vw 0vw;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-907ec40{--e-icon-list-icon-size:4vw;}.elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-907ec40 .elementor-icon-list-item > a{font-size:4vw;}.elementor-1287 .elementor-element.elementor-element-dde9afd > .elementor-widget-container{margin:0vw 0vw 0vw 3vw;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-dde9afd{font-size:4.2vw;}.elementor-1287 .elementor-element.elementor-element-b80dd28 > .elementor-widget-container{margin:-5vw 0vw 0vw 0vw;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-b80dd28{--e-icon-list-icon-size:4vw;}.elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-b80dd28 .elementor-icon-list-item > a{font-size:4vw;}.elementor-1287 .elementor-element.elementor-element-d1d2d41 > .elementor-widget-container{margin:0vw 0vw 0vw 3vw;padding:3vw 3vw 3vw 3vw;}.elementor-1287 .elementor-element.elementor-element-d1d2d41{font-size:4.2vw;}.elementor-1287 .elementor-element.elementor-element-e69a40e > .elementor-widget-container{margin:-5vw 0vw 0vw 0vw;padding:1vw 1vw 1vw 1vw;}.elementor-1287 .elementor-element.elementor-element-e69a40e{--e-icon-list-icon-size:4vw;}.elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-item > .elementor-icon-list-text, .elementor-1287 .elementor-element.elementor-element-e69a40e .elementor-icon-list-item > a{font-size:4vw;}.elementor-1287 .elementor-element.elementor-element-20f0818{--e-n-carousel-swiper-slides-to-display:1;}.elementor-1287 .elementor-element.elementor-element-813dbc8{margin-top:0px;margin-bottom:10px;padding:0px 0px 0px 0px;}.elementor-1287 .elementor-element.elementor-element-ceceef1{--e-image-carousel-slides-to-show:2;}}@media(min-width:768px){.elementor-1287 .elementor-element.elementor-element-4a4c5c1{width:51.454%;}.elementor-1287 .elementor-element.elementor-element-d736388{width:48.546%;}.elementor-1287 .elementor-element.elementor-element-e15a39a{width:47.694%;}.elementor-1287 .elementor-element.elementor-element-0338481{width:52.272%;}.elementor-1287 .elementor-element.elementor-element-0242721{--content-width:1350px;}.elementor-1287 .elementor-element.elementor-element-a046e54{width:66.343%;}.elementor-1287 .elementor-element.elementor-element-5e53c3a{width:33.566%;}}@media(max-width:1024px) and (min-width:768px){.elementor-1287 .elementor-element.elementor-element-4a4c5c1{width:50%;}.elementor-1287 .elementor-element.elementor-element-d736388{width:50%;}.elementor-1287 .elementor-element.elementor-element-e15a39a{width:100%;}.elementor-1287 .elementor-element.elementor-element-0338481{width:100%;}.elementor-1287 .elementor-element.elementor-element-a046e54{width:60%;}.elementor-1287 .elementor-element.elementor-element-5e53c3a{width:40%;}}/* Start custom CSS for divider, class: .elementor-element-aef05d3 */.elementor-1287 .elementor-element.elementor-element-aef05d3 {
  -webkit-mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  overflow: hidden;
}/* End custom CSS */
/* Start custom CSS for divider, class: .elementor-element-d7e5355 */.elementor-1287 .elementor-element.elementor-element-d7e5355 {
  -webkit-mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  overflow: hidden;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-f6e11c9 *//* =========================================
   1. SHIMMER VARIABLE
========================================= */
@property --shimmer-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

/* =========================================
   2. PARENT OVERRIDES
========================================= */
.elementor-1287 .elementor-element.elementor-element-f6e11c9 {
  overflow: visible !important;
}

.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button-wrapper {
  position: relative;
  display: inline-flex; 
  z-index: 1;
  min-width: fit-content; 
  
  filter: drop-shadow(0px 15px 33px rgba(0, 0, 0, 0.6));
}

/* =========================================
   3. THE RADAR WAVE (ALWAYS ON & SATURATED BLUE)
========================================= */
.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button-wrapper::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  
  /* Deep, highly saturated blue */
  background: #0033FF; 
  
  z-index: -1;
  opacity: 0;
  filter: blur(15px); 
  pointer-events: none;
  
  /* Animation moved here so it pulses by default, no hover required */
  animation: radar-blue-wave 1.5s infinite ease-out;
}

/* =========================================
   4. BASE BUTTON
========================================= */
.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button {
  --corner-size: 20px;
  
  position: relative;
  z-index: 2;
  overflow: visible;
  border: none !important;
  
  background: radial-gradient(circle, #F50100 10%, #8a0000 100%) !important;

  padding: 15px 25px !important;

  white-space: nowrap; 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;

  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
  
  transition: transform 0.3s ease, background 0.3s ease;
}

@media only screen and (max-width: 900px){
    .elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button{
         padding: 10px 19px !important;
    }
}


/* Persistent Shimmer Border */
.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  
  /* 🔥 CHANGED: Increased by 1px (from 1.8px to 2.8px) */
  --border-width: 2.8px;

  background: conic-gradient(
    from var(--shimmer-angle),
    #3a66bc6e 0%,
    #3a66bc6e 70%,
    #3a66bc 85%,
    #d0e0ff 90%,
    #3a66bc 95%,
    #3a66bc6e 100%
  );
  animation: shimmerRotate 2.2s linear infinite;

  -webkit-mask: 
    linear-gradient(135deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;
  mask: -webkit-mask;
}

/* =========================================
   5. ANIMATIONS
========================================= */
@keyframes radar-blue-wave {
    0% { transform: scale(0.95); opacity: 0.95; }
    100% { transform: scale(1.6) scaleX(1.4); opacity: 0; }
}

@keyframes shimmerRotate {
  0% { --shimmer-angle: 0deg; }
  100% { --shimmer-angle: 360deg; }
}

.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button:hover {
  transform: translateY(-5px); 
}

.elementor-1287 .elementor-element.elementor-element-f6e11c9:hover h6 {
  color: #ffffff !important;
}

/* =========================================
   6. ICON CONTAINER & SHAPE
========================================= */
.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  /* 1.25x Larger Container */
  width: 40px; 
  height: 35px;

  /* 0.25x Padding Inside Container */
  padding: 9px 10px;
  box-sizing: border-box;

  z-index: 1;
}

/* ROTATING NAVY HEX */
.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button-icon::after {
  content: "";
  position: absolute;
  inset: 0;

  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
  -webkit-clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);

  background: #0B1D4C;

  z-index: -1;
  transform-origin: center;
}

.elementor-1287 .elementor-element.elementor-element-f6e11c9:hover .elementor-button-icon::after {
  animation: hexSpin 15s linear infinite;
}

@keyframes hexSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* SVG ICON */
.elementor-1287 .elementor-element.elementor-element-f6e11c9 .elementor-button-icon svg {
  transform: scale(1);
  transform-origin: center;

  fill: #ffffff !important;
  color: #ffffff !important;

  width: 100%;
  height: 100%;

  position: relative;
  z-index: 1;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-ca6806e *//* =========================================
   1. SHIMMER VARIABLE
========================================= */
@property --shimmer-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

/* =========================================
   2. PARENT OVERRIDES
========================================= */
.elementor-1287 .elementor-element.elementor-element-ca6806e {
  overflow: visible !important;
}

.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button-wrapper {
  position: relative;
  display: inline-flex; 
  z-index: 1;
  min-width: fit-content; 
  
  filter: drop-shadow(0px 15px 33px rgba(0, 0, 0, 0.6));
}

/* =========================================
   3. THE RADAR WAVE (ALWAYS ON & SATURATED BLUE)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button-wrapper::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  
  /* Deep, highly saturated blue */
  background: #0033FF; 
  
  z-index: -1;
  opacity: 0;
  filter: blur(15px); 
  pointer-events: none;
  
  /* Animation moved here so it pulses by default, no hover required */
  animation: radar-blue-wave 1.5s infinite ease-out;
}

/* =========================================
   4. BASE BUTTON
========================================= */
.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button {
  --corner-size: 20px;
  
  position: relative;
  z-index: 2;
  overflow: visible;
  border: none !important;
  
  background: radial-gradient(circle, #F50100 10%, #8a0000 100%) !important;

  padding: 15px 25px !important;

  white-space: nowrap; 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;

  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
  
  transition: transform 0.3s ease, background 0.3s ease;
}

@media only screen and (max-width: 900px){
    .elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button{
         padding: 10px 19px !important;
    }
}


/* Persistent Shimmer Border */
.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  
  /* 🔥 CHANGED: Increased by 1px (from 1.8px to 2.8px) */
  --border-width: 2.8px;

  background: conic-gradient(
    from var(--shimmer-angle),
    #3a66bc6e 0%,
    #3a66bc6e 70%,
    #3a66bc 85%,
    #d0e0ff 90%,
    #3a66bc 95%,
    #3a66bc6e 100%
  );
  animation: shimmerRotate 2.2s linear infinite;

  -webkit-mask: 
    linear-gradient(135deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;
  mask: -webkit-mask;
}

/* =========================================
   5. ANIMATIONS
========================================= */
@keyframes radar-blue-wave {
    0% { transform: scale(0.95); opacity: 0.95; }
    100% { transform: scale(1.6) scaleX(1.4); opacity: 0; }
}

@keyframes shimmerRotate {
  0% { --shimmer-angle: 0deg; }
  100% { --shimmer-angle: 360deg; }
}

.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button:hover {
  transform: translateY(-5px); 
}

.elementor-1287 .elementor-element.elementor-element-ca6806e:hover h6 {
  color: #ffffff !important;
}

/* =========================================
   6. ICON CONTAINER & SHAPE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  /* 1.25x Larger Container */
  width: 40px; 
  height: 35px;

  /* 0.25x Padding Inside Container */
  padding: 9px 10px;
  box-sizing: border-box;

  z-index: 1;
}

/* ROTATING NAVY HEX */
.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button-icon::after {
  content: "";
  position: absolute;
  inset: 0;

  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
  -webkit-clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);

  background: #0B1D4C;

  z-index: -1;
  transform-origin: center;
}

.elementor-1287 .elementor-element.elementor-element-ca6806e:hover .elementor-button-icon::after {
  animation: hexSpin 15s linear infinite;
}

@keyframes hexSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* SVG ICON */
.elementor-1287 .elementor-element.elementor-element-ca6806e .elementor-button-icon svg {
  transform: scale(1);
  transform-origin: center;

  fill: #ffffff !important;
  color: #ffffff !important;

  width: 100%;
  height: 100%;

  position: relative;
  z-index: 1;
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-02461bf */.elementor-1287 .elementor-element.elementor-element-02461bf {
    transform: scale(1.2);
    transform-origin: center;
  }/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-a1e1064 */.elementor-1287 .elementor-element.elementor-element-a1e1064 img {
  -webkit-mask-image: linear-gradient(
    to bottom,
    rgba(0,0,0,1) 0%,        /* Top: fully visible */
    rgba(0,0,0,1) 70%,       /* Solid until fade zone starts (same distance) */

    rgba(0,0,0,0.98) 71%,
    rgba(0,0,0,0.92) 73%,
    rgba(0,0,0,0.82) 76%,
    rgba(0,0,0,0.68) 80%,
    rgba(0,0,0,0.50) 85%,
    rgba(0,0,0,0.32) 90%,
    rgba(0,0,0,0.16) 95%,
    rgba(0,0,0,0.06) 98%,
    rgba(0,0,0,0) 100%       /* Bottom: fully transparent */
  );

  mask-image: linear-gradient(
    to bottom,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,1) 70%,
    rgba(0,0,0,0.98) 71%,
    rgba(0,0,0,0.92) 73%,
    rgba(0,0,0,0.82) 76%,
    rgba(0,0,0,0.68) 80%,
    rgba(0,0,0,0.50) 85%,
    rgba(0,0,0,0.32) 90%,
    rgba(0,0,0,0.16) 95%,
    rgba(0,0,0,0.06) 98%,
    rgba(0,0,0,0) 100%
  );
}




.elementor-1287 .elementor-element.elementor-element-a1e1064 {
    transform: scale(1.75);
    transform-origin: center;
  }/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-a6de0fe */.elementor-1287 .elementor-element.elementor-element-a6de0fe {
    transform: scale(1.355);
    transform-origin: center;
  }/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-c1c8c46 */.elementor-1287 .elementor-element.elementor-element-c1c8c46::before {
  content: '';
  position: absolute;
  inset: 0; /* shorthand for top:0; right:0; bottom:0; left:0; */
  pointer-events: none;
  z-index: 2;

  background: repeating-linear-gradient(
    45deg,
    rgba(0, 0, 0, 0.320131) 0 calc(1em),
    transparent calc(4em) calc(5em + 3vh)
  );

  mix-blend-mode: overlay;

  /* 🔥 ADDED: Fades the shapes from the center to the right */
  -webkit-mask-image: linear-gradient(to right, black 50%, transparent 100%);
  mask-image: linear-gradient(to right, black 50%, transparent 100%);
}




.elementor-1287 .elementor-element.elementor-element-c1c8c46 {
  /* --- 1. Corner Depth --- */
  /* Increase this value to make the cut go deeper into the shape */
  --corner-size: 50px;      

  /* --- 2. The Balanced Clipping Path --- */
  /* This maintains the 1:1 ratio (45-degree angle) on all corners */
  clip-path: polygon(
    var(--corner-size) 0%,                        /* Top-left start */
    calc(100% - var(--corner-size)) 0%,           /* Top-right start */
    100% var(--corner-size),                      /* Top-right end */
    100% calc(100% - var(--corner-size)),         /* Bottom-right start */
    calc(100% - var(--corner-size)) 100%,         /* Bottom-right end */
    var(--corner-size) 100%,                      /* Bottom-left start */
    0% calc(100% - var(--corner-size)),           /* Bottom-left end */
    0% var(--corner-size)                         /* Top-left end */
  );
  
  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}/* End custom CSS */
/* Start custom CSS for image-carousel, class: .elementor-element-d6c37fd */x.elementor-1287 .elementor-element.elementor-element-d6c37fd {
  -webkit-mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  overflow: hidden;
}



.elementor-1287 .elementor-element.elementor-element-d6c37fd {
  -webkit-mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  overflow: hidden;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-710622d *//* =========================================
   1. SHIMMER VARIABLE
========================================= */
/* 🔥 REMOVED: Custom property registration for shimmer angle deleted */

/* =========================================
   2. PARENT OVERRIDES
========================================= */
.elementor-1287 .elementor-element.elementor-element-710622d {
  overflow: visible !important;
}

.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button-wrapper {
  position: relative;
  display: inline-flex; 
  z-index: 1;
  min-width: fit-content; 
  /* 🔥 CHANGED: Default drop-shadow removed */
}

/* =========================================
   3. BASE BUTTON
========================================= */
.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button {
  --corner-size: 20px;
  
  position: relative;
  z-index: 2;
  overflow: visible;
  border: none !important;
  
  /* 🔥 CHANGED: Background updated to grades of navy blue */
  background: radial-gradient(circle, #1c3d7a 10%, #061536 100%) !important;

  padding: 15px 25px !important;

  white-space: nowrap; 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;

  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
  
  transition: transform 0.3s ease, background 0.3s ease;
}

@media only screen and (max-width: 900px){
    .elementor-1287 .elementor-element.elementor-element-710622d .elementor-button{
         padding: 10px 19px !important;
    }
}

/* 🔥 REMOVED: .elementor-1287 .elementor-element.elementor-element-710622d .elementor-button::before block deleted to get rid of the shimmery beam border */

/* =========================================
   4. ANIMATIONS & HOVER STATES
========================================= */
/* 🔥 REMOVED: @keyframes shimmerRotate deleted */

/* Keeps only the physical floating effect */
.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button:hover {
  transform: translateY(-5px); 
}

.elementor-1287 .elementor-element.elementor-element-710622d:hover h6 {
  color: #ffffff !important;
}

/* =========================================
   5. ICON CONTAINER & SHAPE
========================================= */
.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 40px; 
  height: 35px;

  padding: 9px 10px;
  box-sizing: border-box;

  z-index: 1;
}

/* ROTATING YELLOW-ORANGE HEX */
.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button-icon::after {
  content: "";
  position: absolute;
  inset: 0;

  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
  -webkit-clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);

  /* 🔥 CHANGED: Background updated to yellowish orange */
  background: #F5A623;

  z-index: -1;
  transform-origin: center;
}

.elementor-1287 .elementor-element.elementor-element-710622d:hover .elementor-button-icon::after {
  animation: hexSpin 15s linear infinite;
}

@keyframes hexSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* SVG ICON */
.elementor-1287 .elementor-element.elementor-element-710622d .elementor-button-icon svg {
  transform: scale(1);
  transform-origin: center;

  /* 🔥 CHANGED: Updated from white to navy blue */
  fill: #061536 !important;
  color: #061536 !important;

  width: 100%;
  height: 100%;

  position: relative;
  z-index: 1;
}/* End custom CSS */
/* Start custom CSS for column, class: .elementor-element-0338481 */.elementor-1287 .elementor-element.elementor-element-0338481 {
  /* --- VARIABLES --- */
  --corner: 25px; /* Adjust the depth of the sci-fi cut here */

  /* Prevent background or inner content from spilling out of the cut corners */
  overflow: hidden; 
  position: relative;

  /* --- THE ASYMMETRICAL SCI-FI CUT (LEFT SIDE ONLY) --- */
  clip-path: polygon(
    var(--corner) 0%,                       /* Top Left Cut Start (Top edge) */
    100% 0%,                                /* Top Right (Square) */
    100% 100%,                              /* Bottom Right (Square) */
    var(--corner) 100%,                     /* Bottom Left Cut Start (Bottom edge) */
    0% calc(100% - var(--corner)),          /* Bottom Left Cut End (Left edge) */
    0% var(--corner)                        /* Top Left Cut End (Left edge) */
  );

  -webkit-clip-path: polygon(
    var(--corner) 0%, 
    100% 0%, 
    100% 100%, 
    var(--corner) 100%, 
    0% calc(100% - var(--corner)), 
    0% var(--corner)
  );
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-e642045 */.elementor-1287 .elementor-element.elementor-element-e642045 {
  /* --- 1. Variables --- */
  --corner-size: 30px;      /* Change this to 50px or whatever you need! */
  --border-color: #011C3D;  /* Navy Blue */
  
  /* Standard border thickness (Top-Left, Bottom-Right, and straight edges) */
  --border-width: 3px;      
  
  /* 🔥 CHANGED: Extra 1px thickness specifically for Top-Right and Bottom-Left */
  --border-width-thick: 4px; 

  /* Required to keep the inner border overlay contained */
  position: relative; 

  /* --- 2. The Balanced Clipping Path --- */
  clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
  
  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* --- 3. The Navy Border Overlay --- */
.elementor-1287 .elementor-element.elementor-element-e642045::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none; /* Let clicks pass right through to the content */
  z-index: 10; /* Keeps the border clearly on top of the background */

  background:
    /* A. The Straight Edges (All 3px) */
    /* If you meant to thicken the straight edges too, change var(--border-width) to var(--border-width-thick) below! */
    linear-gradient(var(--border-color), var(--border-color)) top center / 100% var(--border-width) no-repeat,
    linear-gradient(var(--border-color), var(--border-color)) bottom center / 100% var(--border-width) no-repeat,
    linear-gradient(var(--border-color), var(--border-color)) left center / var(--border-width) 100% no-repeat,
    linear-gradient(var(--border-color), var(--border-color)) right center / var(--border-width) 100% no-repeat,
    
    /* B. The Angled Corners */
    /* Top Left (3px) */
    linear-gradient(135deg, transparent calc(50% - var(--border-width)/2), var(--border-color) calc(50% - var(--border-width)/2), var(--border-color) calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    
    /* 🔥 CHANGED: Top Right uses var(--border-width-thick) (4px) */
    linear-gradient(225deg, transparent calc(50% - var(--border-width-thick)/2), var(--border-color) calc(50% - var(--border-width-thick)/2), var(--border-color) calc(50% + var(--border-width-thick)/2), transparent calc(50% + var(--border-width-thick)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* 🔥 CHANGED: Bottom Left uses var(--border-width-thick) (4px) */
    linear-gradient(45deg, transparent calc(50% - var(--border-width-thick)/2), var(--border-color) calc(50% - var(--border-width-thick)/2), var(--border-color) calc(50% + var(--border-width-thick)/2), transparent calc(50% + var(--border-width-thick)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Bottom Right (3px) */
    linear-gradient(315deg, transparent calc(50% - var(--border-width)/2), var(--border-color) calc(50% - var(--border-width)/2), var(--border-color) calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-7ccf2e1 *//* =========================================
   1. SHIMMER VARIABLE
========================================= */
@property --shimmer-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

/* =========================================
   2. PARENT OVERRIDES
========================================= */
.elementor-1287 .elementor-element.elementor-element-7ccf2e1 {
  overflow: visible !important;
}

.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button-wrapper {
  position: relative;
  display: inline-flex; 
  z-index: 1;
  min-width: fit-content; 
  /* 🔥 CHANGED: Default drop-shadow removed */
}

/* 🔥 CHANGED: Section 3 (The Radar Wave) has been completely removed to eliminate the emanating blues */

/* =========================================
   3. BASE BUTTON
========================================= */
.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button {
  --corner-size: 20px;
  
  position: relative;
  z-index: 2;
  overflow: visible;
  border: none !important;
  
  /* 🔥 CHANGED: Red gradient swapped out for a Navy gradient */
  background: radial-gradient(circle, #1a3a73 10%, #0B1D4C 100%) !important;

  padding: 15px 25px !important;

  white-space: nowrap; 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;

  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
  
  transition: transform 0.3s ease, background 0.3s ease;
}

/* Persistent Shimmer Border */
.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  
  --border-width: 2.8px;

  background: conic-gradient(
    from var(--shimmer-angle),
    #3a66bc6e 0%,
    #3a66bc6e 70%,
    #3a66bc 85%,
    #d0e0ff 90%,
    #3a66bc 95%,
    #3a66bc6e 100%
  );
  animation: shimmerRotate 2.2s linear infinite;

  -webkit-mask: 
    linear-gradient(135deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--border-width)/2), black calc(50% - var(--border-width)/2), black calc(50% + var(--border-width)/2), transparent calc(50% + var(--border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;
  mask: -webkit-mask;
}

/* =========================================
   4. ANIMATIONS & HOVER STATES
========================================= */
@keyframes shimmerRotate {
  0% { --shimmer-angle: 0deg; }
  100% { --shimmer-angle: 360deg; }
}

/* 🔥 CHANGED: Keeps only the physical floating effect */
.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button:hover {
  transform: translateY(-5px); 
}

.elementor-1287 .elementor-element.elementor-element-7ccf2e1:hover h6 {
  color: #ffffff !important;
}

/* =========================================
   5. ICON CONTAINER & SHAPE
========================================= */
.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 40px; 
  height: 35px;

  padding: 9px 10px;
  box-sizing: border-box;

  z-index: 1;
}


@media only screen and (max-width: 900px){
    .elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button{
         padding: 10px 19px !important;
    }
}

/* ROTATING NAVY HEX */
.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button-icon::after {
  content: "";
  position: absolute;
  inset: 0;

  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
  -webkit-clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);

  /* 🔥 CHANGED: Hexagon shape changed to Yellowish Orange */
  background: #FFB300;

  z-index: -1;
  transform-origin: center;
}

.elementor-1287 .elementor-element.elementor-element-7ccf2e1:hover .elementor-button-icon::after {
  animation: hexSpin 15s linear infinite;
}

@keyframes hexSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* SVG ICON */
.elementor-1287 .elementor-element.elementor-element-7ccf2e1 .elementor-button-icon svg {
  transform: scale(1);
  transform-origin: center;

  /* 🔥 CHANGED: SVG Icon color changed to Navy Blue */
  fill: #0B1D4C !important;
  color: #0B1D4C !important;

  width: 100%;
  height: 100%;

  position: relative;
  z-index: 1;
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-ed584f8 */.elementor-1287 .elementor-element.elementor-element-ed584f8 {
  /* --- 1. Corner Depth --- */
  /* Increase this value to make the cut go deeper into the shape */
  --corner-size: 25px;      

  /* --- 2. The Balanced Clipping Path --- */
  /* This maintains the 1:1 ratio (45-degree angle) on all corners */
  clip-path: polygon(
    var(--corner-size) 0%,                        /* Top-left start */
    calc(100% - var(--corner-size)) 0%,           /* Top-right start */
    100% var(--corner-size),                      /* Top-right end */
    100% calc(100% - var(--corner-size)),         /* Bottom-right start */
    calc(100% - var(--corner-size)) 100%,         /* Bottom-right end */
    var(--corner-size) 100%,                      /* Bottom-left start */
    0% calc(100% - var(--corner-size)),           /* Bottom-left end */
    0% var(--corner-size)                         /* Top-left end */
  );
  
  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-822511f *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-822511f:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-8d09f28 */.elementor-1287 .elementor-element.elementor-element-8d09f28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-ff07d56 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-ff07d56:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-bddb05f */.elementor-1287 .elementor-element.elementor-element-bddb05f {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-6390eed *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-6390eed:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-1d25289 */.elementor-1287 .elementor-element.elementor-element-1d25289 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-1a9d284 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-1a9d284:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b515435 */.elementor-1287 .elementor-element.elementor-element-b515435 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-664a748 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-664a748:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-ff9b0f7 */.elementor-1287 .elementor-element.elementor-element-ff9b0f7 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-3428f4e *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-3428f4e:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-907ec40 */.elementor-1287 .elementor-element.elementor-element-907ec40 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-dde9afd *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-dde9afd:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-b80dd28 */.elementor-1287 .elementor-element.elementor-element-b80dd28 {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-d1d2d41 *//* =========================================
   1. BASE ELEMENT EFFECTS (BLUR)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}

/* =========================================
   2. BASE ELEMENT (TEXT EDITOR WRAPPER)
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41 {
  --corner-size: 30px;
  /* Add padding so the text doesn't get cut off by the clipped corners */
  --inner-padding: 15px; 

  position: relative;
  overflow: visible;
  margin: 0.5%;
  padding: var(--inner-padding);
  border: none !important;
  
  /* 🔥 CHANGED: 25% Brighter version of your blue at 90% opacity */
  background-color: rgba(237, 245, 253, 0.9) !important; 

  /* The actual clipped shape */
  clip-path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  -webkit-clip-path: polygon(
    var(--corner-size) 0%, 
    calc(100% - var(--corner-size)) 0%, 
    100% var(--corner-size), 
    100% calc(100% - var(--corner-size)), 
    calc(100% - var(--corner-size)) 100%, 
    var(--corner-size) 100%, 
    0% calc(100% - var(--corner-size)), 
    0% var(--corner-size)
  );
}

/* =========================================
   3. CLIPPED BORDER MASK
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  /* Base widths */
  --border-width: 2px;
  --corner-border-width: 3px; 

  /* Set the default border color */
  background: #244C87;
  
  /* Smooth transition for the hover color change */
  transition: background 0.3s ease;

  /* BORDER MASK (8 SIDES) - This draws the line along the clip-path */
  -webkit-mask: 
    /* Corners */
    linear-gradient(135deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(225deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) top right / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(45deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom left / var(--corner-size) var(--corner-size) no-repeat,
    linear-gradient(315deg, transparent calc(50% - var(--corner-border-width)/2), black calc(50% - var(--corner-border-width)/2), black calc(50% + var(--corner-border-width)/2), transparent calc(50% + var(--corner-border-width)/2)) bottom right / var(--corner-size) var(--corner-size) no-repeat,
    
    /* Straight Sides */
    linear-gradient(to right, black, black) top center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to right, black, black) bottom center / calc(100% - var(--corner-size)*2) var(--border-width) no-repeat,
    linear-gradient(to bottom, black, black) left center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat,
    linear-gradient(to bottom, black, black) right center / var(--border-width) calc(100% - var(--corner-size)*2) no-repeat;

  mask: -webkit-mask;
}

/* =========================================
   4. HOVER BORDER COLOR CHANGE
========================================= */
.elementor-1287 .elementor-element.elementor-element-d1d2d41:hover::before {
  background: #285199; 
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-e69a40e */.elementor-1287 .elementor-element.elementor-element-e69a40e {
    backdrop-filter: blur(8px); /* Adjust the blur factor as needed */
}/* End custom CSS */
/* Start custom CSS for nested-carousel, class: .elementor-element-20f0818 *//* =========================================
   1. CAROUSEL ARROWS BASE SHAPE
========================================= */
.elementor-1287 .elementor-element.elementor-element-20f0818 .elementor-swiper-button-prev,
.elementor-1287 .elementor-element.elementor-element-20f0818 .elementor-swiper-button-next {
  --corner-size: 10px; 
  
  --path: polygon(
    var(--corner-size) 0%,
    calc(100% - var(--corner-size)) 0%,
    100% var(--corner-size),
    100% calc(100% - var(--corner-size)),
    calc(100% - var(--corner-size)) 100%,
    var(--corner-size) 100%,
    0% calc(100% - var(--corner-size)),
    0% var(--corner-size)
  );

  overflow: hidden !important; 
  border-radius: 0 !important; 
  
  /* 🔥 CHANGED: Base Navy darkened by 15% */
  background-color: #1F4075 !important; 

  /* Apply the Clipped Shape */
  clip-path: var(--path);
  -webkit-clip-path: var(--path);
  
  /* Sizing and alignment */
  width: 45px !important;
  height: 45px !important;
  display: flex;
  align-items: center;
  justify-content: center;

  transition: filter 0.3s ease, background-color 0.3s ease !important;
}

/* =========================================
   2. ARROW ICON COLOR (Forced White)
========================================= */
.elementor-1287 .elementor-element.elementor-element-20f0818 .elementor-swiper-button-prev i,
.elementor-1287 .elementor-element.elementor-element-20f0818 .elementor-swiper-button-next i,
.elementor-1287 .elementor-element.elementor-element-20f0818 .elementor-swiper-button-prev svg,
.elementor-1287 .elementor-element.elementor-element-20f0818 .elementor-swiper-button-next svg {
  color: #ffffff !important;
  fill: #ffffff !important;
  font-size: 18px !important; 
  width: 18px !important;
}

/* =========================================
   3. HOVER STATE (Slightly Brighter)
========================================= */
.elementor-1287 .elementor-element.elementor-element-20f0818 .elementor-swiper-button-prev:hover,
.elementor-1287 .elementor-element.elementor-element-20f0818 .elementor-swiper-button-next:hover {
  /* 🔥 CHANGED: Adjusted brightness boost to 15% to maintain the darker feel */
  filter: brightness(1.15); 
}/* End custom CSS */
/* Start custom CSS for image-carousel, class: .elementor-element-ceceef1 */x.elementor-1287 .elementor-element.elementor-element-ceceef1 {
  -webkit-mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  overflow: hidden;
}



.elementor-1287 .elementor-element.elementor-element-ceceef1 {
  -webkit-mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  mask-image: linear-gradient(to right, transparent, black 20%, black 80%, transparent);
  overflow: hidden;
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-fb59438 */.elementor-1287 .elementor-element.elementor-element-fb59438.elementor-section {
  position: relative;
  z-index: 1;

  /* Top + bottom fade reduced to 50% distance */
  -webkit-mask-image:
    linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.2) 2.5%,
      rgba(0, 0, 0, 0.4) 5%,
      rgba(0, 0, 0, 0.7) 7.5%,
      rgba(0, 0, 0, 0.9) 10%,
      rgba(0, 0, 0, 1) 12.5%,
      rgba(0, 0, 0, 1) 87.5%,
      rgba(0, 0, 0, 0.9) 90%,
      rgba(0, 0, 0, 0.7) 92.5%,
      rgba(0, 0, 0, 0.4) 95%,
      rgba(0, 0, 0, 0.2) 97.5%,
      rgba(0, 0, 0, 0) 100%
    );

  mask-image:
    linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.2) 2.5%,
      rgba(0, 0, 0, 0.4) 5%,
      rgba(0, 0, 0, 0.7) 7.5%,
      rgba(0, 0, 0, 0.9) 10%,
      rgba(0, 0, 0, 1) 12.5%,
      rgba(0, 0, 0, 1) 87.5%,
      rgba(0, 0, 0, 0.9) 90%,
      rgba(0, 0, 0, 0.7) 92.5%,
      rgba(0, 0, 0, 0.4) 95%,
      rgba(0, 0, 0, 0.2) 97.5%,
      rgba(0, 0, 0, 0) 100%
    );

  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}



.elementor-1287 .elementor-element.elementor-element-fb59438 {
  position: relative;
  z-index: 0;
  overflow: hidden;
}

.elementor-1287 .elementor-element.elementor-element-fb59438::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(8px);
  pointer-events: none;
}

.elementor-1287 .elementor-element.elementor-element-fb59438 > .elementor-container {
  position: relative;
  z-index: 1;
}













/* 2. Apply precise cinematic fading ONLY on Mobile (767px and below) */
@media (max-width: 767px) {
  .elementor-1287 .elementor-element.elementor-element-fb59438.elementor-section {
    position: relative;
    z-index: 1;

    /* High-Precision Symmetrical Cinematic Fade 
       Top 7.5% Fade-In | Middle 85% Solid | Bottom 7.5% Fade-Out
    */
    -webkit-mask-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.013) 0.225%,
      rgba(0, 0, 0, 0.049) 0.45%,
      rgba(0, 0, 0, 0.104) 0.75%,
      rgba(0, 0, 0, 0.175) 1.3%,
      rgba(0, 0, 0, 0.352) 2.425%,
      rgba(0, 0, 0, 0.55) 3.55%,
      rgba(0, 0, 0, 0.741) 4.675%,
      rgba(0, 0, 0, 0.896) 5.8%,
      rgba(0, 0, 0, 1) 7.5%,      /* Start Solid Area */
      
      rgba(0, 0, 0, 1) 92.5%,     /* End Solid Area */
      
      rgba(0, 0, 0, 0.896) 94.2%,
      rgba(0, 0, 0, 0.741) 95.325%,
      rgba(0, 0, 0, 0.55) 96.45%,
      rgba(0, 0, 0, 0.352) 97.575%,
      rgba(0, 0, 0, 0.175) 98.7%,
      rgba(0, 0, 0, 0.104) 99.25%,
      rgba(0, 0, 0, 0.049) 99.55%,
      rgba(0, 0, 0, 0.013) 99.775%,
      rgba(0, 0, 0, 0) 100%
    ) !important;

    mask-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.013) 0.225%,
      rgba(0, 0, 0, 0.049) 0.45%,
      rgba(0, 0, 0, 0.104) 0.75%,
      rgba(0, 0, 0, 0.175) 1.3%,
      rgba(0, 0, 0, 0.352) 2.425%,
      rgba(0, 0, 0, 0.55) 3.55%,
      rgba(0, 0, 0, 0.741) 4.675%,
      rgba(0, 0, 0, 0.896) 5.8%,
      rgba(0, 0, 0, 1) 7.5%,
      
      rgba(0, 0, 0, 1) 92.5%,
      
      rgba(0, 0, 0, 0.896) 94.2%,
      rgba(0, 0, 0, 0.741) 95.325%,
      rgba(0, 0, 0, 0.55) 96.45%,
      rgba(0, 0, 0, 0.352) 97.575%,
      rgba(0, 0, 0, 0.175) 98.7%,
      rgba(0, 0, 0, 0.104) 99.25%,
      rgba(0, 0, 0, 0.049) 99.55%,
      rgba(0, 0, 0, 0.013) 99.775%,
      rgba(0, 0, 0, 0) 100%
    ) !important;

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
  }
}/* End custom CSS */
/* Start custom CSS *//* Fallback 1 — targets the sticky effects wrapper */
.elementor-sticky--effects .p-white {
  color: #ffffff;
}

/* Fallback 2 — if your header has a specific section ID, e.g. #header */
.elementor-sticky--active#header .p-white,
.elementor-sticky--active .elementor-section .p-white {
  color: #ffffff;
}















/* =========================================
   SCI-FI CLIPPED SCROLLBAR (GRADIENT TRICK)
========================================= */

/* 1. The overall width/height of the scrollbar */
::-webkit-scrollbar {
  width: 16px;  
  height: 16px; 
}

/* 2. The blank white track */
::-webkit-scrollbar-track {
  background: #FFFFFF; 
}

/* 3. The navy blue thumb drawn with gradients */
::-webkit-scrollbar-thumb {
  /* Must be transparent so the chopped corners let the white track show through */
  background-color: transparent !important;
  
  /* Draw the 4 sci-fi corners using background gradients instead of clip-path */
  background-image:
    linear-gradient(135deg, transparent 4px, #0C1E58 4.5px),
    linear-gradient(225deg, transparent 4px, #0C1E58 4.5px),
    linear-gradient(45deg,  transparent 4px, #0C1E58 4.5px),
    linear-gradient(315deg, transparent 4px, #0C1E58 4.5px) !important;
    
  /* Snap each piece to its respective corner */
  background-position: top left, top right, bottom left, bottom right !important;
  
  /* Make each block take up a quarter of the thumb. 
     (We use 51% instead of 50% to force them to overlap slightly so you don't get a 1px gap in the dead center) */
  background-size: 51% 51% !important;
  background-repeat: no-repeat !important;

  /* Optional: Adds a 2px invisible border around the thumb so it doesn't touch the very edges of the screen */
  border: 2px solid #FFFFFF !important;
  background-clip: padding-box !important;
}

/* 4. Hover state (Slightly lighter navy blue) */
::-webkit-scrollbar-thumb:hover {
  background-image:
    linear-gradient(135deg, transparent 4px, #162D63 4.5px),
    linear-gradient(225deg, transparent 4px, #162D63 4.5px),
    linear-gradient(45deg,  transparent 4px, #162D63 4.5px),
    linear-gradient(315deg, transparent 4px, #162D63 4.5px) !important;
}




















body {
  cursor: url('https://w3bdesign.net/wp-content/uploads/2025/10/small-cursor_blue.png'), auto;
}













/* =========================================
   1. PAGE BASE
========================================= */
body {
  margin: 0 !important;
  min-height: 100vh !important;
  position: relative !important;
}

/* =========================================
   2. THE DUAL-LAYER PAGE HUD BORDER
========================================= */
body::after {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  
  /* OVERRIDE ELEMENTOR'S STICKY HEADER */
  z-index: 999999999999999999999999 !important; 
  
  pointer-events: none !important; 
  
  /* CRITICAL: Ensures the background layers start *inside* the thick borders */
  box-sizing: border-box !important; 

  /* --- THE THICK SQUARED OUTER BORDER --- */
  border-style: solid !important;
  border-color: #FFFFFF !important;
  
  border-top-width: 15px !important;    /* <--- TOP outer border thickness */
  /* ???? CHANGED: Reduced another ~20% down to 6px for scrollbar clearance */
  border-right-width: 6px !important;   /* <--- RIGHT outer border thickness */
  border-bottom-width: 15px !important; /* <--- BOTTOM outer border thickness */
  border-left-width: 9px !important;    /* <--- LEFT outer border thickness */

  /* --- THE INNER SCI-FI CORNER FILLS & NAVY LINE --- */
  background:
    /* 1. The Angled Corners (White fill -> 1px Navy line -> Transparent) */
    linear-gradient(135deg, #FFFFFF 26px, #162D63 26px, #162D63 27px, transparent 27.5px) top left no-repeat,
    linear-gradient(225deg, #FFFFFF 26px, #162D63 26px, #162D63 27px, transparent 27.5px) top right no-repeat,
    linear-gradient(45deg,  #FFFFFF 26px, #162D63 26px, #162D63 27px, transparent 27.5px) bottom left no-repeat,
    linear-gradient(315deg, #FFFFFF 26px, #162D63 26px, #162D63 27px, transparent 27.5px) bottom right no-repeat,

    /* 2. The Straight Inner Borders (Navy lines) */
    linear-gradient(#162D63, #162D63) top center / 100% 2px no-repeat,    /* <--- TOP inner line (adjust the '2px') */
    linear-gradient(#162D63, #162D63) bottom center / 100% 2px no-repeat, /* <--- BOTTOM inner line (adjust the '2px') */
    linear-gradient(#162D63, #162D63) left center / 2px 100% no-repeat,   /* <--- LEFT inner line (adjust the '2px') */
    linear-gradient(#162D63, #162D63) right center / 2px 100% no-repeat !important; /* <--- RIGHT inner line (adjust the '2px') */
}/* End custom CSS */