/*
 * Escala tipografica fluida da LP de planilhas.
 * Carregada depois de planilhas.css para manter os breakpoints compactos
 * existentes e ampliar a leitura progressivamente em telas de desktop.
 */

@media (min-width: 681px) {
  .section-intro.centered > .eyebrow {
    width: 100%;
    max-width: none;
    justify-content: center;
  }
}

@media (min-width: 1024px) {
  :root {
    --content: 1320px;
    --lp-text-xs: clamp(0.6875rem, 0.58rem + 0.18vw, 0.8125rem);
    --lp-text-sm: clamp(0.8125rem, 0.68rem + 0.22vw, 0.9375rem);
    --lp-text-base: clamp(0.9375rem, 0.8rem + 0.22vw, 1.0625rem);
    --lp-text-md: clamp(1rem, 0.75rem + 0.4vw, 1.25rem);
    --lp-text-lg: clamp(1.1875rem, 0.98rem + 0.34vw, 1.4375rem);
    --lp-ui-xs: clamp(0.5625rem, 0.48rem + 0.14vw, 0.6875rem);
    --lp-ui-sm: clamp(0.6875rem, 0.58rem + 0.18vw, 0.8125rem);
  }

  body {
    font-size: var(--lp-text-base);
  }

  h2 {
    font-size: clamp(2.25rem, 1.9rem + 0.7vw, 3rem);
  }

  h3 {
    font-size: var(--lp-text-lg);
  }

  .section-intro > p,
  .section-intro > div > p:not(.eyebrow) {
    max-width: 38rem;
    font-size: var(--lp-text-base);
    line-height: 1.8;
  }

  .eyebrow,
  .hero .eyebrow {
    font-size: var(--lp-text-xs);
  }

  .header-nav a,
  .header-inner > .button,
  .button,
  .text-link {
    font-size: var(--lp-text-sm);
  }

  .header-inner > .button {
    min-height: 48px;
    padding-inline: 20px;
  }

  .button {
    min-height: 54px;
    padding: 15px 24px;
  }

  .button i {
    font-size: 0.875em;
  }

  .hero-copy h1 {
    font-size: clamp(3rem, 1.65rem + 2.25vw, 4.5rem);
  }

  .hero-lead {
    max-width: 36rem;
    font-size: var(--lp-text-md);
    line-height: 1.75;
  }

  .hero-detail {
    max-width: 34rem;
    font-size: var(--lp-text-base);
    line-height: 1.75;
  }

  .hero-actions > .button,
  .hero-secondary {
    font-size: var(--lp-text-sm);
  }

  .microcopy,
  .hero-footer > .container > span,
  .hero-footer > .container > div {
    font-size: var(--lp-text-xs);
  }

  .window-top,
  .sheet-toolbar,
  .period-chip,
  .chart-heading,
  .hero-demo figcaption,
  .formula-note,
  .sheet-tabs {
    font-size: var(--lp-ui-xs);
  }

  .dashboard-eyebrow,
  .demo-badge,
  .chart-legend,
  .chart-scale,
  .chart-months,
  .mini-table,
  .mini-table .status,
  .hero-demo figcaption > span,
  .formula-note code {
    font-size: clamp(0.5rem, 0.44rem + 0.1vw, 0.625rem);
  }

  .mini-head h2 {
    font-size: clamp(1.4375rem, 1.22rem + 0.35vw, 1.75rem);
  }

  .kpis > div > span,
  .kpis small {
    font-size: var(--lp-ui-xs);
  }

  .kpis strong {
    font-size: clamp(1.0625rem, 0.9rem + 0.28vw, 1.3125rem);
  }

  .pain-section .lead-question {
    font-size: var(--lp-text-md) !important;
  }

  .pain-grid h3,
  .solution-card h3,
  .scenario-grid h3,
  .resources-grid h3,
  .example-title h3 {
    font-size: var(--lp-text-lg);
  }

  .pain-grid p,
  .solution-card p,
  .scenario-grid p,
  .custom-solution p,
  .audience-inner > div > p:not(.eyebrow),
  .examples-list article > p,
  .faq-intro > p:not(.eyebrow),
  .faq-list details > p,
  .contact-copy > p:not(.eyebrow),
  .form-success > p {
    font-size: var(--lp-text-sm);
    line-height: 1.85;
  }

  .section-closing p,
  .process-closing p,
  .showcase-bottom strong,
  .showcase-bottom p {
    font-size: var(--lp-text-sm);
  }

  .item-index,
  .solution-tag,
  .example-title > span,
  .example-flow {
    font-size: var(--lp-text-xs);
  }

  .custom-solution h3 {
    font-size: var(--lp-text-md);
  }

  .custom-solution > .button {
    font-size: var(--lp-text-sm);
  }

  .process-timeline h3 {
    font-size: var(--lp-text-base);
  }

  .process-timeline p,
  .check-list li,
  .technical-note {
    font-size: var(--lp-text-sm);
  }

  .step-number {
    font-size: var(--lp-text-xs);
  }

  .demo-instruction,
  .demo-navigation button,
  .demo-period select,
  .app-charts .chart-heading,
  .distribution > strong,
  .app-table-head,
  .demo-table,
  .demo-empty {
    font-size: var(--lp-ui-sm);
  }

  .sidebar-caption,
  .sidebar-bottom,
  .app-top,
  .chart-unit,
  .bar-chart span,
  .donut-legend,
  .demo-search,
  .demo-search input,
  .demo-table th,
  .product-demo figcaption {
    font-size: var(--lp-ui-xs);
  }

  .app-heading h3 {
    font-size: clamp(1.3125rem, 1.1rem + 0.35vw, 1.625rem);
  }

  .demo-kpis > div > span,
  .demo-kpis small {
    font-size: var(--lp-ui-xs);
  }

  .demo-kpis strong {
    font-size: clamp(1.5rem, 1.28rem + 0.4vw, 1.875rem);
  }

  .donut > span {
    font-size: var(--lp-ui-xs);
  }

  .donut b {
    font-size: var(--lp-text-md);
  }

  .audience-tags li {
    font-size: var(--lp-text-sm);
  }

  .comparison-table {
    font-size: var(--lp-text-base);
  }

  .comparison-table th:first-child,
  .comparison-table td,
  .comparison-table thead th > span {
    font-size: var(--lp-text-sm);
  }

  .comparison-table thead th {
    font-size: var(--lp-text-lg);
  }

  .faq-intro h2,
  .contact-copy h2 {
    font-size: clamp(2.25rem, 1.95rem + 0.6vw, 2.9375rem);
  }

  .faq-list summary {
    font-size: var(--lp-text-base);
  }

  .contact-note p,
  .form-intro > p,
  .form-panel label,
  .form-footnote,
  .form-error,
  .form-success pre,
  .edit-form {
    font-size: var(--lp-text-sm);
  }

  .form-label {
    font-size: var(--lp-text-xs);
  }

  .form-intro h3,
  .form-success h3 {
    font-size: clamp(1.5rem, 1.28rem + 0.38vw, 1.875rem);
  }

  .form-panel input,
  .form-panel select,
  .form-panel textarea {
    min-height: 48px;
    font-size: var(--lp-text-base);
  }

  .footer-main p,
  .footer-main a:not(.brand-link),
  .footer-contact > span,
  .footer-contact .text-link,
  .whatsapp-float {
    font-size: var(--lp-text-sm);
  }

  .footer-bottom {
    font-size: var(--lp-text-xs);
  }
}

@media (min-width: 1500px) {
  :root {
    --content: 1380px;
    --section-space: 112px;
  }

  .hero-inner {
    gap: 86px;
    padding-block: 110px 100px;
  }

  .section-intro {
    margin-bottom: 56px;
  }

  .form-panel {
    padding: 38px;
  }
}

@media (min-width: 1900px) {
  :root {
    --content: 1440px;
    --section-space: 120px;
  }
}

/*
 * Escala mobile voltada à leitura. Os títulos mantêm as medidas originais;
 * apenas textos, controles e metadados recebem mínimos mais confortáveis.
 */
@media (max-width: 680px) {
  :root {
    --lp-mobile-copy: 0.9375rem;
    --lp-mobile-control: 0.875rem;
    --lp-mobile-small: 0.78125rem;
    --lp-mobile-meta: 0.75rem;
  }

  body {
    font-size: 1rem;
    line-height: 1.7;
  }

  .hero-copy h1 {
    font-size: clamp(2.125rem, 9vw, 3rem);
  }

  h2,
  .faq-intro h2 {
    font-size: 1.6875rem;
  }

  .contact-copy h2 {
    font-size: 1.875rem;
  }

  .hero-lead {
    font-size: 1rem;
    line-height: 1.75;
  }

  .hero-detail,
  .section-intro > p,
  .section-intro > div > p:not(.eyebrow),
  .section-intro.centered > p:not(.eyebrow),
  .pain-section .lead-question,
  .pain-grid p,
  .solution-card p,
  .custom-solution p,
  .scenario-grid p,
  .process-timeline p,
  .section-closing p,
  .process-closing p,
  .audience-inner > div > p:not(.eyebrow),
  .examples-list article > p,
  .faq-intro > p:not(.eyebrow),
  .faq-list details > p,
  .contact-copy > p:not(.eyebrow),
  .form-success > p,
  .showcase-bottom p {
    font-size: var(--lp-mobile-copy);
    line-height: 1.75;
  }

  .pain-section .lead-question {
    font-size: var(--lp-mobile-copy) !important;
  }

  .header-nav a,
  .button,
  .hero-actions > .button,
  .hero-secondary,
  .text-link,
  .custom-solution > .button,
  .center-actions > .button,
  .process-closing > .button,
  .showcase-bottom > .button,
  .contact-copy > .button,
  .form-success .button,
  .edit-form {
    font-size: var(--lp-mobile-control);
  }

  .header-inner > .button {
    font-size: var(--lp-mobile-meta);
  }

  .eyebrow,
  .hero .eyebrow,
  .microcopy,
  .hero-footer > .container > span,
  .hero-footer > .container > div,
  .solution-tag,
  .item-index,
  .step-number,
  .example-title > span,
  .example-flow,
  .comparison-hint,
  .product-demo figcaption,
  .hero-demo figcaption,
  .hero-demo figcaption > span {
    font-size: var(--lp-mobile-meta);
    line-height: 1.65;
  }

  .check-list li,
  .technical-note,
  .audience-tags li,
  .faq-list summary,
  .showcase-bottom strong {
    font-size: var(--lp-mobile-control);
    line-height: 1.65;
  }

  .comparison-table th,
  .comparison-table td,
  .comparison-table th:first-child {
    font-size: var(--lp-mobile-small);
  }

  .comparison-table thead th > span {
    font-size: var(--lp-mobile-meta);
  }

  .form-intro > p,
  .form-panel label,
  .form-error,
  .form-success pre,
  .contact-note p {
    font-size: var(--lp-mobile-control);
    line-height: 1.7;
  }

  .form-label,
  .form-footnote {
    font-size: var(--lp-mobile-small);
    line-height: 1.65;
  }

  .form-panel input,
  .form-panel select,
  .form-panel textarea {
    font-size: 1rem !important;
  }

  .footer-main p,
  .footer-main a:not(.brand-link),
  .footer-contact > span,
  .footer-contact .text-link {
    font-size: var(--lp-mobile-control);
    line-height: 1.7;
  }

  .footer-bottom {
    font-size: var(--lp-mobile-small);
    line-height: 1.65;
  }

  .window-top,
  .sheet-toolbar,
  .period-chip,
  .chart-heading,
  .app-top,
  .app-charts .chart-heading,
  .distribution > strong,
  .app-table-head,
  .demo-table,
  .demo-empty,
  .demo-search,
  .demo-search input,
  .demo-navigation button {
    font-size: 0.6875rem;
  }

  .dashboard-eyebrow,
  .demo-badge,
  .kpis > div > span,
  .kpis small,
  .demo-kpis > div > span,
  .demo-kpis small,
  .chart-legend,
  .mini-table,
  .mini-table .status,
  .donut-legend {
    font-size: 0.5625rem;
  }
}

.turnstile-widget {
  width: 100%;
  min-height: 65px;
  margin: 4px 0 16px;
}

.turnstile-widget iframe {
  max-width: 100%;
}