/* Pricing uses the established Juris type and surface tokens. Prices and
   billing terms stay visible together; no toggle hides the annual commitment. */
.pricing-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr);
  align-items: end;
  gap: clamp(48px, 8vw, 120px);
  padding-block: clamp(80px, 9vw, 132px) 64px;
}
.pricing-intro h1 {
  margin: 0;
  font: 500 var(--display-lg)/1.06 var(--serif);
  letter-spacing: -.018em;
}
.pricing-intro > div > p { max-width: 54ch; margin: 28px 0 0; font-size: var(--text-lead); text-wrap: pretty; }
.pricing-intro .pricing-intro-aside > p { margin: 0; font-size: var(--text-body); }
.pricing-intro-aside nav { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 24px; }
.pricing-intro-aside a { text-underline-offset: 5px; font-size: var(--text-small); }
.pricing-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(6, auto); column-gap: clamp(16px, 2.5vw, 40px); }
.pricing-plan {
  display: grid;
  grid-row: span 6;
  grid-template-rows: subgrid;
  align-content: start;
  gap: 0;
  padding: clamp(24px, 2.8vw, 40px);
  min-width: 0;
}
.pricing-plan-core { background: var(--surface-muted); }
.pricing-plan h2 { margin: 0 0 12px; font: 600 1.5rem/1.3 var(--sans); }
.pricing-tagline { margin: 0; font-size: var(--text-body); line-height: 1.6; text-wrap: pretty; }
.pricing-amount { padding-top: 30px; }
.pricing-amount > p:first-child { margin: 0; }
.pricing-amount strong { display: block; font-size: clamp(2.75rem, 4vw, 3.5rem); font-weight: 500; line-height: 1.15; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
.pricing-amount span { display: block; margin-top: 6px; font-size: var(--text-small); }
.pricing-cycle { margin: 6px 0 0; color: #50545b; font-size: var(--text-small); }
.pricing-annual { margin: 24px 0 30px; font-size: var(--text-small); line-height: 1.65; }
.pricing-annual strong { font-weight: 600; }
.pricing-plan .button { width: 100%; align-self: start; }
.pricing-features { margin: 30px 0 0; padding-left: 18px; font-size: var(--text-body); }
.pricing-features li { padding-left: 3px; margin-top: 12px; }
.pricing-features li:first-child { margin-top: 0; }
.pricing-features li::marker { font-size: .65em; }
.pricing-help { max-width: 80ch; margin: 28px 0 0; color: #50545b; font-size: var(--text-small); }
.pricing-help a { text-underline-offset: 4px; }
.pricing-enterprise { margin-block: 64px clamp(104px, 10vw, 160px); }
.pricing-enterprise-inner { display: grid; grid-template-columns: minmax(190px, .65fr) minmax(0, 1.4fr) auto; gap: 40px; align-items: center; padding: clamp(28px, 3.5vw, 48px); background: var(--surface-muted); }
.pricing-enterprise h2 { margin: 0; font: 500 var(--display-sm)/1.08 var(--serif); letter-spacing: -.018em; }
.pricing-quote { margin: 12px 0 0; font-weight: 600; }
.pricing-enterprise-inner > p { margin: 0; max-width: 60ch; font-size: var(--text-body); text-wrap: pretty; }
.pricing-workflows { padding-block: clamp(88px, 9vw, 136px); background: var(--surface-muted); }
.pricing-section-heading { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(56px, 10vw, 160px); align-items: start; }
.pricing-section-heading h2,
.pricing-close h2 { max-width: 19ch; margin: 0; font: 500 var(--display-md)/1.08 var(--serif); letter-spacing: -.018em; }
.pricing-section-heading > p { margin: 6px 0 0; max-width: 49ch; font-size: var(--text-lead); text-wrap: pretty; }
.pricing-addons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(56px, 10vw, 160px); margin-top: 72px; }
.pricing-addons article { min-width: 0; display: flex; flex-direction: column; }
.pricing-addons h3 { margin: 0; font-size: clamp(1.5rem, 2vw, 1.875rem); font-weight: 600; line-height: 1.3; }
.pricing-addons p { max-width: 52ch; margin: 24px 0 0; text-wrap: pretty; }
.pricing-addons .pricing-addon-price { margin-top: 36px; }
.pricing-addon-price strong { display: block; font-size: clamp(1.875rem, 3vw, 2.5rem); font-weight: 500; line-height: 1.2; letter-spacing: -.015em; }
.pricing-addon-price span { display: block; margin-top: 8px; font-size: var(--text-body); }
.pricing-addons .pricing-addon-note { font-size: var(--text-small); color: #50545b; }
.pricing-addons .text-link { align-self: flex-start; margin-top: auto; padding-top: 32px; }
.pricing-faq { padding-block: clamp(112px, 12vw, 180px); }
.pricing-faq .faq-head h2 { max-width: 14ch; font-size: var(--display-md); line-height: 1.08; }
.pricing-faq .faq-head > p { max-width: 34ch; }
.pricing-close { padding-bottom: clamp(112px, 12vw, 180px); }
.pricing-close-inner { display: flex; justify-content: space-between; align-items: center; gap: 56px; }
.pricing-close-inner p { max-width: 54ch; margin: 28px 0 0; font-size: var(--text-lead); text-wrap: pretty; }
.pricing-close .hero-actions { margin: 0; flex-shrink: 0; flex-direction: column; align-items: flex-start; gap: 24px; }

@media (max-width: 1100px) {
  .pricing-intro { grid-template-columns: minmax(0, 1.3fr) minmax(260px, .8fr); gap: 48px; }
  .pricing-plan { padding-inline: 20px; }
  .pricing-enterprise-inner { grid-template-columns: minmax(180px, .6fr) minmax(0, 1fr); gap: 28px 40px; }
  .pricing-enterprise-inner > .button { grid-column: 2; justify-self: start; }
}
@media (max-width: 800px) {
  .pricing-intro { grid-template-columns: minmax(0, 1fr); padding-top: 64px; gap: 32px; }
  .pricing-intro h1 { font-size: clamp(2.8rem, 8vw, 4.5rem); }
  .pricing-intro > div > p { margin-top: 24px; }
  .pricing-intro .pricing-intro-aside > p { margin-top: 0; }
  .pricing-plans { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 40px; }
  .pricing-plan { grid-row: auto; grid-template-rows: auto; padding: 28px; }
  .pricing-tagline { max-width: 40ch; }
  .pricing-amount strong { font-size: 3.25rem; }
  .pricing-annual { margin-bottom: 28px; }
  .pricing-plan .button { width: auto; justify-self: start; min-width: 180px; }
  .pricing-features { max-width: 48ch; }
  .pricing-enterprise { margin-top: 48px; }
  .pricing-enterprise-inner { grid-template-columns: minmax(0, 1fr); padding: 28px; gap: 24px; }
  .pricing-enterprise-inner > .button { grid-column: auto; }
  .pricing-section-heading, .pricing-addons { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .pricing-addons { margin-top: 56px; gap: 64px; }
  .pricing-close-inner { flex-direction: column; align-items: flex-start; gap: 36px; }
  .pricing-close .hero-actions { flex-direction: row; flex-wrap: wrap; align-items: center; }
}
