/* Ecuador tariff sheet — templates/page-informacion-de-tarifas.php
 *
 * The redesign has no table component (only .home-vs-table, which is a
 * comparison grid built for the homepage and carries its own copy layout), so
 * the price table gets a small one of its own here. Everything else on the
 * page — hero, section rhythm, eyebrow, container — comes from
 * redesign-components / product-components.
 *
 * CacheFly ignores query strings, so this file is versioned by NAME. Any
 * change means a new filename plus the matching bump in functions.php.
 */

.tarifas-page .tarifas-section {
  padding-block: clamp(48px, 6vw, 88px);
}

/* One measure for the table and the notes so their left edges agree. */
.tarifas-page .tarifas-table-wrap,
.tarifas-page .tarifas-notes {
  max-width: 820px;
  margin-inline: auto;
}

/* Narrow viewports scroll the table rather than crushing the price column. */
.tarifas-page .tarifas-table-wrap {
  overflow-x: auto;
  border: 1px solid #e2e8ea;
  border-radius: var(--radius-card);
  background: var(--color-surface-card);
  box-shadow: 0 1px 2px rgba(0, 0, 76, .04), 0 12px 32px rgba(0, 0, 76, .06);
}

.tarifas-page .tarifas-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-sans);
  text-align: left;
}

.tarifas-page .tarifas-table th,
.tarifas-page .tarifas-table td {
  padding: 18px 24px;
  border: 0;
}

.tarifas-page .tarifas-table thead th {
  background: var(--color-brand-navy-deep);
  color: #ffffff;
  font-size: .8125rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* The capacity is the row's label, so it is a <th scope="row"> in the markup;
   undo the browser's centred/bold heading defaults it does not want here. */
.tarifas-page .tarifas-table tbody th {
  color: var(--color-brand-navy-deep);
  font-size: 1.0625rem;
  font-weight: 700;
}

.tarifas-page .tarifas-table tbody td {
  color: var(--color-text-slate);
  font-size: 1.0625rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.tarifas-page .tarifas-table tbody tr + tr th,
.tarifas-page .tarifas-table tbody tr + tr td {
  border-top: 1px solid #edf1f2;
}

.tarifas-page .tarifas-table tbody tr:hover th,
.tarifas-page .tarifas-table tbody tr:hover td {
  background: #f5fbfb;
}

/* Notes */
.tarifas-page .tarifas-notes {
  margin-top: 40px;
}

.tarifas-page .tarifas-notes-list {
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}

.tarifas-page .tarifas-notes-list li {
  display: flex;
  gap: 10px;
  margin: 0;
  padding: 10px 0;
  color: var(--color-text-muted);
  font-size: .9375rem;
  line-height: 1.55;
}

.tarifas-page .tarifas-notes-list li + li {
  border-top: 1px solid #edf1f2;
}

/* Fixed gutter so *, ** and *** all hang off the same left edge. */
.tarifas-page .tarifas-note-mark {
  flex: 0 0 28px;
  color: var(--color-brand-teal-contrast);
  font-weight: 700;
}

@media (max-width: 640px) {
  .tarifas-page .tarifas-table th,
  .tarifas-page .tarifas-table td {
    padding: 14px 16px;
  }
}
