/* Pricing-specific layout and calculator. Shared controls and tokens live in
   currency.css and currency-pages.css. */

/* Keep the decision and the plans in one opening viewport. */
.pricing-intro { padding-top: var(--ui-space-12); padding-bottom: var(--ui-space-16); }
.pricing-intro .rl-display { max-width: 18ch; font-size: var(--ui-title-lg); }
.pricing-intro .rl-sub { max-width: 68ch; margin: var(--ui-space-3) 0 var(--ui-space-8); }
.pricing-intro .rl-sub strong { color: var(--ui-text); }
.pricing-heading {margin-bottom:var(--ui-space-8);padding:var(--ui-space-3) 0;border-radius:var(--ui-radius-sm)}
.pricing-heading > * {position:relative;z-index:1}
.pricing-plans .tier-grid { margin-bottom: 16px; }
.pricing-path {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 var(--ui-space-6);margin:var(--ui-space-6) 0 0;border-top:1px solid var(--ui-border)}
.pricing-path > div {min-width:0;padding:var(--ui-space-4) 0;border-bottom:1px solid var(--ui-border)}
.pricing-path span {display:block;margin-bottom:var(--ui-space-2);color:var(--ui-accent);font:700 var(--ui-text-xs)/1.4 var(--ui-font-sans);letter-spacing:0}
.pricing-path strong {display:block;margin-bottom:var(--ui-space-2);color:var(--ui-text);font:650 var(--ui-text-base)/1.35 var(--ui-font-sans)}
.pricing-path p {margin:0;color:var(--ui-muted);font:400 var(--ui-text-sm)/1.6 var(--ui-font-sans)}

.pricing-page .rl-section:not(.pricing-intro) {padding-top:var(--ui-section-space);padding-bottom:var(--ui-section-space)}
.pricing-workspace-layout {display:grid;gap:var(--ui-space-6)}
.pricing-workspace-list {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 var(--ui-space-6);border-top:1px solid var(--ui-border)}
.pricing-workspace-list > div {min-width:0;padding:var(--ui-space-4) 0;border-bottom:1px solid var(--ui-border)}
.pricing-workspace-list h3 {margin:0 0 var(--ui-space-2);color:var(--ui-text);font-size:var(--ui-text-base);font-weight:650;line-height:1.4}
.pricing-workspace-list p {margin:0;color:var(--ui-muted);font-size:var(--ui-text-sm);line-height:1.6}

/* ---------- Section heads ---------- */
.psec-head { text-align: left; }
.psec-head .rl-sub { max-width: 60ch; margin-left: 0; margin-right: 0; }
.b-head { padding: 0; }

.prose-note { margin-top: var(--ui-space-6); font-size: var(--ui-text-base); line-height: 1.7; text-align: left; }
.prose-note strong { font-weight: 700; }

.rl-timeline {display:grid;margin:var(--ui-space-6) 0 0;border-top:1px solid var(--ui-border)}
.rl-step {display:grid;grid-template-columns:160px minmax(0,1fr);gap:var(--ui-space-6);padding:var(--ui-space-4) 0;border-bottom:1px solid var(--ui-border)}
.rl-step-label {color:var(--ui-text);font:600 var(--ui-text-sm)/1.5 var(--ui-font-sans)}
.rl-step p {margin:0;color:var(--ui-muted);font:400 var(--ui-text-sm)/1.6 var(--ui-font-sans)}
.rl-step p strong {color:var(--ui-text);font-weight:600}

/* ---------- FAQ ---------- */
.faq-section { padding-bottom: 84px; }
.faq { margin-top: 30px; }
/* ---------- Stack calculator ---------- */
.stack-calc {
  max-width: 760px; margin: 34px 0 0;
  border: 1px solid var(--ui-border); border-radius: var(--ui-radius-md);
  background: var(--ui-surface); padding: 6px 22px 26px;
}
.stack-row {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 16px 0; border-bottom: 1px solid var(--ui-border);
}
.stack-row:last-child { border-bottom: none; }
.stack-row-check { display: flex; align-items: center; padding-top: 2px; }
.stack-row input[type="checkbox"] {
  width: 20px; height: 20px; accent-color: var(--ui-accent);
  cursor: pointer; flex: none;
}
.stack-row-body { flex: 1 1 auto; min-width: 0; }
.stack-row--slider .stack-row-body {width:100%}
.stack-row-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 12px; }
.stack-row label.stack-row-label {
  font-weight: 650; font-size: var(--ui-text-base); color: var(--ui-text); cursor: pointer;
}
.stack-row-cat {font-size:var(--ui-text-xs);font-weight:600;color:var(--ui-muted)}
.stack-row-amt {
  font-weight: 700; font-size: var(--ui-text-base); color: var(--ui-text);
  margin-left: auto; white-space: nowrap; font-variant-numeric: tabular-nums;
}
.stack-row-meta { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-top: 4px; align-items: baseline; }
.stack-row-note {font-size:var(--ui-text-xs);color:var(--ui-muted);margin:0}
.stack-row-source {
  font-size: var(--ui-text-xs); color: var(--ui-accent); text-decoration: underline;
  text-underline-offset: 2px; white-space: nowrap;
}
.stack-row-source:hover {color:var(--ui-accent-hover)}
.stack-row--slider .stack-row-top { width: 100%; }
.stack-slider-wrap { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.stack-slider-wrap input[type="range"] {
  flex: 1 1 auto; accent-color: var(--ui-accent); height: 6px; cursor: pointer;
}
.stack-total-row {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 16px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--ui-border);
}
.stack-total { display: flex; flex-direction: column; gap: 2px; }
.stack-total-lbl {font-size:var(--ui-text-sm);font-weight:600;color:var(--ui-muted)}
.stack-total-amt {font-weight:700;font-size:var(--ui-title-sm);color:var(--ui-text)}
.stack-vs { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; text-align: right; max-width: 380px; }
.stack-vs-carcin {font-size:var(--ui-text-sm);line-height:1.5;color:var(--ui-accent);font-weight:600}
.stack-honest {font-size:var(--ui-text-sm);color:var(--ui-muted);margin:18px 0 0}
.stack-foot {font-size:var(--ui-text-xs);color:var(--ui-muted);margin:10px 0 0}
@media (max-width: 900px) {
  .pricing-workspace-list {grid-template-columns:repeat(2,minmax(0,1fr))}
  .pricing-path {grid-template-columns:1fr}
}
@media (max-width: 640px) {
  .rl-step {grid-template-columns:1fr;gap:var(--ui-space-1)}
  .pricing-workspace-list {grid-template-columns:1fr}
  .stack-calc { padding: 4px 16px 22px; }
  .stack-row-amt { margin-left: 0; }
  .stack-total-row { flex-direction: column; align-items: flex-start; }
  .stack-vs { align-items: flex-start; text-align: left; }
}
