/* ==========================================================================
   Nyquist — Pricing page · matches the Tenity vocabulary (nyquist.css + tenity.css)
   Rounded panel cards, hairline tables, per-seat/year USD.
   Ships the "columns" plan layout only (the design's A/B/C switch was a
   design-canvas tweak; production renders the canonical columns layout).
   ========================================================================== */

/* ============ HERO ============ */
.price-hero h1{
  font-size: clamp(48px, 8.4vw, 116px);
  line-height:.94; max-width:none; letter-spacing:-0.05em; font-weight:640;
}
.price-hero .hero-foot{
  display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:64px;
  margin-top:64px; padding-top:0; border-top:none; align-items:start;
}
.price-hero .hero-foot .lede{ max-width:38ch; margin-top:0; font-size:19px }
.price-hero .hero-foot .lede em{ font-style:italic; color:var(--ink) }
.price-hero .mono-list{ display:grid; gap:10px }
.price-hero .mono-list .row{
  font-family:var(--font-mono); font-size:11.5px;
  color:var(--ink-3); letter-spacing:.12em; text-transform:uppercase; line-height:1.5;
}
.price-hero .mono-list .row b{ color:var(--ink); font-weight:500 }

/* ============ SHARED ATOMS ============ */
.tier-name{ font-size:25px; font-weight:600; letter-spacing:-0.03em; line-height:1 }
.tier-tag{ font-family:var(--font-mono); font-size:10.5px; color:var(--ink-3); letter-spacing:.14em; text-transform:uppercase }
.tier-price{ display:flex; align-items:baseline; gap:8px; font-variant-numeric:tabular-nums }
.tier-price .amt{ font-size:44px; font-weight:500; letter-spacing:-0.045em; line-height:1; color:var(--ink) }
.tier-price .per{ font-family:var(--font-mono); font-size:11px; color:var(--ink-3); letter-spacing:.06em; text-transform:uppercase }
.tier-feats{ list-style:none; margin:0; padding:0; display:grid; gap:12px }
.tier-feats li{ display:grid; grid-template-columns:14px 1fr; gap:11px; font-size:14px; line-height:1.45; color:var(--ink-2) }
.tier-feats li .mk{ font-family:var(--font-mono); color:var(--accent); font-size:12px; line-height:1.55 }
.tier-feats li b{ color:var(--ink); font-weight:500 }
.tier-discount{ font-family:var(--font-mono); font-size:11px; color:var(--ink-3); letter-spacing:.06em; text-transform:uppercase }
.tier-discount b{ color:var(--pos); font-weight:500 }
.ribbon{
  font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-ink); background:var(--accent); padding:4px 11px; border-radius:999px; white-space:nowrap;
}

/* ============ TIER CARDS ============ */
/* rounded card base — mirrors .scard */
.tcard{
  position:relative; background:var(--panel); border:1px solid var(--line); border-radius:22px;
  padding:38px 34px 36px; display:flex; flex-direction:column;
  transition: transform .5s var(--ease-out), border-color .3s ease, box-shadow .4s ease;
}
.tcard:hover{ border-color:var(--ink); box-shadow:0 30px 70px -44px rgba(11,14,20,.5) }
.tcard.feat{ background:var(--ink); border-color:var(--ink) }
.tcard.feat .tier-name, .tcard.feat .tier-price .amt{ color:var(--bg) }
.tcard.feat .tier-tag, .tcard.feat .seats, .tcard.feat .tier-price .per,
.tcard.feat .lede-sm, .tcard.feat .tier-feats li{ color:color-mix(in oklab, var(--bg) 72%, var(--ink)) }
.tcard.feat .tier-feats li b{ color:var(--bg) }
.tcard.feat .tier-feats li .mk{ color:color-mix(in oklab, var(--accent) 55%, var(--bg)) }
.tcard.feat .btn-primary{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink) }
.tcard.feat .btn-primary .ca{ background:var(--accent-ink); color:var(--accent) }
.tcard.feat .tier-discount{ color:color-mix(in oklab, var(--bg) 58%, var(--ink)); border-top-color:color-mix(in oklab, var(--bg) 20%, transparent) }
.tcard.feat .tier-discount b{ color:color-mix(in oklab, var(--pos) 42%, var(--bg)) }
.tcard .col-top{ display:flex; align-items:center; justify-content:space-between; gap:12px }
.tcard .seats{ font-family:var(--font-mono); font-size:11px; color:var(--ink-3); letter-spacing:.08em; text-transform:uppercase; margin-top:8px }
.tcard .tier-price{ margin:26px 0 8px }
.tcard .lede-sm{ font-size:14px; color:var(--ink-2); line-height:1.5; margin:18px 0 26px; max-width:32ch }
.tcard .tier-feats{ margin-bottom:28px }
.tcard .btn{ margin-top:auto; width:100% }
.tcard .tier-discount{ margin-top:18px; padding-top:18px; border-top:1px solid var(--hair) }

/* three columns */
.tiers-cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:stretch }

.tiers-note{
  margin-top:28px; font-family:var(--font-mono); font-size:11.5px; color:var(--ink-3);
  letter-spacing:.04em; line-height:1.6; display:flex; flex-wrap:wrap; gap:8px 28px;
}
.tiers-note b{ color:var(--ink); font-weight:500 }
.tiers-note .y{ color:var(--pos) } .tiers-note .d{ color:var(--accent) } .tiers-note .x{ color:var(--ink-4) }

/* ============ PERSONA SUITES ============ */
.suites{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px }
.suite{
  background:var(--panel); border:1px solid var(--line); border-radius:22px;
  padding:32px 30px 30px; display:flex; flex-direction:column; min-height:268px;
  transition: transform .5s var(--ease-out), border-color .3s ease, box-shadow .4s ease;
}
.suite:hover{ border-color:var(--ink); box-shadow:0 30px 70px -44px rgba(11,14,20,.5); transform:translateY(-6px) }
.suite .sh{ display:flex; align-items:baseline; justify-content:space-between; gap:10px }
.suite .sname{ font-size:22px; font-weight:600; letter-spacing:-0.025em; line-height:1.08; max-width:14ch }
.suite .rec{ font-family:var(--font-mono); font-size:10px; color:var(--accent); letter-spacing:.12em; text-transform:uppercase; white-space:nowrap }
.suite .compose{ margin-top:18px; display:flex; flex-wrap:wrap; gap:6px }
.suite .chip{
  font-family:var(--font-mono); font-size:11px; color:var(--ink-2); letter-spacing:.02em;
  border:1px solid var(--line-2); border-radius:999px; padding:4px 10px; white-space:nowrap;
}
.suite .chip.base{ border-color:var(--ink-3); color:var(--ink) }
.suite .sfoot{ margin-top:auto; padding-top:24px; border-top:1px solid var(--hair); display:flex; align-items:flex-end; justify-content:space-between; gap:12px }
.suite .sprice{ font-variant-numeric:tabular-nums }
.suite .sprice .amt{ font-size:28px; font-weight:500; letter-spacing:-0.035em; color:var(--ink); line-height:1 }
.suite .sprice .per{ font-family:var(--font-mono); font-size:10.5px; color:var(--ink-3); letter-spacing:.06em; text-transform:uppercase; display:block; margin-top:6px }
.suite .save{ text-align:right; font-family:var(--font-mono); font-size:11px; letter-spacing:.04em; line-height:1.5 }
.suite .save .was{ color:var(--ink-4); text-decoration:line-through }
.suite .save .pct{ color:var(--pos); display:block; margin-top:3px }
.suite.build{ justify-content:center; align-items:flex-start; background:transparent; border-style:dashed }
.suite.build:hover{ transform:none; box-shadow:none; border-color:var(--ink-3) }

/* ============ FEATURE MATRIX (vs-table style) ============ */
.matrix{ width:100%; border-collapse:collapse; font-size:14px }
.matrix th, .matrix td{ padding:16px 18px; border-bottom:1px solid var(--hair); text-align:center; color:var(--ink-2); vertical-align:middle }
.matrix thead th{
  font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.14em;
  color:var(--ink-3); font-weight:500; border-bottom:1px solid var(--ink-3); vertical-align:bottom; padding-bottom:14px;
}
.matrix thead th .pr{ display:block; font-size:10px; color:var(--ink-4); letter-spacing:.06em; margin-top:6px }
.matrix thead th.feat{ color:var(--accent) }
.matrix .cap{ text-align:left; color:var(--ink); padding-left:0; font-weight:500; letter-spacing:-0.005em }
.matrix td.feat{ background:color-mix(in oklab, var(--accent) 5%, transparent); color:var(--ink) }
.matrix th.feat{ background:color-mix(in oklab, var(--accent) 6%, transparent) }
.matrix .y{ color:var(--pos); font-family:var(--font-mono); font-size:15px }
.matrix .n{ color:var(--ink-4); font-family:var(--font-mono); font-size:14px }
.matrix .d{ color:var(--accent); font-family:var(--font-mono); font-size:12.5px; font-weight:500 }
.matrix .sm{ font-family:var(--font-mono); font-size:11px; color:var(--ink-2); text-transform:none; letter-spacing:.01em; line-height:1.4 }
.matrix .sm b{ color:var(--ink); font-weight:500 }

/* ============ HUB CATALOG ============ */
.hubs{ display:grid; gap:20px }
.hub-base{
  background:var(--ink); color:var(--bg); border-radius:22px; padding:30px 34px;
  display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center;
}
.hub-base .hb-l .nm{ font-size:19px; font-weight:600; letter-spacing:-0.02em }
.hub-base .hb-l .ds{ margin-top:7px; font-size:13.5px; color:color-mix(in oklab, var(--bg) 72%, var(--ink)); line-height:1.5; max-width:54ch }
.hub-base .hb-r{ text-align:right; font-variant-numeric:tabular-nums }
.hub-base .hb-r .amt{ font-size:32px; font-weight:500; letter-spacing:-0.035em; color:var(--bg); line-height:1 }
.hub-base .hb-r .per{ font-family:var(--font-mono); font-size:10.5px; color:color-mix(in oklab, var(--bg) 64%, var(--ink)); letter-spacing:.06em; text-transform:uppercase; display:block; margin-top:7px }

.hub-tier{ background:var(--panel); border:1px solid var(--line); border-radius:22px; padding:28px 34px }
.hub-tier .tier-head{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; padding-bottom:18px; border-bottom:1px solid var(--hair) }
.hub-tier .tier-head .lbl{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink-3); letter-spacing:.12em; text-transform:uppercase }
.hub-tier .tier-head .lbl b{ color:var(--ink); font-weight:500 }
.hub-tier .tier-head .price{ font-family:var(--font-mono); font-size:13px; color:var(--accent); font-weight:500; font-variant-numeric:tabular-nums }
.hub-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:0 }
.hub-grid .h{
  font-size:13.5px; color:var(--ink-2); padding:13px 0; line-height:1.35;
  border-bottom:1px solid var(--hair); padding-right:18px;
}
.hub-grid .h b{ color:var(--ink); font-weight:500; display:block }
.hub-grid .h small{ font-family:var(--font-mono); font-size:10.5px; color:var(--ink-3); letter-spacing:.04em }
.hubs-note{ margin-top:24px; font-size:14.5px; color:var(--ink-2); line-height:1.6; max-width:60ch }
.hubs-note b{ color:var(--ink); font-weight:500 }

/* ============ AI / OVERAGE ============ */
.ai-grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start }
.ai-sub{ font-family:var(--font-mono); font-size:12px; color:var(--ink-3); letter-spacing:.12em; text-transform:uppercase; margin-bottom:24px; display:flex; align-items:center; gap:8px }
.ai-sub .ast{ color:var(--accent) }
.ai-incl{ display:grid; gap:0 }
.ai-incl .ai-row{
  display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center;
  padding:22px 0; border-top:1px solid var(--hair);
}
.ai-incl .ai-row:last-child{ border-bottom:1px solid var(--hair) }
.ai-incl .ai-row .nm{ font-size:16px; font-weight:500; letter-spacing:-0.01em }
.ai-incl .ai-row .nm small{ display:block; font-family:var(--font-mono); font-size:11px; color:var(--ink-3); font-weight:400; letter-spacing:.04em; text-transform:uppercase; margin-top:6px }
.ai-incl .ai-row .cr{ text-align:right; font-family:var(--font-mono); font-size:13px; color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap }
.ai-incl .ai-row .cr b{ font-size:21px; font-weight:500; letter-spacing:-0.01em }
.ai-incl .ai-row .cr span{ display:block; color:var(--ink-3); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; margin-top:4px }

.over{ display:grid; gap:14px }
.over .ov{ background:var(--panel); border:1px solid var(--line); border-radius:16px; display:grid; grid-template-columns:auto 1fr auto; gap:20px; align-items:center; padding:18px 22px }
.over .ov .nm{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink); letter-spacing:.1em; text-transform:uppercase; font-weight:500 }
.over .ov .add{ font-size:13.5px; color:var(--ink-2) }
.over .ov .add b{ color:var(--ink); font-weight:500 }
.over .ov .pr{ text-align:right; font-family:var(--font-mono); font-size:14px; color:var(--ink); font-weight:500; font-variant-numeric:tabular-nums; white-space:nowrap }
.ai-logic{ margin-top:24px; font-size:14.5px; color:var(--ink-2); line-height:1.6 }
.ai-logic b{ color:var(--ink); font-weight:500 }
.ai-logic em{ font-style:italic; color:var(--ink) }

/* ============ BILLING TERMS ============ */
.billing{ width:100%; border-collapse:collapse; font-size:14px }
.billing th, .billing td{ padding:16px 18px; border-bottom:1px solid var(--hair); text-align:right; font-variant-numeric:tabular-nums; color:var(--ink-2) }
.billing thead th{ font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.14em; color:var(--ink-3); font-weight:500; border-bottom:1px solid var(--ink-3) }
.billing th:first-child, .billing td:first-child{ text-align:left }
.billing td.term{ color:var(--ink); font-weight:500; font-size:15px }
.billing td.mult{ font-family:var(--font-mono); color:var(--ink-2) }
.billing td.price{ font-family:var(--font-mono); color:var(--ink); font-weight:500; font-size:15px }
.billing td.note{ font-size:13px; color:var(--ink-3); text-align:left; line-height:1.45 }
.billing tr.base td{ background:color-mix(in oklab, var(--accent) 5%, transparent) }
.billing tr.base td.term{ color:var(--accent) }
.billing tr.best td.price{ color:var(--pos) }
.billing-note{ margin-top:24px; font-family:var(--font-mono); font-size:11.5px; color:var(--ink-3); letter-spacing:.04em; line-height:1.6 }
.billing-note b{ color:var(--ink); font-weight:500 }

/* ============ PRIVATE DEPLOYMENT ============ */
.pd-intro{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-bottom:48px }
.pd-intro > div{ padding:0 24px; border-left:1px solid var(--hair) }
.pd-intro > div:first-child{ border-left:none; padding-left:0 }
.pd-intro .k{ font-family:var(--font-mono); font-size:11px; color:var(--accent); letter-spacing:.12em; text-transform:uppercase }
.pd-intro .v{ margin-top:12px; font-size:14px; color:var(--ink-2); line-height:1.5 }
.pd-intro .v b{ color:var(--ink); font-weight:500 }

/* license bands table */
.bands{ width:100%; border-collapse:collapse; font-size:14px }
.bands th, .bands td{ padding:18px 18px; border-bottom:1px solid var(--hair); text-align:right; font-variant-numeric:tabular-nums; color:var(--ink-2) }
.bands thead th{ font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.14em; color:var(--ink-3); font-weight:500; border-bottom:1px solid var(--ink-3); vertical-align:bottom }
.bands th:first-child, .bands td:first-child{ text-align:left }
.bands td.band{ color:var(--ink); font-weight:600; font-size:17px; letter-spacing:-0.02em }
.bands td.aum{ font-family:var(--font-mono); font-size:12px; color:var(--ink-3); text-align:left }
.bands td.big{ font-family:var(--font-mono); color:var(--ink); font-weight:500; font-size:16px }
.bands td.sub{ font-family:var(--font-mono); color:var(--ink-2); font-size:13px }
.bands thead th.feat{ color:var(--accent) }
.bands td.feat{ background:color-mix(in oklab, var(--accent) 5%, transparent) }

/* modules + deployment + packages — column blocks */
.pd-blocks{ display:grid; grid-template-columns:1.1fr 1fr; gap:24px; margin-top:24px }
.pd-card{ background:var(--panel); border:1px solid var(--line); border-radius:22px; padding:30px 32px }
.pd-card h4{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink-3); letter-spacing:.12em; text-transform:uppercase; font-weight:500 }
.pd-card h4 b{ color:var(--ink); font-weight:500 }
.pd-list{ display:grid; gap:0; margin-top:8px }
.pd-list .r{ display:grid; grid-template-columns:1fr auto; gap:16px; align-items:baseline; padding:15px 0; border-top:1px solid var(--hair) }
.pd-list .r .nm{ font-size:15px; color:var(--ink); font-weight:500; letter-spacing:-0.01em }
.pd-list .r .nm small{ display:block; font-family:var(--font-mono); font-size:11px; color:var(--ink-3); font-weight:400; letter-spacing:.04em; text-transform:uppercase; margin-top:5px }
.pd-list .r .vv{ text-align:right; font-family:var(--font-mono); font-size:14px; color:var(--ink); font-weight:500; font-variant-numeric:tabular-nums; white-space:nowrap }
.pd-list .r .vv small{ display:block; color:var(--ink-3); font-weight:400; font-size:10.5px; letter-spacing:.04em; margin-top:4px; text-transform:uppercase }
.pd-list .r .pct{ color:var(--accent) }
.pd-list .r.req .nm small{ color:var(--warn) }
.pd-note{ margin-top:24px; font-family:var(--font-mono); font-size:11.5px; color:var(--ink-3); letter-spacing:.04em; line-height:1.7 }
.pd-note b{ color:var(--ink); font-weight:500 }
.pd-note .warn{ color:var(--warn) }

/* restricted license strip */
.pd-restrict{ margin-top:24px; display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--hair) }
.pd-restrict > div{ padding:22px 22px 0 22px; border-left:1px solid var(--hair) }
.pd-restrict > div:first-child{ border-left:none; padding-left:0 }
.pd-restrict .x{ font-family:var(--font-mono); color:var(--neg); font-size:13px }
.pd-restrict .t{ margin-top:10px; font-size:14px; color:var(--ink); font-weight:500; letter-spacing:-0.005em }
.pd-restrict .s{ margin-top:6px; font-size:13px; color:var(--ink-3); line-height:1.5 }

/* ============ TABLE SURFACE ============ */
/* Opaque panel behind dense data tables so the fixed dotfield backdrop (z-index:-1,
   body is transparent) doesn't animate through and hurt readability. Matches the
   page's card language (.tcard / .suite / .pd-card are all --panel rounded cards). */
.table-surface{
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 6px 30px 10px;
}

/* ============ RESPONSIVE ============ */
@media (max-width: 1100px){
  .price-hero .hero-foot{ grid-template-columns:1fr; gap:32px }
  .tiers-cols, .suites{ grid-template-columns:1fr }
  .ai-grid{ grid-template-columns:1fr; gap:48px }
  .hub-grid{ grid-template-columns:1fr 1fr }
  .pd-intro, .pd-restrict{ grid-template-columns:1fr 1fr }
  .pd-intro > div:nth-child(3){ border-left:none; padding-left:0 }
  .pd-blocks{ grid-template-columns:1fr }
}
@media (max-width: 640px){
  .suites{ grid-template-columns:1fr }
  .hub-grid{ grid-template-columns:1fr }
  .matrix, .billing, .bands{ font-size:12.5px }
  .matrix th, .matrix td, .billing th, .billing td, .bands th, .bands td{ padding:12px 8px }
  .hub-base{ grid-template-columns:1fr; gap:16px }
  .hub-base .hb-r{ text-align:left }
  .billing td.note{ display:none }
  .billing th:last-child{ display:none }
  .pd-intro, .pd-restrict{ grid-template-columns:1fr }
  .pd-intro > div, .pd-restrict > div{ border-left:none; padding-left:0 }
  .bands td.aum, .bands th:nth-child(2){ display:none }
  .table-surface{ padding-left:14px; padding-right:14px; border-radius:16px }
}