.package-detail {
  display: flex;
  gap: 48px;
  align-items: stretch; /* KEY */
}

/* LEFT IMAGE */
.package-detail .package-image {
  flex: 2;
  display: flex;
  /* height: 570px; */
}

.package-detail .package-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

/* RIGHT INFO */
.package-detail .package-info {
  flex: 1;
  background: #F5F7FA;
  padding: 32px 24px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* optional for spacing */
}

/* INFO ITEMS */
.package-detail .info-item {
  display: flex;
  justify-content: space-between;
  font-size: 18px;
  padding: 0 0 16px 0;
}
.package-detail .duration .title::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  mask-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 14C6.81331 14 5.65328 13.6481 4.66658 12.9888C3.67989 12.3295 2.91085 11.3925 2.45673 10.2961C2.0026 9.19975 1.88378 7.99335 2.11529 6.82946C2.3468 5.66557 2.91825 4.59648 3.75736 3.75736C4.59648 2.91825 5.66557 2.3468 6.82946 2.11529C7.99335 1.88378 9.19975 2.0026 10.2961 2.45673C11.3925 2.91085 12.3295 3.67989 12.9888 4.66658C13.6481 5.65328 14 6.81331 14 8C14 9.5913 13.3679 11.1174 12.2426 12.2426C11.1174 13.3679 9.5913 14 8 14ZM8 2.85715C6.98284 2.85715 5.98852 3.15877 5.14278 3.72387C4.29705 4.28898 3.63787 5.09218 3.24862 6.03192C2.85937 6.97165 2.75753 8.00571 2.95596 9.00332C3.1544 10.0009 3.64421 10.9173 4.36345 11.6365C5.08269 12.3558 5.99906 12.8456 6.99668 13.044C7.9943 13.2425 9.02835 13.1406 9.96809 12.7514C10.9078 12.3621 11.711 11.703 12.2761 10.8572C12.8412 10.0115 13.1429 9.01716 13.1429 8C13.1429 6.63603 12.601 5.32793 11.6365 4.36345C10.6721 3.39898 9.36397 2.85715 8 2.85715Z" fill="black"/><path d="M9.59714 10.5357L8 8.93857V6.25H8.57143V8.70143L10 10.1329L9.59714 10.5357Z" fill="black"/></svg>');
  background-color: #000;
  mask-size: contain;
  mask-repeat: no-repeat;
}
.package-detail .destination .title::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  mask-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.16499 13.98C8.93173 13.2842 9.64135 12.528 10.287 11.7187C11.647 10.01 12.4743 8.32532 12.5303 6.82732C12.5525 6.21851 12.4517 5.61149 12.234 5.0425C12.0163 4.47352 11.6862 3.95425 11.2633 3.51571C10.8405 3.07717 10.3335 2.72836 9.77285 2.49012C9.21216 2.25188 8.6092 2.12909 7.99999 2.12909C7.39079 2.12909 6.78783 2.25188 6.22714 2.49012C5.66645 2.72836 5.15953 3.07717 4.73666 3.51571C4.3138 3.95425 3.98366 4.47352 3.76597 5.0425C3.54827 5.61149 3.4475 6.21851 3.46966 6.82732C3.52633 8.32532 4.35433 10.01 5.71366 11.7187C6.3593 12.528 7.06892 13.2842 7.83566 13.98C7.90944 14.0467 7.96433 14.0951 8.00033 14.1253L8.16499 13.98ZM7.50833 14.7567C7.50833 14.7567 2.66699 10.6793 2.66699 6.66732C2.66699 5.25283 3.2289 3.89628 4.22909 2.89608C5.22928 1.89589 6.58584 1.33398 8.00033 1.33398C9.41481 1.33398 10.7714 1.89589 11.7716 2.89608C12.7718 3.89628 13.3337 5.25283 13.3337 6.66732C13.3337 10.6793 8.49233 14.7567 8.49233 14.7567C8.22299 15.0047 7.77966 15.002 7.50833 14.7567ZM8.00033 8.53398C8.4954 8.53398 8.97019 8.33732 9.32026 7.98725C9.67033 7.63718 9.86699 7.16239 9.86699 6.66732C9.86699 6.17225 9.67033 5.69745 9.32026 5.34738C8.97019 4.99732 8.4954 4.80065 8.00033 4.80065C7.50525 4.80065 7.03046 4.99732 6.68039 5.34738C6.33032 5.69745 6.13366 6.17225 6.13366 6.66732C6.13366 7.16239 6.33032 7.63718 6.68039 7.98725C7.03046 8.33732 7.50525 8.53398 8.00033 8.53398ZM8.00033 9.33398C7.29308 9.33398 6.6148 9.05303 6.11471 8.55294C5.61461 8.05284 5.33366 7.37456 5.33366 6.66732C5.33366 5.96007 5.61461 5.2818 6.11471 4.7817C6.6148 4.2816 7.29308 4.00065 8.00033 4.00065C8.70757 4.00065 9.38585 4.2816 9.88594 4.7817C10.386 5.2818 10.667 5.96007 10.667 6.66732C10.667 7.37456 10.386 8.05284 9.88594 8.55294C9.38585 9.05303 8.70757 9.33398 8.00033 9.33398Z" fill="black"/></svg>');
  background-color: #000;
  mask-size: contain;
  mask-repeat: no-repeat;
}
.package-detail .package-size .title::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  mask-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 13.0975V11.8715C1 11.5261 1.08932 11.2291 1.26797 10.9805C1.44711 10.7324 1.68779 10.5339 1.99 10.385C2.63562 10.0773 3.27676 9.8322 3.91344 9.64958C4.54962 9.46696 5.31533 9.37565 6.21055 9.37565C7.10577 9.37565 7.87172 9.46696 8.5084 9.64958C9.14508 9.8322 9.78623 10.0773 10.4318 10.385C10.7336 10.5339 10.974 10.7324 11.1531 10.9805C11.3318 11.2291 11.4211 11.5261 11.4211 11.8715V13.0975H1ZM12.9098 13.0975V11.8373C12.9098 11.4055 12.8225 10.9984 12.6478 10.6158C12.4736 10.2327 12.226 9.90415 11.9049 9.63023C12.2707 9.70466 12.623 9.80788 12.9619 9.93988C13.3004 10.0724 13.6353 10.221 13.9668 10.3858C14.2894 10.548 14.5422 10.7557 14.7253 11.0088C14.9084 11.2619 15 11.538 15 11.8373V13.0975H12.9098ZM4.63026 7.06217C4.19506 6.62696 3.97746 6.1002 3.97746 5.48188C3.97746 4.86357 4.19506 4.3368 4.63026 3.9016C5.06547 3.46639 5.59223 3.24879 6.21055 3.24879C6.82887 3.24879 7.35563 3.46639 7.79083 3.9016C8.22604 4.3368 8.44364 4.86357 8.44364 5.48188C8.44364 6.1002 8.22604 6.62696 7.79083 7.06217C7.35563 7.49737 6.82887 7.71498 6.21055 7.71498C5.59223 7.71498 5.06547 7.49737 4.63026 7.06217ZM10.9655 7.06217C10.5284 7.49737 10.0028 7.71498 9.38898 7.71498C9.35722 7.71498 9.31703 7.71125 9.2684 7.70381C9.21977 7.69637 9.17957 7.68868 9.14781 7.68074C9.4004 7.37158 9.59418 7.02867 9.72916 6.65202C9.86463 6.27587 9.93237 5.88508 9.93237 5.47965C9.93237 5.07422 9.86166 4.68715 9.72023 4.31844C9.5783 3.94874 9.3875 3.60361 9.14781 3.28303C9.18801 3.26864 9.2282 3.25921 9.2684 3.25475C9.30859 3.25028 9.34879 3.24805 9.38898 3.24805C10.0028 3.24805 10.5284 3.46565 10.9655 3.90085C11.4027 4.33606 11.6216 4.86282 11.6221 5.48114C11.6226 6.09946 11.4037 6.62647 10.9655 7.06217ZM1.74436 12.3531H10.6767V11.8715C10.6767 11.6968 10.6331 11.5442 10.5457 11.4137C10.4584 11.2832 10.3016 11.1582 10.0753 11.0386C9.51999 10.7418 8.93443 10.5145 8.31859 10.3567C7.70275 10.1989 7.00007 10.12 6.21055 10.12C5.42103 10.12 4.7181 10.1989 4.10177 10.3567C3.48642 10.5145 2.90086 10.7418 2.34507 11.0386C2.11928 11.1577 1.96271 11.2827 1.87537 11.4137C1.78803 11.5442 1.74436 11.6968 1.74436 11.8715V12.3531ZM7.26234 6.53293C7.55363 6.24163 7.69928 5.89128 7.69928 5.48188C7.69928 5.07248 7.55363 4.72189 7.26234 4.4301C6.97104 4.13831 6.62045 3.99266 6.21055 3.99316C5.80065 3.99365 5.45031 4.1393 5.15951 4.4301C4.86871 4.7209 4.72281 5.07149 4.72182 5.48188C4.72083 5.89228 4.86672 6.24262 5.15951 6.53293C5.45229 6.82323 5.80264 6.96912 6.21055 6.97061C6.61846 6.9721 6.96906 6.82621 7.26234 6.53293Z" fill="black"/></svg>');
  background-color: #000;
  mask-size: contain;
  mask-repeat: no-repeat;
}
.package-detail .info-item.package-size{
    padding-bottom: 0;
}

.package-detail .info-item span:first-child {
  font-weight: 600;
  color: #1A1A1A;
}

.package-detail .info-item span:last-child {
    color: #616161;
    text-align: right;
}
.package-detail .info-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  padding: 24px 0;
  border-bottom: 1px solid #616161;
  border-top: 1px solid #616161;
  margin: 24px 0;
}   
.package-detail .info-grid .info-item {
  display: flex;
  flex-direction: column; 
  gap: 8px;
  padding-bottom: 0;
  font-size: 14px;
  text-align: left !important;
}
.package-detail .info-grid .info-item span{ 
  text-align: left !important;
}
.package-detail .info-grid .info-item span:last-child {
  font-weight: 600;
  color: #1A1A1A;
}

.package-detail .info-grid .info-item span:first-child {
    color: #616161;
    text-align: right;
    font-weight: 400;
}

/* PRICE */
.package-detail .price {
    margin-bottom: 24px;
  font-size: 18px;
  font-weight: 600;
}

/* BUTTONS */
.package-detail .btn {
  display: block;
  padding: 14px;
  border-radius: 50px;
  text-align: center;
  margin-bottom: 24px;
  cursor: pointer;
  font-weight: 500;
  text-decoration: none;
  font-size: 16px;
}

.package-detail #enquireBtn { 
    margin-bottom: 0;
  font-weight: 500; 
  background-color: transparent !important;
}
.package-detail .btn-primary {
  background: #2b5da8;
  color: #fff;
}

.package-detail .btn-outline {
  border: 1px solid #2b5da8;
  color: #2b5da8;
  background: transparent;
}

/* ───────── MODAL ───────── */

/* Overlay */
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  z-index: 99;
}

/* Side Modal */
.modal {
  position: fixed;
  top: 0;
  right: -400px;
  width: 350px;
  height: 100%;
  background: #fff;
  padding: 20px;
  transition: 0.3s;
  z-index: 100;
  box-shadow: -5px 0 20px rgba(0,0,0,0.1);
}

/* Active State */
.overlay.active {
  opacity: 1;
  visibility: visible;
}

.modal.active {
  right: 0;
}

/* Modal Content */
/* OVERLAY */
.pd-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  z-index: 999;
}

.pd-overlay.active {
  opacity: 1;
  visibility: visible;
}

/* MODAL */
.pd-modal {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  right: -200%;
  width: 760px;
  height: calc(100% - 72px - 72px);
  background: #fff;
  /* min-height: 80%; */
  z-index: 1000;
  transition: 0.4s ease;
  padding: 48px 32px;
  border-radius: 16px;
  margin-right: 72px;
}
.pd-modal-content{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow-y: auto;
    height: 100%;
}

.pd-modal.active {
  right: 0;
}

/* CLOSE */
.pd-modal .pd-close {
  font-size: 20px;
  cursor: pointer;
  color: #fff;
  position: absolute;
  left: -32px;
  transform: translateX(-100%);
  top: 0;
}

/* CONTENT */
/* .package-detail ~ .pd-modal .pd-modal-content {
  padding: 20px;
} */

/* PACKAGE CARD */
.pd-modal .pd-package-card {
  display: flex;
  gap: 15px;
  background: #f3f4f6;
  padding: 12px;
  border-radius: 10px;
  margin-bottom: 20px;
}

.pd-modal .pd-package-card img {
  width: 150px;
  height: 150px;
  object-fit: cover;
  border-radius: 8px;
}

.pd-modal h3 {
  margin: 0;
  margin-bottom: 8px;
  /* font-size: 16px; */
}

.pd-modal .pd-meta-wrap {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
  margin: 6px 0;
}

.pd-modal .pd-meta-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #000000;
}

.pd-modal .pd-meta-item svg {
  width: 16px;
  height: 16px;
  color: #000000;
}

.pd-modal .pd-desc {
  font-size: 14px;
  color: #616161;
}

.pd-modal .pd-price {
  font-weight: 600;
  margin-top: 16px;
  font-size: 20px;
}

/* FORM */
.pd-modal .pd-form {
  margin-top: 10px;
}


/* HELP */
.pd-help h4{
    margin: 32px 0 8px 0;
}
.pd-help p{
    font-size: 14px;
}
.package-detail .contact{
  font-size: 20px;
}
.contact .whatsapp-link{
    color: #248900;
    margin-left: 24px;
}
.package-detail ~ .pd-modal .pd-phone {
  color: #FF7000;
}


/* ───────── RESPONSIVE ───────── */

@media (max-width: 1200px) { 
    .pd-modal{
        margin-right: 32px;
        width: 550px;
    }
}
@media (max-width: 992px) {
  .package-detail {
    flex-direction: column;
  }
  .package-detail .package-image{
    height: 450px;
    flex: unset;
  }
}

/* MOBILE */
@media (max-width: 767px) {
    .package-detail {
        gap: 32px;
    }
    .pd-modal {
        width: 75%;
        right: -200%;
        margin-right: 0;
        padding: 48px 24px;
        transform: translate(50%, -50%)
    }
    .pd-modal.active{
        right: 50%;
    }
    .pd-modal .pd-close{
        color: #000;
        margin-bottom: 24px;
        transform: unset;
        left: unset;
        right: 24px;
        top: 10px;
    }
}

@media (max-width: 556px) { 
    .pd-modal .pd-package-card{
        flex-direction: column;
    }
    .pd-modal .pd-package-card img{
        width: 100%;
        height: 100%;
    }
    .contact .whatsapp-link{
        display: block;
        margin-left: 0;
        margin-top: 16px;
    }
    .package-detail .package-image{
        height: 400px;
    }
}