body{
    --main-clr: rgb(234, 179, 0);
    --main-clr-o: 234, 179, 0;
    /* --main-clr: rgb(0, 0, 0);
    --main-clr-o: 0, 0, 0; */
    /* --main-clr: rgb(5, 90, 208);
    --main-clr-o: 5, 90, 208; */
}


.dpy{ padding: 50px 0;}


/* BIDO TEMPLATES */
.bd-template-1{ background-color: rgba(var(--main-clr-o), .05); width: 100%; padding: 50px 15px; border-radius: 10px; text-align: center;}
.bd-template-1 > div{ max-width: 600px; margin-inline: auto; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.bd-template-1 > div .icon{ --size: 100px; font-size: 60px; background-color: rgba(var(--main-clr-o), .75); color: #fff; width: var(--size); height: var(--size); display: flex; align-items: center; justify-content: center; border-radius: 50%;}
.bd-template-1 > div .icon i{}
.bd-template-1 > div h1{ font-size: 30px; font-weight: 600; margin-top: 10px;}
.bd-template-1 > div .order-number{ margin-top: 10px; font-size: 15px; font-weight: 400;}
.bd-template-1 > div .order-number span{ font-weight: 500; display: inline-block; background-color: rgba(var(--main-clr-o), .75); color: #fff; padding: 3px 10px 4px;}
.bd-template-1 > div .text{ margin-top: 20px;}
.bd-template-1 > div .text p{ font-size: 16px; font-weight: 400;}
.bd-template-1 > div .text p strong{ font-weight: 600;}
.bd-template-1 > div > a{ margin-top: 30px;}

.bd-template-2{ box-shadow: 0 0 25px 0 rgba(34, 41, 47, .1); border-radius: 10px; overflow: hidden; display: flex; flex-direction: column;}
.bd-template-2 .img{ aspect-ratio: 1.2; position: relative;}
.bd-template-2 .img .swiper{ position: absolute; inset: 0;}
.bd-template-2 .img .swiper,
.bd-template-2 .img .swiper .swiper-wrapper,
.bd-template-2 .img .swiper .swiper-wrapper .swiper-slide{ width: 100%; height: 100%;}
.bd-template-2 .img .swiper .swiper-wrapper .swiper-slide img{ width: 100%; height: 100%; object-fit: cover;}
.bd-template-2 .detail{ display: flex; flex-direction: column; padding: 15px;}
.bd-template-2 .detail strong{ font-size: 16px; font-weight: 500;}
.bd-template-2 .detail span{ font-size: 12px; font-weight: 300;}


.bd-template-3{ height: 100%; padding: 15px; display: flex; flex-direction: column; border-radius: 10px; overflow: hidden; box-shadow: 0 0 25px 0 rgba(34, 41, 47, .1); background-color: #fff; transition: all .3s ease;}
.bd-template-3:hover{ transform: translateY(-5px); box-shadow: 0 15px 20px -5px rgba(34, 41, 47, .1);}
.bd-template-3 .img{ display: flex; aspect-ratio: 1.5; position: relative; border-radius: 10px; overflow: hidden; min-height: fit-content;}
.bd-template-3 .img img{ width: 100%; height: 100%; object-fit: cover; position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: all .3s ease;}
.bd-template-3:hover .img img{ transform: scale(1.05);}
.bd-template-3 .img::before{ content: ''; display: inline-block; position: absolute; left: 0; bottom: 0; width: 100%; height: 30%; background: linear-gradient(transparent, #fff); z-index: 2;}
.bd-template-3 .detail{ display: flex; flex-direction: column; align-items: center; text-align: center; padding: 20px 10px 10px; justify-content: space-between; height: 100%;}
.bd-template-3 .detail > .txt{ display: flex; flex-direction: column; align-items: center; gap: 10px;}
.bd-template-3 .detail > .txt > strong{ font-size: 20px; font-weight: 600;}
.bd-template-3 .detail > .txt > p{ font-size: 15px; font-weight: 400; margin: 0;}
.bd-template-3 .detail > .price{ display: flex; margin-top: 15px; color: #051036; align-items: center; gap: 10px;}
.bd-template-3 .detail > .price span{ display: flex; gap: 5px;}
.bd-template-3 .detail > .price span strong{ font-weight: 600; font-size: 20px;}



.swiper-template-1 .arrow{ --space: 5px; font-size: 20px; position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; background-color: transparent; border: none; outline: none; cursor: pointer; color: #fff;}
.swiper-template-1 .arrow.prev{ left: var(--space);}
.swiper-template-1 .arrow.next{ right: var(--space);}
.swiper-template-1 .swiper-pagination-bullet{ background-color: #fff; opacity: .3; width: 15px; height: 5px; border-radius: 99px;}
.swiper-template-1 .swiper-pagination-bullet-active{ background-color: #fff; opacity: 1;}




.bd-wrapper-1{ display: grid; gap: 25px; grid-template-columns: repeat(4, 1fr);}

@media screen and (max-width: 1400px) {
    .bd-wrapper-1{ grid-template-columns: repeat(3, 1fr);}
}
@media screen and (max-width: 992px) {
    .bd-wrapper-1{ grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width: 768px) {
    .bd-wrapper-1{ display: flex; flex-direction: column;}

    .bd-template-3 .detail > .txt > strong{ font-size: 16px;}
    .bd-template-3 .detail > .txt > p{ font-size: 13px;}
    .bd-template-3 .detail > .price span strong{ font-size: 18px;}
}



.tour-slider{ margin-top: 20px; overflow: visible !important; padding: 30px 0 !important;}
.tour-slider .swiper-slide{ height: auto;}





/* BD BUTTON */
.bd-btn{ white-space: nowrap; text-align: center; background-color: var(--bg); border: 2px solid var(--border, var(--bg)); color: var(--clr); transition: all .3s ease; cursor: pointer; display: flex; justify-content: center; gap: 10px; align-items: center;}
.bd-btn.limited-2{ max-width: 310px; margin-inline: auto; width: 100%;}
.bd-btn:not(.just-clr){border-radius: var(--btn-radius);padding: 14px 40px 15px;font-size: 15px;line-height: 1;}
.bd-btn:not(.just-clr).big{ padding: 15px 40px; font-size: 18px; font-weight: 700;}
.bd-btn:not(.no-hover):hover,
.bd-btn:not(.no-hover).active{ color: var(--hover-clr, var(--bg)); background-color: var(--clr); border-color: var(--hover-border, var(--border, var(--bg)));}
.bd-btn:disabled, .bd-btn.disabled{ pointer-events: none; opacity: .5;}


.btn-main{ --bg: var(--main-clr); --clr: #fff;}
.btn-main-outlined{ --bg: #fff; --clr: var(--main-clr); --border: var(--main-clr);}
.btn-main-single{ --bg: #fff; --clr: var(--main-clr); --hover-border: var(--main-clr);}


.bd-btn-sm{ padding: 10px 30px 11px !important;}





.iframe-map{ width: 100%; height: 400px; border-radius: 20px; overflow: hidden;}
.iframe-map iframe{ width: 100%; height: 100%;}




.whatsapp-icon {
    position: fixed;
    bottom: 15px;
    left: 15px;
    width: 60px;
    height: 60px;
    background-color: #25D366;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    z-index: 10;
    font-size: 40px;
}