/* Section */
.section--combo-packages{ background:#fff; padding:72px 0 64px; }

.combo-wrap{
  position:relative;
  width:100%;
  max-width:1160px;
  margin:0 auto;
  padding:0 20px;
}

/* Global wave (kept subtle) */
.combo-wrap::after{
  content:"";
  position:absolute;
  left:-60%; top:-120%;
  width:240%; height:320%;
  transform:translateX(-70%) rotate(16deg);
  background:linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.55) 50%, rgba(255,255,255,0) 100%);
  mix-blend-mode:screen; opacity:.18; z-index:0;
  animation:combo-wave 6.2s linear infinite;
}
@keyframes combo-wave{ to { transform:translateX(170%) rotate(16deg);} }

/* content above effects */
.combo-wrap > *{ position:relative; z-index:1; }

/* Top icon (stroke) */
.combo-cube{
  width:52px; height:52px; margin:0 auto 10px; color:#0b3d1b;
  display:grid; place-items:center; border-radius:14px;
  background:#eaf6ef; border:1px solid #d7eee4;
  box-shadow: 0 8px 18px rgba(15,23,42,.06), inset 0 -2px 0 rgba(0,0,0,.04);
}
.combo-cube svg{
  width:26px; height:26px;
  stroke:currentColor; stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round;
}

/* Title + sub */
.combo-title{
  margin:8px 0 10px; text-align:center; color:#0b3d1b;
  font-weight:900; font-size: clamp(30px, 2.2vw + 18px, 44px);
}
.combo-sub{
  text-align:center; color:#4b5563; max-width:820px; margin:0 auto 18px;
  font-size: clamp(15px, .45vw + 12px, 18px); line-height:1.65;
}

/* Centered green pill */
.combo-pill{
  display:flex; align-items:center; gap:12px;
  height:56px; padding:0 22px; border-radius:30px;
  background:linear-gradient(90deg, #109a60 0%, #0f8c59 60%, #0d7a4e 100%);
  color:#eafff0; font-weight:900;
  box-shadow: 0 14px 26px rgba(0,0,0,.12), inset 0 0 0 1px rgba(255,255,255,.18);
  border:1px solid rgba(13,110,66,.24);
  margin:0 auto 46px;         /* <-- this centers it */
  width:max-content;
}
.pill-icon{ display:inline-grid; place-items:center; width:22px; height:22px; }
.pill-icon svg{
  width:18px; height:18px;
  stroke:#fff; stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round;
}
.combo-pill strong{ color:#fff; letter-spacing:.2px; }

/* Features grid */
.combo-grid{
  display:grid; grid-template-columns: repeat(12, minmax(0,1fr));
  gap:24px; margin-top:8px;
}
.cfeat{ grid-column: span 3; text-align:center; }
@media (max-width:980px){ .cfeat{ grid-column: span 6; } }
@media (max-width:620px){ .cfeat{ grid-column: span 12; } }

/* Card base */
.card{
  position:relative; overflow:hidden; background:#fff; border-radius:14px;
  border:1px solid #e7efea;
  box-shadow: 0 8px 18px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.05);
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
}
.card:hover{
  transform: translateY(-2px) scale(1.01);
  box-shadow: 0 18px 42px rgba(15,23,42,.10), 0 4px 12px rgba(15,23,42,.07);
  background-color:#f6fbf8;
  border-color:#cfe9dc;
}
/* Hover sweep */
.card::before{
  content:""; position:absolute; inset:-2px; border-radius:inherit; pointer-events:none;
  transform:translateX(-120%);
  background:linear-gradient(115deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.75) 50%, rgba(255,255,255,0) 70%);
  mix-blend-mode:screen; opacity:0;
}
.card:hover::before{ opacity:1; animation:cfeat-sweep 1s ease; }
@keyframes cfeat-sweep{ to { transform:translateX(120%);} }

/* Halos + pro stroke icons */
.cfeat__halo{
  width:72px; height:72px; margin:18px auto 14px; border-radius:50%;
  display:grid; place-items:center; color:#0b3d1b;
  background: radial-gradient(120% 120% at 30% 25%, #f7faf8 0%, #f1f6f3 60%, #e9efec 100%);
  border:1px solid #e5ece8; box-shadow: inset 0 -2px 0 rgba(0,0,0,.035);
}
.cfeat__halo svg{
  width:26px; height:26px;
  stroke:currentColor; stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round;
}
.cfeat__halo.is-green{ color:#15803d; }
.cfeat__halo.is-check{ color:#14532d; }
.cfeat__halo.is-star{ color:#f59e0b; }
.cfeat__halo.is-bulb{ color:#2563eb; }

/* Text */
.cfeat__title{ margin:0 16px 6px; color:#083a1f; font-weight:900; font-size:16px; }
.cfeat__sub{ margin:0 auto 18px; max-width:320px; color:#5b6b78; font-size:13px; line-height:1.55; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .combo-wrap::after, .card::before{ animation:none !important; opacity:0 !important; transform:none !important; }
}