/**
 * /v2/light/pricing — page layout only.
 * Fonts, nav, footer, and theme tokens come from home-BmWhAU4L.css,
 * light-overrides.css, and casan-nav-logo.css.
 */

:root {
  --pr-ink: #0e1615;
  --pr-muted: #5c6b68;
  --pr-line: rgba(14, 22, 21, 0.12);
  --pr-card: #ffffff;
  --pr-pine: #0b6b56;
  --pr-pine-soft: rgba(11, 107, 86, 0.1);
  --pr-radius: 14px;
}

body.casan-pricing {
  min-height: 100%;
}

/*
 * Pricing has no photo hero — restore ink nav on paper.
 * (Home light skin keeps white nav over the dark-washed Copenhagen hero.)
 */
body.casan-pricing.v2-light .bk-header {
  --color-theme-bg-header: #f7f8f7;
  --color-theme-content-header: #0e1615;
  --color-theme-bg-cta-disabled: #d8e0de;
  --color-theme-content-cta: #0e1615;
  --color-theme-content-cta-hover: #3f4a48;
  --color-theme-content-cta-active: #5c6b68;
  --color-theme-content-cta-focus: #0e1615;
  --color-theme-content-cta-disabled: #8a9693;
  --color-theme-border-cta: #0e1615;
  --color-theme-border-cta-hover: #3f4a48;
  --color-theme-border-cta-active: #5c6b68;
  --color-theme-border-cta-focus: #0e1615;
  --color-theme-border-cta-disabled: #d8e0de;
  --color-component-header-level1-border: #d8e0de;
}

body.casan-pricing.v2-light .bk-header .fill-white,
body.casan-pricing.v2-light .bk-header [class*="fill-white"] {
  fill: #0e1615 !important;
}

body.casan-pricing.v2-light .bk-header .stroke-white,
body.casan-pricing.v2-light .bk-header [class*="stroke-white"] {
  stroke: #0e1615 !important;
}

body.casan-pricing.v2-light .bk-header .text-white,
body.casan-pricing.v2-light .bk-header [class*="text-white"],
body.casan-pricing.v2-light .bk-header .text-component-header-content {
  color: #0e1615 !important;
}

body.casan-pricing.v2-light .casan-brand-logo--on-dark {
  display: none !important;
}

body.casan-pricing.v2-light .casan-brand-logo--on-light {
  display: block !important;
}

.casan-pricing-main {
  position: relative;
  z-index: 1;
  /* Header uses -mb-global-header; give the hero room below the sticky nav. */
  padding-top: calc(var(--spacing-global-header, 4.5rem) + clamp(1.5rem, 4vw, 3rem));
}

/*
 * Use the same horizontal band as homepage `.container` (side `--margin`
 * gutters; at ≥1600px a centered max-width). A 1200px cap made tiers/table
 * sit in a narrow band and read as “pushed left” next to the wider nav.
 */
body.casan-pricing .container.pr-page {
  box-sizing: border-box;
  width: auto;
  max-width: none;
  margin-left: var(--margin, 1rem);
  margin-right: var(--margin, 1rem);
  padding-left: 0;
  padding-right: 0;
  justify-self: stretch;
}

@media (width >= 1600px) {
  body.casan-pricing .container.pr-page {
    width: 100%;
    max-width: calc(1600px - (2 * var(--margin, 1rem)));
    margin-left: auto;
    margin-right: auto;
    justify-self: center;
  }
}

.pr-compare-jump {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 1rem;
}

.pr-compare-jump a {
  color: var(--pr-muted);
  text-decoration: none;
  font-weight: 500;
}

.pr-compare-jump a:hover {
  color: var(--pr-ink);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* ── Tier grid ───────────────────────────────────────────────────── */
.pr-tiers {
  display: grid;
  gap: 1rem;
}

@media (min-width: 640px) {
  .pr-tiers {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  .pr-tiers {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.pr-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--pr-card);
  border: 1px solid var(--pr-line);
  border-radius: var(--pr-radius);
  padding: 1.5rem 1.5rem 1.65rem;
}

.pr-card--featured {
  border-color: rgba(14, 22, 21, 0.28);
  box-shadow: 0 0 0 1px rgba(14, 22, 21, 0.08);
}

.pr-card__name {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--pr-ink);
}

.pr-card__audience {
  margin: 0.35rem 0 0;
  font-size: 0.875rem;
  font-weight: 560;
  color: var(--pr-pine);
}

.pr-card__price {
  margin-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.45rem;
}

.pr-card__price strong {
  font-size: clamp(1.5rem, 2.2vw, 1.75rem);
  font-weight: 600;
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  color: var(--pr-ink);
}

.pr-card__price span {
  font-size: 0.875rem;
  letter-spacing: 0;
  color: var(--pr-muted);
}

.pr-card__note {
  margin: 0.45rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.45;
  letter-spacing: 0.005em;
  color: var(--pr-muted);
}

.pr-card > a[data-component-name] {
  margin-top: 1.5rem;
}

.pr-capacity {
  margin: 1.25rem 0 0;
  padding: 1.25rem 0 0;
  border-top: 1px solid var(--pr-line);
  display: grid;
  gap: 0.65rem;
}

.pr-capacity div {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.875rem;
}

.pr-capacity dt {
  color: var(--pr-muted);
  margin: 0;
}

.pr-capacity dt span {
  opacity: 0.8;
}

.pr-capacity dd {
  margin: 0;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  color: var(--pr-ink);
  text-align: right;
}

.pr-features {
  list-style: none;
  margin: 1.5rem 0 0;
  padding: 0;
  border-top: 1px solid var(--pr-line);
}

.pr-features li {
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--pr-line);
  font-size: 0.875rem;
  line-height: 1.35;
  color: var(--pr-muted);
}

.pr-features li:last-child {
  border-bottom: 0;
}

.pr-card__foot {
  margin: 1rem 0 0;
  font-size: 0.75rem;
  color: var(--pr-muted);
}

.pr-footnote {
  margin: 1.5rem 0 0;
  text-align: center;
  font-size: 0.75rem;
  color: var(--pr-muted);
}

/* ── Compare table ───────────────────────────────────────────────── */
.pr-compare {
  margin-top: 0;
}

.pr-compare > h2 {
  max-width: 52rem;
}

.pr-table-scroll {
  margin-top: 2.5rem;
  overflow-x: auto;
  border: 1px solid var(--pr-line);
  border-radius: var(--pr-radius);
  background: var(--pr-card);
  -webkit-overflow-scrolling: touch;
}

.pr-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  table-layout: fixed;
  text-align: left;
}

.pr-table thead th {
  padding: 1.5rem 0.75rem;
  font-weight: 400;
  text-align: center;
  vertical-align: bottom;
  border-bottom: 1px solid var(--pr-line);
  width: 20.5%;
}

.pr-table thead th:first-child {
  width: 18%;
  min-width: 9.5rem;
  text-align: left;
  position: sticky;
  left: 0;
  z-index: 2;
  background: var(--pr-card);
  padding-left: 1.25rem;
  padding-right: 1rem;
}

.pr-table thead .pr-tier-name {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: var(--pr-ink);
}

.pr-table thead .pr-tier-summary {
  margin: 0.35rem 0 0;
  font-size: 0.75rem;
  line-height: 1.4;
  letter-spacing: 0.005em;
  color: var(--pr-muted);
}

.pr-table thead a[data-component-name] {
  margin-top: 1rem;
  display: inline-flex;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
}

.pr-table .pr-section-row td {
  position: sticky;
  left: 0;
  background: #f0f2f1;
  padding: 1rem 1.25rem;
  font-size: 1rem;
  font-weight: 650;
  color: var(--pr-ink);
  border-bottom: 1px solid var(--pr-line);
}

.pr-table tbody tr:not(.pr-section-row) td {
  padding: 1rem 0.75rem;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid rgba(14, 22, 21, 0.08);
}

.pr-table tbody tr:not(.pr-section-row) td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--pr-card);
  text-align: left;
  padding-left: 1.25rem;
  padding-right: 1rem;
}

/* Keep check / dash marks visually centered in the column */
.pr-table tbody tr:not(.pr-section-row) td:has(.pr-check),
.pr-table tbody tr:not(.pr-section-row) td:has(.pr-dash) {
  text-align: center;
}

.pr-row-label {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 560;
  letter-spacing: 0.005em;
  color: var(--pr-ink);
}

.pr-row-hint {
  margin: 0.2rem 0 0;
  font-size: 0.75rem;
  line-height: 1.4;
  letter-spacing: 0.005em;
  color: var(--pr-muted);
}

.pr-check {
  display: inline-flex;
  width: 1.5rem;
  height: 1.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--pr-pine-soft);
  color: var(--pr-pine);
}

.pr-check svg {
  width: 0.875rem;
  height: 0.875rem;
  display: block;
}

.pr-dash {
  color: rgba(14, 22, 21, 0.28);
}

.pr-cell-text {
  display: inline-block;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.35;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  letter-spacing: 0.015em;
  color: var(--pr-ink);
  white-space: nowrap;
}

/* Indigo primary on pricing CTAs (matches casan-nav-logo header CTAs) */
body.casan-pricing a[data-component-name="start-free-trial"].bg-component-button-primary-bg {
  background-color: #462de2 !important;
  border-color: transparent !important;
  color: #fff !important;
}

body.casan-pricing a[data-component-name="start-free-trial"].bg-component-button-primary-bg:hover {
  background-color: #3a22c4 !important;
}
