/* ----------------------------------------------------------------------------
 * Pricing detail pages, v3 alignment.
 *
 * Covers the four pages the redesigned /pricing links into:
 *   pricing_table (Free), pricing_medium (Starter), pricing_pro (Pro)  -> .banner_pricing
 *   home/addon_price                                                   -> .pricing-content
 *
 * Like the bespoke industry pages, these were already on the brand palette
 * (#eeff38 lime on near-black); what they lacked was the v3 type and table
 * treatment. Markup and copy are untouched.
 *
 * Every selector is scoped to a page-specific wrapper, so Bootstrap's
 * .container / .row / .col-* and the shared shell are unaffected.
 * Tokens come from v3-shell.css (:root), loaded by views/partials/v3_head.php.
 * -------------------------------------------------------------------------- */

.banner_pricing,.pricing-content{
  font-family:var(--v3-body);
  background:var(--v3-paper);
  color:var(--v3-ink);
  padding-block:clamp(44px,6vw,80px);
}
.banner_pricing p,.pricing-content p{color:var(--v3-steel);line-height:1.65}

/* headings */
.banner_pricing h2,.pricing-content h2{
  font-family:var(--v3-display);font-weight:800;text-transform:uppercase;
  font-size:clamp(34px,4.6vw,58px);line-height:.95;margin:0 0 28px;text-wrap:balance;
}
.pricing-content h3{font-family:var(--v3-body);font-weight:700;font-size:20px;line-height:1.3}

/* plan name band */
.new_begning{margin:0 auto 22px;text-align:center}
.new_begning h4{
  font-family:var(--v3-display);font-weight:800;text-transform:uppercase;
  font-size:clamp(30px,3.6vw,46px);line-height:1;color:var(--v3-ink);margin:0;
}

/* module / price table */
.banner_pricing table.table-dark{
  width:100%!important;max-width:820px;margin:0 auto;
  border-collapse:collapse;background:var(--v3-card);
  border:1px solid var(--v3-rule);font-size:15.5px;
}
.banner_pricing table.table-dark th,
.banner_pricing table.table-dark td{
  padding:14px 18px;text-align:left;vertical-align:top;
  border-bottom:1px solid var(--v3-rule);color:var(--v3-ink);
}
/* beats `table thead th{background-color:#c6ced6!important}` in
   assets/modules/home/css/style.css:13536, which applies site-wide. */
.banner_pricing table.table-dark thead th{
  background-color:var(--v3-ink)!important;color:#f2f4ea!important;
  font-family:var(--v3-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  font-weight:400!important;border:0 none!important;position:static!important;
  white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
}
.banner_pricing table.table-dark tbody tr:last-child td{border-bottom:0}
.banner_pricing table.table-dark tbody tr:nth-child(even) td{background:var(--v3-paper)}
.banner_pricing table.table-dark td:first-child{font-weight:600}
.banner_pricing .w-40{width:40%}

/* add-on cards */
.pricing-content .row.d-flx{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:var(--v3-card);border:1px solid var(--v3-rule);border-radius:6px;
  padding:22px;margin:0 0 20px;
}
.pricing-content .black_btnnn{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:10px;
}
.pricing-content .black_btnnn span{
  font-family:var(--v3-display);font-weight:800;font-size:36px;line-height:.9;
  font-variant-numeric:tabular-nums;
}
.pricing-content .black_btnnn span::before{content:"\20B9";font-size:.6em;margin-right:2px}
.pricing-content a.black_btn{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--v3-lime);color:var(--v3-ink);
  font-family:var(--v3-body);font-weight:700;font-size:15px;
  padding:12px 20px;border-radius:var(--v3-radius-btn);text-decoration:none;
  border:2px solid transparent;transition:transform .15s ease;
}
.pricing-content a.black_btn:hover{transform:translateY(-2px);text-decoration:none;color:var(--v3-ink)}

@media (max-width:600px){
  .banner_pricing table.table-dark{font-size:14.5px}
  .banner_pricing table.table-dark th,.banner_pricing table.table-dark td{padding:12px 14px}
  .pricing-content a.black_btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  .banner_pricing *,.pricing-content *{transition:none!important;animation:none!important}
}