/* portal-v2 · /pricing/ — Tabular spec + Conversational FAQ
 * スコープ: .theme-portal-v2 のみ。このファイルは /pricing/ にだけ読み込まれる。
 * 規約: /design.md。色・フォント・角丸はすべて --portal-* トークン経由。
 * オレンジ(--portal-utility)は無料診断CTAのみに使用する。
 */

/* ============ page hero ============ */
.theme-portal-v2 .page-hero {
  background: var(--portal-paper);
  border-bottom: 1px solid var(--portal-rule);
}

.theme-portal-v2 .page-hero h1 {
  font-size: var(--portal-text-page-title);
}

.theme-portal-v2 .crumbs a:hover {
  color: var(--portal-primary-deep);
}

/* ============ 料金ブロック ============ */
.theme-portal-v2 .plan-card {
  background: var(--portal-surface);
  box-shadow: none;
  border: 1px solid var(--portal-rule);
  border-radius: var(--portal-radius-card);
  overflow: hidden;
}

.theme-portal-v2 .pv-plan-head {
  padding: var(--space-xl) var(--space-xl) var(--space-lg);
  background: var(--portal-surface);
  border-bottom: 1px solid var(--portal-rule);
}

.theme-portal-v2 .pv-plan-eyebrow {
  font-family: var(--portal-font-numeric);
  font-weight: 700;
  font-size: var(--text-xs);
  letter-spacing: 0.18em;
  color: var(--portal-primary-deep);
  margin-bottom: var(--space-md);
}

.theme-portal-v2 .pv-price-table {
  width: 100%;
  border-collapse: collapse;
}

.theme-portal-v2 .pv-price-table th {
  text-align: left;
  font-weight: 600;
  font-size: var(--text-sm);
  color: var(--portal-ink);
  padding: var(--space-sm) 0;
  border-top: 1px solid var(--portal-rule);
  width: 60%;
}

.theme-portal-v2 .pv-price-table tr:first-child th,
.theme-portal-v2 .pv-price-table tr:first-child td {
  border-top: none;
}

.theme-portal-v2 .pv-price-table td {
  padding: var(--space-sm) 0;
  border-top: 1px solid var(--portal-rule);
  text-align: right;
}

.theme-portal-v2 .pv-num {
  font-family: var(--portal-font-numeric);
  font-weight: 700;
  font-size: var(--text-xl);
  color: var(--portal-primary-deep);
  font-variant-numeric: tabular-nums;
}

/* ---- 標準内容 / オプション 表 ---- */
.theme-portal-v2 .pv-plan-table {
  width: 100%;
  border-collapse: collapse;
}

.theme-portal-v2 .pv-plan-table th {
  text-align: left;
  font-size: var(--text-sm);
  font-weight: 700;
  padding: var(--space-md) var(--space-xl);
  border-bottom: 1px solid var(--portal-rule);
}

.theme-portal-v2 .pv-plan-table thead th:first-child {
  background: var(--portal-primary-wash);
  color: var(--portal-primary-deep);
}

.theme-portal-v2 .pv-plan-table thead th:last-child {
  background: var(--portal-paper);
  color: var(--portal-ink);
}

.theme-portal-v2 .pv-th-icon {
  width: 15px;
  height: 15px;
  margin-right: var(--space-2xs);
  vertical-align: -0.15em;
}

.theme-portal-v2 .pv-plan-table td {
  vertical-align: top;
  padding: var(--space-lg) var(--space-xl);
  border-right: 1px solid var(--portal-rule);
}

.theme-portal-v2 .pv-plan-table td:last-child {
  border-right: none;
}

.theme-portal-v2 .pv-plan-table td ul {
  display: grid;
  gap: var(--space-xs);
}

.theme-portal-v2 .pv-plan-table td li {
  display: flex;
  gap: var(--space-xs);
  font-size: var(--text-sm);
  line-height: 1.6;
}

.theme-portal-v2 .pv-plan-table td:first-child li::before {
  content: "✓";
  color: var(--portal-primary);
  font-weight: 900;
  flex: none;
}

.theme-portal-v2 .pv-plan-table td:last-child li::before {
  content: "＋";
  color: var(--portal-primary-deep);
  font-weight: 900;
  flex: none;
}

@media (max-width: 42.5rem) {
  .theme-portal-v2 .pv-plan-table,
  .theme-portal-v2 .pv-plan-table thead,
  .theme-portal-v2 .pv-plan-table tbody,
  .theme-portal-v2 .pv-plan-table tr {
    display: block;
    width: 100%;
  }
  .theme-portal-v2 .pv-plan-table thead tr {
    display: grid;
    grid-template-columns: 1fr;
  }
  .theme-portal-v2 .pv-plan-table thead th {
    border-bottom: none;
  }
  .theme-portal-v2 .pv-plan-table td {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border-right: none;
    border-bottom: 1px solid var(--portal-rule);
  }
  .theme-portal-v2 .pv-plan-table td:last-child {
    border-bottom: none;
  }
}

.theme-portal-v2 .plan-foot {
  padding: var(--space-xl);
}

/* ============ 最初の3か月 ============ */
.theme-portal-v2 .iv-row {
  border-color: var(--portal-rule);
}

.theme-portal-v2 .iv-kpi {
  background: var(--portal-primary-wash);
  color: var(--portal-primary-deep);
  border-radius: var(--portal-radius-control);
  font-family: var(--portal-font-numeric);
}

/* ============ 効果の測り方 ============ */
.theme-portal-v2 .roi-col li::before {
  color: var(--portal-primary);
}

.theme-portal-v2 .assets {
  background: var(--portal-surface);
  border-radius: var(--portal-radius-card);
  border: 1px solid var(--portal-rule);
  box-shadow: none;
}

.theme-portal-v2 .assets th {
  color: var(--portal-primary-deep);
}

.theme-portal-v2 .assets td {
  font-family: var(--portal-font-numeric);
}

.theme-portal-v2 .roi-note {
  font-family: var(--portal-font-numeric);
  line-height: 1.9;
}

/* ============ 適合 ============ */
.theme-portal-v2 .fit-col {
  border-radius: var(--portal-radius-card);
}

.theme-portal-v2 .fit-col.yes {
  background: var(--portal-surface);
  border: 1px solid var(--portal-primary);
  box-shadow: none;
}

.theme-portal-v2 .fit-col.no {
  background: var(--portal-paper);
  border: 1px solid var(--portal-rule);
}

.theme-portal-v2 .fit-col.yes h3 {
  color: var(--portal-primary-deep);
}

.theme-portal-v2 .fit-col.yes li::before {
  color: var(--portal-primary);
}

/* ============ データ・資産の帰属 ============ */
.theme-portal-v2 .safe-card {
  background: var(--portal-surface);
  border: 1px solid var(--portal-rule);
  border-radius: var(--portal-radius-card);
  padding: var(--space-lg);
}

.theme-portal-v2 .pv-icon-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: var(--portal-radius-pill);
  background: var(--portal-primary-wash);
  color: var(--portal-primary-deep);
  margin-right: var(--space-xs);
  flex: none;
}

.theme-portal-v2 .safe-card h3 .ph {
  color: inherit;
  font-size: 15px;
}

/* ============ FAQ ============ */
.theme-portal-v2 .faq-item {
  border-color: var(--portal-rule);
}

.theme-portal-v2 .faq-item summary::before {
  color: var(--portal-primary-deep);
}

.theme-portal-v2 .faq-item summary:focus-visible {
  outline-color: var(--portal-focus);
}

/* ============ CTA band ============ */
.theme-portal-v2 .cta-band {
  background: var(--portal-primary);
  border-radius: var(--portal-radius-card);
  box-shadow: none;
}

.theme-portal-v2 .cta-band::before,
.theme-portal-v2 .cta-band::after {
  content: none;
}

.theme-portal-v2 .cta-band h2,
.theme-portal-v2 .cta-band p {
  color: var(--portal-surface);
}

.theme-portal-v2 .cta-band .btn-utility .ph {
  width: 1em;
  height: 1em;
}

.theme-portal-v2 .cta-band .btn:focus-visible {
  outline-color: var(--portal-surface);
}