.cards-panel {
  grid-column: 2;
  grid-row: 1;
  min-width: 320px;
  background: var(--burgundy-bg-card);
  border-radius: var(--radius);
  padding: 40px 34px;
  display: flex;
  flex-direction: column;
  gap: 26px;
  border: 1px solid rgba(168, 77, 114, 0.1);
  box-shadow: var(--shadow-sm);
  position: relative;
  overflow: hidden;
}

.cards-panel::before {
  content: '';
  position: absolute;
  inset: -20% -20% auto auto;
  width: 140%;
  height: 140%;
  background: radial-gradient(ellipse at 70% 40%, rgba(168, 77, 114, 0.06), transparent 70%);
  pointer-events: none;
}

.cards-panel > * { position: relative; z-index: 1; }

.cards-header .brand-big {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 32px;
  font-weight: 800;
  flex-wrap: wrap;
}

.cards-header .brand-big i { color: var(--burgundy-mid); font-size: 38px; }
.cards-header .brand-name { color: var(--burgundy-deep); }
.cards-header .brand-tag { font-size: 18px; font-weight: 400; color: var(--text-muted); }
.cards-header p { color: var(--text-secondary); font-size: 16px; }
.cards-header p i { color: var(--burgundy-mid); margin-inline-start: 6px; }

.motivation-card {
  background: var(--bg-white);
  border-radius: var(--radius-sm);
  padding: 22px 26px;
  box-shadow: var(--shadow-card);
  border-inline-end: 5px solid var(--burgundy-light);
  transition: var(--transition);
}

.motivation-card:hover {
  transform: translateY(-4px);
  border-inline-end-color: var(--burgundy-deep);
}

.motivation-card .card-icon {
  display: inline-flex;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: var(--burgundy-pale);
  color: var(--burgundy-deep);
  font-size: 22px;
  margin-bottom: 12px;
}

.motivation-card h4 { font-size: 19px; font-weight: 700; margin-bottom: 4px; }
.motivation-card h4 i { color: var(--burgundy-mid); margin-inline-start: 8px; }
.motivation-card p { color: var(--text-secondary); font-size: 14px; line-height: 1.7; }

.card-badge-free {
  display: inline-block;
  margin-top: 12px;
  padding: 5px 20px;
  border-radius: var(--radius-full);
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, var(--burgundy-mid), var(--burgundy-deep));
}

.badge-soft {
  display: inline-block;
  margin-top: 10px;
  padding: 3px 16px;
  border-radius: var(--radius-full);
  font-size: 12px;
  font-weight: 600;
  background: var(--burgundy-pale);
  color: var(--burgundy-deep);
}

@media (max-width: 1100px) {
  .cards-panel {
    grid-column: 1;
    grid-row: 2;
  }
}

@media (max-width: 600px) {
  .cards-panel { padding: 20px 16px; }
  .motivation-card { padding: 16px 18px; }
}
