.elementor-6129 .elementor-element.elementor-element-0add1ee{--display:flex;--min-height:380px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--overlay-opacity:0.29;}.elementor-6129 .elementor-element.elementor-element-0add1ee:not(.elementor-motion-effects-element-type-background), .elementor-6129 .elementor-element.elementor-element-0add1ee > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-6129 .elementor-element.elementor-element-0add1ee::before, .elementor-6129 .elementor-element.elementor-element-0add1ee > .elementor-background-video-container::before, .elementor-6129 .elementor-element.elementor-element-0add1ee > .e-con-inner > .elementor-background-video-container::before, .elementor-6129 .elementor-element.elementor-element-0add1ee > .elementor-background-slideshow::before, .elementor-6129 .elementor-element.elementor-element-0add1ee > .e-con-inner > .elementor-background-slideshow::before, .elementor-6129 .elementor-element.elementor-element-0add1ee > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-6129 .elementor-element.elementor-element-0add1ee > .elementor-shape-bottom svg, .elementor-6129 .elementor-element.elementor-element-0add1ee > .e-con-inner > .elementor-shape-bottom svg{height:40px;}.elementor-6129 .elementor-element.elementor-element-0add1ee.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-6129 .elementor-element.elementor-element-2130790{text-align:center;}.elementor-6129 .elementor-element.elementor-element-2130790 .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-weight:700;color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-8ca5138{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;--margin-top:-20px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6129 .elementor-element.elementor-element-8ca5138.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-6129 .elementor-element.elementor-element-dd20a7f{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 5px;}.elementor-6129 .elementor-element.elementor-element-dd20a7f .elementor-heading-title{font-family:"DM Sans", Sans-serif;font-size:16px;font-weight:600;color:#FFFFFF;}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-6129 .elementor-element.elementor-element-0299183{margin:04px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6129 .elementor-element.elementor-element-0299183 .elementor-icon-wrapper{text-align:center;}.elementor-6129 .elementor-element.elementor-element-0299183.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-0299183.elementor-view-framed .elementor-icon, .elementor-6129 .elementor-element.elementor-element-0299183.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-0299183.elementor-view-framed .elementor-icon, .elementor-6129 .elementor-element.elementor-element-0299183.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-0299183 .elementor-icon{font-size:16px;}.elementor-6129 .elementor-element.elementor-element-0299183 .elementor-icon svg{height:16px;}.elementor-6129 .elementor-element.elementor-element-2477b37{margin:0px 3px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6129 .elementor-element.elementor-element-2477b37 .elementor-heading-title{font-family:"DM Sans", Sans-serif;font-size:16px;font-weight:600;color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-a45b9a5{--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:20px 20px;--row-gap:20px;--column-gap:20px;--overlay-opacity:0.5;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:10px;--padding-right:10px;}.elementor-6129 .elementor-element.elementor-element-a45b9a5::before, .elementor-6129 .elementor-element.elementor-element-a45b9a5 > .elementor-background-video-container::before, .elementor-6129 .elementor-element.elementor-element-a45b9a5 > .e-con-inner > .elementor-background-video-container::before, .elementor-6129 .elementor-element.elementor-element-a45b9a5 > .elementor-background-slideshow::before, .elementor-6129 .elementor-element.elementor-element-a45b9a5 > .e-con-inner > .elementor-background-slideshow::before, .elementor-6129 .elementor-element.elementor-element-a45b9a5 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-6129 .elementor-element.elementor-element-7ec273a{--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-widget-media-carousel .elementor-carousel-image-overlay{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-6129 .elementor-element.elementor-element-6f0af67.elementor-skin-slideshow .elementor-main-swiper:not(.elementor-thumbnails-swiper){margin-bottom:10px;}.elementor-6129 .elementor-element.elementor-element-6f0af67 .elementor-main-swiper:not(.elementor-thumbnails-swiper){height:350px;}.elementor-6129 .elementor-element.elementor-element-6f0af67 .elementor-thumbnails-swiper .elementor-carousel-image{aspect-ratio:16 / 9;}.elementor-6129 .elementor-element.elementor-element-6f0af67 .elementor-main-swiper .swiper-slide{border-radius:10px;}.elementor-6129 .elementor-element.elementor-element-6f0af67 .elementor-swiper-button{font-size:20px;}.elementor-6129 .elementor-element.elementor-element-fe4166a{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-evenly;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6129 .elementor-element.elementor-element-fe4166a.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-6129 .elementor-element.elementor-element-650ed14 .elementor-button-content-wrapper{flex-direction:row;}.elementor-6129 .elementor-element.elementor-element-650ed14 .elementor-button{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;fill:#FFFFFF;color:#FFFFFF;padding:12px 12px 12px 12px;}.elementor-6129 .elementor-element.elementor-element-313d0cc .elementor-button-content-wrapper{flex-direction:row;}.elementor-6129 .elementor-element.elementor-element-313d0cc .elementor-button{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;fill:#FFFFFF;color:#FFFFFF;padding:12px 12px 12px 12px;}.elementor-6129 .elementor-element.elementor-element-93da999 .elementor-button-content-wrapper{flex-direction:row;}.elementor-6129 .elementor-element.elementor-element-93da999 .elementor-button{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;fill:#FFFFFF;color:#FFFFFF;padding:12px 12px 12px 12px;}.elementor-6129 .elementor-element.elementor-element-e6ad33f .elementor-button-content-wrapper{flex-direction:row;}.elementor-6129 .elementor-element.elementor-element-e6ad33f .elementor-button{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;fill:#FFFFFF;color:#FFFFFF;padding:12px 12px 12px 12px;}.elementor-6129 .elementor-element.elementor-element-1fa6a39{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0{width:var( --container-widget-width, 48.735% );max-width:48.735%;--container-widget-width:48.735%;--container-widget-flex-grow:0;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table{max-width:100%;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table thead tr th{color:#fff;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 table.dataTable thead .sorting:after{color:#fff;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 table.dataTable thead .sorting_asc:after{color:#fff;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 table.dataTable thead .sorting_desc:after{color:#fff;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table thead tr th:hover{color:#fff;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 table.dataTable thead .sorting:after:hover{color:#fff;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 table.dataTable thead .sorting_asc:after:hover{color:#fff;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 table.dataTable thead .sorting_desc:after:hover{color:#fff;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table thead > tr th .data-table-header-text{font-family:"Red Hat Display", Sans-serif;font-size:16px;font-weight:600;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table thead tr th i{font-size:20px;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table thead tr th .data-table-header-svg-icon{height:20px;width:20px;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody > tr:nth-child(2n) td{color:#000000;background:#f2f2f2;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody > tr:nth-child(2n+1) td{color:#000000;background-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody tr td{border-style:solid;border-width:1px 1px 1px 1px;padding:8px 8px 8px 8px;font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table-wrap table td a{color:#000000;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table-wrap table td a:hover{color:#6d7882;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody .td-content-wrapper{text-align:left;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody .td-content-wrapper .eael-datatable-icon i{font-size:20px;color:#c15959;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody .td-content-wrapper .eael-datatable-icon svg{height:20px;width:20px;fill:#c15959;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody .td-content-wrapper:hover .eael-datatable-icon i{color:#6d7882;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody .td-content-wrapper:hover .eael-datatable-icon svg{fill:#6d7882;}.elementor-6129 .elementor-element.elementor-element-4f15e83{width:var( --container-widget-width, 47.514% );max-width:47.514%;--container-widget-width:47.514%;--container-widget-flex-grow:0;}.elementor-6129 .elementor-element.elementor-element-4f15e83.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table{max-width:100%;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table thead tr th{color:#fff;}.elementor-6129 .elementor-element.elementor-element-4f15e83 table.dataTable thead .sorting:after{color:#fff;}.elementor-6129 .elementor-element.elementor-element-4f15e83 table.dataTable thead .sorting_asc:after{color:#fff;}.elementor-6129 .elementor-element.elementor-element-4f15e83 table.dataTable thead .sorting_desc:after{color:#fff;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table thead tr th:hover{color:#fff;}.elementor-6129 .elementor-element.elementor-element-4f15e83 table.dataTable thead .sorting:after:hover{color:#fff;}.elementor-6129 .elementor-element.elementor-element-4f15e83 table.dataTable thead .sorting_asc:after:hover{color:#fff;}.elementor-6129 .elementor-element.elementor-element-4f15e83 table.dataTable thead .sorting_desc:after:hover{color:#fff;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table thead > tr th .data-table-header-text{font-family:"Red Hat Display", Sans-serif;font-size:16px;font-weight:600;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table thead tr th i{font-size:20px;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table thead tr th .data-table-header-svg-icon{height:20px;width:20px;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody > tr:nth-child(2n) td{color:#000000;background:#f2f2f2;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody > tr:nth-child(2n+1) td{color:#000000;background-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody tr td{border-style:solid;border-width:1px 1px 1px 1px;padding:8px 8px 8px 8px;font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table-wrap table td a{color:#000000;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table-wrap table td a:hover{color:#6d7882;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody .td-content-wrapper{text-align:left;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody .td-content-wrapper .eael-datatable-icon i{font-size:20px;color:#c15959;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody .td-content-wrapper .eael-datatable-icon svg{height:20px;width:20px;fill:#c15959;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody .td-content-wrapper:hover .eael-datatable-icon i{color:#6d7882;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody .td-content-wrapper:hover .eael-datatable-icon svg{fill:#6d7882;}.elementor-6129 .elementor-element.elementor-element-e84263a .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:25px;font-weight:700;color:#000000;}.elementor-widget-icon-list .elementor-icon-list-item:not(:last-child):after{border-color:var( --e-global-color-text );}.elementor-widget-icon-list .elementor-icon-list-icon i{color:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-icon svg{fill:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-icon-list .elementor-icon-list-text{color:var( --e-global-color-secondary );}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(13px/2);}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(13px/2);}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(13px/2);}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-13px/2);}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-13px/2);}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-6129 .elementor-element.elementor-element-efb03cd{--e-icon-list-icon-size:20px;--icon-vertical-offset:0px;}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-item > .elementor-icon-list-text, .elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-6129 .elementor-element.elementor-element-efb03cd .elementor-icon-list-text{color:#54595F;transition:color 0.3s;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-6129 .elementor-element.elementor-element-97b54c1{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-6129 .elementor-element.elementor-element-2a2292c{--display:flex;--border-radius:10px 10px 10px 10px;box-shadow:0px 2px 5px 0px rgba(178, 34.00000000000002, 34.00000000000002, 0.34);}.elementor-6129 .elementor-element.elementor-element-2a2292c.e-con{--align-self:flex-start;--flex-grow:0;--flex-shrink:0;}.elementor-6129 .elementor-element.elementor-element-9ac9969 .elementor-icon-wrapper{text-align:center;}.elementor-6129 .elementor-element.elementor-element-9ac9969.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-9ac9969.elementor-view-framed .elementor-icon, .elementor-6129 .elementor-element.elementor-element-9ac9969.elementor-view-default .elementor-icon{color:#FFFFFF;border-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-9ac9969.elementor-view-framed .elementor-icon, .elementor-6129 .elementor-element.elementor-element-9ac9969.elementor-view-default .elementor-icon svg{fill:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-f728be1{text-align:center;}.elementor-6129 .elementor-element.elementor-element-f728be1 .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:30px;font-weight:700;color:#000000;}.elementor-6129 .elementor-element.elementor-element-0fbd234 .elementor-button{background-color:#FFFFFF00;font-family:"Poppins", Sans-serif;font-size:15px;font-weight:400;border-style:solid;border-width:2px 2px 2px 2px;border-radius:30px 30px 30px 30px;}.elementor-6129 .elementor-element.elementor-element-0fbd234 .elementor-button:hover, .elementor-6129 .elementor-element.elementor-element-0fbd234 .elementor-button:focus{background-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-0fbd234{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6129 .elementor-element.elementor-element-0fbd234 .elementor-button-content-wrapper{flex-direction:row;}.elementor-6129 .elementor-element.elementor-element-0f2802c .elementor-button{background-color:#FFFFFF00;font-family:"Quicksand", Sans-serif;font-weight:600;border-style:solid;border-width:2px 2px 2px 2px;border-radius:30px 30px 30px 30px;}.elementor-6129 .elementor-element.elementor-element-0f2802c .elementor-button:hover, .elementor-6129 .elementor-element.elementor-element-0f2802c .elementor-button:focus{background-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-0f2802c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6129 .elementor-element.elementor-element-0f2802c .elementor-button-content-wrapper{flex-direction:row;}.elementor-6129 .elementor-element.elementor-element-598934a .elementor-button{background-color:#FFFFFF00;font-family:"Quicksand", Sans-serif;font-weight:600;border-style:solid;border-width:2px 2px 2px 2px;border-radius:30px 30px 30px 30px;}.elementor-6129 .elementor-element.elementor-element-598934a .elementor-button:hover, .elementor-6129 .elementor-element.elementor-element-598934a .elementor-button:focus{background-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-598934a{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6129 .elementor-element.elementor-element-598934a .elementor-button-content-wrapper{flex-direction:row;}.elementor-6129 .elementor-element.elementor-element-aff4663 .elementor-button{background-color:#FFFFFF00;font-family:"Quicksand", Sans-serif;font-weight:600;border-style:solid;border-width:2px 2px 2px 2px;border-radius:30px 30px 30px 30px;}.elementor-6129 .elementor-element.elementor-element-aff4663 .elementor-button:hover, .elementor-6129 .elementor-element.elementor-element-aff4663 .elementor-button:focus{background-color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-aff4663{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6129 .elementor-element.elementor-element-aff4663 .elementor-button-content-wrapper{flex-direction:row;}.elementor-6129 .elementor-element.elementor-element-a5a4e25{--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-6129 .elementor-element.elementor-element-11574ea .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:25px;font-weight:600;color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-46a7f65{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;}.elementor-6129 .elementor-element.elementor-element-46a7f65 .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:25px;font-weight:700;color:#000000;}.elementor-6129 .elementor-element.elementor-element-aa6471f{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--e-icon-list-icon-size:17px;--icon-vertical-align:flex-start;--icon-vertical-offset:4px;}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-6129 .elementor-element.elementor-element-aa6471f .elementor-icon-list-text{color:#54595F;transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-33791a6{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 15px) 0px;}.elementor-6129 .elementor-element.elementor-element-33791a6 .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:20px;font-weight:700;color:#000000;}.elementor-6129 .elementor-element.elementor-element-c41ae05{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--e-icon-list-icon-size:17px;--icon-vertical-align:flex-start;--icon-vertical-offset:4px;}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-icon i{color:#E70000;transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-icon svg{fill:#E70000;transition:fill 0.3s;}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;}.elementor-6129 .elementor-element.elementor-element-c41ae05 .elementor-icon-list-text{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-dfa7c33{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;}.elementor-6129 .elementor-element.elementor-element-dfa7c33 .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:25px;font-weight:700;color:#000000;}.elementor-6129 .elementor-element.elementor-element-4557257{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--e-icon-list-icon-size:17px;--icon-vertical-align:flex-start;--icon-vertical-offset:4px;}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-6129 .elementor-element.elementor-element-4557257 .elementor-icon-list-text{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-2bc51c8{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;}.elementor-6129 .elementor-element.elementor-element-2bc51c8 .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:25px;font-weight:700;color:#000000;}.elementor-6129 .elementor-element.elementor-element-d3e27a4{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--e-icon-list-icon-size:17px;--icon-vertical-align:center;--icon-vertical-offset:0px;}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-icon{padding-inline-end:0px;}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-6129 .elementor-element.elementor-element-d3e27a4 .elementor-icon-list-text{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-0b812ae{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;}.elementor-6129 .elementor-element.elementor-element-0b812ae .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:25px;font-weight:700;color:#000000;}.elementor-6129 .elementor-element.elementor-element-6a0442a{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--e-icon-list-icon-size:17px;--icon-vertical-align:flex-start;--icon-vertical-offset:0px;}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-item > .elementor-icon-list-text, .elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-6129 .elementor-element.elementor-element-6a0442a .elementor-icon-list-text{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-878ef05{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;}.elementor-6129 .elementor-element.elementor-element-878ef05 .elementor-heading-title{font-family:"El Messiri", Sans-serif;font-size:25px;font-weight:700;color:#000000;}.elementor-6129 .elementor-element.elementor-element-7e90a75{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--e-icon-list-icon-size:17px;--icon-vertical-offset:0px;}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-6129 .elementor-element.elementor-element-7e90a75 .elementor-icon-list-text{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-7fee471{--display:flex;--border-radius:10px 10px 10px 10px;box-shadow:0px 2px 5px 0px rgba(178, 34.00000000000002, 34.00000000000002, 0.34);}.elementor-6129 .elementor-element.elementor-element-7fee471.e-con{--align-self:flex-start;--flex-grow:0;--flex-shrink:0;}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(5px/2);}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-5px/2);}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-item:hover .elementor-icon-list-icon i{color:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-item:hover .elementor-icon-list-icon svg{fill:#FFFFFF;}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-6129 .elementor-element.elementor-element-fe88f7e{--e-icon-list-icon-size:17px;--icon-vertical-align:flex-start;--icon-vertical-offset:0px;}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-icon{padding-inline-end:0px;}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-item > .elementor-icon-list-text, .elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-6129 .elementor-element.elementor-element-fe88f7e .elementor-icon-list-text{transition:color 0.3s;}.elementor-6129 .elementor-element.elementor-element-f86ecbd .elementor-button{background-color:var( --e-global-color-7eee4be );font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;fill:#FFFFFF;color:#FFFFFF;border-radius:10px 10px 10px 10px;padding:15px 15px 15px 15px;}.elementor-6129 .elementor-element.elementor-element-f86ecbd .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-6129 .elementor-element.elementor-element-f86ecbd .elementor-button:hover, .elementor-6129 .elementor-element.elementor-element-f86ecbd .elementor-button:focus{color:#000000;}.elementor-6129 .elementor-element.elementor-element-f86ecbd .elementor-button:hover svg, .elementor-6129 .elementor-element.elementor-element-f86ecbd .elementor-button:focus svg{fill:#000000;}.elementor-6129 .elementor-element.elementor-element-3380d83{--display:flex;--border-radius:10px 10px 10px 10px;box-shadow:0px 2px 5px 0px rgba(178, 34.00000000000002, 34.00000000000002, 0.34);}.elementor-6129 .elementor-element.elementor-element-3380d83.e-con{--align-self:flex-start;}.elementor-6129 .elementor-element.elementor-element-dd940c7{--display:flex;}.elementor-6129 .elementor-element.elementor-element-942fffa{--display:flex;}.elementor-6129 .elementor-element.elementor-element-942fffa.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-6129 .elementor-element.elementor-element-efad5f7{font-family:"DM Sans", Sans-serif;font-weight:400;color:#000000;}.elementor-6129 .elementor-element.elementor-element-86457bf .elementor-heading-title{font-family:"DM Sans", Sans-serif;font-weight:700;color:var( --e-global-color-7eee4be );}.elementor-6129 .elementor-element.elementor-element-d16c84f{--display:flex;}.elementor-6129 .elementor-element.elementor-element-d16c84f.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-6129 .elementor-element.elementor-element-4ee9fdb .elementor-button{background-color:var( --e-global-color-7eee4be );font-family:"DM Sans", Sans-serif;font-size:15px;font-weight:500;fill:#FFFFFF;color:#FFFFFF;border-radius:10px 10px 10px 10px;padding:15px 15px 15px 15px;}.elementor-6129 .elementor-element.elementor-element-4ee9fdb .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-6129 .elementor-element.elementor-element-4ee9fdb .elementor-button:hover, .elementor-6129 .elementor-element.elementor-element-4ee9fdb .elementor-button:focus{color:#000000;}.elementor-6129 .elementor-element.elementor-element-4ee9fdb .elementor-button:hover svg, .elementor-6129 .elementor-element.elementor-element-4ee9fdb .elementor-button:focus svg{fill:#000000;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-6129 .elementor-element.elementor-element-6f0af67.elementor-skin-slideshow .elementor-main-swiper:not(.elementor-thumbnails-swiper){margin-bottom:10px;}}@media(max-width:767px){.elementor-6129 .elementor-element.elementor-element-0add1ee{--width:100%;}.elementor-6129 .elementor-element.elementor-element-2130790 .elementor-heading-title{font-size:40px;}.elementor-6129 .elementor-element.elementor-element-dd20a7f .elementor-heading-title{font-size:15px;}.elementor-6129 .elementor-element.elementor-element-2477b37{width:var( --container-widget-width, 220px );max-width:220px;--container-widget-width:220px;--container-widget-flex-grow:0;}.elementor-6129 .elementor-element.elementor-element-2477b37 .elementor-heading-title{font-size:15px;}.elementor-6129 .elementor-element.elementor-element-6f0af67.elementor-skin-slideshow .elementor-main-swiper:not(.elementor-thumbnails-swiper){margin-bottom:10px;}.elementor-6129 .elementor-element.elementor-element-fe4166a{--width:322px;--justify-content:space-around;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0{width:var( --container-widget-width, 347.111px );max-width:347.111px;--container-widget-width:347.111px;--container-widget-flex-grow:0;}.elementor-6129 .elementor-element.elementor-element-3d9f8f0 .eael-data-table tbody tr td{padding:8px 8px 8px 8px;font-size:12px;}.elementor-6129 .elementor-element.elementor-element-4f15e83{width:var( --container-widget-width, 301.514px );max-width:301.514px;--container-widget-width:301.514px;--container-widget-flex-grow:0;}.elementor-6129 .elementor-element.elementor-element-4f15e83 .eael-data-table tbody tr td{padding:8px 8px 8px 8px;font-size:12px;}.elementor-6129 .elementor-element.elementor-element-f86ecbd{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 30px;}.elementor-6129 .elementor-element.elementor-element-3380d83{--width:100%;--min-height:0px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-evenly;--border-radius:8% 8% 08% 8%;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6129 .elementor-element.elementor-element-dd940c7{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-6129 .elementor-element.elementor-element-942fffa{--width:40%;--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-6129 .elementor-element.elementor-element-efad5f7{font-size:15px;}.elementor-6129 .elementor-element.elementor-element-86457bf{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6129 .elementor-element.elementor-element-86457bf .elementor-heading-title{font-size:17px;}.elementor-6129 .elementor-element.elementor-element-d16c84f{--width:53%;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-6129 .elementor-element.elementor-element-4ee9fdb{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-6129 .elementor-element.elementor-element-4ee9fdb .elementor-button{font-size:15px;}}@media(min-width:768px){.elementor-6129 .elementor-element.elementor-element-a45b9a5{--content-width:80%;}.elementor-6129 .elementor-element.elementor-element-7ec273a{--width:60%;}.elementor-6129 .elementor-element.elementor-element-2a2292c{--width:100%;}.elementor-6129 .elementor-element.elementor-element-a5a4e25{--width:40%;}.elementor-6129 .elementor-element.elementor-element-7fee471{--width:100%;}.elementor-6129 .elementor-element.elementor-element-3380d83{--width:80%;}}/* Start custom CSS for container, class: .elementor-element-0add1ee *//* =====================================================================
TOUR POST — HERO SECTION — MAI KEBALI TOUR (v2.0 — Maroon & Putih)
Tempel di: Container HERO (yang paling atas) > Advanced > Custom CSS
(GANTI seluruh CSS v1.0 / Azure)
---------------------------------------------------------------------
CSS CLASS PER ELEMEN (isi di Advanced > CSS Classes) — SAMA SEPERTI v1.0
---------------------------------------------------------------------
Container (hero) .......................... mkt-th
├─ Heading (judul tour) ................... mkt-th-title
└─ Container (baris breadcrumb / chip) .... mkt-th-meta
├─ Heading (label, mis. "Home") ....... mkt-th-meta-label
├─ Icon (pemisah, mis. ») ............ mkt-th-meta-icon
└─ Heading (teks, mis. judul tour) .... mkt-th-meta-text
---------------------------------------------------------------------
YANG BERUBAH di v2.0
- Nuansa dari biru-navy menjadi MAROON & PUTIH (tanpa emas/oranye;
warna bintang kuning dihapus, ikon jadi blush/putih).
- Lapisan gelap kini maroon-gelap + lapisan maroon tipis di atas foto
agar foto (yang oranye) terlihat menyatu dengan nuansa maroon.
- Judul memakai El Messiri, kata di bergradasi putih → blush.
- Garis aksen di bawah judul punya kotak kecil di tengah.
- Chip breadcrumb kaca maroon, tautan berubah blush saat hover.
- Tampil rapi di desktop, tablet, HP, dan HP kecil.
CARA KERJA
- Foto latar, Background Overlay, dan Shape Divider (gelombang) tetap
diatur dari panel. CSS ini TIDAK memakai ::before milik container,
jadi overlay panel tetap jalan.
- Lapisan gelap lewat ::after. Atur kekuatannya: --th-shade (0 - 1).
- Tanpa foto, hero otomatis memakai gradien maroon.
RINGAN
- Tanpa backdrop-filter, tanpa filter blur, tanpa JavaScript.
- Animasi hanya opacity/translate (sekali saat halaman dibuka).
TIDAK DIKUNCI
- Tanpa !important (kecuali pada mode "kurangi gerakan"). Selector
memakai :where(), jadi pengaturan panel (font, ukuran, warna, jarak,
lebar, border, radius, tinggi) menang.
===================================================================== */
/* ---------------------------------------------------------------------
1. PUSAT KENDALI
--------------------------------------------------------------------- */
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee).e-con {
/* Warna (maroon, putih, blush) */
--th-maroon: #74142A;
--th-maroon-light: #A32244;
--th-maroon-dark: #4A0C1B;
--th-maroon-deep: #240510; /* sisi tergelap lapisan gelap */
--th-rgb: 116, 20, 42;
--th-white: #FFFFFF;
--th-blush: #F4D3DB;
/* Font */
--th-font-display: "El Messiri", Georgia, serif;
--th-font-body: "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;
/* Teks eyebrow di atas judul ("" = sembunyikan) */
--th-eyebrow: "PRIVATE TOUR PACKAGE";
--th-eyebrow-gap: 20px;
/* Kekuatan lapisan gelap (0 - 1) */
--th-shade: 1;
/* Lapisan maroon tipis di atas foto (0 = tanpa, .4 = lebih maroon) */
--th-tint: .26;
--th-ease: cubic-bezier(.22, .75, .2, 1);
position: relative;
width: 100%;
overflow: hidden;
isolation: isolate;
box-sizing: border-box;
font-family: var(--th-font-body);
color: var(--th-white);
/* cadangan jika belum ada foto latar */
background-color: var(--th-maroon-dark);
background-image: linear-gradient(135deg, #4A0C1B 0%, #74142A 58%, #A32244 100%);
background-size: cover;
background-position: center;
--min-height: clamp(380px, 46vw, 540px);
--padding-top: clamp(96px, 11vw, 150px);
--padding-bottom: clamp(120px, 13vw, 190px); /* ruang untuk gelombang */
--padding-left: clamp(22px, 5vw, 82px);
--padding-right: clamp(22px, 5vw, 82px);
--flex-direction: column;
--align-items: center;
--justify-content: center;
--gap: 20px;
--row-gap: 20px;
}
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee) *,
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee) *::before,
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee) *::after {
box-sizing: border-box;
}
/* Shape Divider (gelombang) selalu di atas lapisan lain */
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee) .elementor-shape {
z-index: 2;
}
/* ---------------------------------------------------------------------
2. LAPISAN GELAP + MAROON TIPIS (::after — ::before dibiarkan untuk
overlay panel)
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-0add1ee::after {
content: "";
position: absolute;
inset: 0;
z-index: -1;
pointer-events: none;
opacity: var(--th-shade);
background:
radial-gradient(60% 55% at 50% 42%, rgba(36, 5, 16, .30) 0%, transparent 70%),
linear-gradient(180deg, rgba(36, 5, 16, .58) 0%, rgba(36, 5, 16, .24) 46%, rgba(36, 5, 16, .66) 100%),
linear-gradient(rgba(var(--th-rgb), var(--th-tint)), rgba(var(--th-rgb), var(--th-tint)));
}
/* ---------------------------------------------------------------------
3. JUDUL — .mkt-th-title (Heading widget, rata tengah)
Alignment default di wrapper -> kontrol "Alignment" panel tetap menang.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-title) {
width: 100%;
max-width: 980px;
min-width: 0;
margin: 0;
text-align: center;
animation: thIn .9s var(--th-ease) both;
}
/* eyebrow: garis di kedua sisi + teks */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-title)::before {
content: var(--th-eyebrow);
display: inline-block;
white-space: pre;
margin-bottom: var(--th-eyebrow-gap);
padding: 0 52px;
background:
linear-gradient(90deg, var(--th-white), var(--th-blush)) left center / 38px 2px no-repeat,
linear-gradient(270deg, var(--th-white), var(--th-blush)) right center / 38px 2px no-repeat;
font-family: var(--th-font-body);
font-size: clamp(10.5px, .8vw, 12.5px);
font-weight: 600;
line-height: 1.3;
letter-spacing: .24em;
text-transform: uppercase;
color: var(--th-blush);
pointer-events: none;
user-select: none;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-title .elementor-heading-title) {
margin: 0;
font-family: var(--th-font-display);
font-size: clamp(34px, 4.8vw, 68px);
font-weight: 600;
line-height: 1.08;
letter-spacing: -.012em;
color: var(--th-white);
text-shadow: 0 6px 30px rgba(36, 5, 16, .5);
text-wrap: balance;
}
/* kata di dalam bergradasi putih -> blush */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-title .elementor-heading-title span) {
background: linear-gradient(90deg, var(--th-white) 0%, var(--th-blush) 100%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
text-shadow: none;
}
/* garis aksen di bawah judul: garis memudar + kotak kecil di tengah */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-title)::after {
content: "";
display: inline-block;
vertical-align: top;
width: 150px;
height: 8px;
margin-top: 22px;
background:
linear-gradient(90deg, transparent 0%, var(--th-white) 50%, transparent 100%) center / 100% 2px no-repeat,
linear-gradient(var(--th-white), var(--th-white)) center / 8px 8px no-repeat;
}
/* ---------------------------------------------------------------------
4. CHIP BREADCRUMB — .mkt-th-meta (Container: label + ikon + teks)
Kaca maroon tanpa blur (ringan). Border & radius lewat variabel
Elementor supaya tetap bisa diubah dari panel.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta) {
--width: fit-content;
--flex-direction: row;
--flex-wrap: nowrap;
--align-items: center;
--justify-content: center;
--gap: 10px;
--column-gap: 10px;
--row-gap: 10px;
--padding-top: 9px;
--padding-right: 22px;
--padding-bottom: 9px;
--padding-left: 22px;
--border-style: solid;
--border-color: rgba(255, 255, 255, .34);
--border-top-width: 1px;
--border-right-width: 1px;
--border-bottom-width: 1px;
--border-left-width: 1px;
--border-radius: 999px;
max-width: 100%;
background: rgba(36, 5, 16, .42);
box-shadow: 0 14px 30px -18px rgba(36, 5, 16, .8), inset 0 1px 0 rgba(255, 255, 255, .2);
animation: thIn .9s var(--th-ease) .14s both;
}
/* cadangan border & radius (specificity nol; kalah oleh variabel Elementor) */
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee .mkt-th-meta) {
border: 1px solid rgba(255, 255, 255, .34);
border-radius: 999px;
}
/* isi chip: lebar mengikuti isi */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta > .elementor-widget) {
width: auto;
flex: 0 0 auto;
min-width: 0;
margin: 0;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta-label .elementor-heading-title) {
margin: 0;
font-family: var(--th-font-body);
font-size: 12px;
font-weight: 600;
line-height: 1.2;
letter-spacing: .18em;
text-transform: uppercase;
color: var(--th-blush);
}
/* ikon pemisah: ukuran lewat font-size (kontrol "Size" panel menang) */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta-icon .elementor-icon) {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 18px;
line-height: 1;
color: var(--th-blush);
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta-icon .elementor-icon svg) {
width: 1em;
height: 1em;
fill: currentColor;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta-text .elementor-heading-title) {
margin: 0;
font-family: var(--th-font-body);
font-size: 15px;
font-weight: 600;
line-height: 1.2;
letter-spacing: .01em;
color: var(--th-white);
}
/* tautan di dalam chip ikut warna teks, berubah blush saat hover (mouse) */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta a) {
color: inherit;
text-decoration: none;
transition: color .3s ease;
}
@media (hover: hover) {
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta a:hover) {
color: var(--th-blush);
}
}
/* ---------------------------------------------------------------------
5. ANIMASI MASUK (sekali, saat halaman dibuka)
--------------------------------------------------------------------- */
@keyframes thIn {
from { opacity: 0; translate: 0 22px; }
to { opacity: 1; translate: 0 0; }
}
/* =====================================================================
RESPONSIVE
===================================================================== */
/* ---------- TABLET 768 - 1024 ---------- */
@media (min-width: 768px) and (max-width: 1024px) {
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee).e-con {
--min-height: 400px;
--padding-top: 100px;
--padding-bottom: 128px;
--padding-left: clamp(30px, 4.5vw, 46px);
--padding-right: clamp(30px, 4.5vw, 46px);
}
}
/* ---------- MOBILE <= 767px ---------- */
@media (max-width: 767px) {
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee).e-con {
--min-height: 340px;
--padding-top: 86px;
--padding-bottom: 104px;
--padding-left: clamp(18px, 5.2vw, 24px);
--padding-right: clamp(18px, 5.2vw, 24px);
--gap: 16px;
--row-gap: 16px;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-title)::before {
margin-bottom: 16px;
padding: 0 40px;
background-size: 28px 2px, 28px 2px;
font-size: 10px;
letter-spacing: .17em;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-title .elementor-heading-title) {
font-size: clamp(30px, 8.6vw, 40px);
line-height: 1.12;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-title)::after {
width: 100px;
margin-top: 18px;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta) {
--padding-top: 8px;
--padding-right: 16px;
--padding-bottom: 8px;
--padding-left: 16px;
--gap: 8px;
--column-gap: 8px;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta-label .elementor-heading-title) {
font-size: 10.5px;
letter-spacing: .14em;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta-icon .elementor-icon) {
font-size: 16px;
}
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta-text .elementor-heading-title) {
font-size: 13.5px;
}
}
/* ---------- HP KECIL <= 374px ---------- */
@media (max-width: 374px) {
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee).e-con {
--padding-top: 76px;
--padding-bottom: 92px;
}
/* chip boleh turun baris bila terlalu sempit */
.elementor-6129 .elementor-element.elementor-element-0add1ee :where(.mkt-th-meta) {
--flex-wrap: wrap;
}
}
/* ---------------------------------------------------------------------
6. REDUCED MOTION / SELECTION
--------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
:where(.elementor-6129 .elementor-element.elementor-element-0add1ee) * {
animation-duration: .01ms;
animation-iteration-count: 1;
}
}
.elementor-6129 .elementor-element.elementor-element-0add1ee ::selection {
background: var(--th-blush);
color: var(--th-maroon-dark);
}
/* =====================================================================
CATATAN PEMAKAIAN
1. Foto latar, Background Overlay, dan Shape Divider (gelombang):
atur dari panel seperti biasa. Jika gelombang menutupi teks,
tambah --padding-bottom (blok 1) atau padding bawah dari panel.
2. Teks eyebrow: --th-eyebrow. Kosongkan ("") untuk menyembunyikan.
3. Judul boleh memakai untuk gradasi, misalnya:
Ubud Cultural Tour
4. Lapisan gelap: --th-shade (0 - 1). Jika kamu sudah memakai
Background Overlay dari panel dan terlalu gelap, isi 0.
Lapisan maroon tipis di atas foto: --th-tint (0 - .4).
5. Label, ikon, dan teks di chip breadcrumb boleh dikosongkan salah
satu; chip menyesuaikan lebarnya.
===================================================================== *//* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-a45b9a5 *//* =====================================================================
TOUR POST — ISI KONTEN — MAI KEBALI TOUR (v2.0 — Maroon & Putih)
Tempel di: Container ISI (container utama) > Advanced > Custom CSS
GANTI SEMUA CSS lama dengan file ini.
---------------------------------------------------------------------
CSS CLASS PER ELEMEN (isi di Advanced > CSS Classes) — SAMA SEPERTI v1.4
---------------------------------------------------------------------
Container (utama isi) ..................... mkt-tp
├─ Container (KOLOM KIRI) ................. mkt-tp-left
│ ├─ Media Carousel ..................... mkt-tp-gallery
│ ├─ Container (4 tombol info) .......... mkt-tp-badges
│ │ └─ Button x4 ...................... mkt-tp-badge
│ ├─ Container (2 tabel kendaraan) ...... mkt-tp-tables
│ │ └─ Data Table x2 .................. mkt-tp-table
│ ├─ Heading (Top Highlight) ............ mkt-tp-sec
│ ├─ Icon List (Top Highlight) .......... mkt-tp-list mkt-tp-list--pin
│ ├─ Text Editor ........................ mkt-tp-text
│ └─ Container (Promise) ................ mkt-tp-share
│ ├─ Icon ........................... mkt-tp-share-icon
│ ├─ Heading ........................ mkt-tp-share-title
│ └─ Button x4 ...................... mkt-tp-share-btn
└─ Container (KOLOM KANAN) ................ mkt-tp-right
├─ Heading (Price: IDR ...) ........... mkt-tp-price
├─ Heading Suggested Itinerary ........ mkt-tp-sec
├─ Icon List Suggested Itinerary ...... mkt-tp-list mkt-tp-list--route
├─ Heading Notes ...................... mkt-tp-sec
├─ Icon List Notes .................... mkt-tp-list mkt-tp-list--note
├─ Heading Inclusion .................. mkt-tp-sec
├─ Icon List Inclusion ................ mkt-tp-list mkt-tp-list--yes
├─ Heading Exclusion .................. mkt-tp-sec
├─ Icon List Exclusion ................ mkt-tp-list mkt-tp-list--no
├─ Heading Pick Up Area & Time ........ mkt-tp-sec
├─ Icon List Pick Up Area & Time ...... mkt-tp-list mkt-tp-list--pin
├─ Heading What To Bring .............. mkt-tp-sec
├─ Icon List What To Bring ............ mkt-tp-list mkt-tp-list--pin
├─ Heading Important Information ...... mkt-tp-sec
├─ Icon List Important Information .... mkt-tp-list mkt-tp-list--info
└─ Container (info + booking) ......... mkt-tp-book
├─ Icon List ...................... mkt-tp-book-list
└─ Button ......................... mkt-tp-book-btn
YANG BERUBAH di v2.0
- Nuansa dari biru-navy menjadi MAROON & PUTIH. TIDAK ADA emas,
oranye, kuning, hijau, merah, atau biru lagi (kotak Notes & ikon
Promise yang dulu kuning/emas kini maroon).
- Bentuk "daun" diagonal (sudut kiri-atas & kanan-bawah membulat)
di kartu kanan, galeri, tabel, tombol info, blok Promise.
- Galeri: foto utama berbingkai putih + cincin maroon, kilau saat
hover, thumbnail berkerudung putih (aktif = bingkai maroon),
panah kotak maroon.
- Tombol Booking & tombol Promise berbentuk KOTAK seperti Hero
(isian meluncur saat hover).
- Body sama dengan section lain: putih + cahaya maroon tipis +
watermark bergaris tipis "TOUR DETAILS".
- Lebih ringan: tanpa mask-image besar, tanpa animasi tak berujung,
tanpa blur/filter.
TIDAK DIKUNCI
- Tanpa !important, kecuali 3 properti LEBAR struktural pada tabel.
Font, ukuran, warna, jarak, border, radius, ikon, tipografi:
semuanya bisa diubah dari panel Elementor (panel selalu menang).
- Kosongkan field di panel bila ingin kembali ke gaya bawaan CSS ini.
- Warna ikon list: variabel --e-icon-list-icon-color (panel
"Icon > Color" juga memakai variabel ini).
===================================================================== */
/* ---------------------------------------------------------------------
1. PUSAT KENDALI
--------------------------------------------------------------------- */
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5).e-con {
/* Warna (maroon, putih, blush) */
--tp-maroon: #74142A;
--tp-maroon-dark: #4A0C1B;
--tp-maroon-light: #A32244;
--tp-rgb: 116, 20, 42;
--tp-blush: #F4D3DB;
--tp-tint: #FBF3F5;
--tp-white: #FFFFFF;
/* gradasi utama (header tabel + 4 tombol info + banner harga) */
--tp-grad: linear-gradient(110deg, #4A0C1B 0%, #74142A 58%, #A32244 100%);
--tp-text: #2B1519;
--tp-muted: rgba(43, 21, 25, .74);
--tp-soft: rgba(43, 21, 25, .56);
--tp-font-display: "El Messiri", Georgia, serif;
--tp-font-body: "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;
/* Watermark */
--tp-watermark-no: "10"; /* angka besar di kartu kanan ("" = hilang) */
--tp-watermark-word: "Tour Details"; /* kata besar di bawah ("" = hilang) */
--tp-watermark-size: clamp(64px, 10.5vw, 180px);
--tp-wm-stroke: rgba(var(--tp-rgb), .13);
/* Ukuran & bentuk */
--tp-max-width: 1320px;
--tp-pad-bottom: clamp(100px, 12vw, 190px); /* ruang untuk watermark */
--tp-card-radius: 6px 34px 6px 34px; /* kartu kanan, Promise */
--tp-gal-radius: 6px 34px 6px 34px; /* foto utama galeri */
--tp-block-radius: 4px 22px 4px 22px; /* tabel, banner, booking */
--tp-chip-radius: 4px 16px 4px 16px; /* tombol info, baris list */
--tp-tbl-cols: 2;
--tp-ease: cubic-bezier(.22, .75, .2, 1);
position: relative;
width: 100%;
overflow: hidden;
isolation: isolate;
box-sizing: border-box;
font-family: var(--tp-font-body);
color: var(--tp-text);
background: linear-gradient(180deg, var(--tp-white) 0%, var(--tp-tint) 100%);
--padding-top: clamp(44px, 5vw, 76px);
--padding-bottom: var(--tp-pad-bottom);
--padding-left: max(clamp(22px, 5vw, 82px), calc((100% - var(--tp-max-width)) / 2));
--padding-right: max(clamp(22px, 5vw, 82px), calc((100% - var(--tp-max-width)) / 2));
--flex-direction: row;
--flex-wrap: nowrap;
--align-items: flex-start;
--justify-content: space-between;
--gap: clamp(28px, 3.4vw, 56px);
--column-gap: clamp(28px, 3.4vw, 56px);
--row-gap: 40px;
}
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5) *,
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5) *::before,
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5) *::after {
box-sizing: border-box;
}
/* ---------------------------------------------------------------------
2. CAHAYA MAROON + WATERMARK KATA
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5::before {
content: "";
position: absolute;
inset: auto;
top: clamp(-330px, -15vw, -120px);
right: clamp(-450px, -21vw, -180px);
z-index: -3;
width: clamp(440px, 56vw, 920px);
height: clamp(440px, 56vw, 920px);
pointer-events: none;
border-radius: 50%;
background: radial-gradient(circle, rgba(var(--tp-rgb), .10) 0%, rgba(var(--tp-rgb), .04) 40%, transparent 70%);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5::after {
content: var(--tp-watermark-word);
position: absolute;
inset: auto auto -.2em -.02em;
z-index: -4;
pointer-events: none;
user-select: none;
font-family: var(--tp-font-display);
font-size: var(--tp-watermark-size);
font-weight: 400;
line-height: 1;
letter-spacing: -.02em;
white-space: nowrap;
color: transparent;
-webkit-text-stroke: 1px var(--tp-wm-stroke);
}
/* ---------------------------------------------------------------------
3. DUA KOLOM
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-left) {
--width: 57%;
--flex-direction: column;
--align-items: stretch;
--justify-content: flex-start;
--gap: clamp(22px, 2.4vw, 32px);
--row-gap: clamp(22px, 2.4vw, 32px);
--padding-top: 0px;
--padding-right: 0px;
--padding-bottom: 0px;
--padding-left: 0px;
position: relative;
min-width: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-right) {
--width: 38%;
--flex-direction: column;
--align-items: stretch;
--justify-content: flex-start;
--gap: 12px;
--row-gap: 12px;
--padding-top: clamp(20px, 2.2vw, 30px);
--padding-right: clamp(20px, 2.2vw, 30px);
--padding-bottom: clamp(22px, 2.4vw, 32px);
--padding-left: clamp(20px, 2.2vw, 30px);
--border-style: solid;
--border-color: rgba(var(--tp-rgb), .18);
--border-top-width: 1px;
--border-right-width: 1px;
--border-bottom-width: 1px;
--border-left-width: 1px;
--border-radius: var(--tp-card-radius);
position: relative;
min-width: 0;
background-image:
linear-gradient(90deg, var(--tp-maroon), var(--tp-maroon-light)),
linear-gradient(165deg, rgba(255, 255, 255, .96) 0%, rgba(251, 243, 245, .92) 100%);
background-repeat: no-repeat;
background-position: 30px 0, 0 0;
background-size: 52px 3px, 100% 100%;
box-shadow:
0 28px 56px -32px rgba(var(--tp-rgb), .5),
inset 0 1px 0 rgba(255, 255, 255, .9);
}
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-right) {
border: 1px solid rgba(var(--tp-rgb), .18);
border-radius: var(--tp-card-radius);
}
/* angka besar bergaris tipis di sudut kanan atas kartu */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-right)::after {
content: var(--tp-watermark-no);
position: absolute;
right: 0;
top: -66px;
z-index: -1;
pointer-events: none;
user-select: none;
font-family: var(--tp-font-display);
font-size: clamp(70px, 8vw, 125px);
line-height: 1;
letter-spacing: -.04em;
color: transparent;
-webkit-text-stroke: 1px rgba(var(--tp-rgb), .16);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-left > .elementor-widget, .mkt-tp-right > .elementor-widget) {
width: 100%;
min-width: 0;
margin: 0;
}
/* ---------------------------------------------------------------------
4. GALERI — .mkt-tp-gallery (Media Carousel)
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-main-swiper) {
overflow: hidden;
border-radius: var(--tp-gal-radius);
box-shadow:
0 0 0 5px var(--tp-white),
0 0 0 6px rgba(var(--tp-rgb), .28),
0 32px 60px -32px rgba(var(--tp-rgb), .65);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-main-swiper .swiper-slide) {
position: relative;
overflow: hidden;
}
/* gradasi maroon tipis di bawah foto utama */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-main-swiper .swiper-slide)::before {
content: "";
position: absolute;
inset: 0;
z-index: 1;
background: linear-gradient(180deg, rgba(74, 12, 27, 0) 58%, rgba(74, 12, 27, .4) 100%);
pointer-events: none;
}
/* kilau diagonal (diam di luar layar; menyapu saat hover, lihat bagian 13) */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-main-swiper .swiper-slide)::after {
content: "";
position: absolute;
inset: 0;
z-index: 2;
background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, .4) 50%, transparent 62%);
transform: translateX(-130%);
pointer-events: none;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-thumbnails-swiper) {
margin-top: 16px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-thumbnails-swiper .swiper-slide) {
position: relative;
overflow: hidden;
cursor: pointer;
border-radius: 4px 14px 4px 14px;
box-shadow: 0 0 0 1px rgba(var(--tp-rgb), .2);
transition: box-shadow .35s ease, transform .35s var(--tp-ease);
}
/* kerudung putih pada thumbnail yang tidak aktif */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-thumbnails-swiper .swiper-slide)::before {
content: "";
position: absolute;
inset: 0;
z-index: 1;
background: rgba(255, 255, 255, .45);
transition: opacity .35s ease;
pointer-events: none;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-thumbnails-swiper .swiper-slide-thumb-active) {
box-shadow:
0 0 0 2px var(--tp-maroon),
0 12px 22px -12px rgba(var(--tp-rgb), .7);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-thumbnails-swiper .swiper-slide-thumb-active)::before {
opacity: 0;
}
/* panah kotak maroon */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-swiper-button) {
display: inline-flex;
align-items: center;
justify-content: center;
width: 42px;
height: 42px;
font-size: 16px;
border: 1.5px solid rgba(255, 255, 255, .7);
border-radius: 0;
color: var(--tp-white);
background: var(--tp-maroon);
transition: background-color .3s ease, color .3s ease;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery) .elementor-swiper-button svg {
fill: currentColor;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .swiper-pagination-bullet) {
width: 7px;
height: 7px;
border-radius: 999px;
background: rgba(var(--tp-rgb), .4);
opacity: 1;
transition: width .4s var(--tp-ease), background .3s ease;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .swiper-pagination-bullet-active) {
width: 26px;
background: var(--tp-maroon);
}
/* ---------------------------------------------------------------------
5. TOMBOL INFO — .mkt-tp-badges / .mkt-tp-badge (4 Button)
Gradasi sama dengan header tabel (variabel --tp-grad).
Grid otomatis: 4 sejajar jika cukup, kalau tidak 2 x 2.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badges, .mkt-tp-badges > .e-con-inner) {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 148px), 1fr));
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badges) {
--width: 100%;
--display: grid;
--align-items: stretch;
--justify-content: normal;
--gap: 10px;
--column-gap: 10px;
--row-gap: 10px;
--padding-top: 0px;
--padding-right: 0px;
--padding-bottom: 0px;
--padding-left: 0px;
min-width: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badges > .elementor-widget) {
width: 100%;
min-width: 0;
margin: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badge .elementor-button) {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 12px 14px;
border: 0;
border-radius: var(--tp-chip-radius);
background-color: var(--tp-maroon);
background-image: var(--tp-grad);
background-size: 170% 100%;
background-position: 0% 50%;
background-repeat: no-repeat;
color: var(--tp-white);
font-family: var(--tp-font-body);
font-size: 13.5px;
font-weight: 600;
line-height: 1.2;
letter-spacing: .01em;
box-shadow: 0 14px 26px -16px rgba(var(--tp-rgb), .85), inset 0 1px 0 rgba(255, 255, 255, .2);
transition: transform .4s var(--tp-ease), box-shadow .4s ease, background-position .6s var(--tp-ease);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badge .elementor-button-content-wrapper) {
align-items: center;
justify-content: center;
gap: 8px;
}
/* ---------------------------------------------------------------------
6. TABEL KENDARAAN — .mkt-tp-tables / .mkt-tp-table (2 Data Table)
Hanya LEBAR (grid & tabel) yang dikunci agar tidak menyempit;
font, warna, border, jarak tetap bisa diubah lewat variabel --tb-*.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-tables, .mkt-tp-tables > .e-con-inner) {
display: grid;
grid-template-columns: repeat(var(--tp-tbl-cols), minmax(0, 1fr));
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-tables) {
--width: 100%;
--display: grid;
--align-items: start;
--justify-content: normal;
--gap: 16px;
--column-gap: 16px;
--row-gap: 16px;
--padding-top: 0px;
--padding-right: 0px;
--padding-bottom: 0px;
--padding-left: 0px;
min-width: 0;
}
/* lebar widget tabel = selebar kolom grid (struktural) */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-tables > .elementor-widget,
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-tables > .e-con-inner > .elementor-widget {
--container-widget-width: 100%;
--container-widget-flex-grow: 1;
width: 100% !important;
max-width: 100% !important;
min-width: 0;
margin: 0;
justify-self: stretch;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-table) {
overflow: hidden;
border: 1px solid rgba(var(--tp-rgb), .22);
border-radius: var(--tp-block-radius);
background: var(--tp-white);
box-shadow: 0 18px 36px -26px rgba(var(--tp-rgb), .5);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-table .elementor-widget-container) {
width: 100%;
overflow-x: auto;
}
/* variabel tabel — ubah di sini (atau override di panel container) */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-table) {
--tb-font: 15px;
--tb-pad-x: 22px;
--tb-pad-y: 14px;
--tb-text: rgba(43, 21, 25, .84);
--tb-line: rgba(var(--tp-rgb), .13);
--tb-zebra: rgba(var(--tp-rgb), .045);
--tb-hover: rgba(var(--tp-rgb), .10);
}
/* Selector tabel sengaja dibuat lebih kuat (class diulang) agar menang
dari gaya bawaan plugin Data Table. Ubah tampilan lewat variabel --tb-*. */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table table {
width: 100% !important;
max-width: 100%;
margin: 0;
border: 0;
border-collapse: collapse;
border-spacing: 0;
background: transparent;
font-family: var(--tp-font-body);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table :is(thead, tbody, tfoot, tr) {
border: 0;
background: transparent;
box-shadow: none;
}
/* ---- HEADER ---- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table th {
position: relative;
overflow: hidden;
padding: 17px var(--tb-pad-x);
border: 0;
text-align: left;
vertical-align: middle;
font-family: var(--tp-font-body);
font-size: calc(var(--tb-font) + 1px);
font-weight: 600;
line-height: 1.3;
letter-spacing: .01em;
color: var(--tp-white);
background: var(--tp-grad);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table th * {
margin: 0;
color: inherit;
}
/* ikon mobil di awal header (hapus blok ini jika tidak diinginkan) */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table th:first-child::before {
content: "";
display: inline-block;
width: 30px;
height: 30px;
margin-right: 12px;
vertical-align: middle;
border-radius: 50%;
background:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M18.92 6.01C18.72 5.42 18.16 5 17.5 5h-11c-.66 0-1.21.42-1.42 1.01L3 12v8c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-1h12v1c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-8l-2.08-5.99zM6.5 16c-.83 0-1.5-.67-1.5-1.5S5.67 13 6.5 13s1.5.67 1.5 1.5S7.33 16 6.5 16zm11 0c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zM5 11l1.5-4.5h11L19 11H5z'/%3E%3C/svg%3E")
center / 16px 16px no-repeat,
rgba(255, 255, 255, .18);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3);
}
/* titik-titik dekoratif di kanan header */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table th::after {
content: "";
position: absolute;
right: -6px;
top: -6px;
width: 150px;
height: 100px;
pointer-events: none;
background-image: radial-gradient(rgba(255, 255, 255, .32) 1.4px, transparent 1.4px);
background-size: 14px 14px;
-webkit-mask-image: linear-gradient(225deg, black 8%, transparent 70%);
mask-image: linear-gradient(225deg, black 8%, transparent 70%);
}
/* ---- BARIS ---- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table td {
position: relative;
padding: var(--tb-pad-y) var(--tb-pad-x);
border: 0;
border-top: 1px solid var(--tb-line);
text-align: left;
vertical-align: middle;
font-family: var(--tp-font-body);
font-size: var(--tb-font);
font-weight: 400;
line-height: 1.5;
color: var(--tb-text);
background: var(--tp-white);
transition: background .3s ease, color .3s ease, box-shadow .3s ease;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table td * {
margin: 0;
font: inherit;
color: inherit;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table tbody tr:nth-child(even) td {
background: var(--tb-zebra);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table tbody tr:hover td {
background: var(--tb-hover);
color: var(--tp-maroon-dark);
}
/* penanda tipis di sisi kiri baris saat hover */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-table.mkt-tp-table.mkt-tp-table tbody tr:hover td:first-child {
box-shadow: inset 3px 0 0 var(--tp-maroon);
}
/* ---------------------------------------------------------------------
7. JUDUL BAGIAN — .mkt-tp-sec (Heading widget)
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-sec) {
margin-top: clamp(8px, 1.2vw, 16px);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-sec .elementor-heading-title) {
display: flex;
align-items: center;
gap: 14px;
margin: 0;
font-family: var(--tp-font-display);
font-size: clamp(22px, 1.9vw, 28px);
font-weight: 600;
line-height: 1.15;
letter-spacing: -.01em;
color: var(--tp-maroon);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-sec .elementor-heading-title)::before {
content: "";
flex: 0 0 auto;
width: 5px;
height: 1.05em;
border-radius: 999px;
background: linear-gradient(180deg, var(--tp-maroon-light), var(--tp-maroon) 55%, var(--tp-maroon-dark));
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-sec .elementor-heading-title)::after {
content: "";
flex: 1 1 auto;
min-width: 24px;
height: 1px;
background: linear-gradient(90deg, rgba(var(--tp-rgb), .4), transparent);
}
/* ---------------------------------------------------------------------
8. BANNER HARGA — .mkt-tp-price (Heading widget)
Jika teks harga tetap gelap: kosongkan "Text Color" heading di panel
(atau set putih) — warna panel selalu menang.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-price) {
position: relative;
overflow: hidden;
isolation: isolate;
margin-bottom: 6px;
border-radius: var(--tp-block-radius);
background: linear-gradient(115deg, #4A0C1B 0%, #74142A 48%, #A32244 100%);
box-shadow:
0 22px 42px -24px rgba(var(--tp-rgb), .8),
inset 0 1px 0 rgba(255, 255, 255, .24);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-price)::before {
content: "";
position: absolute;
right: -8px;
top: -8px;
z-index: 0;
width: 190px;
height: 120px;
pointer-events: none;
background-image: radial-gradient(rgba(255, 255, 255, .34) 1.6px, transparent 1.6px);
background-size: 16px 16px;
-webkit-mask-image: linear-gradient(225deg, black 8%, transparent 70%);
mask-image: linear-gradient(225deg, black 8%, transparent 70%);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-price)::after {
content: "";
position: absolute;
left: -44px;
bottom: -70px;
z-index: 0;
width: 150px;
height: 150px;
pointer-events: none;
border: 1px solid rgba(255, 255, 255, .26);
border-radius: 50%;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-price) .elementor-heading-title {
position: relative;
z-index: 1;
margin: 0;
padding: clamp(16px, 1.6vw, 22px) clamp(18px, 2vw, 26px);
font-family: var(--tp-font-display);
font-size: clamp(24px, 2.2vw, 32px);
font-weight: 600;
line-height: 1.15;
letter-spacing: -.01em;
color: var(--tp-white);
text-shadow: 0 2px 14px rgba(36, 5, 16, .35);
}
/* ---------------------------------------------------------------------
9. ICON LIST — .mkt-tp-list (inti desain)
Memakai variabel resmi Elementor (--e-icon-list-icon-size,
--e-icon-list-icon-color, --e-icon-list-icon-gap) sehingga panel
"Icon > Size / Color / Spacing" tetap berfungsi. Lingkaran ikon
otomatis mengikuti ukuran ikon dari panel.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list, .mkt-tp-book-list) {
--e-icon-list-icon-size: 14px;
--e-icon-list-icon-gap: 14px;
--e-icon-list-icon-color: var(--tp-ic);
--tp-ic: var(--tp-maroon);
--tp-ic-bg: rgba(var(--tp-rgb), .10);
--tp-ic-ring: rgba(var(--tp-rgb), .06);
--tp-ic-pad: 16px;
width: 100%;
margin: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list .elementor-icon-list-items, .mkt-tp-book-list .elementor-icon-list-items) {
display: flex;
flex-direction: column;
gap: 6px;
margin: 0;
padding: 0;
list-style: none;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list .elementor-icon-list-item, .mkt-tp-book-list .elementor-icon-list-item) {
position: relative;
align-items: flex-start;
margin: 0;
padding: 8px 12px 8px 8px;
border-radius: var(--tp-chip-radius);
transition: background .35s ease, transform .35s var(--tp-ease);
}
/* lingkaran ikon */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list .elementor-icon-list-icon, .mkt-tp-book-list .elementor-icon-list-icon) {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
width: calc(var(--e-icon-list-icon-size, 14px) + var(--tp-ic-pad));
height: calc(var(--e-icon-list-icon-size, 14px) + var(--tp-ic-pad));
border-radius: 50%;
color: var(--tp-ic);
background: var(--tp-ic-bg);
box-shadow: 0 0 0 4px var(--tp-ic-ring);
transition: background .35s ease, color .35s ease, box-shadow .35s ease;
}
/* glyph: ikuti variabel warna Elementor (panel menang) */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list, .mkt-tp-book-list) .elementor-icon-list-icon i {
color: var(--e-icon-list-icon-color, var(--tp-ic));
line-height: 1;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list, .mkt-tp-book-list) .elementor-icon-list-icon svg {
fill: var(--e-icon-list-icon-color, var(--tp-ic));
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list .elementor-icon-list-text, .mkt-tp-book-list .elementor-icon-list-text) {
padding-top: 3px;
font-family: var(--tp-font-body);
font-size: 15px;
font-weight: 400;
line-height: 1.6;
color: var(--tp-muted);
transition: color .35s ease;
}
/* ---- JENIS: ROUTE (Suggested Itinerary) ---- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route .elementor-icon-list-items) {
gap: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route .elementor-icon-list-item) {
padding: 0 0 18px;
border-radius: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route .elementor-icon-list-item:last-child) {
padding-bottom: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route .elementor-icon-list-text) {
padding-top: 5px;
}
/* garis putus-putus penghubung antar langkah */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route .elementor-icon-list-item)::before {
content: "";
position: absolute;
left: 14px;
top: 36px;
bottom: 6px;
width: 2px;
pointer-events: none;
background-image: linear-gradient(180deg, rgba(var(--tp-rgb), .5) 0 6px, transparent 6px 12px);
background-size: 2px 12px;
background-repeat: repeat-y;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route .elementor-icon-list-item:last-child)::before {
display: none;
}
/* SEMUA langkah sama: lingkaran gradasi maroon + glyph putih.
Warna glyph bisa diubah dari panel Icon > Color, gradasi lingkaran
lewat variabel --tp-route-*. */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route) {
--tp-route-a: var(--tp-maroon-light);
--tp-route-b: var(--tp-maroon);
--tp-route-c: var(--tp-maroon-dark);
--tp-route-glyph: #FFFFFF;
--e-icon-list-icon-color: var(--tp-route-glyph);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route .elementor-icon-list-icon) {
background: linear-gradient(135deg, var(--tp-route-a) 0%, var(--tp-route-b) 58%, var(--tp-route-c) 100%);
box-shadow: 0 0 0 4px rgba(var(--tp-rgb), .12), 0 8px 16px -8px rgba(var(--tp-rgb), .65);
}
/* ---- JENIS: NOTE (Notes) — panel blush dengan garis maroon ---- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--note) {
--tp-ic: var(--tp-maroon);
--tp-ic-bg: rgba(var(--tp-rgb), .14);
--tp-ic-ring: rgba(var(--tp-rgb), .08);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--note .elementor-icon-list-items) {
padding: 12px 14px;
border-left: 4px solid var(--tp-maroon);
border-radius: var(--tp-chip-radius);
background: rgba(var(--tp-rgb), .06);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--note .elementor-icon-list-text) {
font-size: 14.5px;
font-weight: 400;
color: var(--tp-text);
}
/* ---- JENIS: YES (Inclusion) & NO (Exclusion) ----
Sama-sama maroon; Exclusion dibedakan dengan lingkaran outline. */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--yes, .mkt-tp-list--no) {
--e-icon-list-icon-size: 12px;
--tp-ic-pad: 14px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--yes .elementor-icon-list-items,
.mkt-tp-list--no .elementor-icon-list-items) {
gap: 2px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--yes .elementor-icon-list-item,
.mkt-tp-list--no .elementor-icon-list-item) {
align-items: center;
padding-top: 6px;
padding-bottom: 6px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--yes .elementor-icon-list-text,
.mkt-tp-list--no .elementor-icon-list-text) {
padding-top: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--no .elementor-icon-list-icon) {
background: transparent;
box-shadow: inset 0 0 0 1.5px rgba(var(--tp-rgb), .4), 0 0 0 3px rgba(var(--tp-rgb), .05);
}
/* ---- JENIS: INFO (Important Information) ---- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--info) {
--e-icon-list-icon-size: 11px;
--tp-ic-pad: 13px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--info .elementor-icon-list-items) {
gap: 4px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--info .elementor-icon-list-item) {
align-items: flex-start;
padding: 8px 10px 8px 6px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--info .elementor-icon-list-icon) {
margin-top: 2px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--info .elementor-icon-list-text) {
padding-top: 0;
font-size: 14px;
line-height: 1.65;
}
/* ---- HOVER LIST (mouse saja) ---- */
@media (hover: hover) {
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list .elementor-icon-list-item, .mkt-tp-book-list .elementor-icon-list-item):hover {
background: rgba(var(--tp-rgb), .05);
transform: translateX(5px);
--e-icon-list-icon-color: #FFFFFF;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--route .elementor-icon-list-item):hover {
background: transparent;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--note .elementor-icon-list-item):hover {
background: transparent;
transform: none;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list .elementor-icon-list-item, .mkt-tp-book-list .elementor-icon-list-item):hover
:where(.elementor-icon-list-icon) {
color: var(--tp-white);
background: var(--tp-ic);
box-shadow: 0 0 0 5px var(--tp-ic-ring);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list .elementor-icon-list-item, .mkt-tp-book-list .elementor-icon-list-item):hover
:where(.elementor-icon-list-text) {
color: var(--tp-maroon-dark);
}
}
/* ---------------------------------------------------------------------
10. TEKS — .mkt-tp-text (Text Editor)
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-text) {
position: relative;
padding-left: 22px;
font-family: var(--tp-font-body);
font-size: 15.5px;
font-weight: 400;
line-height: 1.8;
color: var(--tp-muted);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-text)::before {
content: "";
position: absolute;
left: 0;
top: 3px;
bottom: 3px;
width: 2px;
border-radius: 999px;
background: linear-gradient(180deg, var(--tp-maroon) 0%, var(--tp-maroon-light) 58%, rgba(var(--tp-rgb), .1) 100%);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-text .elementor-widget-container, .mkt-tp-text p) {
margin: 0;
font: inherit;
color: inherit;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-text p + p) {
margin-top: 12px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-text strong, .mkt-tp-text b) {
font-weight: 600;
color: var(--tp-maroon);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-text a) {
color: var(--tp-maroon);
text-decoration: underline;
text-decoration-color: rgba(var(--tp-rgb), .4);
text-underline-offset: 3px;
transition: color .3s ease;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-text a):hover {
color: var(--tp-maroon-light);
}
/* ---------------------------------------------------------------------
11. BLOK PROMISE — .mkt-tp-share (Icon + Heading + Button x4)
Ikon maroon di atas, judul besar, lalu tombol KOTAK outline maroon
dengan lebar mengikuti teks, membungkus otomatis & rata tengah.
SEMUA .elementor-6129 .elementor-element.elementor-element-a45b9a5 memakai :where() → panel Elementor (font, warna,
ukuran, padding, border, radius) SELALU menang.
Ubah cepat lewat variabel --tp-share-* di bawah.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share) {
--tp-share-gap: 12px; /* jarak antar tombol */
--tp-share-fs: 15px; /* ukuran huruf tombol */
--tp-share-h: 46px; /* tinggi minimal tombol */
--tp-share-line: var(--tp-maroon); /* warna border tombol */
--tp-share-text: var(--tp-maroon); /* warna teks & ikon tombol */
--width: 100%;
--flex-direction: row;
--flex-wrap: wrap;
--align-items: center;
--justify-content: center;
--gap: var(--tp-share-gap);
--column-gap: var(--tp-share-gap);
--row-gap: var(--tp-share-gap);
--padding-top: clamp(28px, 3vw, 40px);
--padding-right: clamp(18px, 3vw, 40px);
--padding-bottom: clamp(28px, 3vw, 40px);
--padding-left: clamp(18px, 3vw, 40px);
--border-style: solid;
--border-color: rgba(var(--tp-rgb), .2);
--border-top-width: 1px;
--border-right-width: 1px;
--border-bottom-width: 1px;
--border-left-width: 1px;
--border-radius: var(--tp-card-radius);
position: relative;
min-width: 0;
text-align: center;
background: linear-gradient(165deg, #FFFFFF 0%, rgba(251, 243, 245, .9) 100%);
box-shadow: 0 22px 44px -28px rgba(var(--tp-rgb), .5);
}
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-share) {
border: 1px solid rgba(var(--tp-rgb), .2);
border-radius: var(--tp-card-radius);
}
/* ikon & judul: selalu satu baris penuh */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-icon, .mkt-tp-share-title) {
--container-widget-width: 100%;
flex: 0 0 100%;
width: 100%;
min-width: 0;
margin: 0;
}
/* ---- IKON: lingkaran maroon, glyph putih ---- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-icon .elementor-icon-wrapper) {
display: flex;
justify-content: center;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-icon .elementor-icon) {
display: inline-flex;
align-items: center;
justify-content: center;
width: 60px;
height: 60px;
padding: 0;
font-size: 26px;
line-height: 1;
border-radius: 50%;
color: var(--tp-white);
background: linear-gradient(145deg, var(--tp-maroon-light) 0%, var(--tp-maroon) 55%, var(--tp-maroon-dark) 100%);
box-shadow: 0 0 0 6px rgba(var(--tp-rgb), .08), 0 14px 26px -10px rgba(var(--tp-rgb), .75);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-icon) .elementor-icon svg {
width: 1em;
height: 1em;
fill: currentColor;
}
/* ---- JUDUL ---- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-title) {
margin: 6px 0 4px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-title .elementor-heading-title) {
margin: 0;
text-align: center;
font-family: var(--tp-font-display);
font-size: clamp(26px, 2.5vw, 36px);
font-weight: 600;
line-height: 1.15;
letter-spacing: -.01em;
color: var(--tp-maroon);
}
/* ---- TOMBOL: kotak, lebar mengikuti teks, membungkus, rata tengah ---- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share > .mkt-tp-share-btn,
.mkt-tp-share > .e-con-inner > .mkt-tp-share-btn) {
--container-widget-width: auto;
--container-widget-flex-grow: 0;
flex: 0 1 auto;
width: auto;
max-width: 100%;
min-width: 0;
margin: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn .elementor-button) {
position: relative;
overflow: hidden;
isolation: isolate;
display: inline-flex;
align-items: center;
justify-content: center;
max-width: 100%;
min-height: var(--tp-share-h);
padding: 10px 22px;
border: 1.5px solid var(--tp-share-line);
border-radius: 0;
background: var(--tp-white);
color: var(--tp-share-text);
font-family: var(--tp-font-body);
font-size: var(--tp-share-fs);
font-weight: 500;
line-height: 1.3;
letter-spacing: 0;
text-align: center;
white-space: normal;
box-shadow: none;
transition: color .35s ease, border-color .35s ease, transform .35s var(--tp-ease);
}
/* isian maroon meluncur dari kiri saat hover */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn .elementor-button)::before {
content: "";
position: absolute;
inset: 0;
z-index: -1;
background: var(--tp-share-line);
transform: scaleX(0);
transform-origin: left center;
transition: transform .4s var(--tp-ease);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn .elementor-button-content-wrapper) {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
}
/* ikon tombol: polos, warna mengikuti teks tombol */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn .elementor-button-icon) {
display: inline-flex;
align-items: center;
flex: 0 0 auto;
margin: 0;
font-size: 1em;
color: inherit;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn) .elementor-button-icon svg {
width: 1em;
height: 1em;
fill: currentColor;
}
/* ---------------------------------------------------------------------
12. BLOK BOOKING (dalam kartu kanan) — .mkt-tp-book
Tombol booking kotak seperti Hero: isian putih meluncur saat hover.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book) {
--width: 100%;
--flex-direction: column;
--align-items: stretch;
--justify-content: flex-start;
--gap: 16px;
--row-gap: 16px;
--padding-top: clamp(16px, 1.8vw, 22px);
--padding-right: clamp(14px, 1.6vw, 20px);
--padding-bottom: clamp(16px, 1.8vw, 22px);
--padding-left: clamp(14px, 1.6vw, 20px);
--border-style: solid;
--border-color: rgba(var(--tp-rgb), .22);
--border-top-width: 1px;
--border-right-width: 1px;
--border-bottom-width: 1px;
--border-left-width: 1px;
--border-radius: var(--tp-block-radius);
margin-top: clamp(8px, 1.2vw, 16px);
min-width: 0;
background: linear-gradient(165deg, rgba(251, 243, 245, .95) 0%, rgba(255, 255, 255, .96) 100%);
}
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5 .mkt-tp-book) {
border: 1px solid rgba(var(--tp-rgb), .22);
border-radius: var(--tp-block-radius);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book > .elementor-widget) {
width: 100%;
min-width: 0;
margin: 0;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button) {
position: relative;
overflow: hidden;
isolation: isolate;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
min-height: 52px;
padding: 16px 28px;
border: 1.5px solid var(--tp-maroon);
border-radius: 0;
background: var(--tp-maroon);
color: var(--tp-white);
font-family: var(--tp-font-body);
font-size: 14px;
font-weight: 700;
letter-spacing: .12em;
text-transform: uppercase;
line-height: 1.2;
box-shadow: none;
transition: color .35s ease, transform .35s var(--tp-ease), box-shadow .35s var(--tp-ease);
}
/* isian putih meluncur dari kiri */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button)::before {
content: "";
position: absolute;
inset: 0;
z-index: -1;
background: var(--tp-white);
transform: scaleX(0);
transform-origin: left center;
transition: transform .45s var(--tp-ease);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button-content-wrapper) {
align-items: center;
justify-content: center;
gap: 10px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button-icon) {
color: inherit;
transition: transform .35s var(--tp-ease);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn) .elementor-button-icon svg {
fill: currentColor;
}
/* ---------------------------------------------------------------------
13. HOVER TOMBOL & GALERI (mouse saja)
--------------------------------------------------------------------- */
@media (hover: hover) {
/* galeri */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-main-swiper .swiper-slide):hover::after {
transform: translateX(130%);
transition: transform 1s var(--tp-ease);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-swiper-button):hover {
color: var(--tp-maroon);
background: var(--tp-white);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-thumbnails-swiper .swiper-slide):hover {
transform: translateY(-3px);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-thumbnails-swiper .swiper-slide):hover::before {
opacity: 0;
}
/* tombol info */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badge .elementor-button):hover {
transform: translateY(-3px);
background-position: 100% 50%;
box-shadow: 0 18px 30px -16px rgba(var(--tp-rgb), .95), inset 0 1px 0 rgba(255, 255, 255, .26);
}
/* tombol Promise */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn .elementor-button):hover {
color: var(--tp-white);
transform: translateY(-2px);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn .elementor-button):hover::before {
transform: scaleX(1);
}
/* tombol Booking */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button):hover {
color: var(--tp-maroon);
transform: translate(-3px, -3px);
box-shadow: 5px 5px 0 var(--tp-maroon-light);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button):hover::before {
transform: scaleX(1);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button):hover .elementor-button-icon {
transform: translateX(4px);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button):active {
transform: translate(0, 0);
box-shadow: none;
}
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button:focus-visible,
.mkt-tp-badge .elementor-button:focus-visible,
.mkt-tp-share-btn .elementor-button:focus-visible) {
outline: 2px solid var(--tp-maroon);
outline-offset: 3px;
}
/* ---------------------------------------------------------------------
14. ANIMASI MUNCUL SAAT SCROLL (galeri & kartu kanan) — desktop saja
Ringan: dijalankan browser tanpa JavaScript.
--------------------------------------------------------------------- */
@keyframes tpIn {
from { opacity: 0; translate: 0 26px; }
to { opacity: 1; translate: 0 0; }
}
@media (min-width: 1025px) and (prefers-reduced-motion: no-preference) {
@supports (animation-timeline: view()) {
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery, .mkt-tp-right) {
animation: tpIn linear both;
animation-timeline: view();
animation-range: entry 0% entry 36%;
}
}
}
/* =====================================================================
RESPONSIVE
===================================================================== */
@media (min-width: 1600px) {
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5).e-con {
--tp-max-width: 1420px;
}
}
@media (min-width: 1025px) and (max-width: 1280px) {
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5).e-con {
--padding-left: 44px;
--padding-right: 44px;
--gap: 32px;
--column-gap: 32px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-left) { --width: 58%; }
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-right) { --width: 38%; }
}
@media (max-width: 1024px) {
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5).e-con {
--flex-direction: column;
--flex-wrap: wrap;
--align-items: stretch;
--row-gap: 36px;
--tp-pad-bottom: clamp(100px, 16vw, 150px);
--tp-watermark-size: clamp(64px, 14vw, 130px);
flex-direction: column;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-left, .mkt-tp-right) {
--width: 100%;
width: 100%;
max-width: 100%;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-right)::after {
top: -46px;
font-size: 88px;
}
}
@media (min-width: 768px) and (max-width: 1024px) {
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5).e-con {
--padding-left: clamp(30px, 4.5vw, 46px);
--padding-right: clamp(30px, 4.5vw, 46px);
}
}
@media (max-width: 767px) {
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5).e-con {
--tp-tbl-cols: 1;
--tp-card-radius: 5px 24px 5px 24px;
--tp-gal-radius: 5px 24px 5px 24px;
--tp-block-radius: 4px 18px 4px 18px;
--tp-chip-radius: 4px 13px 4px 13px;
--tp-pad-bottom: 92px;
--tp-watermark-size: 21vw;
--padding-top: 34px;
--padding-left: clamp(18px, 5.2vw, 24px);
--padding-right: clamp(18px, 5.2vw, 24px);
--row-gap: 30px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-left) {
--gap: 22px;
--row-gap: 22px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-right) {
--padding-top: 16px;
--padding-right: 16px;
--padding-bottom: 20px;
--padding-left: 16px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-right)::after {
top: -34px;
font-size: 64px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-main-swiper) {
box-shadow:
0 0 0 4px var(--tp-white),
0 0 0 5px rgba(var(--tp-rgb), .28),
0 24px 44px -26px rgba(var(--tp-rgb), .6);
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-swiper-button) {
width: 34px;
height: 34px;
font-size: 13px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-gallery .elementor-thumbnails-swiper) {
margin-top: 12px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badges) {
--gap: 8px;
--column-gap: 8px;
--row-gap: 8px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badge .elementor-button) {
padding: 11px 10px;
font-size: 12.5px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-table) {
--tb-font: 14px;
--tb-pad-x: 16px;
--tb-pad-y: 12px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-sec .elementor-heading-title) {
gap: 12px;
font-size: 22px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-price) .elementor-heading-title {
font-size: 24px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list .elementor-icon-list-text,
.mkt-tp-book-list .elementor-icon-list-text) {
font-size: 14.5px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-list--info .elementor-icon-list-text) {
font-size: 14px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-text) {
padding-left: 16px;
font-size: 15px;
line-height: 1.72;
}
/* Promise di HP — tombol kotak rata tengah, sedikit lebih kecil */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share) {
--tp-share-gap: 10px;
--tp-share-fs: 14px;
--tp-share-h: 44px;
--padding-top: 26px;
--padding-right: 16px;
--padding-bottom: 26px;
--padding-left: 16px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-icon .elementor-icon) {
width: 52px;
height: 52px;
font-size: 22px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-title .elementor-heading-title) {
font-size: 26px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn .elementor-button) {
padding: 9px 18px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-book-btn .elementor-button) {
min-height: 50px;
padding: 15px 22px;
font-size: 13px;
letter-spacing: .1em;
}
}
@media (max-width: 374px) {
:where(.elementor-6129 .elementor-element.elementor-element-a45b9a5).e-con {
--padding-top: 28px;
--tp-pad-bottom: 84px;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-badges) {
--gap: 6px;
--column-gap: 6px;
--row-gap: 6px;
}
/* layar sangat kecil — tombol Promise penuh satu baris */
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share > .mkt-tp-share-btn,
.mkt-tp-share > .e-con-inner > .mkt-tp-share-btn) {
flex: 1 1 100%;
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(.mkt-tp-share-btn .elementor-button) {
width: 100%;
}
}
/* ---------------------------------------------------------------------
15. TOUCH / REDUCED MOTION / SELECTION
--------------------------------------------------------------------- */
@media (hover: none) and (pointer: coarse) {
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(a, button) {
-webkit-tap-highlight-color: transparent;
}
}
@media (prefers-reduced-motion: reduce) {
.elementor-6129 .elementor-element.elementor-element-a45b9a5 :where(*),
.elementor-6129 .elementor-element.elementor-element-a45b9a5 *::before,
.elementor-6129 .elementor-element.elementor-element-a45b9a5 *::after {
animation-duration: .01ms;
animation-iteration-count: 1;
transition-duration: .01ms;
}
}
.elementor-6129 .elementor-element.elementor-element-a45b9a5 ::selection {
background: var(--tp-blush);
color: var(--tp-maroon-dark);
}
/* =====================================================================
CATATAN PEMAKAIAN
1. Icon List — satu jenis per widget (CSS Classes, dua class):
mkt-tp-list mkt-tp-list--route / --note / --yes / --no /
--info / --pin
2. Mengubah gradasi tombol info + header tabel + banner: edit
--tp-grad di blok 1 (atau atur Background di panel Button).
3. Ukuran ikon list bisa diubah dari panel (Icon > Size);
lingkaran di belakang ikon ikut membesar otomatis.
4. Data Table: header diambil dari | . Jika plugin memakai |
untuk header, kirim hasil Inspect Element agar disesuaikan.
5. Watermark: --tp-watermark-no (angka di kartu kanan) dan
--tp-watermark-word (kata di bawah) di blok 1.
6. Jika sebuah ikon/teks masih berwarna lain (misalnya ikon
peringatan di Notes masih merah, atau tombol Promise tampil
beda), kosongkan isian warna/background yang pernah diisi di
panel widget tersebut — panel selalu menang atas CSS ini.
===================================================================== *//* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-3380d83 *//* =====================================================================
BOOK NOW STICKY — MAI KEBALI TOUR (v1.1 — Maroon, dari versi lama)
Tempel di: Container PALING LUAR (container kedua, yang berisi
Text Editor + Heading + Button) > Advanced > Custom CSS
(GANTI seluruh CSS lama)
---------------------------------------------------------------------
STRUKTUR & CSS CLASS (isi di Advanced > CSS Classes) — TIDAK BERUBAH
---------------------------------------------------------------------
Container (paling luar / bar) ............. mkt-bk
└─ Container (baris isi) .................. mkt-bk-inner
├─ Container (teks harga) ............. mkt-bk-info
│ ├─ Text Editor (label kecil) ...... mkt-bk-label
│ └─ Heading (harga) ................ mkt-bk-price
└─ Container (tombol) ................. mkt-bk-action
└─ Button (Book Now) .............. mkt-bk-btn
YANG DIUBAH dari versi lama (struktur kode dipertahankan)
- Warna biru-navy -> maroon, putih, blush (tanpa emas/oranye).
- Tombol mengikuti gaya tombol Hero: KOTAK, maroon, bayangan blush
bergeser; hover/ditekan: isian putih meluncur dari kiri + tombol
bergeser, bayangan maroon. (Gradasi & kilau miring dihapus.)
- Denyut di HP kini cincin tipis (transform + opacity), bukan
animasi box-shadow, jadi lebih ringan.
- Harga: El Messiri maroon. Kartu: bentuk daun. Aksen garis maroon.
PERILAKU
- Mobile (<= 767px): bar menempel di dasar layar (fixed), muncul
dengan animasi naik, mengikuti safe-area iPhone.
- Tablet & desktop: tampil sebagai kartu biasa (tidak menempel).
Mau disembunyikan di desktop? Elementor > Advanced > Responsive >
Hide On Desktop / Tablet.
- Mau sticky juga di tablet? Ganti 767px menjadi 1024px pada blok
"MOBILE STICKY" di bawah.
TENTANG PRATINJAU DI EDITOR ELEMENTOR
- Di mode responsif editor, bar "fixed" menempel ke dasar bingkai
perangkat, yang bisa lebih tinggi dari area yang terlihat sehingga
bagian bawah bar tertutup bilah gelap di bawah editor (yang ada
pegangan ═ nya). Itu bukan kesalahan CSS: seret pegangan ═ ke atas
agar bingkai perangkat lebih pendek, atau cek lewat Preview / HP
asli.
TIDAK DIKUNCI
- Tanpa !important. Font, warna, ukuran, jarak, border, radius,
background, ikon: semua bisa diubah dari panel Elementor (panel
selalu menang). Jika tombol masih tampil membulat atau berwarna
lain, kosongkan Border Radius / warna yang pernah diisi di panel
Button.
===================================================================== */
/* ---------------------------------------------------------------------
1. PUSAT KENDALI
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-3380d83 {
--bk-maroon: #74142A;
--bk-maroon-dark: #4A0C1B;
--bk-maroon-light: #A32244;
--bk-rgb: 116, 20, 42;
--bk-blush: #F4D3DB;
--bk-tint: #FBF3F5;
--bk-white: #FFFFFF;
--bk-muted: rgba(43, 21, 25, .62);
--bk-font-display: "El Messiri", Georgia, serif;
--bk-font-body: "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;
--bk-max-width: 760px; /* lebar kartu (tablet/desktop) */
--bk-radius: 6px 26px 6px 26px; /* kartu (tablet/desktop) */
--bk-radius-mobile: 26px 6px 0 0; /* bar sticky (mobile) */
--bk-ease: cubic-bezier(.22, .75, .2, 1);
position: relative;
width: 100%;
max-width: var(--bk-max-width);
margin-inline: auto;
box-sizing: border-box;
isolation: isolate;
font-family: var(--bk-font-body);
color: var(--bk-maroon);
background: linear-gradient(165deg, var(--bk-white) 0%, var(--bk-tint) 100%);
box-shadow:
0 28px 54px -32px rgba(var(--bk-rgb), .5),
inset 0 1px 0 rgba(255, 255, 255, .9);
--width: 100%;
--flex-direction: column;
--align-items: stretch;
--justify-content: center;
--gap: 0px;
--row-gap: 0px;
--padding-top: 16px;
--padding-right: 20px;
--padding-bottom: 16px;
--padding-left: 20px;
--border-style: solid;
--border-color: rgba(var(--bk-rgb), .2);
--border-top-width: 1px;
--border-right-width: 1px;
--border-bottom-width: 1px;
--border-left-width: 1px;
--border-radius: var(--bk-radius);
}
:where(.elementor-6129 .elementor-element.elementor-element-3380d83) {
border: 1px solid rgba(var(--bk-rgb), .2);
border-radius: var(--bk-radius);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(*),
.elementor-6129 .elementor-element.elementor-element-3380d83 *::before,
.elementor-6129 .elementor-element.elementor-element-3380d83 *::after {
box-sizing: border-box;
}
/* garis aksen maroon di tepi atas bar */
.elementor-6129 .elementor-element.elementor-element-3380d83::before {
content: "";
position: absolute;
left: 22px;
top: 0;
width: 52px;
height: 3px;
z-index: 1;
pointer-events: none;
border-radius: 0 0 4px 4px;
background: linear-gradient(90deg, var(--bk-maroon), var(--bk-maroon-light));
}
/* ---------------------------------------------------------------------
2. BARIS ISI — .mkt-bk-inner (teks harga di kiri, tombol di kanan)
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-inner) {
--width: 100%;
--flex-direction: row;
--flex-wrap: nowrap;
--align-items: center;
--justify-content: space-between;
--gap: 16px;
--column-gap: 16px;
--row-gap: 12px;
--padding-top: 0px;
--padding-right: 0px;
--padding-bottom: 0px;
--padding-left: 0px;
min-width: 0;
}
/* jika container luar bertipe "Boxed", lebar isi dalam tetap penuh */
.elementor-6129 .elementor-element.elementor-element-3380d83 > .e-con-inner {
width: 100%;
max-width: 100%;
}
/* ---------------------------------------------------------------------
3. TEKS HARGA — .mkt-bk-info / .mkt-bk-label / .mkt-bk-price
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-info) {
--width: auto;
--flex-direction: column;
--align-items: flex-start;
--justify-content: center;
--gap: 2px;
--row-gap: 2px;
--padding-top: 0px;
--padding-right: 0px;
--padding-bottom: 0px;
--padding-left: 0px;
flex: 1 1 auto;
min-width: 0;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-info > .elementor-widget) {
width: 100%;
min-width: 0;
margin: 0;
}
/* label kecil (Text Editor) */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-label) {
font-family: var(--bk-font-body);
font-size: 11px;
font-weight: 600;
line-height: 1.3;
letter-spacing: .1em;
text-transform: uppercase;
color: var(--bk-muted);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-label .elementor-widget-container, .mkt-bk-label p) {
margin: 0;
font: inherit;
letter-spacing: inherit;
text-transform: inherit;
color: inherit;
}
/* harga (Heading) */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-price .elementor-heading-title) {
margin: 0;
font-family: var(--bk-font-display);
font-size: clamp(22px, 6vw, 28px);
font-weight: 600;
line-height: 1.1;
letter-spacing: -.01em;
color: var(--bk-maroon);
}
/* ---------------------------------------------------------------------
4. TOMBOL — .mkt-bk-action / .mkt-bk-btn (Book Now)
Gaya sama dengan tombol Hero: kotak, maroon, bayangan bergeser.
--------------------------------------------------------------------- */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-action) {
--width: auto;
--flex-direction: row;
--align-items: center;
--justify-content: flex-end;
--padding-top: 0px;
--padding-right: 0px;
--padding-bottom: 0px;
--padding-left: 0px;
flex: 0 0 auto;
min-width: 0;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-action > .elementor-widget) {
width: auto;
min-width: 0;
margin: 0;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn) {
position: relative;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button) {
position: relative;
overflow: hidden;
isolation: isolate;
display: flex;
align-items: center;
justify-content: center;
min-height: 50px;
padding: 15px 28px;
border: 1.5px solid var(--bk-maroon);
border-radius: 0;
background: var(--bk-maroon);
color: var(--bk-white);
font-family: var(--bk-font-body);
font-size: 13px;
font-weight: 700;
line-height: 1.2;
letter-spacing: .12em;
text-transform: uppercase;
white-space: nowrap;
box-shadow: 4px 4px 0 var(--bk-blush);
transition: color .35s ease, transform .35s var(--bk-ease), box-shadow .35s var(--bk-ease);
}
/* isian putih meluncur dari kiri */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button)::before {
content: "";
position: absolute;
inset: 0;
z-index: -1;
background: var(--bk-white);
transform: scaleX(0);
transform-origin: left center;
transition: transform .45s var(--bk-ease);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button-content-wrapper) {
align-items: center;
justify-content: center;
gap: 10px;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button-text) {
color: inherit;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button-icon) {
color: inherit;
transition: transform .35s var(--bk-ease);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn) .elementor-button svg {
fill: currentColor;
}
/* cincin denyut di sekeliling tombol (aktif di HP, lihat blok mobile) */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn)::after {
content: "";
position: absolute;
inset: 0;
z-index: -1;
border: 1.5px solid rgba(var(--bk-rgb), .5);
opacity: 0;
pointer-events: none;
}
/* ditekan: tombol "menekan" + isian putih (umpan balik di HP) */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button):active {
color: var(--bk-maroon);
transform: translate(2px, 2px);
box-shadow: 2px 2px 0 var(--bk-blush);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button):active::before {
transform: scaleX(1);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button:focus-visible) {
outline: 2px solid var(--bk-maroon);
outline-offset: 3px;
}
@media (hover: hover) {
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button):hover {
color: var(--bk-maroon);
transform: translate(-3px, -3px);
box-shadow: 6px 6px 0 var(--bk-maroon-light);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button):hover::before {
transform: scaleX(1);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button):hover .elementor-button-icon {
transform: translateX(4px);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button):active {
transform: translate(0, 0);
box-shadow: none;
}
}
@keyframes mktBkRing {
0% { opacity: .65; scale: 1 1; }
70%, 100% { opacity: 0; scale: 1.16 1.5; }
}
@keyframes mktBkUp {
from { opacity: 0; translate: 0 100%; }
to { opacity: 1; translate: 0 0; }
}
/* ---------------------------------------------------------------------
5. MOBILE STICKY (<= 767px)
Bar menempel di dasar layar. Ganti 767px -> 1024px bila ingin
sticky juga di tablet.
--------------------------------------------------------------------- */
@media (max-width: 767px) {
.elementor-6129 .elementor-element.elementor-element-3380d83 {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 9990;
width: 100%;
max-width: 100%;
margin-inline: 0;
--bk-radius: var(--bk-radius-mobile);
--padding-top: 12px;
--padding-right: clamp(16px, 4.8vw, 22px);
--padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
--padding-left: clamp(16px, 4.8vw, 22px);
/* hanya garis tepi atas; sisi lain tanpa border */
--border-top-width: 1px;
--border-right-width: 0px;
--border-bottom-width: 0px;
--border-left-width: 0px;
background: linear-gradient(180deg, rgba(255, 255, 255, .98) 0%, rgba(251, 243, 245, .98) 100%);
box-shadow:
0 -20px 42px -24px rgba(var(--bk-rgb), .55),
0 -1px 0 rgba(var(--bk-rgb), .1);
animation: mktBkUp .7s var(--bk-ease) .25s both;
}
:where(.elementor-6129 .elementor-element.elementor-element-3380d83) {
border: 0;
border-top: 1px solid rgba(var(--bk-rgb), .2);
border-radius: var(--bk-radius-mobile);
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-inner) {
--gap: 12px;
--column-gap: 12px;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button) {
min-height: 48px;
padding: 13px 20px;
font-size: 12.5px;
letter-spacing: .1em;
}
/* cincin denyut halus mengelilingi tombol (transform + opacity saja) */
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn)::after {
animation: mktBkRing 2.8s ease-out 1.4s infinite;
}
/* ruang di dasar halaman agar konten/footer tidak tertutup bar */
body:has(.mkt-bk) {
padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
}
}
/* HP kecil: teks harga & tombol sedikit lebih kecil */
@media (max-width: 374px) {
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-price .elementor-heading-title) {
font-size: 20px;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-label) {
font-size: 10px;
}
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(.mkt-bk-btn .elementor-button) {
padding: 12px 15px;
font-size: 12px;
letter-spacing: .08em;
}
}
/* ---------------------------------------------------------------------
6. REDUCED MOTION
--------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
.elementor-6129 .elementor-element.elementor-element-3380d83,
.elementor-6129 .elementor-element.elementor-element-3380d83 :where(*),
.elementor-6129 .elementor-element.elementor-element-3380d83 *::before,
.elementor-6129 .elementor-element.elementor-element-3380d83 *::after {
animation: none;
transition-duration: .01ms;
}
}/* End custom CSS */ |