/* ── Pricing toggle ── */
.pricing-toggle {
  display: flex;
  justify-content: center;
  gap: var(--space-1);
  margin-bottom: var(--space-10);
  background: var(--color-bg-alt);
  border-radius: var(--border-radius-pill);
  padding: var(--space-1);
  max-width: 340px;
  margin-left: auto;
  margin-right: auto;
}
/* flex-gap fallback for older Safari */
.pricing-toggle > * + * { margin-left: var(--space-1); }

.pricing-toggle__btn {
  flex: 1;
  padding: var(--space-3) var(--space-6);
  border: none;
  border-radius: var(--border-radius-pill);
  background: transparent;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-muted);
  cursor: pointer;
  transition: all var(--transition-fast);
}

.pricing-toggle__btn:hover {
  color: var(--color-charcoal);
}

.pricing-toggle__btn--active {
  background: var(--color-white);
  color: var(--color-charcoal);
  box-shadow: var(--shadow-sm);
}

/* ── Pricing panels ── */
.pricing-panel {
  display: none;
}

.pricing-panel--active {
  display: block;
}

/* ── Pricing grid ── */
.pricing-grid {
  display: grid;
  gap: var(--space-6);
  max-width: 1100px;
  margin: 0 auto;
  align-items: start;
}

.pricing-grid--4 {
  grid-template-columns: repeat(4, 1fr);
}

.pricing-grid--3 {
  grid-template-columns: repeat(3, 1fr);
  max-width: 900px;
}

/* ── Pricing card ── */
.pricing-card {
  position: relative;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-xl);
  padding: var(--space-8);
  transition: box-shadow var(--transition-base);
}

.pricing-card:hover {
  box-shadow: var(--shadow-lg);
}

.pricing-card--highlighted {
  border-color: var(--color-accent-orange);
  box-shadow: var(--shadow-md);
  transform: scale(1.02);
}

.pricing-card--seed {
  border-color: var(--color-accent-gold);
}

.pricing-card__name {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-charcoal);
  margin-bottom: var(--space-1);
}

.pricing-card__tagline {
  font-size: var(--font-size-sm);
  color: var(--color-accent-orange);
  font-weight: var(--font-weight-medium);
  font-style: italic;
  margin-bottom: var(--space-2);
}

.pricing-card--seed .pricing-card__tagline {
  color: var(--color-accent-gold);
}

.pricing-card__description {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  margin-bottom: var(--space-5);
  line-height: var(--line-height-relaxed);
}

.pricing-card__price {
  margin-bottom: var(--space-5);
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--color-border);
}

.pricing-card__amount {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-charcoal);
  line-height: 1;
}

.pricing-card__period {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  font-weight: var(--font-weight-normal);
}

/* Annual hint (shown when monthly is active) */
.pricing-card__annual-hint {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  margin-top: var(--space-2);
}

.pricing-card__annual-link {
  color: var(--color-accent-green);
  text-decoration: none;
  font-weight: var(--font-weight-medium);
}

.pricing-card__annual-link:hover {
  text-decoration: underline;
}

/* Annual detail (shown when annual is active) */
.pricing-card__annual-detail {
  margin-top: var(--space-2);
}

.pricing-card__was {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  text-decoration: line-through;
}

.pricing-card__annual-total {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  margin-top: var(--space-1);
}

.pricing-card__save {
  display: inline-block;
  background: var(--color-accent-green-tint);
  color: var(--color-accent-green);
  font-weight: var(--font-weight-semibold);
  font-size: 0.6875rem;
  padding: 2px 6px;
  border-radius: 4px;
  margin-left: var(--space-1);
}

.pricing-card__features {
  margin-bottom: var(--space-6);
}

.pricing-card__features .check-list li {
  font-size: var(--font-size-xs);
  padding: var(--space-1) 0;
}

.pricing-card__cta {
  text-align: center;
}

.pricing-card__cta .btn {
  width: 100%;
}

/* ── Badges (scoped to pricing cards to avoid collision with components.css .badge) ── */
.pricing-card .badge {
  position: absolute;
  top: calc(var(--space-8) * -0.5);
  left: 50%;
  transform: translateX(-50%);
  padding: var(--space-1) var(--space-4);
  border-radius: var(--border-radius-pill);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  white-space: nowrap;
}

.pricing-card .badge--orange,
.pricing-card .badge--popular {
  background: var(--color-accent-orange);
  color: var(--color-white);
}

.pricing-card .badge--teal {
  background: var(--color-accent-green);
  color: var(--color-white);
}

.pricing-card .badge--green {
  background: var(--color-accent-gold);
  color: var(--color-white);
}

/* ── Startup Programme accordion ── */
.startup-accordion {
  border: 2px solid var(--color-accent-gold);
  border-radius: var(--border-radius-xl);
  background: var(--color-accent-gold-tint);
  overflow: hidden;
}

.startup-accordion__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-6) var(--space-8);
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: background var(--transition-fast);
}

.startup-accordion__header:hover {
  background: rgba(166, 123, 26, 0.06);
}

.startup-accordion__header:focus-visible {
  outline: 2px solid var(--color-accent-gold);
  outline-offset: -2px;
}

.startup-accordion__header-left {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}
.startup-accordion__header-left > * + * { margin-left: var(--space-4); }

.startup-accordion__icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--border-radius);
  background: rgba(255, 255, 255, 0.6);
  color: var(--color-accent-gold);
}

.startup-accordion__icon svg {
  width: 22px;
  height: 22px;
}

.startup-accordion__title {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-semibold);
  color: var(--color-charcoal);
  margin: 0 0 2px 0;
}

.startup-accordion__subtitle {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  margin: 0;
}

.startup-accordion__header-right {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}
.startup-accordion__header-right > * + * { margin-left: var(--space-4); }

.startup-accordion__pills {
  display: flex;
  gap: var(--space-3);
}
.startup-accordion__pills > * + * { margin-left: var(--space-3); }

.startup-accordion__pill {
  background: var(--color-white);
  border-radius: var(--border-radius-pill);
  padding: var(--space-1) 14px;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-accent-gold);
  box-shadow: var(--shadow-sm);
  white-space: nowrap;
}

.startup-accordion__chevron {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  color: var(--color-text-muted);
  transition: transform var(--transition-base);
}

.startup-accordion--open .startup-accordion__chevron {
  transform: rotate(180deg);
}

/* Accordion body — hidden by default */
.startup-accordion__body {
  display: none;
  padding: 0 var(--space-8) var(--space-8);
  border-top: 1px solid rgba(166, 123, 26, 0.15);
}

.startup-accordion--open .startup-accordion__body {
  display: block;
}

.startup-accordion__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
  padding-top: var(--space-6);
}

/* ── Startup tier cards (inside accordion) ── */
.startup-tier-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-lg);
  padding: var(--space-6);
  transition: box-shadow var(--transition-base);
}

.startup-tier-card:hover {
  box-shadow: var(--shadow-md);
}

.startup-tier-card__badge {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.3px;
  padding: 3px 10px;
  border-radius: var(--border-radius-pill);
  margin-bottom: var(--space-3);
}

.startup-tier-card__badge--green {
  background: var(--color-accent-green-tint);
  color: var(--color-accent-green);
}

.startup-tier-card__badge--gold {
  background: var(--color-accent-gold-tint);
  color: var(--color-accent-gold);
}

.startup-tier-card__name {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  color: var(--color-charcoal);
  margin-bottom: var(--space-1);
}

.startup-tier-card__price {
  margin-bottom: var(--space-2);
}

.startup-tier-card__amount {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-accent-gold);
}

.startup-tier-card__period {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

.startup-tier-card__desc {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  margin-bottom: var(--space-4);
  line-height: var(--line-height-relaxed);
}

.startup-tier-card__features {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--space-5) 0;
}

.startup-tier-card__features li {
  font-size: var(--font-size-xs);
  color: var(--color-text-body);
  padding: 3px 0 3px 20px;
  position: relative;
}

.startup-tier-card__features li::before {
  content: '\2713';
  position: absolute;
  left: 0;
  color: var(--color-accent-green);
  font-weight: var(--font-weight-semibold);
}

.startup-tier-card__evidence {
  font-size: 0.6875rem;
  color: var(--color-text-muted);
  font-style: italic;
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
  margin-top: var(--space-3);
}

/* .btn--gold: canonical definition in components.css */

/* ── Startup Programme banner (legacy — kept for investor banner) ── */
.startup-banner {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-6) var(--space-8);
  border: 2px solid var(--color-accent-gold);
  border-radius: var(--border-radius-xl);
  background: var(--color-accent-gold-tint);
}
/* flex-gap fallback for older Safari */
.startup-banner > * + * { margin-left: var(--space-6); }

.startup-banner__icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--border-radius);
  background: var(--color-accent-gold-tint);
  color: var(--color-accent-gold);
}

.startup-banner__icon svg {
  width: 24px;
  height: 24px;
}

.startup-banner__content {
  flex: 1;
}

.startup-banner__content h4 {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-charcoal);
  margin-bottom: var(--space-1);
}

.startup-banner__content p {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  line-height: var(--line-height-relaxed);
  margin: 0;
}

/* ── Investor promotion banner ── */
.startup-banner--investor {
  border-color: var(--color-accent-blue);
  background: var(--color-accent-blue-tint);
}

.startup-banner--investor .startup-banner__icon {
  background: var(--color-accent-blue-tint);
  color: var(--color-accent-blue);
}

/* ── Enterprise levers ── */
.levers-section {
  margin-top: var(--space-16);
}

.levers-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-6);
}

.lever-card {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  transition: border-color var(--transition-base);
}
/* flex-gap fallback for older Safari */
.lever-card > * + * { margin-left: var(--space-4); }

.lever-card:hover {
  border-color: var(--color-accent-green);
}

.lever-card__icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--border-radius);
  background-color: var(--color-accent-green-tint);
  color: var(--color-accent-green);
}

.lever-card__icon svg {
  width: 18px;
  height: 18px;
}

.lever-card__name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-charcoal);
  margin-bottom: var(--space-1);
}

.lever-card__description {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}


/* ── Money-back guarantee ── */
.pricing-card__guarantee {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  margin-top: var(--space-3);
  font-size: var(--font-size-xs);
  color: var(--color-accent-green);
  font-weight: var(--font-weight-medium);
}
.pricing-card__guarantee > * + * { margin-left: var(--space-2); }
.pricing-card__guarantee svg { flex-shrink: 0; }

/* ── Testimonial cards ── */
.testimonial-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-8);
  max-width: 900px;
  margin: 0 auto;
}
.testimonial-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-xl);
  padding: var(--space-8);
  transition: box-shadow var(--transition-base);
}
.testimonial-card:hover { box-shadow: var(--shadow-md); }
.testimonial-card__quote { position: relative; margin-bottom: var(--space-6); }
.testimonial-card__quote-icon { color: var(--color-accent-orange); opacity: 0.3; margin-bottom: var(--space-3); }
.testimonial-card__quote p { font-size: var(--font-size-sm); color: var(--color-text-body); line-height: var(--line-height-relaxed); font-style: italic; margin: 0; }
.testimonial-card__author { display: flex; align-items: center; justify-content: space-between; padding-top: var(--space-4); border-top: 1px solid var(--color-border); }
.testimonial-card__name { display: block; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-charcoal); }
.testimonial-card__role { display: block; font-size: var(--font-size-xs); color: var(--color-text-muted); }
.testimonial-card__result { font-size: 0.6875rem; font-weight: var(--font-weight-semibold); color: var(--color-accent-green); background: var(--color-accent-green-tint); padding: 3px 10px; border-radius: var(--border-radius-pill); white-space: nowrap; }

/* ── Trust logo strip ── */
.trust-strip { text-align: center; padding: var(--space-6) 0; }
.trust-strip__label { display: block; font-size: var(--font-size-xs); color: var(--color-text-muted); margin-bottom: var(--space-4); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.trust-strip__logos { display: flex; align-items: center; justify-content: center; gap: 24px; flex-wrap: wrap; margin-bottom: var(--space-3); }
.trust-strip__logo { height: 28px; width: auto; max-width: 80px; object-fit: contain; object-position: center; filter: grayscale(100%); opacity: 0.6; transition: filter 0.3s ease, opacity 0.3s ease; }
.trust-strip__logo:hover,
.trust-strip__logos:hover .trust-strip__logo { filter: grayscale(0%); opacity: 1; }
.trust-strip__detail { display: flex; align-items: center; justify-content: center; font-size: 0.6875rem; color: var(--color-text-muted); }

/* ── Compare All Plans toggle ── */
.compare-toggle { display: flex; align-items: center; justify-content: center; gap: var(--space-2); padding: var(--space-4) var(--space-6); border: 1px solid var(--color-border); border-radius: var(--border-radius); background: var(--color-white); cursor: pointer; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-charcoal); max-width: 300px; margin: 0 auto var(--space-6); transition: all var(--transition-fast); -webkit-user-select: none; -moz-user-select: none; user-select: none; }
.compare-toggle > * + * { margin-left: var(--space-2); }
.compare-toggle:hover { border-color: var(--color-accent-orange); box-shadow: var(--shadow-sm); }
.compare-toggle:focus-visible { outline: 2px solid var(--color-accent-orange); outline-offset: 2px; }
.compare-toggle__chevron { transition: transform var(--transition-base); flex-shrink: 0; }
.compare-toggle--open .compare-toggle__chevron { transform: rotate(180deg); }
.compare-body { display: none; }
.compare-body--open { display: block; }

/* ── Comparison table ── */
.compare-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--color-border); border-radius: var(--border-radius-lg); }
.compare-table { width: 100%; border-collapse: collapse; font-size: var(--font-size-xs); min-width: 1100px; table-layout: fixed; }
.compare-table thead { background: var(--color-charcoal); color: var(--color-white); }
.compare-table th { padding: var(--space-3) var(--space-4); font-weight: var(--font-weight-semibold); text-align: center; overflow: hidden; text-overflow: ellipsis; }
.compare-table__feature-col { text-align: left; position: sticky; left: 0; background: inherit; z-index: 1; width: 200px; }
.compare-table thead .compare-table__feature-col { background: var(--color-charcoal); }
.compare-table tbody tr { border-bottom: 1px solid var(--color-border); }
.compare-table tbody tr:nth-child(even) { background: var(--color-bg-alt); }
.compare-table tbody tr:nth-child(even) .compare-table__feature-col { background: var(--color-bg-alt); }
.compare-table tbody tr:nth-child(odd) .compare-table__feature-col { background: var(--color-white); }
.compare-table td { padding: var(--space-3) var(--space-4); text-align: center; color: var(--color-text-body); }
.compare-table__check { color: var(--color-accent-green); font-weight: var(--font-weight-bold); }
.compare-table__dash { color: var(--color-text-muted); opacity: 0.5; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .pricing-grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .pricing-grid--3 {
    grid-template-columns: repeat(2, 1fr);
  }

  .levers-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .pricing-grid--4,
  .pricing-grid--3 {
    grid-template-columns: 1fr;
  }

  .pricing-card--highlighted {
    transform: none;
  }

  .levers-grid {
    grid-template-columns: 1fr;
  }

  .testimonial-grid { grid-template-columns: 1fr; }
  .testimonial-card { padding: var(--space-6); }
  .testimonial-card__author { flex-direction: column; align-items: flex-start; gap: var(--space-2); }
  .trust-strip__logos { gap: 16px; }

  .startup-banner {
    flex-direction: column;
    text-align: center;
    padding: var(--space-6);
  }

  .startup-banner .btn {
    width: 100%;
  }
  /* flex-gap fallback: switch to vertical margin on mobile */
  .startup-banner > * + * { margin-left: 0; margin-top: var(--space-4); }

  .startup-accordion__header {
    flex-direction: column;
    text-align: center;
    gap: var(--space-3);
    padding: var(--space-5);
  }

  .startup-accordion__header-left {
    flex-direction: column;
  }
  .startup-accordion__header-left > * + * { margin-left: 0; margin-top: var(--space-3); }

  .startup-accordion__header-right > * + * { margin-left: 0; }

  .startup-accordion__body {
    padding: 0 var(--space-5) var(--space-5);
  }

  .startup-accordion__grid {
    grid-template-columns: 1fr;
  }
}