/* Home mais limpa. Pedido do proprietario em 02/10/2026: "a home le como contrato".
   Tres pilares, tres desenhos de regra em SVG,
   tabela de precos so com numeros e o codigo da clausula em link pequeno.
   Tudo aqui vale so para a home (.ord-home) e nada se move: sem animation,
   sem transform. As cores vem dos tokens do site, que mudam por escopo. */

.ord-home .ord-vh { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }


/* Pilares: reaproveitam o cartao escuro aprovado em 01/10; o link de prova fica pequeno. */

/* Desenhos de regra */
.ord-home .ord-rule-figs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0 0 8px; }
.ord-home .ord-rule-fig { display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 20px 20px 12px; background: #fffdf9; border: 1px solid #d8c9ad; border-radius: var(--ra-10); box-shadow: 0 3px 10px rgba(21,34,53,.05); color: var(--ink-inverse); }
.ord-home .ord-rule-fig-title { margin: 0 0 12px; font-size: var(--fs-16); line-height: 1.35; font-weight: var(--fw-700); color: var(--ink-inverse); }
.ord-home .ord-rule-svg { display: block; width: 100%; height: auto; margin-block: auto; overflow: visible; }
.ord-home .ord-rule-svg .r-eq { fill: none; stroke: var(--ink-inverse); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.ord-home .ord-rule-svg .r-fixed { fill: none; stroke: var(--gold); stroke-width: 3; }
.ord-home .ord-rule-svg .r-trail { fill: none; stroke: var(--why-ink-3); stroke-width: 1.6; stroke-dasharray: 5 4; }
.ord-home .ord-rule-svg .r-ref { fill: none; stroke: var(--border-dark); stroke-width: 1; stroke-dasharray: 2 3; }
.ord-home .ord-rule-svg .r-axis { fill: none; stroke: var(--border-dark); stroke-width: 1.5; }
.ord-home .ord-rule-svg .r-hit { fill: #fffdf9; stroke: var(--ink-inverse); stroke-width: 2; }
.ord-home .ord-rule-svg .r-bar { fill: var(--ink-inverse); }
.ord-home .ord-rule-svg .r-dot { fill: var(--ink-inverse); }
.ord-home .ord-rule-svg .r-dot-pay { fill: var(--gold); }
.ord-home .ord-rule-svg .r-txt { fill: var(--ink-inverse-muted); font-family: var(--font-sans); font-size: var(--fs-12); font-weight: var(--fw-500); }
.ord-home .ord-rule-svg .r-txt-strong { fill: var(--ink-inverse); font-family: var(--font-sans); font-size: var(--fs-12); font-weight: var(--fw-700); }
.ord-home .ord-rule-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 12px 0 0; padding: 0; list-style: none; font-size: var(--fs-12); line-height: 1.4; color: var(--ink-inverse-muted); }
.ord-home .ord-rule-legend li { display: inline-flex; align-items: center; gap: 6px; }
.ord-home .ord-rule-legend i { display: inline-block; width: 18px; height: 0; border-top: 2px solid var(--ink-inverse); }
.ord-home .ord-rule-legend i.l-fixed { border-top: 3px solid var(--gold); }
.ord-home .ord-rule-legend i.l-trail { border-top: 2px dashed var(--why-ink-3); }
.ord-home .ord-rule-fig figcaption { padding-top: 12px; font-size: var(--fs-14); line-height: 1.5; color: var(--ink-inverse-muted); }
.ord-home .ord-rule-ref { display: inline-flex; align-items: center; min-height: 32px; margin-top: 4px; color: var(--gold); font-size: var(--fs-14); font-weight: var(--fw-600); text-decoration: underline; text-underline-offset: 4px; }
.ord-home .ord-rule-ref:hover, .ord-home .ord-rule-ref:focus-visible { text-decoration-thickness: 2px; }

/* Tabela de precos: so numeros. O preco fica no mesmo <td> do botao porque a
   medicao do clique (src/analytics-client.js) le .ord-mx-price dentro do td. */
.ord-home .ord-pt-lead { margin: 0 0 16px; color: #475667; font-size: var(--fs-16); }
.ord-home .ord-pt-frame { border: 1px solid rgba(21,34,53,.14); border-radius: var(--ra-10); background: #fffdf9; overflow: hidden; }
.ord-home .ord-pt { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.ord-home .ord-pt th, .ord-home .ord-pt td { padding: 14px 20px; text-align: left; vertical-align: middle; border-bottom: 1px solid rgba(21,34,53,.1); color: var(--ink); font-size: var(--fs-16); }
.ord-home .ord-pt tbody tr:last-child th, .ord-home .ord-pt tbody tr:last-child td { border-bottom: 0; }
.ord-home .ord-pt thead th { padding-block: 12px; background: var(--navy); color: var(--ink-inverse); font-size: var(--fs-12); font-weight: var(--fw-700); letter-spacing: .08em; text-transform: uppercase; }
.ord-home .ord-pt tbody th { font-size: var(--fs-20); font-weight: var(--fw-700); white-space: nowrap; }
.ord-home .ord-pt-wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.ord-home .ord-pt-amount { display: inline-flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.ord-home .ord-pt .ord-mx-price { font-size: var(--fs-20); font-weight: var(--fw-700); color: var(--ink); }
.ord-home .ord-pt-was { color: #586575; font-size: var(--fs-14); }
.ord-site.ord-home #plans .ord-pt .ord-mx-buy { flex: 0 0 auto; width: auto; margin-top: 0; background-color: var(--gold); min-height: 44px; padding-inline: 18px; white-space: nowrap; }
.ord-home .ord-pt-same { display: none; }

.ord-home .ord-pt-note { margin: 12px 0 0; color: #475667; font-size: var(--fs-14); }

/* Regras da conta, dentro do mesmo cartao recolhivel aprovado */
.ord-home .ord-rule-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 32px; margin: 4px 0 16px; padding: 0; list-style: none; }
.ord-home .ord-rule-list li { margin: 0; color: #475667; font-size: var(--fs-14); line-height: 1.5; }
.ord-home .ord-rule-list strong { display: block; margin-bottom: 2px; color: var(--ink); font-size: var(--fs-16); }
.ord-home #plans .ord-rule-list a.ord-rule-ref { display: inline-flex; min-height: 32px; color: #785b36; }

/* Codigo da clausula embaixo do cartao da garantia */
.ord-home .ord-clause-link { display: inline-flex; align-items: center; min-height: 32px; margin-top: 8px; color: inherit; font-size: var(--fs-14); font-weight: var(--fw-600); text-decoration: underline; text-decoration-color: currentColor; text-underline-offset: 4px; opacity: .85; }
.ord-home .ord-clause-link:hover, .ord-home .ord-clause-link:focus-visible { opacity: 1; text-decoration-thickness: 2px; }

@media (max-width: 1080px) {
  .ord-home .ord-rule-figs { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
}
@media (max-width: 760px) {
  .ord-home .ord-pt-same { display: block; margin: -4px 0 12px; color: #475667; font-size: var(--fs-14); }
  .ord-home .ord-rule-list { grid-template-columns: minmax(0, 1fr); }
  .ord-home .ord-pt-frame { border: 0; background: transparent; overflow: visible; }
  .ord-home .ord-pt thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ord-home .ord-pt, .ord-home .ord-pt tbody { display: block; }
  .ord-home .ord-pt tbody tr { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin: 0 0 10px; padding: 14px 16px; border: 1px solid rgba(21,34,53,.14); border-radius: var(--ra-10); background: #fffdf9; }
  .ord-home .ord-pt tbody th, .ord-home .ord-pt tbody td { display: block; padding: 0; border: 0; }
  /* Os tres limites sao iguais em todo tamanho: no telefone saem uma vez, na linha .ord-pt-same. */
  .ord-home .ord-pt td[data-label] { display: none; }
}
