/*
Theme Name:     Alsaf Theme
Description:    
Author:         Alvantesha Priliandi
Email Author:   palvantesha@gmail.com
Template:       Divi
Version:        0.0.029
*/

h1,h2, h3, h4, h5, h6, p, span, a, li {
    font-family: "Noto Sans", sans-serif;
    font-style: normal;
}

.container {
    max-width: 1280px;
    width: 90%;
    margin: 0 auto;
}
.pk-row {
    align-items: flex-start;
    display: flex;
    flex: 1;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 32px;
    height: min-content;
    justify-content: space-between;
}
.pk-col {
/*     flex: 1; */
	flex: 0 0 calc(50% - 16px); /* 2 kolom, dikurangi gap */
  	box-sizing: border-box;

}
@media (max-width: 768px) {
  .pk-col {
    flex: 0 0 100% !important;
  }
}
.pk-card {
    background-color: #fff;
    padding: 8px;
    opacity: 1;
    transform: none;
    border-radius: 24px;
    box-shadow: rgba(0, 0, 0, 0.137) 0px 0.30109px 1.50547px -1.5px, rgba(0, 0, 0, 0.114) 0px 1.14427px 5.72133px -3px, rgba(0, 0, 0, 0.016) 0px 5px 25px -4.5px;
    will-change: auto;
}
.pk-card h3, .pk-card h4, .pk-card h5, .pk-card p {
    padding:0;
    margin: 0;
}
.pk-card-header figure {
    margin: 0;
}
.pk-card-header figure img {
    width: 100%;
/*     height: 228px; */
    border-radius: 16px 16px 0px 98px;
}
.pk-card-body {
    padding: 14px;
}
.pk-card .pk-card-body .pk-title h3 {
    font-size: 21px;
    font-weight: 700;
    color: #758195;
    line-height: 110%;
}
.pk-card .pk-card-body .pk-title h5 {
    font-size: 24px;
    color: #903eab;
    font-weight: 700;
    line-height: 125%;
}
.pk-title, .pk-price {
    margin-bottom: 30px;
}
.pk-price p {
    color: #758195;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
}
.pk-price h4 {
    color: #b91c1c;
    font-size: 28px;
    font-weight: 700;
    line-height: 110%;
}
.pk-description {
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 12px;
}
.pk-description svg {
    width: 20px !important;
}
a {
    text-decoration: none;
}
.pk-cta {
    margin-top: 24px;
}
.btn {
    padding: 14px 24px;
    border-radius: 8px;
    text-align: center;
}
.btn-primary {
    background-color: #903eab;
    color: #fff;
    font-size: 16px;
    box-shadow: rgba(109, 39, 129, 0.055) 0px 0.36218px 1.08653px -0.5px, rgba(109, 39, 129, 0.16) 0px 3px 9px -1px;
    opacity: 1;
}
.btn-block {
    display: block;
}
.pk-description-left {
    align-items: center;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 8px;
    height: min-content;
    justify-content: center;
    overflow: hidden;
    padding: 0;
}
.pk-description-left span, .pk-description-right p {
    color: #44546f;
    font-size: 16px;
}
/* Tambahkan media query untuk mengubah tata letak saat di mobile */
@media (max-width: 1080px) {
    .pk-row {
        flex-direction: column; /* Ubah arah flex menjadi vertikal */
        gap: 16px; /* Jarak antar kolom lebih kecil untuk layar kecil */
    }

    .pk-col {
        flex: unset; /* Menghilangkan properti flex untuk kolom agar tidak mengisi seluruh lebar */
        width: 100%; /* Buat kolom menempati 100% lebar layar */
    }
}

#main-header .container {
	max-width: 1200px !important;
}
.feature-kebab .et_pb_row {
	margin-bottom: 100px !important;
}

.mobile_menu_bar:before, .mobile_menu_bar:after, #top-menu li.current-menu-ancestor>a, #top-menu li.current-menu-item>a {
    color: #fff;
}
.et_mobile_menu {
	border-top: 3px solid #fff;
}

.feature-kebab .et_pb_column.et_pb_column_1_4, 
.feature-kebab .et_pb_column.et_pb_column_1_5, 
.feature-kebab .et_pb_column.et_pb_column_1_6 {
	margin: 0 0 100px !important;
}

.device-phone:before {
	content: '';
    background-image: url(https://kebabbangki.com/wp-content/uploads/2024/06/Samsung-Galaxy-S22-1.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left center;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 99;
    top: -4px;
    left: -4px;
}

@media only screen and (max-width: 980px) {
	.all-produk .tab-md-chicken {
		margin-bottom: 110px !important;
	}
	.feature-kebab .et_pb_main_blurb_image {
		left: 25% !important;
	}
	.img-phone img {
		width: 289px !important;
		height: 595px !important;
		left: -7px !important;
	}
	.owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
		margin-top: -47% !important;
	}
}
@media screen and (max-width: 767px) {
	.device-phone:before {
/* 		    top: -1px;
    		left: 17px; */
	}
    .list-wrp.fluid > *:not(._arrow), .list-wrp.fluid .bttn-tab:not(._arrow), .list-wrp.fluid .bttn-lg:not(._arrow), .list-wrp.fluid .bttn-sm:not(._arrow), .star-rate {
        justify-content: center;
        text-align: center;
		width: 100%;
    }
	.owl-carousel .item img {
		width: 242px !important;
	}
	.feature-kebab .et_pb_column {
		width: 244px !important;
	}
	.feature-kebab {
		justify-content: center !important;
	}
	.all-produk .et_pb_column {
		margin-bottom: 110px !important;
	}
	.all-produk .et_pb_column:last-child {
		margin-bottom: 0px !important;
	}
	.video-carousel .owl-nav button.owl-next, .video-carousel .owl-nav button.owl-prev {
		margin-top: -120% !important;
	}
	.social-aprove-carousel .owl-nav button.owl-next {
		right: -30px !important;
	}
	.social-aprove-carousel .owl-nav button.owl-prev {
		left: -53px !important;
	}
	
	.video-carousel .owl-nav button.owl-next {
		right: -30px !important;
	}
	.video-carousel .owl-nav button.owl-prev {
		left: -30px !important;
	}
	.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
		width: 38px;
    	height: 38px;
	}
	.owl-carousel .owl-nav button span {
		font-weight: 300 !important;
		font-size: 42px !important;
		top: 4px !important;
		left: 13px !important;
	}
	.owl-carousel .owl-nav button.owl-next, 
	.owl-carousel .owl-nav button.owl-prev, 
	.owl-carousel button.owl-dot {
		width: 38px !important;
		height: 38px !important;
	}
	    .img-phone img {
        position: absolute;
        height: 615px !important;
        z-index: 9;
        left: -8px !important;
        top: -11px !important;
        width: 300px !important;
        max-width: 80vw !important;
    }
	.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
		margin-top: -120% !important;
	}
	.content-custom {
		justify-content: center !important;
	}
}

/* start owl carousel testimonial */
.img-phone img {
	position: absolute;
    width: 302px;
    height: 618px;
    z-index: 9;
    left: -7px;
    top: -10px;
}
.social-aprove-carousel .item {
	position: relative;
	padding: 15px;
	box-sizing: border-box;
}
.owl-carousel .item img {
    display: block;
    width: fit-content;
	border-radius: 21px;
}
.owl-theme .owl-nav {
	position: relative !important;
}
.owl-carousel .owl-nav button.owl-next, 
.owl-carousel .owl-nav button.owl-prev, 
.owl-carousel button.owl-dot {
	display: flex !important;
	justify-content: center !important;
	align-content: center !important;
	background: 0 0;
	color: inherit;
	border: none;
	padding: 0 !important;
	font: inherit;
	position: absolute;
	margin-top: -28%;
	width: 48px;
	height: 48px;
	background: #903eab;
	border-radius: 40px;

}
.owl-carousel .owl-nav .disabled {
	background: rgba(255, 255, 255, 0.6) !important;
}
.owl-carousel .owl-nav button span{
	color: #fff;
	font-weight: 400;
	font-size: 50px;
	position: absolute;
	top: 8px;
    left: 18px;
}
.owl-carousel .owl-nav .disabled span{
	color: #9498AD;
	font-weight: 400;
	font-size: 50px;
	position: absolute;
	top: 8px;
    left: 18px;
}

.social-aprove-carousel .owl-nav button.owl-next {
	right: -42px;
}
.social-aprove-carousel .owl-nav button.owl-prev {
	left: -42px;
}
.owl-theme .owl-nav .disabled {
	opacity: 1;
	background: #fff !important;
}
.video-carousel .owl-nav button {
	display: flex;
    justify-content: center;
    align-items: center;
}

.owl-theme .owl-nav [class*='owl-']:hover {
    background: #903eab !important;
}
.owl-theme .owl-nav [class*='owl-']:hover svg {
    fill: #fff !important;
}

.owl-theme .owl-nav .disabled svg {
	fill: #903eab !important;
	width: 24px !important;
	height: 24px !important;
}

.owl-theme .owl-nav button svg {
	fill: #fff !important;
	width: 24px !important;
	height: 24px !important;
}

.video-carousel .owl-nav button.owl-next {
	right: 139%;
}
.video-carousel .owl-nav button.owl-prev {
	left: -54%;
}

.owl-theme .owl-nav {
	position: absolute;
}
/* end owl carousel testimonial */

/* start owl carousel video */
.video-carousel iframe {
	border-radius: 24px;
}
.video-carousel .owl-nav button.owl-next, 
.video-carousel .owl-nav button.owl-prev {
	margin-top: -44%;
}
/* end owl carousel video */

.title-card {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 700;
	font-size: 16px;
	line-height: 24px;
	color: #010101;
	padding: 0;
}
.price-card .text-red {
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	color: #C40002;
}
.price-card .teext-gray {
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 21px;
	color: #7E7C7C;
}
.faq h5:after {
	content: '';
    background: url(https://kebabbangki.com/wp-content/uploads/2024/06/Vector-4.png);
    position: absolute;
    left: -32px !important;
    top: 3px;
    width: 20px; /* Tambahkan ini */
    height: 20px; /* Tambahkan ini */
    background-repeat: no-repeat;
    background-size: 20px 20px;
}
.text-dark-1 {
	color: #010101 !important;
}
.text-dark-2 {
	color: #504D4D !important;
}
.text-info {
  font-size: 16px
}
.text-highlight {
  color: #C40002;
  font-weight: 600;
}
.btn-sm {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500
}
.btn-xs {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500
}
.btn-red {
  background: #C40002;
  color: #fff;
}
.justify-content-between {
  justify-content: space-between !important;
}
.align-items-center{
  align-items: center;
}
.feature-kebab .et_pb_column, .feature-kebab .et_pb_module, .testimonial .et_pb_module {
	overflow: visible !important;
}
.testimonial-info {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 27px;
    color: #010101;
}
.testimonial-author-name {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #010101;
}
.testimonial-author-position {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #504D4D;
}
body {
      font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif !important;
}
.list-wrp {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}
p:not(.has-background):last-of-type {
    padding-bottom: 0;
}

.bttn-lg:not(.bttn-textlink)._inv {
    color: #fff;
    background: #C40002;
}

.bttn-lg:not(.bttn-textlink) {
    cursor: pointer;
    color: white;
    border: unset;
    background: #478CFE;
    font-weight: 600;
    line-height: 1.5em;
    display: inline-flex;
    align-items: center;
    text-align: left;
    transition: margin .3s, transform .3s, box-shadow .3s, color .3s, background .3s;
    transition-timing-function: ease-in;
}
.bttn-lg:not(.bttn-textlink) {
    font-size: 18px;
    padding-top: 16px !important;
    padding-right: 32px !important;
    padding-bottom: 16px !important;
    padding-left: 32px !important;
    border-radius: 6px;
}

.bttn-sm, .bttn-lg, .bttn-textlink {
    width: fit-content;
    text-decoration: none;
}

.bttn-sm:not(.bttn-textlink)._border._inv, .bttn-lg:not(.bttn-textlink)._border._inv {
    color: white;
    border-color: white;
    background: transparent;
    transition: color .3s, backgorund .3s, margin .3s, transform .3s, box-shadow .3s;
}
.btn-play {
  margin-right: 0; 
  display: flex; 
  justify-content: start;
  gap: 8px;
}
.p-0 {
  padding: 0;
}
.kb-txt-rate {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    color: rgba(255, 255, 255, 0.8);
  margin-bottom: 5px
}
.kb-txt-info {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: rgba(255, 255, 255, 0.6);
}

/* Start Hero Banner */
.framer-iA65W .framer-1ojo3zm {
    align-content: flex-start;
    align-items: flex-start;
    display: flex;
    flex: none;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 64px;
    height: min-content;
    justify-content: flex-start;
    overflow: hidden;
    padding: 0 0 0 5%;
    position: relative;
    width: 100%;
}
@media (min-width: 810px) and (max-width: 1279px) {
    .framer-iA65W .framer-1ojo3zm {
        padding: 0 0 0 54px;
    }
}
.framer-iA65W .framer-rjr6qs {
    align-content: flex-start;
    align-items: flex-start;
    display: flex;
    flex: .5 0 0px;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 64px;
    height: min-content;
    justify-content: flex-start;
    overflow: hidden;
    padding: 192px 0 0;
    position: relative;
    width: 1px;
}
@media (min-width: 810px) and (max-width: 1279px) {
    .framer-iA65W .framer-rjr6qs {
        padding: 156px 0 0;
    }
}
.framer-iA65W .framer-scmfge {
    align-content: center;
    align-items: center;
    display: flex;
    flex: none;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 24px;
    height: min-content;
    justify-content: flex-start;
    max-width: 1140px;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 100%;
}
.ssr-variant {
    display: contents;
}
.framer-iA65W .framer-1rnm6tq, .framer-iA65W .framer-1ija2ve, .framer-iA65W .framer-16xj5o9, .framer-iA65W .framer-1h1d5y4, .framer-iA65W .framer-1y2falm {
    --framer-link-text-color: #0099ff;
    --framer-link-text-decoration: underline;
    flex: none;
    height: auto;
    position: relative;
    white-space: pre-wrap;
    width: 100%;
    word-break: break-word;
    word-wrap: break-word;
}
@media (min-width: 810px) and (max-width: 1279px) {
    .framer-iA65W .framer-1772fuw {
        aspect-ratio: .6787072243346007 / 1;
/*         height: 526px; */
    }
}
.framer-iA65W .framer-1772fuw {
    aspect-ratio: .9074626865671642 / 1;
    border-bottom-left-radius: 200px;
    flex: .5 0 0px;
/*     height: 635px; */
    overflow: hidden;
    position: relative;
    width: 1px;
    will-change: transform;
    z-index: 1;
}
@media (min-width: 810px) and (max-width: 1279px) {
    .framer-iA65W .framer-1772fuw {
        aspect-ratio: .6787072243346007 / 1;
/*         height: 526px; */
    }
}
@media (max-width: 809px) {
	.framer-iA65W .framer-1ojo3zm {
        align-content: center;
        align-items: center;
        flex-direction: column;
        gap: 32px;
        order: 0;
        padding: 0;
    }
	.framer-iA65W .framer-rjr6qs {
        align-content: center;
        align-items: center;
        flex: none;
        gap: 32px;
        order: 1;
        padding: 0;
        width: 90%;
    }
	.framer-iA65W .framer-rjr6qs .framer-text {
		text-align: center !important;
	}
	@media (max-width: 809px) {
		.framer-iA65W .framer-b5q1v3-container {
			width: 100% !important;
		}
	}
	.framer-iA65W .framer-b5q1v3-container {
		flex: none;
		height: auto;
		position: relative;
		width: 200px;
	}
    .framer-iA65W .framer-1772fuw {
        aspect-ratio: .8065843621399177 / 1;
        flex: none;
        height: 484px;
        order: 0;
        width: 100%;
    }
}

.framer-iA65W .framer-1x8jyrj {
    aspect-ratio: .9074626865671642 / 1;
    flex: 1 0 0px;
    height: 635px;
    overflow: hidden;
    position: relative;
    width: 1px;
}

.framer-iA65W .framer-k6rb3r {
    align-content: center;
    align-items: center;
    border-bottom-left-radius: 200px;
    bottom: 0;
    display: flex;
    flex: none;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 10px;
    justify-content: center;
    overflow: hidden;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 536px;
    will-change: transform;
}
.framer-iA65W .framer-i8xwew {
    -webkit-mask: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .7) 100%) add;
    background: linear-gradient(180deg, #7a1f9f 0%, rgb(170, 80, 204) 100%);
    flex: none;
    inset: 0;
    mask: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .7) 100%) add;
    overflow: hidden;
    position: absolute;
    z-index: 0;
}
.framer-oabWH .framer-1trxnh6 {
    aspect-ratio: 1.16 / 1;
    bottom: -31px;
    flex: none;
    /* height: 300px; */
    left: 21%;
    overflow: visible;
    position: absolute;
    right: 0;
    width: 79%;
}

.framer-oabWH .framer-3vjblz {
    aspect-ratio: .9991031390134529 / 1;
    flex: none;
    height: 537px;
    opacity: .6;
    overflow: visible;
    position: absolute;
    right: 0;
    top: 0;
    width: 536px;
}