.packages-grid {
  --brown: #6B2014;
  --brown-deep: #4d1409;
  --saffron: #F2B233;
  --saffron-soft: #f7c95f;
  --ember: #E8651C;
  --lava: #D63D14;
  --crimson: #A8240E;
  --lime: #D9E84A;
  --cream: #FFF8E7;
  --cream-2: #fdf3df;
  --white: #FFFFFF;
  --ink: #1A1A1A;
  --muted: #6f6258;
  --line: #ece2cf;
  display: grid;
  grid-template-columns: 1fr 1.24fr 1fr;
  gap: 22px;
  margin-top: 40px;
  align-items: start;
}

.pkg-card {
  background: var(--white);
  border: 2px solid #e6ddcc;
  border-radius: 16px;
  overflow: visible;
  display: flex;
  flex-direction: column;
  transition: transform .2s, box-shadow .2s;
  position: relative;
  text-decoration: none;
}
.pkg-card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(107,32,20,.13); }

.pkg-card.featured {
  border: 3px solid var(--lava);
  margin-top: -14px;
  margin-bottom: -14px;
  box-shadow: 0 20px 44px rgba(214,61,20,.22);
  z-index: 3;
}

.pkg-ribbon {
  position: absolute;
  top: -29px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--lime);
  color: var(--brown);
  border: 2px solid var(--brown);
  font-family: 'Oswald', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .6px;
  padding: 4px 18px;
  border-radius: 30px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  box-shadow: 0 4px 10px rgba(0,0,0,.12);
  z-index: 2;
}

.pkg-head {
  background: #5b4034;
  padding: 11px 16px;
  text-align: center;
  border-radius: 13px 13px 0 0;
}
.pkg-card.featured .pkg-head { background: var(--brown); padding: 13px 16px; border-radius: 10px 10px 0 0; }
.pkg-head h4 {
  font-family: 'Oswald', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin: 0;
}
.pkg-card.featured .pkg-head h4 { font-size: 17px; }

.pkg-body { padding: 22px 20px; display: flex; flex-direction: column; gap: 14px; }
.pkg-card.featured .pkg-body { padding: 22px 22px; gap: 13px; }

.pkg-qty {
  font-family: 'Oswald', sans-serif;
  font-size: 36px;
  font-weight: 700;
  color: var(--brown);
  text-align: center;
  line-height: 1;
}
.pkg-card.featured .pkg-qty { font-size: 40px; }

.pkg-supply { font-size: 14px; font-weight: 700; color: var(--muted); text-align: center; margin-top: -8px; }
.pkg-card.featured .pkg-supply { font-size: 15px; }

.pkg-img-wrap { min-height: 150px; display: flex; align-items: center; justify-content: center; position: relative; }
.pkg-img-wrap img {
  max-height: 160px;
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 12px 16px rgba(107,32,20,.18));
}
.pkg-card.featured .pkg-img-wrap { min-height: 188px; }
.pkg-card.featured .pkg-img-wrap img {
  max-height: 200px;
  max-width: 110%;
  width: auto;
  filter: drop-shadow(0 16px 22px rgba(107,32,20,.22));
}

.pkg-bonus-tag {
  position: absolute;
  right: 6px;
  bottom: 10px;
  background: var(--ember);
  color: #fff;
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 11px;
  border-radius: 6px;
  box-shadow: 0 3px 8px rgba(0,0,0,.2);
}
.pkg-card.featured .pkg-bonus-tag { font-size: 13px; padding: 5px 13px; }

.pkg-price {
  font-family: 'Oswald', sans-serif;
  font-size: 66px;
  font-weight: 700;
  color: var(--lava);
  text-align: center;
  line-height: .95;
}
.pkg-card.featured .pkg-price { font-size: 74px; }

.pkg-price-per { font-size: 14px; font-weight: 600; color: var(--muted); text-align: center; margin-top: -4px; }
.pkg-card.featured .pkg-price-per { font-size: 15px; }

.pkg-feats { display: flex; flex-direction: column; gap: 7px; padding: 4px 0; }
.pkg-feat { display: flex; align-items: center; gap: 9px; font-size: 14.5px; font-weight: 600; }
.pkg-feat svg { width: 17px; height: 17px; min-width: 17px; }
.pkg-feat.yes { color: #2f2a26; }
.pkg-feat.yes svg { fill: #1f9e57; }
.pkg-feat.no { color: #b3a99c; }
.pkg-feat.no svg { fill: #c9bdae; }
.pkg-card.featured .pkg-feat { font-size: 15.5px; gap: 10px; }
.pkg-card.featured .pkg-feat svg { width: 18px; height: 18px; min-width: 18px; }

.pkg-save {
  background: var(--cream-2);
  border: 1px solid var(--saffron-soft);
  border-radius: 8px;
  text-align: center;
  padding: 9px;
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  font-size: 17px;
  color: var(--crimson);
}
.pkg-card.featured .pkg-save { font-size: 18px; padding: 10px; }

.pkg-total { text-align: center; line-height: 1.2; }
.pkg-total .was { color: #b3a99c; text-decoration: line-through; font-size: 17px; margin-right: 6px; }
.pkg-total .now { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 26px; color: var(--brown); }
.pkg-total .ship { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.pkg-card.featured .pkg-total .was { font-size: 19px; }
.pkg-card.featured .pkg-total .now { font-size: 30px; }

.pkg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  background: var(--lava);
  color: #fff;
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  border: none;
  border-radius: 9px;
  cursor: pointer;
  transition: background .2s, transform .15s, box-shadow .2s;
  font-size: 20px;
  padding: 14px 16px;
  width: 100%;
  position: relative;
  letter-spacing: .3px;
  pointer-events: none;
}
.pkg-btn:hover {
  background: var(--crimson);
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(168,36,14,.34);
}
.pkg-btn svg { width: 20px; height: 20px; }
.pkg-card.featured .pkg-btn {
  font-size: 22px;
  padding: 17px 16px;
  box-shadow: 0 12px 26px rgba(214,61,20,.34);
}
.pkg-card.featured .pkg-btn svg { width: 24px; height: 24px; }

.pkg-hand {
  position: absolute;
  right: -6px;
  bottom: -22px;
  width: 46px;
  pointer-events: none;
  animation: hand-tap 1.6s ease-in-out infinite;
}
.pkg-card.featured .pkg-hand { width: 52px; right: -8px; bottom: -24px; }
@keyframes hand-tap {
  0%, 100% { transform: translateY(0) rotate(-8deg); }
  50% { transform: translateY(-7px) rotate(-8deg); }
}

.pkg-pay { max-width: 180px; margin: 2px auto 0; opacity: .85; }
.pkg-card.featured .pkg-pay { max-width: 200px; }

@media (max-width: 991px) {
  .packages-grid { grid-template-columns: 1fr 1.2fr 1fr; gap: 16px; }
  .pkg-card.featured { margin-top: -12px; margin-bottom: -12px; box-shadow: 0 16px 34px rgba(214,61,20,.2); }
  .pkg-card.featured .pkg-body { padding: 20px 16px; gap: 13px; }
  .pkg-card.featured .pkg-img-wrap { min-height: 170px; }
  .pkg-card.featured .pkg-img-wrap img { max-height: 175px; max-width: 106%; }
  .pkg-card.featured .pkg-qty { font-size: 36px; }
  .pkg-card.featured .pkg-price { font-size: 62px; }
  .pkg-card.featured .pkg-save { font-size: 17px; }
  .pkg-card.featured .pkg-total .now { font-size: 27px; }
  .pkg-card.featured .pkg-btn { font-size: 19px; padding: 14px 12px; }
}

@media (max-width: 767px) {
  .packages-grid { grid-template-columns: 1fr; max-width: 380px; margin: 40px auto 0; }
  .pkg-card:nth-child(1) { order: 3; }
  .pkg-card:nth-child(2) { order: 1; }
  .pkg-card:nth-child(3) { order: 2; }
  .pkg-card { margin-top: 0; }
  .pkg-card.featured { margin-top: 0; margin-bottom: 0; }
  .pkg-card.featured .pkg-img-wrap img { max-width: 100%; }
}