/* ==========================================================================
   prices.css — Tabla de precios
   ========================================================================== */

.prices__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-12);
  align-items: start;
}

@media (min-width: 1024px) {
  .prices__inner {
    grid-template-columns: 1fr 1.2fr;
    gap: var(--space-16);
  }
}

.prices__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.prices__title {
  font-size: var(--text-d2);
}

.prices__subtitle {
  color: var(--ink-2);
}

.prices__note {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  background-color: var(--accent-light);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  color: var(--accent-dark);
  font-weight: 500;
}

/* --- Tabla / lista de precios --- */
.price-table {
  background-color: var(--canvas);
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  overflow: hidden;
}

.price-table__header {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-6);
  background-color: var(--paper);
  border-bottom: 1px solid var(--line);
}

.price-table__header span {
  font-size: var(--text-caption);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--tracking-eyebrow);
  color: var(--ink-2);
}

.price-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-5) var(--space-6);
  border-bottom: 1px solid var(--line);
  transition: background-color var(--duration-fast) var(--ease-out);
}

.price-row:last-child {
  border-bottom: none;
}

.price-row:hover {
  background-color: var(--paper);
}

.price-row__species {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.price-row__name {
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--ink);
}

.price-row__scientific {
  font-size: var(--text-caption);
  color: var(--ink-3);
  font-style: italic;
}

.price-row__price {
  font-size: var(--text-h2);
  font-weight: var(--weight-display);
  color: var(--accent);
  text-align: right;
  white-space: nowrap;
  line-height: 1;
}

.price-row__price-sub {
  font-size: var(--text-caption);
  color: var(--ink-3);
  font-weight: 400;
  display: block;
  text-align: right;
  margin-top: 2px;
}

/* Fila destacada (precio diferente) */
.price-row--featured {
  background-color: var(--accent-light);
}

.price-row--featured .price-row__price {
  color: var(--accent-dark);
}

/* --- Nota al pie --- */
.price-table__footer {
  padding: var(--space-5) var(--space-6);
  background-color: var(--paper);
  border-top: 1px solid var(--line);
  font-size: var(--text-caption);
  color: var(--ink-2);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.price-table__footer li {
  list-style: none;
  padding-left: var(--space-5);
  position: relative;
}

.price-table__footer li::before {
  content: '·';
  position: absolute;
  left: var(--space-2);
  color: var(--ink-3);
}

/* --- CTA debajo de precios --- */
.prices__cta {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  align-items: flex-start;
  margin-top: var(--space-4);
}

.prices__cta-note {
  font-size: var(--text-caption);
  color: var(--ink-2);
}
