/* ════════════════════════════════════════════════════════════════════
   COMBO PACKS — Dedicated card + grid styles
   Used on: index.php homepage section, shop.php promo strip,
            shop.php dedicated combo grid (?cat=combo-packs)
   ════════════════════════════════════════════════════════════════════ */

/* ─── GRID CONTAINERS ──────────────────────────────────────────── */

/* Homepage combo section — full width on mobile, 2-up on desktop */
.combo-grid-v8 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 0 16px 24px;
}

/* Shop page promo strip (when not filtering by combo-packs) */
.combo-strip-v8 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  padding: 8px 16px 18px;
  margin-bottom: 8px;
}
.combo-strip-v8-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 16px 10px;
  margin-bottom: 4px;
}
.combo-strip-v8-header h3 {
  font-family: 'Lora', Georgia, serif;
  font-size: 18px;
  margin: 0;
  color: #1A1A1A;
}
.combo-strip-v8-header h3 em {
  color: #C9A24A;
  font-style: italic;
}
.combo-strip-v8-header a {
  font-size: 11px;
  color: #0B4F2F;
  font-weight: 600;
  text-decoration: none;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Shop dedicated combo grid (?cat=combo-packs) */
.combo-shop-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  padding: 8px 16px 24px;
}

/* Shop hero header for combo category */
.combo-shop-hero {
  background: linear-gradient(135deg, #0B4F2F 0%, #06351F 100%);
  color: #FAF7EF;
  padding: 28px 20px 32px;
  border-radius: 0;
  margin: 0 0 16px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.combo-shop-hero::before {
  content: '';
  position: absolute;
  top: 0; right: 0; width: 200px; height: 200px;
  background: radial-gradient(circle, rgba(172, 147, 98, 0.18) 0%, transparent 70%);
  pointer-events: none;
}
.combo-shop-hero-eyebrow {
  display: inline-block;
  padding: 4px 12px;
  background: rgba(172, 147, 98, 0.18);
  border: 1px solid rgba(172, 147, 98, 0.4);
  color: #C9A24A;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  border-radius: 100px;
  margin-bottom: 12px;
  text-transform: uppercase;
}
.combo-shop-hero h1 {
  font-family: 'Lora', Georgia, serif;
  font-size: 28px;
  margin: 0 0 8px;
  line-height: 1.15;
  font-weight: 600;
  color: #FAF7EF;
  position: relative;
  z-index: 1;
}
.combo-shop-hero h1 em {
  color: #C9A24A;
  font-style: italic;
}
.combo-shop-hero p {
  font-size: 13px;
  margin: 0;
  color: rgba(250, 247, 239, 0.85);
  line-height: 1.5;
  max-width: 480px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.combo-shop-back {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 12px;
  margin: 12px 16px 0;
  font-size: 12px;
  color: #0B4F2F;
  text-decoration: none;
  font-weight: 600;
}

/* ─── COMBO CARD ───────────────────────────────────────────────── */

.combo-pcard {
  position: relative;
  background: #fff;
  border: 1px solid rgba(172, 147, 98, 0.28);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.22s cubic-bezier(0.4, 0, 0.2, 1),
              border-color 0.22s;
  width: 100%;
  text-align: left;
  font-family: inherit;
}
.combo-pcard:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(11, 79, 47, 0.12);
  border-color: rgba(172, 147, 98, 0.5);
}
.combo-pcard:focus-visible {
  outline: 2px solid #C9A24A;
  outline-offset: 2px;
}
.combo-pcard.is-oos { opacity: 0.6; }

/* Media area */
.combo-pcard-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  background: linear-gradient(135deg, #F3E8D0 0%, #E8DBB8 100%);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.combo-pcard-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.combo-pcard-fallback {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: #AC9362;
  opacity: 0.5;
}

.combo-pcard-badge {
  position: absolute;
  top: 14px;
  left: 0;
  padding: 6px 14px 6px 12px;
  background: #C9A24A;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  clip-path: polygon(0 0, 100% 0, calc(100% - 6px) 50%, 100% 100%, 0 100%);
  z-index: 2;
}

.combo-pcard-save {
  position: absolute;
  top: 14px;
  right: 14px;
  padding: 5px 9px;
  background: #C44;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  z-index: 2;
}

.combo-pcard-wish {
  position: absolute;
  bottom: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.95);
  border: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #888;
  z-index: 2;
  transition: transform 0.15s, color 0.15s;
}
.combo-pcard-wish:hover { transform: scale(1.08); color: #C44; }
.combo-pcard-wish.on { color: #C44; fill: #C44; }
.combo-pcard-wish.on svg { fill: #C44; }

/* Body */
.combo-pcard-body {
  padding: 18px 18px 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.combo-pcard-eyebrow {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: #AC9362;
  margin-bottom: 6px;
  text-transform: uppercase;
}
.combo-pcard-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #C9A24A;
}

.combo-pcard-name {
  font-family: 'Lora', Georgia, serif;
  font-size: 19px;
  font-weight: 600;
  color: #0B4F2F;
  margin: 0 0 6px;
  line-height: 1.2;
}

.combo-pcard-tagline {
  font-size: 13px;
  color: #6f6760;
  line-height: 1.5;
  margin: 0 0 14px;
}

/* Item thumbnails strip */
.combo-pcard-thumbs {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.combo-pcard-thumb {
  position: relative;
  width: 52px;
  height: 52px;
  border-radius: 10px;
  background: #FAF7EF;
  border: 1px solid rgba(172, 147, 98, 0.22);
  overflow: hidden;
  flex-shrink: 0;
}
.combo-pcard-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.combo-pcard-thumb-fb {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: #AC9362;
  opacity: 0.5;
}
.combo-pcard-thumb-qty {
  position: absolute;
  bottom: -3px;
  right: -3px;
  padding: 2px 5px;
  background: #0B4F2F;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  border-radius: 100px;
  border: 2px solid #fff;
  line-height: 1;
}
.combo-pcard-thumb-more {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: #AC9362;
  background: rgba(172, 147, 98, 0.1);
  border-style: dashed;
}

/* Items list (text-detailed) */
.combo-pcard-items {
  list-style: none;
  padding: 12px 0 0;
  margin: 0 0 14px;
  border-top: 1px dashed rgba(172, 147, 98, 0.3);
  font-size: 12.5px;
  color: #1A1A1A;
}
.combo-pcard-items li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  line-height: 1.4;
}
.combo-pcard-item-check {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(11, 79, 47, 0.1);
  color: #0B4F2F;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.combo-pcard-item-name {
  flex: 1;
  min-width: 0;
  font-weight: 500;
  color: #1A1A1A;
}
.combo-pcard-item-size {
  font-size: 11px;
  color: #888;
  font-weight: 400;
}
.combo-pcard-item-qty {
  font-size: 11.5px;
  font-weight: 700;
  color: #0B4F2F;
  margin-left: auto;
  flex-shrink: 0;
}

/* Rating row */
.combo-pcard-rating {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 14px;
  font-size: 12px;
}
.combo-pcard-stars {
  display: inline-flex;
  align-items: center;
  letter-spacing: -1px;
  font-size: 14px;
}
.combo-pcard-stars .star.full { color: #C9A24A; }
.combo-pcard-stars .star.empty { color: #DDD3BD; }
.combo-pcard-stars .star.half {
  color: #C9A24A;
  background: linear-gradient(90deg, #C9A24A 50%, #DDD3BD 50%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.combo-pcard-rating-num {
  font-weight: 700;
  color: #1A1A1A;
}
.combo-pcard-rating-count {
  color: #888;
  font-size: 11.5px;
}

/* Footer (price + CTA) */
.combo-pcard-foot {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(172, 147, 98, 0.18);
}
.combo-pcard-price-block {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.combo-pcard-price {
  font-family: 'Lora', Georgia, serif;
  font-size: 26px;
  font-weight: 700;
  color: #0B4F2F;
  line-height: 1;
}
.combo-pcard-mrp {
  font-size: 14px;
  color: #aaa;
  text-decoration: line-through;
  font-weight: 500;
}
.combo-pcard-saved {
  margin-left: auto;
  font-size: 11px;
  font-weight: 700;
  color: #C44;
  letter-spacing: 0.02em;
}

.combo-pcard-cta {
  width: 100%;
  height: 48px;
  background: #0B4F2F;
  color: #fff;
  border: 0;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background 0.15s, transform 0.1s;
  font-family: inherit;
}
.combo-pcard-cta:hover { background: #06351F; }
.combo-pcard-cta:active { transform: scale(0.98); }
.combo-pcard-cta:disabled {
  background: #ccc;
  color: #fff;
  cursor: not-allowed;
}
.combo-pcard-cta.added {
  background: #2D7A3F;
}

/* ─── DESKTOP — 2 per row + bigger spacing ─────────────────── */
@media (min-width: 768px) {
  .combo-grid-v8 {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 4px 24px 28px;
  }
  .combo-strip-v8 {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto 16px;
    padding: 8px 24px 20px;
  }
  .combo-strip-v8-header {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4px 24px 10px;
  }
  .combo-shop-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px 24px 36px;
  }
  .combo-shop-hero {
    border-radius: 20px;
    margin: 16px 24px 24px;
    padding: 56px 40px 56px;
    max-width: 1152px;
    margin-left: auto;
    margin-right: auto;
  }
  .combo-shop-hero h1 { font-size: 40px; }
  .combo-shop-hero p { font-size: 15px; max-width: 600px; }

  .combo-pcard-name { font-size: 22px; }
  .combo-pcard-tagline { font-size: 14px; }
  .combo-pcard-items { font-size: 13.5px; }
  .combo-pcard-price { font-size: 30px; }
  .combo-pcard-thumb { width: 60px; height: 60px; }
  .combo-pcard-body { padding: 22px 22px 24px; }
}

/* ─── ON SHOP DEDICATED COMBO PAGE — hide regular product grid ──── */
.shop-combo-mode .prod-grid,
.shop-combo-mode .filter-row,
.shop-combo-mode .sort-row {
  display: none !important;
}


/* ════════════════════════════════════════════════════════════════════
   F6 POLISH (2026-05-24) — Additive overrides for combo card.
   All rules below override earlier rules via source order. No selectors
   renamed. No data attributes touched. Add-to-cart JS safe.

   Polish list:
   - hover lift softened -3px → -2px (consistency)
   - name switched to Fraunces serif (per F6 Q6 approval)
   - eyebrow tighter tracking + gold accent
   - SAVE pill less screaming
   - "You save ₹X" calmer chip styling
   - rating block visibility now controlled by PHP conditional
   - CTA button height bump for tap target
   ════════════════════════════════════════════════════════════════════ */

/* ── Hover: softer lift ───────────────────────────────────────── */
.combo-pcard:hover {
  transform: translateY(-2px);
  box-shadow:
    0 10px 28px rgba(11, 79, 47, 0.10),
    0 4px 10px rgba(11, 79, 47, 0.06);
  border-color: rgba(172, 147, 98, 0.45);
}

/* ── Name: Fraunces serif (per F6 approval) ───────────────────── */
.combo-pcard-name {
  font-family: 'Fraunces', 'Playfair Display', Georgia, serif;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

/* ── Eyebrow: tighter tracking, gold accent ──────────────────── */
.combo-pcard-eyebrow {
  letter-spacing: 0.18em;
  color: #8C7340;
}
.combo-pcard-dot {
  background: #C9A24A;
}

/* ── SAVE pill: less screaming, premium feel ──────────────────── */
.combo-pcard-save {
  background: #B4391F;
  letter-spacing: 0.06em;
  box-shadow: 0 2px 6px rgba(180, 57, 31, 0.22);
}

/* ── "You save ₹X" chip: calmer treatment ─────────────────────── */
.combo-pcard-saved {
  background: rgba(11, 79, 47, 0.08);
  color: #0B4F2F;
  padding: 3px 9px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.02em;
}

/* ── Rating block — only renders when real data exists.
       PHP now wraps this in <?php if ($_rating !== null) ?>. ──── */

/* ── CTA: better tap target, softer hover ─────────────────────── */
.combo-pcard-cta {
  min-height: 44px;
  letter-spacing: 0.03em;
  transition: background .15s ease, transform .15s ease, box-shadow .2s ease;
}
.combo-pcard-cta:hover:not(:disabled) {
  transform: translateY(-1px);
}

/* ── REDUCED MOTION ──────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .combo-pcard:hover { transform: none; }
  .combo-pcard-cta:hover:not(:disabled) { transform: none; }
}
/* ═══════════════════════════════════════════════════════════════════════
   COMBO STRIP LAYOUT CORRECTION — 2026-06-06 (CSS-only)
   Prevent a single combo card from stretching full-width (empty right side)
   on desktop, and prevent horizontal overflow of card content on mobile.
   ═══════════════════════════════════════════════════════════════════════ */

/* Mobile: card content must never overflow its cell. */
.combo-strip-v8, .combo-grid-v8, .combo-shop-grid { max-width: 100%; }
.combo-pcard { min-width: 0; max-width: 100%; }
.combo-pcard * { min-width: 0; }
.combo-pcard img, .combo-pcard-media img { max-width: 100%; height: auto; }

/* Desktop: size cards to content instead of stretching across the row, so a
   single (or odd-count) combo doesn't leave a big empty half. Cards stay
   compact and left-aligned above the products. */
@media (min-width: 768px) {
  .combo-strip-v8 {
    grid-template-columns: repeat(auto-fill, minmax(280px, 360px));
    justify-content: start;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   COMBO SECTION — Option A compact, left-aligned (2026-06-06, CSS-only)
   Homepage uses .combo-grid-v8; shop strip uses .combo-strip-v8. With one
   combo, repeat(2,1fr) left an empty half. Size cards to content and
   left-align so a single combo stays compact instead of stretching.
   Mobile: full-width but contained (no horizontal overflow).
   ═══════════════════════════════════════════════════════════════════════ */
@media (min-width: 768px) {
  .combo-grid-v8 {
    grid-template-columns: repeat(auto-fill, minmax(360px, 480px));
    justify-content: start;
    max-width: 1200px;
    margin: 0 auto;
    padding: 4px 24px 28px;
  }
}
/* Mobile containment (all combo containers) */
.combo-grid-v8, .combo-strip-v8, .combo-shop-grid { max-width: 100%; }
.combo-grid-v8 .combo-pcard, .combo-strip-v8 .combo-pcard { min-width: 0; max-width: 100%; }
/* ════════════════════════════════════════════════════════════════════
   CURATED BUNDLE EXPERIENCE — combo section redesign (2026-06-11)
   Hero featured card + "More Combos" carousel + trust strip.
   Uses brand vars: --green #0B4F2F, --linen #FAF7EF, --amber-md #AC9362.
   ════════════════════════════════════════════════════════════════════ */
.combo-sec{max-width:1200px;margin:36px auto 8px;padding:0 18px;box-sizing:border-box}
.combo-sec--shop{margin-top:8px}

/* Section header */
.combo-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.combo-sec-head-l{min-width:0}
.combo-sec-title{font-family:'Fraunces',Georgia,serif;font-size:30px;font-weight:600;color:var(--green);line-height:1.1;display:flex;align-items:center;gap:9px}
.combo-sec-title em{font-style:normal;color:var(--amber-md)}
.combo-sec-leaf{color:var(--amber-md);font-size:22px;line-height:1}
.combo-sec-sub{margin:7px 0 0;color:#6b6256;font-size:14px}
.combo-sec-viewall{flex-shrink:0;display:inline-flex;align-items:center;gap:7px;padding:10px 20px;border:1.5px solid var(--green);border-radius:40px;color:var(--green);font-weight:600;font-size:12px;letter-spacing:.4px;text-transform:uppercase;text-decoration:none;background:transparent;transition:all .25s}
.combo-sec-viewall:hover{background:var(--green);color:#fff}

/* ── Featured HERO bundle card ───────────────────────────────────── */
.combo-hero{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:0;background:linear-gradient(135deg,#fffdf8 0%,var(--linen) 100%);border:1.5px solid #e7d9bd;border-radius:26px;overflow:hidden;box-shadow:0 18px 50px -22px rgba(11,79,47,.32),0 4px 14px -8px rgba(0,0,0,.08);transition:transform .25s ease,box-shadow .25s ease}
.combo-hero:hover{transform:translateY(-4px);box-shadow:0 28px 64px -24px rgba(11,79,47,.4),0 6px 18px -8px rgba(0,0,0,.1)}
.combo-hero-info{padding:32px 30px 28px;display:flex;flex-direction:column;position:relative;z-index:2}
.combo-hero-ribbon{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;background:var(--green);color:#fff;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:7px 16px 7px 13px;border-radius:0 14px 14px 0;margin:0 0 18px -30px;box-shadow:0 4px 12px -3px rgba(11,79,47,.4)}
.combo-hero-ribbon svg{color:var(--amber-md)}
.combo-hero-name{font-family:'Fraunces',Georgia,serif;font-size:38px;font-weight:600;color:var(--green);line-height:1.05;margin:0 0 4px}
.combo-hero-sub{font-family:'Fraunces',Georgia,serif;font-size:21px;color:#4a5a4f;margin:0 0 14px;font-weight:400}
.combo-hero-divider{display:flex;align-items:center;gap:10px;margin:4px 0 14px;max-width:230px}
.combo-hero-divider::before,.combo-hero-divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--amber-md),transparent);background-size:200% 100%;animation:comboShimmer 4s linear infinite}
.combo-hero-leaf{color:var(--amber-md);font-size:14px}
.combo-hero-desc{color:#5e574b;font-size:14.5px;line-height:1.55;margin:0 0 18px;max-width:340px}
.combo-hero-feats{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:13px}
.combo-hero-feats li{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:4px 12px}
.combo-hero-feat-ic{grid-row:span 2;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--green-lt);display:flex;align-items:center;justify-content:center;color:var(--green)}
.combo-hero-feats b{font-size:14px;color:#2a2a26;font-weight:700;grid-column:2/4;align-self:end;line-height:1}
.combo-hero-feats em{font-size:12px;color:#8a8170;font-style:normal;grid-column:2/4;align-self:start}
.combo-hero-foot{margin-top:auto;padding-top:18px;border-top:1px dashed #d9cbae;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.combo-hero-price-block{display:flex;align-items:baseline;gap:9px}
.combo-hero-price{font-family:'Fraunces',Georgia,serif;font-size:30px;font-weight:700;color:var(--green)}
.combo-hero-mrp{font-size:16px;color:#a89c88;text-decoration:line-through}
.combo-hero-actions{display:flex;align-items:center;gap:10px}
.combo-hero-add{display:inline-flex;align-items:center;gap:8px;background:var(--green);color:#fff;border:none;border-radius:40px;padding:13px 24px;font-size:13.5px;font-weight:700;letter-spacing:.3px;cursor:pointer;box-shadow:0 8px 20px -8px rgba(11,79,47,.55);transition:all .25s}
.combo-hero-add:hover{background:var(--green2);transform:translateY(-1px)}
.combo-hero-add:disabled{background:#b9b3a6;box-shadow:none;cursor:not-allowed}
.combo-hero-view{display:inline-flex;align-items:center;gap:7px;padding:13px 22px;border:1.5px solid var(--amber-md);border-radius:40px;color:var(--green);font-weight:600;font-size:13px;text-decoration:none;background:#fff;transition:all .25s}
.combo-hero-view:hover{background:var(--amber-lt)}
/* hero media */
.combo-hero-media{position:relative;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 60% 40%,#fff 0%,transparent 70%)}
.combo-hero-media img{max-width:100%;max-height:380px;object-fit:contain;transition:transform .3s ease}
.combo-hero:hover .combo-hero-media img{transform:scale(1.03)}
.combo-hero-media-fb{width:100%;height:300px;display:flex;align-items:center;justify-content:center;color:var(--green-lt)}
.combo-hero-save{position:absolute;top:18px;right:18px;width:74px;height:74px;border-radius:50%;background:radial-gradient(circle,#c0392b,#9c2b20);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 6px 16px -4px rgba(156,43,32,.6);z-index:3;animation:comboPulse 2.4s ease-in-out infinite}
.combo-hero-save span{font-size:10px;font-weight:600;letter-spacing:1px;line-height:1}
.combo-hero-save b{font-size:21px;font-weight:800;line-height:1}

/* ── "More Combos for You" header ────────────────────────────────── */
.combo-more-head{display:flex;align-items:center;gap:14px;margin:30px 0 16px}
.combo-more-title{font-family:'Fraunces',Georgia,serif;font-size:22px;font-weight:600;color:var(--green);white-space:nowrap}
.combo-more-line{flex:1;height:1px;background:linear-gradient(90deg,var(--amber-md),transparent)}
.combo-more-nav{display:flex;gap:8px;flex-shrink:0}
.combo-more-arrow{width:38px;height:38px;border-radius:50%;border:1.5px solid #e0d3b8;background:#fff;color:var(--green);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;box-shadow:0 3px 10px -4px rgba(0,0,0,.15)}
.combo-more-arrow:hover{background:var(--green);color:#fff;border-color:var(--green)}

/* ── Carousel rail ───────────────────────────────────────────────── */
.combo-rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.combo-rail::-webkit-scrollbar{display:none}
.combo-rail .combo-pcard{scroll-snap-align:start;flex:0 0 300px;max-width:300px}

/* ── Trust strip ─────────────────────────────────────────────────── */
.combo-trust{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;margin:22px 0 8px;padding:20px 24px;background:#fff;border:1px solid #ece1cc;border-radius:18px}
.combo-trust-item{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:3px 11px;flex:1;min-width:150px}
.combo-trust-ic{grid-row:span 2;width:38px;height:38px;border-radius:50%;background:var(--green-xlt);display:flex;align-items:center;justify-content:center;color:var(--green)}
.combo-trust-item b{font-size:13px;color:#2a2a26;align-self:end;line-height:1}
.combo-trust-item em{font-size:11px;color:#8a8170;font-style:normal;align-self:start;line-height:1.3}

@keyframes comboPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes comboShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.combo-hero-save{animation:none}.combo-hero-divider::before,.combo-hero-divider::after{animation:none}}

/* ── Mobile ──────────────────────────────────────────────────────── */
@media(max-width:768px){
  .combo-sec{margin-top:26px;padding:0 14px}
  .combo-sec-head{flex-direction:column;align-items:flex-start;gap:10px}
  .combo-sec-title{font-size:24px}
  .combo-sec-viewall{padding:8px 16px;font-size:11px}
  .combo-hero{grid-template-columns:1fr;border-radius:20px}
  .combo-hero-media{order:-1;padding:20px 20px 0;min-height:230px}
  .combo-hero-media img{max-height:240px}
  .combo-hero-info{padding:22px 20px 24px}
  .combo-hero-ribbon{margin-left:-20px}
  .combo-hero-name{font-size:30px}
  .combo-hero-sub{font-size:18px}
  .combo-hero-save{width:62px;height:62px;top:14px;right:14px}
  .combo-hero-save b{font-size:18px}
  .combo-hero-foot{padding-top:16px}
  .combo-hero-actions{width:100%}
  .combo-hero-add{flex:1;justify-content:center}
  .combo-rail .combo-pcard{flex:0 0 78vw;max-width:78vw}
  .combo-trust{gap:16px 10px;padding:16px}
  .combo-trust-item{min-width:calc(50% - 8px)}
}
@media(max-width:430px){
  .combo-hero-name{font-size:26px}
  .combo-hero-feats li{gap:3px 10px}
}