/* The batch landing page (/phone-number-batch-processing), in the API page's
   visual language. Shared pieces live in public-components.css. */
.public-page .batch-hero { padding-bottom: 48px; background: linear-gradient(180deg, #f6faf8 0%, #fff 75%); }
.public-page .batch-card { padding: 24px; border: 1px solid #dce6e0; border-radius: 10px; background: #fff; box-shadow: 0 24px 48px -32px rgba(20, 60, 40, .45); }
.public-page .batch-card .public-detail-list { margin: 0 0 16px; padding: 0; }
.public-page .batch-card .public-detail-list > div { padding: 10px 0; border-top: 1px solid #e3eee8; }
.public-page .batch-card .public-detail-list > div:first-child { border-top: 0; padding-top: 0; }
.public-page .batch-card dt { color: #58665f; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.public-page .batch-card dd { margin: 2px 0 0; color: #1d2723; font-size: 15px; }
.public-page .batch-card p { margin: 0 0 10px; color: #4d5c55; font-size: 14px !important; }
.public-page .batch-card p.batch-card-secure { margin: 0; padding-top: 12px; border-top: 1px solid #e3eee8; }
.public-page .batch-card p.pv-arrow-line { margin: 0; }
.public-page .batch-facts { margin-top: 40px; }

/* Workflow: numbered steps. */
.public-page .batch-workflow .public-step { position: relative; padding: 24px; border: 1px solid #dce6e0; border-radius: 10px; background: #fff; }
.public-page .batch-workflow .public-step::before { content: counter(public-step); display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-bottom: 14px; border-radius: 50%; background: #eef7f2; color: #146c43; font-size: 15px; font-weight: 700; }
.public-page .batch-workflow .public-step h3 { font-size: 18px; }
.public-page .batch-workflow .public-step p { margin: 0; font-size: 15px !important; }

/* What's in your results. */
.public-page .batch-results-card { padding: 24px; border: 1px solid #dce6e0; border-radius: 10px; background: #f6faf8; }
.public-page .batch-results-card h3 { margin: 0 0 14px; font-size: 18px; }
.public-page .batch-results-card dl { margin: 0 0 18px; }
.public-page .batch-results-card dl > div { padding: 12px 0; border-top: 1px solid #dce6e0; }
.public-page .batch-results-card dl > div:first-child { border-top: 0; padding-top: 0; }
.public-page .batch-results-card dt { display: inline-block; margin-bottom: 4px; padding: 2px 8px; border-radius: 6px; background: #eef7f2; color: #146c43; font-size: 13px; font-weight: 600; }
.public-page .batch-results-card dd { margin: 0; color: #4d5c55; font-size: 15px; }
.public-page .batch-results-card p { margin: 0; }

/* Pricing: one card, the rate beside what it includes. */
.public-page .batch-pricing { background: #f6faf8; border-top: 1px solid #e3eee8; }
.public-page .batch-price-card { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 0; margin-top: 8px; border: 1px solid #dce6e0; border-radius: 10px; background: #fff; overflow: hidden; }
.public-page .batch-price-summary { padding: 40px; border-right: 1px solid #e3eee8; }
.public-page p.batch-price { display: flex; align-items: baseline; gap: 10px; margin: 0 0 8px; }
.public-page .batch-price .price-grid { color: #146c43; font-size: 48px; font-weight: 700; line-height: 1; }
.public-page .batch-price span:last-child { color: #4d5c55; font-size: 16px; }
.public-page .batch-price-summary .public-compare-intro { margin: 0 0 18px; }
.public-page .batch-tiers { margin: 4px 0 8px; }
.public-page .batch-price-summary .public-product-actions { margin-top: 20px; }
.public-page .batch-includes { margin: 0; padding: 40px 40px 16px; list-style: none; }
.public-page .batch-includes li { position: relative; padding: 0 0 16px 36px; }
.public-page .batch-includes li::before { content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%; background: #146c43 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.public-page .batch-includes h3 { margin: 0 0 2px; font-size: 16px; line-height: 1.5; }
.public-page .batch-includes p { margin: 0; font-size: 14px !important; line-height: 1.5 !important; }
.public-page .batch-price-meta { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; border-top: 1px solid #e3eee8; }
.public-page .batch-price-meta > div { display: flex; justify-content: space-between; gap: 16px; padding: 16px 40px; }
.public-page .batch-price-meta > div + div { border-left: 1px solid #e3eee8; }
.public-page .batch-price-meta dt { color: #4d5c55; font-size: 15px; font-weight: 500; }
.public-page .batch-price-meta dd { margin: 0; color: #1d2723; font-weight: 600; }
.public-page .batch-pricing .public-product-notes { max-width: 820px; margin-top: 28px; padding-top: 20px; border-top: 1px solid #dce6e0; }
.public-page .batch-pricing .public-product-notes p { margin: 0 0 10px; }
.public-page .batch-landing sup { font-size: 11px; line-height: 0; }

@media (max-width: 960px) {
  .public-page .batch-price-card { grid-template-columns: 1fr; }
  .public-page .batch-price-summary { border-right: 0; border-bottom: 1px solid #e3eee8; }
  .public-page .batch-price-meta { grid-template-columns: 1fr; }
  .public-page .batch-price-meta > div + div { border-left: 0; border-top: 1px solid #e3eee8; }
}
@media (max-width: 640px) {
  .public-page .batch-price-summary, .public-page .batch-includes { padding: 24px 20px; }
  .public-page .batch-price-meta > div { padding: 14px 20px; }
  .public-page .batch-card, .public-page .batch-results-card, .public-page .batch-workflow .public-step { padding: 20px; }
  .public-page .batch-price-summary .btn.btn-primary, .public-page .batch-results-card a.pv-button { width: 100%; }
  .public-page .batch-price .price-grid { font-size: 40px; }
}

/* Hero: a results file preview, the batch page's version of the API page's code panel. */
.public-page .batch-hero .public-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
.public-page .batch-preview { margin: 0; border: 1px solid #dce6e0; border-radius: 10px; background: #fff; box-shadow: 0 24px 48px -32px rgba(20, 60, 40, .45); overflow: hidden; }
.public-page .batch-preview figcaption { padding: 10px 16px; border-bottom: 1px solid #e3eee8; background: #f6faf8; color: #4d5c55; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; }
.public-page .batch-preview figcaption span { margin-right: 8px; color: #c5d3cb; letter-spacing: 2px; }
.public-page .batch-preview table { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.public-page .batch-preview th { padding: 10px 14px; background: #eef7f2; color: #146c43; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-align: left; text-transform: uppercase; }
.public-page .batch-preview td { padding: 11px 14px; border-top: 1px solid #e3eee8; color: #1d2723; white-space: nowrap; }
.public-page .batch-preview .pv-tag { font-size: 12px; }
.public-page .batch-preview .batch-tag--muted { background: #f0f3f2; color: #4d5c55; }
.public-page .batch-preview .batch-tag--fake { background: #fef3f2; color: #b42318; }

/* Before you upload: one row under the facts strip. */
.public-page .batch-before { margin-top: 32px; }
.public-page .batch-before .batch-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 0 32px; padding: 24px 24px 0; box-shadow: none; overflow: hidden; }
.public-page .batch-before .batch-card h2 { grid-column: 1; margin: 0; font-size: 20px !important; }
.public-page .batch-before .public-detail-list { grid-column: 2; grid-row: 1 / span 2; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0 0 16px; }
.public-page .batch-before .public-detail-list > div { padding: 0; border: 0; }
.public-page .batch-before .batch-card > p:not(.batch-card-secure):not(.pv-arrow-line) { grid-column: 1; margin: 8px 0 16px; }
.public-page .batch-before .batch-card p.batch-card-secure { grid-column: 1 / -1; display: flex; align-items: center; margin: 0 -24px; padding: 14px 24px 14px 50px; border-top: 1px solid #e3eee8; background: #f6faf8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23146c43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") 24px center / 16px no-repeat; }
.public-page .batch-before .batch-card p.pv-arrow-line { grid-column: 1 / -1; margin: 0 -24px; padding: 0 24px 14px 50px; background: #f6faf8; }
@media (max-width: 960px) {
  .public-page .batch-before .batch-card { grid-template-columns: minmax(0, 1fr); }
  .public-page .batch-before .batch-card h2, .public-page .batch-before .public-detail-list, .public-page .batch-before .batch-card > p:not(.batch-card-secure):not(.pv-arrow-line) { grid-column: 1; grid-row: auto; }
  .public-page .batch-before .batch-card h2 { margin-bottom: 14px; }
}
@media (max-width: 640px) {
  .public-page .batch-before .public-detail-list { grid-template-columns: minmax(0, 1fr); }
  .public-page .batch-before .batch-card { padding: 20px 20px 0; }
  .public-page .batch-before .batch-card p.batch-card-secure, .public-page .batch-before .batch-card p.pv-arrow-line { margin: 0 -20px; padding-left: 46px; padding-right: 20px; background-position: 20px center; }
  .public-page .batch-preview td, .public-page .batch-preview th { padding: 9px 10px; }
  .public-page .batch-preview { overflow-x: auto; }
}