.shared-hosting-hero {
  background: linear-gradient(135deg, #0d2540 0%, #1d3a6e 100%);
  color: #fff;
  padding: 80px 0 60px;
}

.shared-hosting-hero-title {
  font-weight: 700;
}

.shared-hosting-hero-text {
  font-size: 1.1rem;
}

.shared-hosting-hero-badge {
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .2);
  font-weight: 500;
}

.shared-hosting-pricing {
  background: #f8fafc;
}

.shared-plan-col--standard {
  margin-top: 16px;
}

.shared-plan-col--featured {
  margin-top: 40px;
}

.shared-plan-card {
  border-radius: 14px;
  overflow: visible;
  transition: transform .2s ease, box-shadow .2s ease;
}

.shared-plan-card.is-most-popular {
  border: 2px solid #f59e0b !important;
  box-shadow: 0 8px 30px rgba(245, 158, 11, .22) !important;
}

.shared-plan-card.is-best-choice {
  border: 2px solid #8b5cf6 !important;
  box-shadow: 0 8px 30px rgba(139, 92, 246, .22) !important;
}

.shared-plan-ribbon {
  border-radius: 30px;
  color: #fff;
  font-size: .78rem;
  font-weight: 700;
  left: 50%;
  letter-spacing: .6px;
  padding: 8px 22px;
  position: absolute;
  top: -18px;
  transform: translateX(-50%);
  white-space: nowrap;
  z-index: 5;
}

.shared-plan-ribbon--popular {
  background: linear-gradient(135deg, #f59e0b 0%, #ef4444 100%);
  box-shadow: 0 6px 18px rgba(245, 158, 11, .45);
}

.shared-plan-ribbon--best {
  background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
  box-shadow: 0 6px 18px rgba(139, 92, 246, .45);
}

.shared-plan-ribbon-auto {
  font-size: .85em;
  font-weight: 500;
  opacity: .8;
}

.shared-plan-promo-badge {
  background: linear-gradient(135deg, #dc2626, #f59e0b);
  border-radius: 4px 0 0 4px;
  box-shadow: 0 4px 8px rgba(220, 38, 38, .3);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .5px;
  padding: 6px 12px;
  right: -8px;
  top: 18px;
  z-index: 4;
}

.shared-price-original {
  color: #94a3b8;
  font-size: .7em;
  font-weight: 400;
  text-decoration: line-through;
}

.shared-price-promo {
  color: #dc2626;
  font-weight: 700;
}

.shared-price-hidden,
.shared-addons-list {
  display: none;
}

.shared-addons-list.is-visible {
  display: block;
}

.shared-addons-block {
  background: #f9fbff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 10px;
}

.shared-addon-toggle {
  font-size: .85rem;
  text-decoration: none;
}

.shared-addon-toggle-icon {
  float: right;
  transition: transform .2s ease;
}

.shared-addon-toggle-icon.is-expanded {
  transform: rotate(180deg);
}

.shared-addon-row {
  font-size: .85rem;
}

.shared-addon-qty {
  text-align: center;
  width: 75px;
}
