/* Tably: base compartilhada (tokens da identidade visual v1.0) */
:root {
  --g: #059669; --gd: #047857; --m: #34D399; --l: #6EE7B7; --mint: #D1FAE5; --graf: #0F172A; --red: #DC2626;
  --bg: #F6F7F9; --card: #FFFFFF; --ink: #0F172A; --muted: #64748B; --line: #E2E8F0; --soft: #EEF2F6;
  --shadow: 0 1px 2px rgba(15,23,42,.04), 0 12px 32px -12px rgba(15,23,42,.14);
  --radius: 20px;
  --font-title: "Sora", system-ui, sans-serif;
  --font-text: "Plus Jakarta Sans", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --bg: #0B0F17; --card: #131A26; --ink: #F1F5F9; --muted: #94A3B8; --line: #1F2A3B; --soft: #182131; --shadow: 0 1px 2px rgba(0,0,0,.3), 0 16px 40px -16px rgba(0,0,0,.6); }
}
:root[data-theme="dark"] { --bg: #0B0F17; --card: #131A26; --ink: #F1F5F9; --muted: #94A3B8; --line: #1F2A3B; --soft: #182131; --shadow: 0 1px 2px rgba(0,0,0,.3), 0 16px 40px -16px rgba(0,0,0,.6); }

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { background: var(--bg); color: var(--ink); font-family: var(--font-text); line-height: 1.55; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img, svg { display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
:focus-visible { outline: 3px solid var(--m); outline-offset: 3px; border-radius: 8px; }
::selection { background: var(--mint); color: var(--graf); }

.wrap { max-width: 1160px; margin: 0 auto; padding: 0 20px; }
@media (max-width: 480px) { .wrap { padding: 0 16px; } }

.eyebrow { font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--g); }
.h-title { font-family: var(--font-title); font-weight: 800; letter-spacing: -.03em; line-height: 1.04; }
.muted { color: var(--muted); }

/* Lockup */
.lockup { display: inline-flex; align-items: center; gap: calc(var(--fs) * .32); }
.wm { font-family: var(--font-title); font-weight: 700; font-size: var(--fs); letter-spacing: -.03em; line-height: 1; }

/* Botões */
.btn { --bh: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: var(--bh); padding: 0 24px; border-radius: 999px; font-weight: 700; font-size: 15.5px; white-space: nowrap; position: relative; overflow: hidden; isolation: isolate; transition: translate .2s ease, box-shadow .2s ease, background-color .2s ease; }
.btn svg { flex-shrink: 0; }
.btn-primary { background: var(--g); color: #fff; box-shadow: 0 10px 24px -10px rgba(5,150,105,.7); }
.btn-primary::before { content: ""; position: absolute; inset: 0; background: var(--gd); transform: translateY(101%); transition: transform .35s cubic-bezier(.2,.8,.2,1); z-index: -1; }
.btn-primary:hover::before { transform: translateY(0); }
.btn-primary:hover { translate: 0 -2px; box-shadow: 0 16px 30px -12px rgba(5,150,105,.8); }
.btn-ghost { border: 1.5px solid var(--line); background: var(--card); color: var(--ink); }
.btn-ghost:hover { border-color: var(--g); color: var(--g); translate: 0 -2px; }
.btn-dark { background: var(--graf); color: #fff; }
.btn-dark:hover { translate: 0 -2px; background: #1E293B; }
.btn-white { background: #fff; color: var(--graf); }
.btn-white:hover { translate: 0 -2px; background: var(--mint); }
.btn-sm { --bh: 42px; padding: 0 18px; font-size: 14px; }
.btn .arrow { transition: transform .25s ease; }
.btn:hover .arrow { transform: translateX(4px); }

/* Mini planilha */
.sheet { background: #fff; border-radius: 12px; overflow: hidden; font-size: 12.5px; color: #0F172A; border: 1px solid #E2E8F0; font-variant-numeric: tabular-nums; }
.sheet .r { display: grid; grid-template-columns: 1.3fr 1fr 1fr; }
.sheet .r > span { padding: 8px 10px; border-right: 1px solid #E2E8F0; border-bottom: 1px solid #E2E8F0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; }
.sheet .r > span:last-child { border-right: 0; }
.sheet .r:last-child > span { border-bottom: 0; }
.sheet .h > span { background: #059669; color: #fff; font-weight: 700; border-color: #047857; }
.sheet .pos { color: #059669; font-weight: 700; }
.sheet .neg { color: #DC2626; font-weight: 700; }

/* Preço */
.price-old { text-decoration: line-through; color: var(--muted); font-weight: 600; }
.price-new { font-family: var(--font-title); font-weight: 800; letter-spacing: -.02em; }

/* Tags */
.pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.pill-mint { background: var(--mint); color: var(--gd); }
.pill-soft { background: var(--soft); color: var(--muted); }

/* Lottie containers */
.lottie svg { width: 100% !important; height: 100% !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}