.elementor-3722 .elementor-element.elementor-element-d2f673d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-3722 .elementor-element.elementor-element-7032485{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-7032485.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3722 .elementor-element.elementor-element-b3220fc{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-b3220fc.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3722 .elementor-element.elementor-element-f5cc5ad .elegant-menu-container{background-color:var( --e-global-color-02138d9 );padding:15px 20px 15px 20px;border-radius:10px;}.elementor-3722 .elementor-element.elementor-element-f5cc5ad .elegant-menu-link{color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f5cc5ad .elegant-menu-link:hover, .elementor-3722 .elementor-element.elementor-element-f5cc5ad .elegant-menu-item.active .elegant-menu-link{color:#D4AF37;}.elementor-3722 .elementor-element.elementor-element-f5cc5ad .elegant-menu-link::after{background-color:#D4AF37;}.elementor-3722 .elementor-element.elementor-element-6f8fc19{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-8532798 .ekit_navsearch-button :is(i, svg){font-size:60px;}.elementor-3722 .elementor-element.elementor-element-8532798 .ekit_navsearch-button{margin:5px 5px 5px 5px;padding:0px 0px 0px 0px;width:40px;height:40px;line-height:40px;text-align:center;}.elementor-3722 .elementor-element.elementor-element-ie97mr9{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overlay-opacity:0.89;--border-radius:0px 0px 150px 0px;--padding-top:200px;--padding-bottom:120px;--padding-left:30px;--padding-right:30px;}.elementor-3722 .elementor-element.elementor-element-ie97mr9:not(.elementor-motion-effects-element-type-background), .elementor-3722 .elementor-element.elementor-element-ie97mr9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://man1mojokerto.sch.id/wp-content/uploads/2026/08/Desain-tanpa-judul-8.png");background-position:center right;background-repeat:no-repeat;background-size:cover;}.elementor-3722 .elementor-element.elementor-element-ie97mr9::before, .elementor-3722 .elementor-element.elementor-element-ie97mr9 > .elementor-background-video-container::before, .elementor-3722 .elementor-element.elementor-element-ie97mr9 > .e-con-inner > .elementor-background-video-container::before, .elementor-3722 .elementor-element.elementor-element-ie97mr9 > .elementor-background-slideshow::before, .elementor-3722 .elementor-element.elementor-element-ie97mr9 > .e-con-inner > .elementor-background-slideshow::before, .elementor-3722 .elementor-element.elementor-element-ie97mr9 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(270deg, #00799173 34%, #007991 66%);}.elementor-3722 .elementor-element.elementor-element-a7138c8{--display:flex;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:45%;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3722 .elementor-element.elementor-element-57a484e .elementor-icon-list-icon i{color:var( --e-global-color-astglobalcolor0 );transition:color 0.3s;}.elementor-3722 .elementor-element.elementor-element-57a484e .elementor-icon-list-icon svg{fill:var( --e-global-color-astglobalcolor0 );transition:fill 0.3s;}.elementor-3722 .elementor-element.elementor-element-57a484e{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-3722 .elementor-element.elementor-element-57a484e .elementor-icon-list-item > .elementor-icon-list-text, .elementor-3722 .elementor-element.elementor-element-57a484e .elementor-icon-list-item > a{font-size:14px;text-transform:uppercase;letter-spacing:1px;}.elementor-3722 .elementor-element.elementor-element-57a484e .elementor-icon-list-text{color:#ecf0f2;transition:color 0.3s;}.elementor-3722 .elementor-element.elementor-element-e7daea1 .hfe-infocard{text-align:left;}.elementor-3722 .elementor-element.elementor-element-e7daea1 .hfe-infocard-title{font-family:"Noto Serif Dogra", Sans-serif;text-transform:uppercase;color:#FFFFFF;margin:0px 0px 30px 0px;}.elementor-3722 .elementor-element.elementor-element-e7daea1 .hfe-infocard-text{font-size:16px;text-transform:uppercase;line-height:25px;color:#FFFFFF;margin:0px 0px 30px 0px;}.elementor-3722 .elementor-element.elementor-element-18a581f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3722 .elementor-element.elementor-element-91dfb09{width:auto;max-width:auto;align-self:center;}.elementor-3722 .elementor-element.elementor-element-91dfb09 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-f914389 .elementor-button{background-color:#02010100;fill:#ffffff;color:#ffffff;border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-f914389{width:auto;max-width:auto;align-self:center;}.elementor-3722 .elementor-element.elementor-element-f914389 > .elementor-widget-container{margin:0px 0px 0px 40px;padding:0px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-f914389 .elementor-button-content-wrapper{flex-direction:row;}.elementor-3722 .elementor-element.elementor-element-f914389 .elementor-button .elementor-button-content-wrapper{gap:10px;}.elementor-3722 .elementor-element.elementor-element-f914389 .elementor-button:hover, .elementor-3722 .elementor-element.elementor-element-f914389 .elementor-button:focus{color:var( --e-global-color-astglobalcolor0 );}.elementor-3722 .elementor-element.elementor-element-f914389 .elementor-button:hover svg, .elementor-3722 .elementor-element.elementor-element-f914389 .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor0 );}.elementor-3722 .elementor-element.elementor-element-hxyphnr > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-3722 .elementor-element.elementor-element-hxyphnr:not(.elementor-motion-effects-element-type-background), .elementor-3722 .elementor-element.elementor-element-hxyphnr > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0079910A;}.elementor-3722 .elementor-element.elementor-element-hxyphnr{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:100px 0px 100px 0px;}.elementor-3722 .elementor-element.elementor-element-hxyphnr > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-3722 .elementor-element.elementor-element-578cd3f > .elementor-element-populated{margin:0px 50px 0px 0px;--e-column-margin-right:50px;--e-column-margin-left:0px;}.elementor-3722 .elementor-element.elementor-element-df394e7 > .elementor-widget-container{padding:19px 19px 19px 19px;}.elementor-3722 .elementor-element.elementor-element-df394e7.exad-glass-effect-yes.elementor-section{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}.elementor-3722 .elementor-element.elementor-element-df394e7.exad-glass-effect-yes > .elementor-column-wrap{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}.elementor-3722 .elementor-element.elementor-element-df394e7.exad-glass-effect-yes > .elementor-widget-container{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}.elementor-3722 .elementor-element.elementor-element-df394e7 .elementor-image-box-title{font-family:"Open Sans Hebrew Condensed", Sans-serif;font-size:44px;text-transform:capitalize;font-style:normal;color:var( --e-global-color-02138d9 );}.elementor-3722 .elementor-element.elementor-element-df394e7 .elementor-image-box-description{color:var( --e-global-color-text );}.elementor-3722 .elementor-element.elementor-element-041f7c0 > .elementor-widget-container{background-color:var( --e-global-color-02138d9 );margin:5px 5px 5px 5px;padding:30px 30px 30px 30px;border-radius:15px 15px 15px 15px;box-shadow:0px 7px 20px 0px rgba(0, 0, 0, 0.07);}.elementor-3722 .elementor-element.elementor-element-041f7c0:hover .elementor-widget-container{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-3722 .elementor-element.elementor-element-041f7c0 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:25px;}.elementor-3722 .elementor-element.elementor-element-041f7c0 .elementor-icon-box-title{margin-block-end:5px;color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-framed .elementor-icon, .elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-default .elementor-icon{fill:#FFFFFF;color:#FFFFFF;border-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-stacked:has(:hover) .elementor-icon,
					 .elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-stacked:has(:focus) .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-framed:has(:hover) .elementor-icon,
					 .elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-default:has(:hover) .elementor-icon,
					 .elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-framed:has(:focus) .elementor-icon,
					 .elementor-3722 .elementor-element.elementor-element-041f7c0.elementor-view-default:has(:focus) .elementor-icon{fill:var( --e-global-color-secondary );color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-3722 .elementor-element.elementor-element-041f7c0 .elementor-icon{font-size:24px;padding:18px;border-width:2px 2px 2px 2px;}.elementor-3722 .elementor-element.elementor-element-041f7c0 .elementor-icon-box-title, .elementor-3722 .elementor-element.elementor-element-041f7c0 .elementor-icon-box-title a{font-family:"Open Sans Hebrew Condensed", Sans-serif;font-size:28px;font-weight:700;text-transform:capitalize;}.elementor-3722 .elementor-element.elementor-element-041f7c0 .elementor-icon-box-description{font-family:"Open Sans Hebrew Condensed", Sans-serif;color:#BDBDBD;}.elementor-3722 .elementor-element.elementor-element-16a9e09 > .elementor-widget-container{background-color:var( --e-global-color-secondary );margin:5px 5px 5px 5px;padding:30px 30px 30px 30px;border-radius:15px 15px 15px 15px;box-shadow:0px 7px 20px 0px rgba(0, 0, 0, 0.07);}.elementor-3722 .elementor-element.elementor-element-16a9e09:hover .elementor-widget-container{background-color:var( --e-global-color-astglobalcolor3 );}.elementor-3722 .elementor-element.elementor-element-16a9e09 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:19px;}.elementor-3722 .elementor-element.elementor-element-16a9e09 .elementor-icon-box-title{margin-block-end:5px;color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-6f6bd1a4 );}.elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-framed .elementor-icon, .elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-default .elementor-icon{fill:var( --e-global-color-6f6bd1a4 );color:var( --e-global-color-6f6bd1a4 );border-color:var( --e-global-color-6f6bd1a4 );}.elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-stacked:has(:hover) .elementor-icon,
					 .elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-stacked:has(:focus) .elementor-icon{background-color:var( --e-global-color-02138d9 );}.elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-framed:has(:hover) .elementor-icon,
					 .elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-default:has(:hover) .elementor-icon,
					 .elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-framed:has(:focus) .elementor-icon,
					 .elementor-3722 .elementor-element.elementor-element-16a9e09.elementor-view-default:has(:focus) .elementor-icon{fill:var( --e-global-color-02138d9 );color:var( --e-global-color-02138d9 );border-color:var( --e-global-color-02138d9 );}.elementor-3722 .elementor-element.elementor-element-16a9e09 .elementor-icon{font-size:30px;padding:11px;border-width:2px 2px 2px 2px;}.elementor-3722 .elementor-element.elementor-element-16a9e09 .elementor-icon-box-title, .elementor-3722 .elementor-element.elementor-element-16a9e09 .elementor-icon-box-title a{font-size:35px;font-weight:500;text-transform:capitalize;}.elementor-3722 .elementor-element.elementor-element-16a9e09 .elementor-icon-box-description{font-size:16px;color:#BDBDBD;}.elementor-3722 .elementor-element.elementor-element-441b386 > .elementor-widget-container{background-color:var( --e-global-color-secondary );margin:5px 5px 5px 5px;padding:30px 30px 30px 30px;border-radius:15px 15px 15px 15px;box-shadow:0px 7px 20px 0px rgba(0, 0, 0, 0.07);}.elementor-3722 .elementor-element.elementor-element-441b386:hover .elementor-widget-container{background-color:var( --e-global-color-astglobalcolor3 );}.elementor-3722 .elementor-element.elementor-element-441b386 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:20px;}.elementor-3722 .elementor-element.elementor-element-441b386 .elementor-icon-box-title{margin-block-end:0px;color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-441b386.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-441b386.elementor-view-framed .elementor-icon, .elementor-3722 .elementor-element.elementor-element-441b386.elementor-view-default .elementor-icon{fill:#FFFFFF;color:#FFFFFF;border-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-441b386 .elementor-icon{font-size:30px;padding:11px;border-width:2px 2px 2px 2px;}.elementor-3722 .elementor-element.elementor-element-441b386 .elementor-icon-box-title, .elementor-3722 .elementor-element.elementor-element-441b386 .elementor-icon-box-title a{font-size:32px;font-weight:500;text-transform:capitalize;}.elementor-3722 .elementor-element.elementor-element-441b386 .elementor-icon-box-description{color:#BDBDBD;}.elementor-3722 .elementor-element.elementor-element-c11b9cc > .elementor-widget-container{background-color:var( --e-global-color-02138d9 );margin:5px 5px 5px 5px;padding:30px 30px 30px 30px;border-radius:15px 15px 15px 15px;box-shadow:0px 7px 20px 0px rgba(0, 0, 0, 0.07);}.elementor-3722 .elementor-element.elementor-element-c11b9cc:hover .elementor-widget-container{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-3722 .elementor-element.elementor-element-c11b9cc .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:26px;}.elementor-3722 .elementor-element.elementor-element-c11b9cc .elementor-icon-box-title{margin-block-end:0px;color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-c11b9cc.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-c11b9cc.elementor-view-framed .elementor-icon, .elementor-3722 .elementor-element.elementor-element-c11b9cc.elementor-view-default .elementor-icon{fill:#FFFFFF;color:#FFFFFF;border-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-c11b9cc .elementor-icon{font-size:26px;padding:18px;border-width:2px 2px 2px 2px;}.elementor-3722 .elementor-element.elementor-element-c11b9cc .elementor-icon-box-title, .elementor-3722 .elementor-element.elementor-element-c11b9cc .elementor-icon-box-title a{font-size:47px;font-weight:500;text-transform:capitalize;letter-spacing:1.6px;}.elementor-3722 .elementor-element.elementor-element-c11b9cc .elementor-icon-box-description{color:#BDBDBD;}.elementor-3722 .elementor-element.elementor-element-a30549c{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-3722 .elementor-element.elementor-element-8189ad7{--display:flex;}.elementor-3722 .elementor-element.elementor-element-66ad19f{--display:flex;}.elementor-3722 .elementor-element.elementor-element-dc2388e{--display:flex;}.elementor-3722 .elementor-element.elementor-element-6b6b967{--display:flex;}.elementor-3722 .elementor-element.elementor-element-f972970{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-cc33228{--display:flex;}.elementor-3722 .elementor-element.elementor-element-ced3aa0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-327560a .e-gallery-item:hover .elementor-gallery-item__overlay, .elementor-3722 .elementor-element.elementor-element-327560a .e-gallery-item:focus .elementor-gallery-item__overlay{background-color:rgba(0,0,0,0.5);}.elementor-3722 .elementor-element.elementor-element-327560a{--image-transition-duration:800ms;--overlay-transition-duration:800ms;--content-text-align:center;--content-padding:20px;--content-transition-duration:800ms;--content-transition-delay:800ms;}.elementor-3722 .elementor-element.elementor-element-c3f9843{--n-tabs-heading-wrap:wrap;--n-tabs-heading-overflow-x:initial;--n-tabs-title-white-space:initial;}.elementor-3722 .elementor-element.elementor-element-4ee524cd{--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;--align-items:stretch;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--padding-top:111px;--padding-bottom:25px;--padding-left:15px;--padding-right:15px;}.elementor-3722 .elementor-element.elementor-element-46e7a7c1 > .elementor-widget-container{margin:0px 0px 40px 0px;}.elementor-3722 .elementor-element.elementor-element-46e7a7c1 .elementskit-section-title-wraper .elementskit-section-title{margin:0px 0px -22px 0px;font-family:"Open Sans Hebrew Condensed", Sans-serif;font-size:65px;font-weight:500;text-transform:capitalize;}.elementor-3722 .elementor-element.elementor-element-46e7a7c1 .elementskit-section-title-wraper .elementskit-section-title > span{color:#000000;}.elementor-3722 .elementor-element.elementor-element-46e7a7c1 .elementskit-section-title-wraper .elementskit-section-title:hover > span{color:#000000;}.elementor-3722 .elementor-element.elementor-element-46e7a7c1 .elementskit-section-title-wraper .elementskit-section-title span:last-child, .elementor-3722 .elementor-element.elementor-element-46e7a7c1 .elementskit-section-title-wraper .elementskit-section-title > span{font-family:"Heebo", Sans-serif;font-size:50px;font-weight:700;}.elementor-3722 .elementor-element.elementor-element-00efb29{--grid-row-gap:9px;--grid-column-gap:12px;}.elementor-3722 .elementor-element.elementor-element-00efb29 > .elementor-widget-container{background-color:var( --e-global-color-astglobalcolor6 );margin:3px 3px 3px 3px;padding:8px 8px 8px 8px;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-3722 .elementor-element.elementor-element-00efb29:after{content:"0.66";}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__thumbnail__link{width:100%;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__meta-data span + span:before{content:"•";}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__card{background-color:#00799100;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__text{padding:0 5px;margin-top:20px;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__meta-data{padding:10px 5px;text-transform:uppercase;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__avatar{padding-right:5px;padding-left:5px;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__badge{right:0;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__card .elementor-post__badge{margin:20px;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__title, .elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__title a{color:var( --e-global-color-primary );font-family:"Open Sans Hebrew Condensed", Sans-serif;font-size:17px;text-transform:capitalize;font-style:oblique;line-height:18px;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__title{margin-bottom:9px;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__read-more{color:var( --e-global-color-5da9ef4f );}.elementor-3722 .elementor-element.elementor-element-eaea6ae{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-e7cd4cc{--display:flex;--overlay-opacity:0.5;}.elementor-3722 .elementor-element.elementor-element-e7cd4cc::before, .elementor-3722 .elementor-element.elementor-element-e7cd4cc > .elementor-background-video-container::before, .elementor-3722 .elementor-element.elementor-element-e7cd4cc > .e-con-inner > .elementor-background-video-container::before, .elementor-3722 .elementor-element.elementor-element-e7cd4cc > .elementor-background-slideshow::before, .elementor-3722 .elementor-element.elementor-element-e7cd4cc > .e-con-inner > .elementor-background-slideshow::before, .elementor-3722 .elementor-element.elementor-element-e7cd4cc > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-3722 .elementor-element.elementor-element-90251fd.exad-glass-effect-yes.elementor-section{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}.elementor-3722 .elementor-element.elementor-element-90251fd.exad-glass-effect-yes > .elementor-column-wrap{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}.elementor-3722 .elementor-element.elementor-element-90251fd.exad-glass-effect-yes > .elementor-widget-container{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}.elementor-3722 .elementor-element.elementor-element-a2e0b35{--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;--align-items:stretch;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--padding-top:111px;--padding-bottom:25px;--padding-left:15px;--padding-right:15px;}.elementor-3722 .elementor-element.elementor-element-4512921 > .elementor-widget-container{margin:0px 0px 40px 0px;}.elementor-3722 .elementor-element.elementor-element-4512921 .elementskit-section-title-wraper .elementskit-section-title{margin:0px 0px -22px 0px;font-family:"Open Sans Hebrew Condensed", Sans-serif;font-size:65px;font-weight:500;text-transform:capitalize;}.elementor-3722 .elementor-element.elementor-element-4512921 .elementskit-section-title-wraper .elementskit-section-title > span{color:#000000;}.elementor-3722 .elementor-element.elementor-element-4512921 .elementskit-section-title-wraper .elementskit-section-title:hover > span{color:#000000;}.elementor-3722 .elementor-element.elementor-element-4512921 .elementskit-section-title-wraper .elementskit-section-title span:last-child, .elementor-3722 .elementor-element.elementor-element-4512921 .elementskit-section-title-wraper .elementskit-section-title > span{font-family:"Heebo", Sans-serif;font-size:50px;font-weight:700;}.elementor-3722 .elementor-element.elementor-element-f379a45{--grid-row-gap:9px;--grid-column-gap:12px;}.elementor-3722 .elementor-element.elementor-element-f379a45 > .elementor-widget-container{background-color:var( --e-global-color-astglobalcolor6 );margin:3px 3px 3px 3px;padding:8px 8px 8px 8px;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-3722 .elementor-element.elementor-element-f379a45:after{content:"0.66";}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__thumbnail__link{width:100%;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__meta-data span + span:before{content:"•";}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__card{background-color:#00799100;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__text{padding:0 5px;margin-top:20px;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__meta-data{padding:10px 5px;text-transform:uppercase;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__avatar{padding-right:5px;padding-left:5px;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__badge{right:0;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__card .elementor-post__badge{margin:20px;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__title, .elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__title a{color:var( --e-global-color-primary );font-family:"Open Sans Hebrew Condensed", Sans-serif;font-size:17px;text-transform:capitalize;font-style:oblique;line-height:18px;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__title{margin-bottom:9px;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__read-more{color:var( --e-global-color-5da9ef4f );}.elementor-3722 .elementor-element.elementor-element-39ff097{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;}.elementor-3722 .elementor-element.elementor-element-45db302{width:100%;max-width:100%;}.elementor-3722 .elementor-element.elementor-element-eb8b821{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-3722 .elementor-element.elementor-element-d185be3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-95ea250{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-d2dadd0{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:0px 0px 0px 0px;--margin-top:-2px;--margin-bottom:-21px;--margin-left:0px;--margin-right:0px;--padding-top:14px;--padding-bottom:-9px;--padding-left:-5px;--padding-right:-5px;}.elementor-3722 .elementor-element.elementor-element-1736fd0{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-3722 .elementor-element.elementor-element-59b37c6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-59b37c6.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3722 .elementor-element.elementor-element-cdadda1 .elementskit-section-title-wraper .elementskit-section-title{color:var( --e-global-color-115ea96 );margin:15px 0px 14px 0px;font-family:"Lato", Sans-serif;font-size:58px;font-weight:800;text-transform:capitalize;line-height:38px;}.elementor-3722 .elementor-element.elementor-element-cdadda1 .elementskit-section-title-wraper .elementskit-section-title > span{color:#000000;}.elementor-3722 .elementor-element.elementor-element-cdadda1 .elementskit-section-title-wraper .elementskit-section-title:hover > span{color:#000000;}.elementor-3722 .elementor-element.elementor-element-cdadda1 .elementskit-section-title-wraper p{color:#ffffff;font-family:"Lato", Sans-serif;font-size:26px;font-weight:400;line-height:28px;margin:50px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-9ef8db3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-7d4648e > .elementor-widget-container{margin:40px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-7d4648e img{width:63%;max-width:50%;height:107px;}.elementor-3722 .elementor-element.elementor-element-3e06d1f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:5px 5px;--row-gap:5px;--column-gap:5px;--margin-top:40px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3722 .elementor-element.elementor-element-473006d img{width:48%;height:95px;}.elementor-3722 .elementor-element.elementor-element-e32266f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3722 .elementor-element.elementor-element-dfd97ae{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:flex-start;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:124px;--padding-bottom:101px;--padding-left:15px;--padding-right:15px;}.elementor-3722 .elementor-element.elementor-element-dfd97ae:not(.elementor-motion-effects-element-type-background), .elementor-3722 .elementor-element.elementor-element-dfd97ae > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://man1mojokerto.sch.id/wp-content/uploads/2025/12/events-footer-bg.webp");}.elementor-3722 .elementor-element.elementor-element-e681afe{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3722 .elementor-element.elementor-element-59ca1da > .elementor-widget-container{margin:0px 0px 20px 0px;}.elementor-3722 .elementor-element.elementor-element-59ca1da{text-align:start;}.elementor-3722 .elementor-element.elementor-element-59ca1da img{width:100%;}.elementor-3722 .elementor-element.elementor-element-64e8168 .elementskit-section-title-wraper .elementskit-section-title{color:#FFFFFF;margin:0px 0px 22px 0px;font-family:"Archivo", Sans-serif;font-size:16px;font-weight:600;line-height:27px;}.elementor-3722 .elementor-element.elementor-element-64e8168 .elementskit-section-title-wraper .elementskit-section-title > span{color:#000000;}.elementor-3722 .elementor-element.elementor-element-64e8168 .elementskit-section-title-wraper .elementskit-section-title:hover > span{color:#000000;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-da8f4de > a i{color:#3B5998;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-da8f4de > a svg{fill:#3B5998;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-da8f4de > a{background-color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-da8f4de > a:hover{background-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-c019cbf > a i{color:#3B5998;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-c019cbf > a svg{fill:#3B5998;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-c019cbf > a{background-color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-c019cbf > a:hover{background-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-571488d > a i{color:#0077B5;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-571488d > a svg{fill:#0077B5;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-571488d > a{background-color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-571488d > a:hover{background-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-01435ac > a i{color:#25D366;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-01435ac > a svg{fill:#25D366;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-01435ac > a{background-color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .elementor-repeater-item-01435ac > a:hover{background-color:#FFFFFF;}.elementor-3722 .elementor-element.elementor-element-f35ea0f > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .ekit_social_media{text-align:left;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .ekit_social_media > li > a{text-align:center;text-decoration:none;border-radius:8% 8% 8% 8%;padding:0px 0px 0px 0px;width:50px;height:50px;line-height:46px;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .ekit_social_media > li{display:inline-block;margin:0px 2px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .ekit_social_media > li > a i{font-size:18px;}.elementor-3722 .elementor-element.elementor-element-f35ea0f .ekit_social_media > li > a svg{max-width:18px;}.elementor-3722 .elementor-element.elementor-element-e4c4dae{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:40px;--padding-right:0px;}.elementor-3722 .elementor-element.elementor-element-748648c > .elementor-widget-container{margin:2px 0px 24px 0px;}.elementor-3722 .elementor-element.elementor-element-748648c .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:18px;font-weight:600;line-height:24px;color:#ffffff;}.elementor-3722 .elementor-element.elementor-element-49fb188 > .elementor-widget-container{margin:2px 0px 24px 0px;}.elementor-3722 .elementor-element.elementor-element-49fb188 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:18px;font-weight:600;line-height:24px;color:#ffffff;}.elementor-3722 .elementor-element.elementor-element-a305267 > .elementor-widget-container{margin:2px 0px 24px 0px;}.elementor-3722 .elementor-element.elementor-element-a305267 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:18px;font-weight:600;line-height:24px;color:#ffffff;}.elementor-3722 .elementor-element.elementor-element-f6813af > .elementor-widget-container{margin:2px 0px 24px 0px;}.elementor-3722 .elementor-element.elementor-element-f6813af .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:18px;font-weight:600;line-height:24px;color:#ffffff;}.elementor-3722 .elementor-element.elementor-element-4474383{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3722 .elementor-element.elementor-element-765c3de > .elementor-widget-container{margin:2px 0px 24px 0px;}.elementor-3722 .elementor-element.elementor-element-765c3de .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:18px;font-weight:600;line-height:24px;color:#ffffff;}.elementor-3722 .elementor-element.elementor-element-e44dda0{width:auto;max-width:auto;}.elementor-3722 .elementor-element.elementor-element-e44dda0.elementor-element{--align-self:center;}body.elementor-page-3722:not(.elementor-motion-effects-element-type-background), body.elementor-page-3722 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#ffffff;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-3722 .elementor-element.elementor-element-7032485{--width:8.91%;}.elementor-3722 .elementor-element.elementor-element-b3220fc{--width:83.862%;}.elementor-3722 .elementor-element.elementor-element-6f8fc19{--width:25%;}.elementor-3722 .elementor-element.elementor-element-4ee524cd{--content-width:1300px;}.elementor-3722 .elementor-element.elementor-element-a2e0b35{--content-width:1300px;}.elementor-3722 .elementor-element.elementor-element-d185be3{--width:53%;}.elementor-3722 .elementor-element.elementor-element-95ea250{--width:50%;}.elementor-3722 .elementor-element.elementor-element-d2dadd0{--width:100%;}.elementor-3722 .elementor-element.elementor-element-59b37c6{--width:71.607%;}.elementor-3722 .elementor-element.elementor-element-9ef8db3{--width:66.6666%;}.elementor-3722 .elementor-element.elementor-element-3e06d1f{--width:66.6666%;}.elementor-3722 .elementor-element.elementor-element-e681afe{--width:34%;}.elementor-3722 .elementor-element.elementor-element-e4c4dae{--width:22%;}.elementor-3722 .elementor-element.elementor-element-4474383{--width:22%;}}@media(max-width:1024px) and (min-width:768px){.elementor-3722 .elementor-element.elementor-element-a7138c8{--width:100%;}.elementor-3722 .elementor-element.elementor-element-578cd3f{width:100%;}.elementor-3722 .elementor-element.elementor-element-d912a6a{width:50%;}.elementor-3722 .elementor-element.elementor-element-111e28b{width:50%;}.elementor-3722 .elementor-element.elementor-element-e681afe{--width:33%;}.elementor-3722 .elementor-element.elementor-element-e4c4dae{--width:33%;}.elementor-3722 .elementor-element.elementor-element-4474383{--width:33%;}}@media(min-width:1025px){.elementor-3722 .elementor-element.elementor-element-ie97mr9:not(.elementor-motion-effects-element-type-background), .elementor-3722 .elementor-element.elementor-element-ie97mr9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}@media(max-width:1024px){.elementor-3722 .elementor-element.elementor-element-ie97mr9{--padding-top:150px;--padding-bottom:80px;--padding-left:50px;--padding-right:80px;}.elementor-3722 .elementor-element.elementor-element-a7138c8{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3722 .elementor-element.elementor-element-91dfb09 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-f914389 > .elementor-widget-container{margin:0px 0px 0px 30px;}.elementor-3722 .elementor-element.elementor-element-hxyphnr{padding:50px 50px 50px 50px;}.elementor-3722 .elementor-element.elementor-element-578cd3f > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-3722 .elementor-element.elementor-element-df394e7 .elementor-image-box-wrapper{text-align:center;}.elementor-3722 .elementor-element.elementor-element-041f7c0 > .elementor-widget-container{padding:15px 15px 15px 15px;}.elementor-3722 .elementor-element.elementor-element-041f7c0 .elementor-icon{font-size:20px;}.elementor-3722 .elementor-element.elementor-element-16a9e09 > .elementor-widget-container{padding:15px 15px 15px 15px;}.elementor-3722 .elementor-element.elementor-element-16a9e09 .elementor-icon{font-size:20px;}.elementor-3722 .elementor-element.elementor-element-441b386 > .elementor-widget-container{padding:15px 15px 15px 15px;}.elementor-3722 .elementor-element.elementor-element-441b386 .elementor-icon{font-size:20px;}.elementor-3722 .elementor-element.elementor-element-c11b9cc > .elementor-widget-container{padding:15px 15px 15px 15px;}.elementor-3722 .elementor-element.elementor-element-c11b9cc .elementor-icon{font-size:20px;}.elementor-3722 .elementor-element.elementor-element-cdadda1 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-dfd97ae{--flex-wrap:wrap;}.elementor-3722 .elementor-element.elementor-element-e4c4dae{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(max-width:767px){.elementor-3722 .elementor-element.elementor-element-ie97mr9{--border-radius:0px 0px 75px 0px;--padding-top:100px;--padding-bottom:60px;--padding-left:25px;--padding-right:30px;}.elementor-3722 .elementor-element.elementor-element-a7138c8{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3722 .elementor-element.elementor-element-e7daea1 .hfe-infocard-text{font-size:15px;}.elementor-3722 .elementor-element.elementor-element-91dfb09 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3722 .elementor-element.elementor-element-91dfb09{align-self:center;}.elementor-3722 .elementor-element.elementor-element-f914389 > .elementor-widget-container{margin:0px 0px 0px 20px;}.elementor-3722 .elementor-element.elementor-element-f914389{align-self:center;}.elementor-3722 .elementor-element.elementor-element-hxyphnr{padding:60px 25px 60px 25px;}.elementor-3722 .elementor-element.elementor-element-041f7c0 > .elementor-widget-container{padding:30px 30px 30px 30px;}.elementor-3722 .elementor-element.elementor-element-041f7c0 .elementor-icon-box-wrapper{text-align:center;}.elementor-3722 .elementor-element.elementor-element-16a9e09 > .elementor-widget-container{padding:30px 30px 30px 30px;}.elementor-3722 .elementor-element.elementor-element-16a9e09 .elementor-icon-box-wrapper{text-align:center;}.elementor-3722 .elementor-element.elementor-element-441b386 > .elementor-widget-container{padding:30px 30px 30px 30px;}.elementor-3722 .elementor-element.elementor-element-441b386 .elementor-icon-box-wrapper{text-align:center;}.elementor-3722 .elementor-element.elementor-element-c11b9cc > .elementor-widget-container{padding:30px 30px 30px 30px;}.elementor-3722 .elementor-element.elementor-element-c11b9cc .elementor-icon-box-wrapper{text-align:center;}.elementor-3722 .elementor-element.elementor-element-4ee524cd{--padding-top:110px;--padding-bottom:25px;--padding-left:10px;--padding-right:10px;}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-3722 .elementor-element.elementor-element-00efb29:after{content:"0.5";}.elementor-3722 .elementor-element.elementor-element-00efb29 .elementor-post__thumbnail__link{width:100%;}.elementor-3722 .elementor-element.elementor-element-a2e0b35{--padding-top:110px;--padding-bottom:25px;--padding-left:10px;--padding-right:10px;}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-3722 .elementor-element.elementor-element-f379a45:after{content:"0.5";}.elementor-3722 .elementor-element.elementor-element-f379a45 .elementor-post__thumbnail__link{width:100%;}.elementor-3722 .elementor-element.elementor-element-cdadda1 .elementskit-section-title-wraper .elementskit-section-title{font-size:32px;}.elementor-3722 .elementor-element.elementor-element-dfd97ae{--margin-top:200px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3722 .elementor-element.elementor-element-e681afe{--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-3722 .elementor-element.elementor-element-e4c4dae{--padding-top:40px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-3722 .elementor-element.elementor-element-4474383{--padding-top:40px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}}/* Start custom CSS for html, class: .elementor-element-f4b1127 *//*============================
STRUKTUR ORGANISASI
=============================*/

.struktur-organisasi{

padding:70px 20px;

max-width:1400px;

margin:auto;

}

.org-tree{

display:flex;

flex-direction:column;

align-items:center;

gap:35px;

}

.level{

display:flex;

justify-content:center;

gap:30px;

flex-wrap:wrap;

width:100%;

position:relative;

}

.node{

min-width:220px;

padding:18px 24px;

text-align:center;

background:#fff;

border-radius:18px;

font-weight:700;

color:#21443C;

box-shadow:0 10px 30px rgba(0,0,0,.08);

border-top:4px solid #0B8F73;

transition:.3s;

}

.node:hover{

transform:translateY(-6px);

box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.utama{

background:linear-gradient(135deg,#0B8F73,#159E92);

color:#fff;

font-size:22px;

min-width:320px;

border:none;

}

.utama2{

background:#FFD56A;

color:#21443C;

font-size:20px;

min-width:360px;

border:none;

}

.three{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.four{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.six{

display:grid;

grid-template-columns:repeat(6,1fr);

gap:18px;

}

@media(max-width:1100px){

.three,
.four,
.six{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.three,
.four,
.six{

grid-template-columns:1fr;

}

.node{

width:100%;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-65414b1 *//*=====================================
LAYANAN AKADEMIK
=====================================*/

.layanan-section{

margin-top:80px;

}

.layanan-section p{

max-width:720px;

margin:15px auto 0;

text-align:center;

line-height:1.8;

color:#6c757d;

}

.layanan-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

margin-top:45px;

}

.layanan-card{

display:block;

text-decoration:none;

background:#ffffff;

padding:35px;

border-radius:24px;

box-shadow:0 18px 40px rgba(0,0,0,.08);

border:1px solid rgba(0,0,0,.04);

transition:.35s;

position:relative;

overflow:hidden;

}

.layanan-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(90deg,#0B8F73,#19A79A,#FFD56A);

}

.layanan-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,.12);

}

.layanan-icon{

width:70px;

height:70px;

margin-bottom:25px;

border-radius:18px;

display:flex;

justify-content:center;

align-items:center;

font-size:30px;

background:linear-gradient(135deg,#0B8F73,#19A79A);

color:#fff;

box-shadow:0 15px 25px rgba(11,143,115,.20);

}

.layanan-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.layanan-card p{

margin:0;

text-align:left;

font-size:15px;

line-height:1.8;

color:#666;

}

.layanan-card span{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:20px;

font-weight:700;

color:#0B8F73;

}

.layanan-card span i{

transition:.3s;

}

.layanan-card:hover span i{

transform:translateX(5px);

}

/* Tablet */

@media(max-width:1024px){

.layanan-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.layanan-grid{

grid-template-columns:1fr;

}

.layanan-card{

padding:28px;

}

.layanan-card h3{

font-size:20px;

}

.layanan-icon{

width:60px;

height:60px;

font-size:24px;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-4f3937f *//* =====================================================
   KESISWAA MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}

/*=========================================
QUICK MENU
=========================================*/

.quick-menu{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin:-40px auto 70px;

position:relative;

z-index:20;

}

.menu-card{

background:rgba(255,255,255,.92);

backdrop-filter:blur(15px);

padding:30px;

border-radius:22px;

text-align:center;

transition:.35s;

box-shadow:

0 15px 40px rgba(0,0,0,.08);

border:1px solid rgba(255,255,255,.45);

}

.menu-card:hover{

transform:translateY(-10px);

}

.menu-icon{

width:72px;

height:72px;

margin:auto;

margin-bottom:20px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:

linear-gradient(135deg,#0B8F73,#19A79A);

color:white;

font-size:28px;

box-shadow:

0 15px 30px rgba(11,143,115,.25);

}

.menu-card h3{

margin:0;

margin-bottom:10px;

font-size:22px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.menu-card p{

font-size:15px;

line-height:1.7;

color:#666;

margin-bottom:18px;

}

.menu-card a{

text-decoration:none;

font-weight:700;

color:#0B8F73;

transition:.3s;

}

.menu-card a i{

margin-left:6px;

transition:.3s;

}

.menu-card:hover a i{

transform:translateX(5px);

}


/*=========================
RESPONSIVE
=========================*/

@media(max-width:1024px){

.quick-menu{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.quick-menu{

grid-template-columns:1fr;

margin-top:30px;

}

.menu-card{

padding:25px;

}

.menu-icon{

width:60px;

height:60px;

font-size:24px;

}

.menu-card h3{

font-size:20px;

}
}

/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-52324ea *//* =====================================================
   KEHUMASAN MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}


/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for gallery, class: .elementor-element-327560a *//*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f4b1127 *//*============================
STRUKTUR ORGANISASI
=============================*/

.struktur-organisasi{

padding:70px 20px;

max-width:1400px;

margin:auto;

}

.org-tree{

display:flex;

flex-direction:column;

align-items:center;

gap:35px;

}

.level{

display:flex;

justify-content:center;

gap:30px;

flex-wrap:wrap;

width:100%;

position:relative;

}

.node{

min-width:220px;

padding:18px 24px;

text-align:center;

background:#fff;

border-radius:18px;

font-weight:700;

color:#21443C;

box-shadow:0 10px 30px rgba(0,0,0,.08);

border-top:4px solid #0B8F73;

transition:.3s;

}

.node:hover{

transform:translateY(-6px);

box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.utama{

background:linear-gradient(135deg,#0B8F73,#159E92);

color:#fff;

font-size:22px;

min-width:320px;

border:none;

}

.utama2{

background:#FFD56A;

color:#21443C;

font-size:20px;

min-width:360px;

border:none;

}

.three{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.four{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.six{

display:grid;

grid-template-columns:repeat(6,1fr);

gap:18px;

}

@media(max-width:1100px){

.three,
.four,
.six{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.three,
.four,
.six{

grid-template-columns:1fr;

}

.node{

width:100%;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-65414b1 *//*=====================================
LAYANAN AKADEMIK
=====================================*/

.layanan-section{

margin-top:80px;

}

.layanan-section p{

max-width:720px;

margin:15px auto 0;

text-align:center;

line-height:1.8;

color:#6c757d;

}

.layanan-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

margin-top:45px;

}

.layanan-card{

display:block;

text-decoration:none;

background:#ffffff;

padding:35px;

border-radius:24px;

box-shadow:0 18px 40px rgba(0,0,0,.08);

border:1px solid rgba(0,0,0,.04);

transition:.35s;

position:relative;

overflow:hidden;

}

.layanan-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(90deg,#0B8F73,#19A79A,#FFD56A);

}

.layanan-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,.12);

}

.layanan-icon{

width:70px;

height:70px;

margin-bottom:25px;

border-radius:18px;

display:flex;

justify-content:center;

align-items:center;

font-size:30px;

background:linear-gradient(135deg,#0B8F73,#19A79A);

color:#fff;

box-shadow:0 15px 25px rgba(11,143,115,.20);

}

.layanan-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.layanan-card p{

margin:0;

text-align:left;

font-size:15px;

line-height:1.8;

color:#666;

}

.layanan-card span{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:20px;

font-weight:700;

color:#0B8F73;

}

.layanan-card span i{

transition:.3s;

}

.layanan-card:hover span i{

transform:translateX(5px);

}

/* Tablet */

@media(max-width:1024px){

.layanan-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.layanan-grid{

grid-template-columns:1fr;

}

.layanan-card{

padding:28px;

}

.layanan-card h3{

font-size:20px;

}

.layanan-icon{

width:60px;

height:60px;

font-size:24px;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-4f3937f *//* =====================================================
   KESISWAA MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}

/*=========================================
QUICK MENU
=========================================*/

.quick-menu{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin:-40px auto 70px;

position:relative;

z-index:20;

}

.menu-card{

background:rgba(255,255,255,.92);

backdrop-filter:blur(15px);

padding:30px;

border-radius:22px;

text-align:center;

transition:.35s;

box-shadow:

0 15px 40px rgba(0,0,0,.08);

border:1px solid rgba(255,255,255,.45);

}

.menu-card:hover{

transform:translateY(-10px);

}

.menu-icon{

width:72px;

height:72px;

margin:auto;

margin-bottom:20px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:

linear-gradient(135deg,#0B8F73,#19A79A);

color:white;

font-size:28px;

box-shadow:

0 15px 30px rgba(11,143,115,.25);

}

.menu-card h3{

margin:0;

margin-bottom:10px;

font-size:22px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.menu-card p{

font-size:15px;

line-height:1.7;

color:#666;

margin-bottom:18px;

}

.menu-card a{

text-decoration:none;

font-weight:700;

color:#0B8F73;

transition:.3s;

}

.menu-card a i{

margin-left:6px;

transition:.3s;

}

.menu-card:hover a i{

transform:translateX(5px);

}


/*=========================
RESPONSIVE
=========================*/

@media(max-width:1024px){

.quick-menu{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.quick-menu{

grid-template-columns:1fr;

margin-top:30px;

}

.menu-card{

padding:25px;

}

.menu-icon{

width:60px;

height:60px;

font-size:24px;

}

.menu-card h3{

font-size:20px;

}
}

/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-52324ea *//* =====================================================
   KEHUMASAN MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}


/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for gallery, class: .elementor-element-327560a *//*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f4b1127 *//*============================
STRUKTUR ORGANISASI
=============================*/

.struktur-organisasi{

padding:70px 20px;

max-width:1400px;

margin:auto;

}

.org-tree{

display:flex;

flex-direction:column;

align-items:center;

gap:35px;

}

.level{

display:flex;

justify-content:center;

gap:30px;

flex-wrap:wrap;

width:100%;

position:relative;

}

.node{

min-width:220px;

padding:18px 24px;

text-align:center;

background:#fff;

border-radius:18px;

font-weight:700;

color:#21443C;

box-shadow:0 10px 30px rgba(0,0,0,.08);

border-top:4px solid #0B8F73;

transition:.3s;

}

.node:hover{

transform:translateY(-6px);

box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.utama{

background:linear-gradient(135deg,#0B8F73,#159E92);

color:#fff;

font-size:22px;

min-width:320px;

border:none;

}

.utama2{

background:#FFD56A;

color:#21443C;

font-size:20px;

min-width:360px;

border:none;

}

.three{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.four{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.six{

display:grid;

grid-template-columns:repeat(6,1fr);

gap:18px;

}

@media(max-width:1100px){

.three,
.four,
.six{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.three,
.four,
.six{

grid-template-columns:1fr;

}

.node{

width:100%;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-65414b1 *//*=====================================
LAYANAN AKADEMIK
=====================================*/

.layanan-section{

margin-top:80px;

}

.layanan-section p{

max-width:720px;

margin:15px auto 0;

text-align:center;

line-height:1.8;

color:#6c757d;

}

.layanan-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

margin-top:45px;

}

.layanan-card{

display:block;

text-decoration:none;

background:#ffffff;

padding:35px;

border-radius:24px;

box-shadow:0 18px 40px rgba(0,0,0,.08);

border:1px solid rgba(0,0,0,.04);

transition:.35s;

position:relative;

overflow:hidden;

}

.layanan-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(90deg,#0B8F73,#19A79A,#FFD56A);

}

.layanan-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,.12);

}

.layanan-icon{

width:70px;

height:70px;

margin-bottom:25px;

border-radius:18px;

display:flex;

justify-content:center;

align-items:center;

font-size:30px;

background:linear-gradient(135deg,#0B8F73,#19A79A);

color:#fff;

box-shadow:0 15px 25px rgba(11,143,115,.20);

}

.layanan-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.layanan-card p{

margin:0;

text-align:left;

font-size:15px;

line-height:1.8;

color:#666;

}

.layanan-card span{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:20px;

font-weight:700;

color:#0B8F73;

}

.layanan-card span i{

transition:.3s;

}

.layanan-card:hover span i{

transform:translateX(5px);

}

/* Tablet */

@media(max-width:1024px){

.layanan-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.layanan-grid{

grid-template-columns:1fr;

}

.layanan-card{

padding:28px;

}

.layanan-card h3{

font-size:20px;

}

.layanan-icon{

width:60px;

height:60px;

font-size:24px;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-4f3937f *//* =====================================================
   KESISWAA MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}

/*=========================================
QUICK MENU
=========================================*/

.quick-menu{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin:-40px auto 70px;

position:relative;

z-index:20;

}

.menu-card{

background:rgba(255,255,255,.92);

backdrop-filter:blur(15px);

padding:30px;

border-radius:22px;

text-align:center;

transition:.35s;

box-shadow:

0 15px 40px rgba(0,0,0,.08);

border:1px solid rgba(255,255,255,.45);

}

.menu-card:hover{

transform:translateY(-10px);

}

.menu-icon{

width:72px;

height:72px;

margin:auto;

margin-bottom:20px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:

linear-gradient(135deg,#0B8F73,#19A79A);

color:white;

font-size:28px;

box-shadow:

0 15px 30px rgba(11,143,115,.25);

}

.menu-card h3{

margin:0;

margin-bottom:10px;

font-size:22px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.menu-card p{

font-size:15px;

line-height:1.7;

color:#666;

margin-bottom:18px;

}

.menu-card a{

text-decoration:none;

font-weight:700;

color:#0B8F73;

transition:.3s;

}

.menu-card a i{

margin-left:6px;

transition:.3s;

}

.menu-card:hover a i{

transform:translateX(5px);

}


/*=========================
RESPONSIVE
=========================*/

@media(max-width:1024px){

.quick-menu{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.quick-menu{

grid-template-columns:1fr;

margin-top:30px;

}

.menu-card{

padding:25px;

}

.menu-icon{

width:60px;

height:60px;

font-size:24px;

}

.menu-card h3{

font-size:20px;

}
}

/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-52324ea *//* =====================================================
   KEHUMASAN MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}


/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for gallery, class: .elementor-element-327560a *//*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f4b1127 *//*============================
STRUKTUR ORGANISASI
=============================*/

.struktur-organisasi{

padding:70px 20px;

max-width:1400px;

margin:auto;

}

.org-tree{

display:flex;

flex-direction:column;

align-items:center;

gap:35px;

}

.level{

display:flex;

justify-content:center;

gap:30px;

flex-wrap:wrap;

width:100%;

position:relative;

}

.node{

min-width:220px;

padding:18px 24px;

text-align:center;

background:#fff;

border-radius:18px;

font-weight:700;

color:#21443C;

box-shadow:0 10px 30px rgba(0,0,0,.08);

border-top:4px solid #0B8F73;

transition:.3s;

}

.node:hover{

transform:translateY(-6px);

box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.utama{

background:linear-gradient(135deg,#0B8F73,#159E92);

color:#fff;

font-size:22px;

min-width:320px;

border:none;

}

.utama2{

background:#FFD56A;

color:#21443C;

font-size:20px;

min-width:360px;

border:none;

}

.three{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.four{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.six{

display:grid;

grid-template-columns:repeat(6,1fr);

gap:18px;

}

@media(max-width:1100px){

.three,
.four,
.six{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.three,
.four,
.six{

grid-template-columns:1fr;

}

.node{

width:100%;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-65414b1 *//*=====================================
LAYANAN AKADEMIK
=====================================*/

.layanan-section{

margin-top:80px;

}

.layanan-section p{

max-width:720px;

margin:15px auto 0;

text-align:center;

line-height:1.8;

color:#6c757d;

}

.layanan-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

margin-top:45px;

}

.layanan-card{

display:block;

text-decoration:none;

background:#ffffff;

padding:35px;

border-radius:24px;

box-shadow:0 18px 40px rgba(0,0,0,.08);

border:1px solid rgba(0,0,0,.04);

transition:.35s;

position:relative;

overflow:hidden;

}

.layanan-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(90deg,#0B8F73,#19A79A,#FFD56A);

}

.layanan-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,.12);

}

.layanan-icon{

width:70px;

height:70px;

margin-bottom:25px;

border-radius:18px;

display:flex;

justify-content:center;

align-items:center;

font-size:30px;

background:linear-gradient(135deg,#0B8F73,#19A79A);

color:#fff;

box-shadow:0 15px 25px rgba(11,143,115,.20);

}

.layanan-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.layanan-card p{

margin:0;

text-align:left;

font-size:15px;

line-height:1.8;

color:#666;

}

.layanan-card span{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:20px;

font-weight:700;

color:#0B8F73;

}

.layanan-card span i{

transition:.3s;

}

.layanan-card:hover span i{

transform:translateX(5px);

}

/* Tablet */

@media(max-width:1024px){

.layanan-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.layanan-grid{

grid-template-columns:1fr;

}

.layanan-card{

padding:28px;

}

.layanan-card h3{

font-size:20px;

}

.layanan-icon{

width:60px;

height:60px;

font-size:24px;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-4f3937f *//* =====================================================
   KESISWAA MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}

/*=========================================
QUICK MENU
=========================================*/

.quick-menu{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin:-40px auto 70px;

position:relative;

z-index:20;

}

.menu-card{

background:rgba(255,255,255,.92);

backdrop-filter:blur(15px);

padding:30px;

border-radius:22px;

text-align:center;

transition:.35s;

box-shadow:

0 15px 40px rgba(0,0,0,.08);

border:1px solid rgba(255,255,255,.45);

}

.menu-card:hover{

transform:translateY(-10px);

}

.menu-icon{

width:72px;

height:72px;

margin:auto;

margin-bottom:20px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:

linear-gradient(135deg,#0B8F73,#19A79A);

color:white;

font-size:28px;

box-shadow:

0 15px 30px rgba(11,143,115,.25);

}

.menu-card h3{

margin:0;

margin-bottom:10px;

font-size:22px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.menu-card p{

font-size:15px;

line-height:1.7;

color:#666;

margin-bottom:18px;

}

.menu-card a{

text-decoration:none;

font-weight:700;

color:#0B8F73;

transition:.3s;

}

.menu-card a i{

margin-left:6px;

transition:.3s;

}

.menu-card:hover a i{

transform:translateX(5px);

}


/*=========================
RESPONSIVE
=========================*/

@media(max-width:1024px){

.quick-menu{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.quick-menu{

grid-template-columns:1fr;

margin-top:30px;

}

.menu-card{

padding:25px;

}

.menu-icon{

width:60px;

height:60px;

font-size:24px;

}

.menu-card h3{

font-size:20px;

}
}

/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-52324ea *//* =====================================================
   KEHUMASAN MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}


/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for gallery, class: .elementor-element-327560a *//*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f4b1127 *//*============================
STRUKTUR ORGANISASI
=============================*/

.struktur-organisasi{

padding:70px 20px;

max-width:1400px;

margin:auto;

}

.org-tree{

display:flex;

flex-direction:column;

align-items:center;

gap:35px;

}

.level{

display:flex;

justify-content:center;

gap:30px;

flex-wrap:wrap;

width:100%;

position:relative;

}

.node{

min-width:220px;

padding:18px 24px;

text-align:center;

background:#fff;

border-radius:18px;

font-weight:700;

color:#21443C;

box-shadow:0 10px 30px rgba(0,0,0,.08);

border-top:4px solid #0B8F73;

transition:.3s;

}

.node:hover{

transform:translateY(-6px);

box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.utama{

background:linear-gradient(135deg,#0B8F73,#159E92);

color:#fff;

font-size:22px;

min-width:320px;

border:none;

}

.utama2{

background:#FFD56A;

color:#21443C;

font-size:20px;

min-width:360px;

border:none;

}

.three{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.four{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.six{

display:grid;

grid-template-columns:repeat(6,1fr);

gap:18px;

}

@media(max-width:1100px){

.three,
.four,
.six{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.three,
.four,
.six{

grid-template-columns:1fr;

}

.node{

width:100%;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-65414b1 *//*=====================================
LAYANAN AKADEMIK
=====================================*/

.layanan-section{

margin-top:80px;

}

.layanan-section p{

max-width:720px;

margin:15px auto 0;

text-align:center;

line-height:1.8;

color:#6c757d;

}

.layanan-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

margin-top:45px;

}

.layanan-card{

display:block;

text-decoration:none;

background:#ffffff;

padding:35px;

border-radius:24px;

box-shadow:0 18px 40px rgba(0,0,0,.08);

border:1px solid rgba(0,0,0,.04);

transition:.35s;

position:relative;

overflow:hidden;

}

.layanan-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(90deg,#0B8F73,#19A79A,#FFD56A);

}

.layanan-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,.12);

}

.layanan-icon{

width:70px;

height:70px;

margin-bottom:25px;

border-radius:18px;

display:flex;

justify-content:center;

align-items:center;

font-size:30px;

background:linear-gradient(135deg,#0B8F73,#19A79A);

color:#fff;

box-shadow:0 15px 25px rgba(11,143,115,.20);

}

.layanan-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.layanan-card p{

margin:0;

text-align:left;

font-size:15px;

line-height:1.8;

color:#666;

}

.layanan-card span{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:20px;

font-weight:700;

color:#0B8F73;

}

.layanan-card span i{

transition:.3s;

}

.layanan-card:hover span i{

transform:translateX(5px);

}

/* Tablet */

@media(max-width:1024px){

.layanan-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.layanan-grid{

grid-template-columns:1fr;

}

.layanan-card{

padding:28px;

}

.layanan-card h3{

font-size:20px;

}

.layanan-icon{

width:60px;

height:60px;

font-size:24px;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-4f3937f *//* =====================================================
   KESISWAA MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}

/*=========================================
QUICK MENU
=========================================*/

.quick-menu{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin:-40px auto 70px;

position:relative;

z-index:20;

}

.menu-card{

background:rgba(255,255,255,.92);

backdrop-filter:blur(15px);

padding:30px;

border-radius:22px;

text-align:center;

transition:.35s;

box-shadow:

0 15px 40px rgba(0,0,0,.08);

border:1px solid rgba(255,255,255,.45);

}

.menu-card:hover{

transform:translateY(-10px);

}

.menu-icon{

width:72px;

height:72px;

margin:auto;

margin-bottom:20px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:

linear-gradient(135deg,#0B8F73,#19A79A);

color:white;

font-size:28px;

box-shadow:

0 15px 30px rgba(11,143,115,.25);

}

.menu-card h3{

margin:0;

margin-bottom:10px;

font-size:22px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.menu-card p{

font-size:15px;

line-height:1.7;

color:#666;

margin-bottom:18px;

}

.menu-card a{

text-decoration:none;

font-weight:700;

color:#0B8F73;

transition:.3s;

}

.menu-card a i{

margin-left:6px;

transition:.3s;

}

.menu-card:hover a i{

transform:translateX(5px);

}


/*=========================
RESPONSIVE
=========================*/

@media(max-width:1024px){

.quick-menu{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.quick-menu{

grid-template-columns:1fr;

margin-top:30px;

}

.menu-card{

padding:25px;

}

.menu-icon{

width:60px;

height:60px;

font-size:24px;

}

.menu-card h3{

font-size:20px;

}
}

/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-52324ea *//* =====================================================
   KEHUMASAN MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}


/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for gallery, class: .elementor-element-327560a *//*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f4b1127 *//*============================
STRUKTUR ORGANISASI
=============================*/

.struktur-organisasi{

padding:70px 20px;

max-width:1400px;

margin:auto;

}

.org-tree{

display:flex;

flex-direction:column;

align-items:center;

gap:35px;

}

.level{

display:flex;

justify-content:center;

gap:30px;

flex-wrap:wrap;

width:100%;

position:relative;

}

.node{

min-width:220px;

padding:18px 24px;

text-align:center;

background:#fff;

border-radius:18px;

font-weight:700;

color:#21443C;

box-shadow:0 10px 30px rgba(0,0,0,.08);

border-top:4px solid #0B8F73;

transition:.3s;

}

.node:hover{

transform:translateY(-6px);

box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.utama{

background:linear-gradient(135deg,#0B8F73,#159E92);

color:#fff;

font-size:22px;

min-width:320px;

border:none;

}

.utama2{

background:#FFD56A;

color:#21443C;

font-size:20px;

min-width:360px;

border:none;

}

.three{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.four{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.six{

display:grid;

grid-template-columns:repeat(6,1fr);

gap:18px;

}

@media(max-width:1100px){

.three,
.four,
.six{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.three,
.four,
.six{

grid-template-columns:1fr;

}

.node{

width:100%;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-65414b1 *//*=====================================
LAYANAN AKADEMIK
=====================================*/

.layanan-section{

margin-top:80px;

}

.layanan-section p{

max-width:720px;

margin:15px auto 0;

text-align:center;

line-height:1.8;

color:#6c757d;

}

.layanan-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

margin-top:45px;

}

.layanan-card{

display:block;

text-decoration:none;

background:#ffffff;

padding:35px;

border-radius:24px;

box-shadow:0 18px 40px rgba(0,0,0,.08);

border:1px solid rgba(0,0,0,.04);

transition:.35s;

position:relative;

overflow:hidden;

}

.layanan-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(90deg,#0B8F73,#19A79A,#FFD56A);

}

.layanan-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,.12);

}

.layanan-icon{

width:70px;

height:70px;

margin-bottom:25px;

border-radius:18px;

display:flex;

justify-content:center;

align-items:center;

font-size:30px;

background:linear-gradient(135deg,#0B8F73,#19A79A);

color:#fff;

box-shadow:0 15px 25px rgba(11,143,115,.20);

}

.layanan-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.layanan-card p{

margin:0;

text-align:left;

font-size:15px;

line-height:1.8;

color:#666;

}

.layanan-card span{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:20px;

font-weight:700;

color:#0B8F73;

}

.layanan-card span i{

transition:.3s;

}

.layanan-card:hover span i{

transform:translateX(5px);

}

/* Tablet */

@media(max-width:1024px){

.layanan-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.layanan-grid{

grid-template-columns:1fr;

}

.layanan-card{

padding:28px;

}

.layanan-card h3{

font-size:20px;

}

.layanan-icon{

width:60px;

height:60px;

font-size:24px;

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-4f3937f *//* =====================================================
   KESISWAA MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}

/*=========================================
QUICK MENU
=========================================*/

.quick-menu{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin:-40px auto 70px;

position:relative;

z-index:20;

}

.menu-card{

background:rgba(255,255,255,.92);

backdrop-filter:blur(15px);

padding:30px;

border-radius:22px;

text-align:center;

transition:.35s;

box-shadow:

0 15px 40px rgba(0,0,0,.08);

border:1px solid rgba(255,255,255,.45);

}

.menu-card:hover{

transform:translateY(-10px);

}

.menu-icon{

width:72px;

height:72px;

margin:auto;

margin-bottom:20px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:

linear-gradient(135deg,#0B8F73,#19A79A);

color:white;

font-size:28px;

box-shadow:

0 15px 30px rgba(11,143,115,.25);

}

.menu-card h3{

margin:0;

margin-bottom:10px;

font-size:22px;

font-weight:700;

text-transform:capitalize;

color:#21443C;

}

.menu-card p{

font-size:15px;

line-height:1.7;

color:#666;

margin-bottom:18px;

}

.menu-card a{

text-decoration:none;

font-weight:700;

color:#0B8F73;

transition:.3s;

}

.menu-card a i{

margin-left:6px;

transition:.3s;

}

.menu-card:hover a i{

transform:translateX(5px);

}


/*=========================
RESPONSIVE
=========================*/

@media(max-width:1024px){

.quick-menu{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.quick-menu{

grid-template-columns:1fr;

margin-top:30px;

}

.menu-card{

padding:25px;

}

.menu-icon{

width:60px;

height:60px;

font-size:24px;

}

.menu-card h3{

font-size:20px;

}
}

/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-52324ea *//* =====================================================
   KEHUMASAN MAN 1 MOJOKERTO
   PREMIUM UI 2026
====================================================== */

:root{

--primary:#0B8F73;
--secondary:#16A085;
--accent:#F4B942;
--gold:#FFD56A;
--white:#ffffff;
--dark:#21443C;
--text:#5B6B68;
--shadow:0 18px 40px rgba(0,0,0,.08);

}

.humas-page{

font-family:inherit;

color:var(--dark);

}


/*========================
HERO
========================*/

.humas-hero{

position:relative;

overflow:hidden;

padding:90px 50px;

border-radius:30px;

background:
linear-gradient(135deg,
#0B8F73 0%,
#16A085 55%,
#1EB980 100%);

box-shadow:var(--shadow);

margin-bottom:80px;

}

.humas-hero:before{

content:"";

position:absolute;

top:-120px;

left:-5%;

width:110%;

height:220px;

background:rgba(255,255,255,.06);

border-radius:0 0 50% 50%;

}

.humas-hero:after{

content:"";

position:absolute;

bottom:-140px;

left:-5%;

width:110%;

height:240px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.hero-content{

position:relative;

z-index:2;

max-width:760px;

}

.badge{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:rgba(255,255,255,.16);

backdrop-filter:blur(10px);

border-radius:50px;

color:#fff;

font-weight:600;

margin-bottom:25px;

}

.badge i{

color:var(--gold);

}

.hero-content h1{

font-size:54px;

font-weight:800;

line-height:1.15;

margin:0 0 20px;

color:white;

}

.hero-content h1 span{

display:block;

color:var(--gold);

}

.hero-content p{

font-size:18px;

line-height:1.9;

color:rgba(255,255,255,.95);

}


/*========================
SECTION TITLE
========================*/

.section-heading{

text-align:center;

margin-bottom:45px;

}

.section-heading span{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#EEF9F5;

color:var(--primary);

font-weight:700;

font-size:14px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-heading h2{

font-size:40px;

margin:0;

font-weight:800;

color:var(--dark);

}

/* Judul Utama */
.section-heading h2,
.hero-content h1,
.title-area h2,
.gallery-title h2,
.cta-box h2{

    text-transform: capitalize;

}
/*========================
KOORDINATOR
========================*/

.koordinator-card{

display:grid;

grid-template-columns:280px 1fr;

gap:45px;

align-items:center;

padding:45px;

border-radius:28px;

background:#fff;

box-shadow:var(--shadow);

margin-bottom:70px;

}

.foto{

text-align:center;

}

.foto img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid rgba(244,185,66,.25);

box-shadow:

0 0 0 8px rgba(11,143,115,.08),

0 18px 35px rgba(0,0,0,.12);

}

.profil h3{

margin:0;

font-size:36px;

font-weight:800;

color:var(--dark);

}

.profil span{

display:inline-block;

margin:10px 0 20px;

color:var(--primary);

font-weight:700;

font-size:17px;

}

.profil p{

line-height:1.9;

color:var(--text);

margin-bottom:25px;

text-align:justify;

}

.profil-info{

display:flex;

flex-wrap:wrap;

gap:18px;

}

.profil-info div{

background:#F6FBF9;

padding:12px 18px;

border-radius:12px;

font-weight:600;

color:var(--dark);

}

.profil-info i{

margin-right:8px;

color:var(--accent);

}


/*========================
STATISTIK
========================*/

.statistik{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-bottom:80px;

}

.stat-card{

background:white;

padding:35px;

border-radius:24px;

text-align:center;

box-shadow:var(--shadow);

transition:.35s;

}

.stat-card:hover{

transform:translateY(-8px);

}

.stat-card i{

font-size:34px;

color:var(--accent);

margin-bottom:18px;

}

.stat-card h2{

font-size:42px;

margin:0;

font-weight:800;

color:var(--primary);

}

.stat-card span{

color:#6D7A77;

font-weight:600;

}


/*========================
TUGAS
========================*/

.tugas-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.tugas-card{

padding:35px;

border-radius:24px;

background:white;

box-shadow:var(--shadow);

transition:.35s;

}

.tugas-card:hover{

transform:translateY(-8px);

}

.tugas-card i{

font-size:34px;

color:var(--accent);

margin-bottom:20px;

}

.tugas-card h3{

margin:0 0 12px;

font-size:24px;

font-weight:800;

color:var(--dark);

}

.tugas-card p{

line-height:1.8;

text-align:justify;

color:var(--text);

}


/*========================
RESPONSIVE
========================*/

@media(max-width:1024px){

.hero-content h1{

font-size:42px;

}

.koordinator-card{

grid-template-columns:1fr;

text-align:center;

}

.profil{

text-align:center;

}

.profil p{

text-align:center;

}

.profil-info{

justify-content:center;

}

.statistik{

grid-template-columns:repeat(2,1fr);

}

.tugas-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.humas-hero{

padding:60px 25px;

border-radius:24px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:16px;

}

.section-heading h2{

font-size:28px;

}

.koordinator-card{

padding:25px;

}

.foto img{

width:180px;

height:180px;

}

.profil h3{

font-size:28px;

}

.statistik{

grid-template-columns:1fr;

}

.tugas-grid{

grid-template-columns:1fr;

}

.stat-card{

padding:25px;

}

.tugas-card{

padding:25px;

}

/*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}

}/* End custom CSS */
/* Start custom CSS for gallery, class: .elementor-element-327560a *//*=========================================
GALERI KEHUMASAN
==========================================*/

.gallery-section{

margin-top:90px;

}

.gallery-section p{

max-width:700px;

margin:auto;

margin-top:15px;

color:#666;

line-height:1.8;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

grid-auto-rows:220px;

gap:18px;

margin-top:45px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.gallery-item:hover{

transform:translateY(-8px);

box-shadow:

0 25px 45px rgba(0,0,0,.12);

}

.gallery-item:hover img{

transform:scale(1.08);

}

.gallery-item::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(to top,

rgba(0,0,0,.55),

transparent 55%);

opacity:0;

transition:.35s;

z-index:2;

}

.gallery-item:hover::before{

opacity:1;

}

.gallery-item::after{

content:"";

font-family:"Font Awesome 6 Free";

font-weight:900;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

width:60px;

height:60px;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,255,255,.25);

backdrop-filter:blur(12px);

color:#fff;

font-size:22px;

opacity:0;

transition:.35s;

z-index:3;

}

.gallery-item:hover::after{

opacity:1;

}

/* variasi */

.gallery-item.tall{

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

/* Tablet */

@media(max-width:1024px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:220px;

}

.gallery-item.tall,

.gallery-item.wide{

grid-column:auto;

grid-row:auto;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-90251fd */.vm-modern{

max-width:1180px;
margin:auto;
padding:70px 20px;

}

.vm-header{

text-align:center;
margin-bottom:40px;

}

.vm-header h2,
.glass-card h3{

    text-transform: capitalize;

}


.vm-header span{

display:inline-block;
padding:6px 18px;
background:#FFF3D5;
color:#C88700;
border-radius:30px;
font-size:13px;
font-weight:700;
letter-spacing:2px;

}

.vm-header h2{

margin:15px 0 10px;
font-size:42px;
font-weight:800;
color:#E89A00;
text-transform:capitalize;

}

.vm-header p{

max-width:700px;
margin:auto;
color:#666;
font-size:16px;
line-height:1.6;

}

.vm-grid{

display:grid;
grid-template-columns:repeat(2,1fr);
gap:25px;

}

.vm-card{

background:#ffffff;
border-radius:22px;
padding:28px;
box-shadow:0 12px 30px rgba(0,0,0,.08);
border:1px solid #e9eef3;

height:760px;

overflow-y:auto;

}

.vm-card::-webkit-scrollbar{

width:6px;

}

.vm-card::-webkit-scrollbar-thumb{

background:#d7a018;
border-radius:10px;

}

.vm-icon{

width:65px;
height:65px;
margin:auto;

display:flex;
align-items:center;
justify-content:center;

border-radius:50%;

background:linear-gradient(135deg,#0E7C90,#18A999);

color:#fff;

font-size:26px;

margin-bottom:15px;

}

.gold{

background:linear-gradient(135deg,#E89A00,#F4C542);

}

.vm-card h3{

text-align:center;
color:#0E7C90;
font-size:26px;
margin-bottom:18px;
font-weight:700;

}

.vm-card h4{

margin-top:20px;
margin-bottom:8px;
color:#E89A00;
font-size:18px;

}

.vm-card blockquote{

background:#f8fbfd;
border-left:4px solid #E89A00;
padding:12px 16px;
border-radius:8px;

font-style:italic;

margin-bottom:15px;

line-height:1.6;

text-align:justify;

}

.vm-card p{

text-align:justify;
line-height:1.55;
margin-bottom:12px;
font-size:15px;
color:#444;

}

.vm-card ul,
.vm-card ol{

padding-left:20px;
margin:8px 0;

}

.vm-card li{

margin-bottom:8px;
line-height:1.5;
font-size:15px;
text-align:justify;
color:#444;

}

@media(max-width:768px){

.vm-grid{

grid-template-columns:1fr;

}

.vm-card{

height:auto;

}

.vm-header h2{

font-size:34px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-45db302 *//*==================================================
      MAN 1 MOJOKERTO
      JADWAL SHOLAT PREMIUM v2
==================================================*/

#man1-prayer{

--primary:#0C7C90;
--secondary:#19A79A;
--success:#35C786;
--gold:#FFD56A;
--gold2:#F5B942;

position:relative;
overflow:hidden;

padding:16px 22px;

border-radius:22px;

background:
linear-gradient(135deg,
var(--primary),
var(--secondary),
var(--success));

box-shadow:
0 12px 30px rgba(0,0,0,.10);

}


/*=========================
BACKGROUND
=========================*/

#man1-prayer:before{

content:"";

position:absolute;

left:-10%;
top:-80px;

width:120%;
height:140px;

background:rgba(255,255,255,.05);

border-radius:0 0 50% 50%;

}

#man1-prayer:after{

content:"";

position:absolute;

bottom:-80px;
left:-10%;

width:120%;
height:140px;

background:rgba(255,255,255,.05);

border-radius:50% 50% 0 0;

}

.prayer-bg-pattern{

position:absolute;
inset:0;

background-image:

radial-gradient(
rgba(255,255,255,.10) 1px,
transparent 1px);

background-size:35px 35px;

opacity:.35;

pointer-events:none;

}


/*=========================
HEADER
=========================*/

.prayer-header{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:14px;

position:relative;

z-index:5;

gap:10px;

flex-wrap:wrap;

}

.title-area h2{

margin:0;

font-size:16px;

font-weight:800;

color:var(--gold);

text-transform:capitalize;

}

.title-area h2 i{

margin-right:8px;

}

.tanggal{

display:flex;

gap:8px;

margin-top:2px;

font-size:13px;

color:white;

opacity:.9;

}

.lokasi{

padding:7px 14px;

border-radius:50px;

background:rgba(255,255,255,.15);

backdrop-filter:blur(10px);

border:1px solid rgba(255,255,255,.15);

font-size:13px;

font-weight:600;

color:white;

}

.lokasi i{

margin-right:6px;

color:var(--gold);

}


/*=========================
GRID
=========================*/

.jadwal-grid{

grid-template-columns:repeat(auto-fit,minmax(80px,95px));

justify-content:space-between;

}


/*=========================
CARD
=========================*/

.card-sholat{

aspect-ratio:1/1;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

padding:6px;

border-radius:16px;

background:rgba(255,255,255,.15);

backdrop-filter:blur(12px);

border:1px solid rgba(255,255,255,.18);

transition:.30s;

box-shadow:

0 8px 18px rgba(0,0,0,.08);

}

.card-sholat:hover{

transform:translateY(-4px);

background:rgba(255,255,255,.22);

}


/*=========================
ICON
=========================*/

.card-sholat .icon{

width:10px;

height:10px;

display:flex;

justify-content:center;

align-items:center;

border-radius:20%;

margin-bottom:4px;

background:

linear-gradient(135deg,var(--gold),var(--gold2));

color:#0C7C90;

font-size:13px;

}


/*=========================
TEXT
=========================*/

.card-sholat h4{

margin:0;

margin-bottom:2px;

font-size:13px;

font-weight:700;

text-transform:capitalize;

color:white;

}

.card-sholat span{

font-size:25px;

font-weight:800;

line-height:1;

color:white;

}


/*=========================
ACTIVE
=========================*/

.card-sholat.active{

background:

linear-gradient(135deg,var(--gold),var(--gold2));

transform:translateY(-4px);

}

.card-sholat.active h4,

.card-sholat.active span{

color:#0C7C90;

}

.card-sholat.active .icon{

background:white;

}


/*=========================
FOOTER
=========================*/

.footer-info{

margin-top:8px;

text-align:center;

font-size:11px;

color:white;

opacity:.9;

position:relative;

z-index:5;

}

.footer-info strong{

color:var(--gold);

}


/*=========================
TABLET
=========================*/

@media(max-width:1024px){

.jadwal-grid{

grid-template-columns:repeat(4,0,1fr);

}

}


/*=========================
MOBILE
=========================*/

@media(max-width:768px){

#man1-prayer{

padding:14px;

}

.prayer-header{

flex-direction:column;

align-items:flex-start;

gap:8px;

}

.title-area h2{

font-size:22px;

}

.lokasi{

width:100%;

text-align:center;

}

.jadwal-grid{

grid-template-columns:repeat(2,1fr);

gap:8px;

}

.card-sholat{

aspect-ratio:1/1;

}

.card-sholat .icon{

width:10px;

height:10px;

font-size:11px;

}

.card-sholat h4{

font-size:12px;

}

.card-sholat span{

font-size:20px;

}

.footer-info{

font-size:10px;

}

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-39ff097 */#man1-prayer{

padding:28px 35px;

border-radius:22px;

background:linear-gradient(135deg,#0E7C90,#18A999,#2DBF85);

}

.prayer-header{

margin-bottom:20px;

}

.title-area h2{

font-size:30px;

color:#FFD66B;

}

.jadwal-grid{

display:grid;

grid-template-columns:repeat(7,1fr);

gap:12px;

}

.card-sholat{

padding:14px 10px;

border-radius:16px;

background:rgba(255,255,255,.15);

backdrop-filter:blur(10px);

}

.card-sholat .icon{

display:none;

}

.card-sholat h4{

font-size:15px;

margin-bottom:6px;

color:#fff;

}

.card-sholat span{

font-size:22px;

font-weight:700;

color:#FFD66B;

}

.footer-date{

margin-top:18px;

text-align:center;

font-size:14px;

color:#fff;

opacity:.9;

}/* End custom CSS */