/* Reading hierarchy. Display headings and decorative phone artwork retain their scale. */
:root {
  --type-body:18px;
  --type-compact:17px;
  --type-control:17px;
  --type-label:16px;
  --type-meta:15px;
  --type-caption:14px;
}
body {font-size:var(--type-body)}

/* Section introductions and full prose. */
:root body :is(.section-heading>p,.section-heading>div>p,.condition-intro,
  .hero .hero-description,.conditions-grid>div>p,.faq-grid>div:first-child>p,
  .final-cta p,.service-copy>p:not(.service-name),.situation-item p,.faq-list p,
  .review-card>p,.featured-story>p,.story-list p) {
  font-size:var(--type-body);line-height:1.75;letter-spacing:-.025em;
  word-break:keep-all;overflow-wrap:break-word;
}
:root body :is(.section-heading>p,.section-heading>div>p) {max-width:450px}
:root body .hero .hero-services {font-size:var(--type-meta);line-height:1.6}
:root body .bank-track li {font-size:var(--type-label)}
:root body .sample-note {font-size:var(--type-meta);line-height:1.75}
:root body #play-sample-video {font-size:var(--type-label)}
#how-it-works .demo-avatar {font-size:14px}

/* Controls stay comfortably readable, including narrow mobile inputs. */
:root body :is(.button,.text-link,.desktop-nav,.nav-cta,.mobile-menu a,
  .mobile-menu button,.hero-contact,.hero .hero-actions .primary,
  .hero .hero-actions .text-link,.floating-contact-link,.condition-form>.button,
  .condition-form .amount-presets button,.amount-presets button,
  .estimate-controls select,.service-copy>.button,.situation-item button,
  .faq-grid>div:first-child>.text-link,.ledger-bottom .text-link,
  .more-stories>summary,.estimate-example>summary,.contact-channel) {
  font-size:var(--type-control);line-height:1.5;
}
:root body :is(.button,.hero-contact) {min-height:52px;height:auto;padding-block:13px}
:root body .desktop-nav {font-size:16px;gap:24px}
:root body .nav-cta {font-size:16px;min-height:46px}
:root body .amount-presets button {min-height:42px;padding:8px 5px}
:root body .estimate-controls select {min-height:52px;height:auto;padding-block:13px}
:root body .condition-form .amount-input input {font-size:28px;line-height:1.4}

/* Card titles, lists, and service tabs. */
:root body :is(.rate-card h3,.condition-form h3) {font-size:24px;line-height:1.4}
:root body .rate-card li {font-size:var(--type-compact);line-height:1.7;align-items:flex-start;word-break:keep-all}
:root body .rate-card .text-link {font-size:var(--type-label);line-height:1.5;min-height:44px}
:root body .rate-card-description {font-size:var(--type-meta);line-height:1.7;min-height:2em}
:root body .rate-figure small {font-size:var(--type-caption);line-height:1.5}
:root body .method-tab strong {font-size:23px;line-height:1.45}
:root body .method-tab small {font-size:var(--type-meta);line-height:1.6;margin-top:8px}
:root body .service-copy dl>div {font-size:var(--type-compact);line-height:1.75;grid-template-columns:90px minmax(0,1fr);gap:16px}
:root body .service-name {font-size:var(--type-label);line-height:1.6}

/* Form labels and supporting information. */
:root body :is(.estimate-controls label,.condition-form .estimate-controls label,
  .amount-input>span,.preview-heading,.condition-note strong,.condition-selected,
  .condition-selected span,.estimate-result dl,.estimate-total>span,
  .estimate-example .estimate-total>span,.example-heading,.request-label,
  .estimate-ticket-row,.estimate-ticket-row strong,.prepare-strip strong,
  .audience-notes strong,.ledger-toolbar strong,.review-person strong,
  .scanner-head strong,.scanner-sheet li) {font-size:var(--type-label);line-height:1.65}
:root body :is(.condition-note,.preview-heading>span:last-child,
  #settlement-note,.amount-error,.estimate-disclaimer,.condition-form .estimate-disclaimer,
  .example-caption,.estimate-ticket p,.estimate-ticket-head,.estimate-ticket-head strong,
  .rates-caption,.detail-note,.service-detail .detail-note,.prepare-strip p,
  .audience-notes p,.scanner-sheet h3,.scanner-head span,.scanner-hint,
  .ledger-toolbar>p,.ledger-toolbar>p>span,.ledger-toolbar label,.ledger-bottom p,
  .review-person span,.review-card footer,.more-stories cite,
  .footer-inner>p,.footer nav,#contact-context,.contact-channel small,.contact-note) {
  font-size:var(--type-meta);line-height:1.75;
}
:root body .estimate-ticket-amount-row strong {font-size:22px}
:root body .preview-heading {flex-wrap:wrap;gap:4px 12px}
:root body .estimate-ticket-head {flex-wrap:wrap;gap:6px 12px}
:root body .estimate-ticket-row {gap:12px}
:root body .estimate-ticket-head strong {white-space:normal;text-align:right}
:root body .footer-bottom {font-size:var(--type-caption);line-height:1.75}

/* Process copy uses the shared grid footprint, so larger text cannot jump between steps. */
#how-it-works .steps article h3 {font-size:24px;line-height:1.4}
#how-it-works .steps article p {font-size:var(--type-compact);line-height:1.7}
#how-it-works :is(.motion-copy>p:last-child,#motion-description) {font-size:var(--type-compact);line-height:1.75}
#how-it-works :is(.player-top,.motion-step-label,.demo-header>div,.chat-message,
  .confirmation-card,.settled p) {font-size:var(--type-label);line-height:1.65}
#how-it-works :is(.player-top>span:last-child,.demo-header>div>span,
  .confirmation-note,.player-time) {font-size:var(--type-caption);line-height:1.6}
#how-it-works .confirmation-card h4 {font-size:18px;line-height:1.5}
#how-it-works .settled strong {font-size:22px}
#how-it-works .chat-message {max-width:94%}
#how-it-works .steps article {min-height:255px}

/* Questions, reviews, and the live ledger. */
:root body :is(.situation-item>summary,.faq-list summary,.comparison-details>summary) {
  font-size:20px;line-height:1.65;gap:16px;
}
:root body .review-person strong {font-size:20px}
:root body .review-card blockquote {font-size:26px;line-height:1.6}
:root body .more-stories blockquote {font-size:var(--type-compact);line-height:1.75}
:root body :is(.compare-table,.compare-table th,.compare-table td) {font-size:var(--type-meta);line-height:1.7}
:root body .ledger-toolbar select {font-size:16px;min-height:44px}
:root body .transaction-table :is(th,td) {font-size:var(--type-meta);line-height:1.6}
:root body .transaction-table td:nth-child(3) {font-size:18px}
:root body .transaction-status {font-size:var(--type-caption);line-height:1.5}

@media (max-width:1100px) and (min-width:761px) {
  :root body .desktop-nav {gap:16px;font-size:15px}
  :root body .rate-cards {grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}
}
@media (max-width:760px) {
  :root {
    --type-body:16px;
    --type-compact:16px;
    --type-control:16px;
    --type-label:16px;
    --type-meta:14px;
    --type-caption:14px;
  }
  :root body :is(.rate-card h3,.condition-form h3) {font-size:21px}
  :root body .method-tab strong {font-size:20px}
  :root body .service-copy dl>div {grid-template-columns:76px minmax(0,1fr);gap:12px}
  :root body .rate-card li {font-size:15px}
  :root body .rate-card .text-link {font-size:15px}
  :root body :is(.situation-item>summary,.faq-list summary,.comparison-details>summary) {font-size:18px}
  :root body .review-card blockquote {font-size:24px}
  :root body .review-person strong {font-size:18px}
  :root body .condition-form .amount-input input {font-size:26px}
  :root body .floating-contact-link {height:56px}
  :root body .footer nav {flex-wrap:wrap;gap:16px 24px}
  :root body .ledger-toolbar {flex-wrap:wrap;gap:16px}
  :root body .transaction-table td:nth-child(3) {font-size:17px}
  #how-it-works .steps article {grid-template-columns:48px 32px minmax(0,1fr);gap:10px;min-height:132px;padding:16px 14px}
  #how-it-works .steps article h3 {font-size:20px}
  #how-it-works .steps article p br {display:none}
  #how-it-works .steps article>img {width:48px}
}
@media (max-width:380px) {
  :root body .rate-cards {grid-template-columns:1fr;gap:32px}
  :root body .rate-card h3 {font-size:22px}
  :root body .rate-card li {font-size:16px}
  :root body .hero .hero-services {font-size:14px;max-width:270px}
  :root body .method-tab strong {font-size:18px}
  :root body .hero-contact {padding-inline:10px;gap:8px}
  :root body .floating-contact-link {gap:6px;padding-inline:8px}
  :root body .condition-form {padding-inline:18px}
}
