@charset "utf-8";

/*
 * SITEWIDE TABELA GLOSS THEME
 *
 * The homepage's approved warm-paper, dark-ink, lime-accent direction is the
 * visual source of truth. This layer extends that system with polished glass,
 * gloss, light, and restrained sparkle on every other public page without
 * changing the homepage art direction itself.
 */

body.site-tabela:not(.home-tabela) {
  --tm-paper: #f6f6f1;
  --tm-paper-soft: #ecece6;
  --tm-card: rgba(255, 255, 255, 0.82);
  --tm-card-solid: #ffffff;
  --tm-ink: #101010;
  --tm-muted: #5b5b56;
  --tm-dark: #252525;
  --tm-dark-soft: #30302e;
  --tm-lime: #e6ff00;
  --tm-lime-deep: #d8ed19;
  --tm-line: rgba(16, 16, 16, 0.13);
  --tm-glass-line: rgba(255, 255, 255, 0.76);
  --tm-glow: rgba(230, 255, 0, 0.34);
  --tm-radius: clamp(1.15rem, 2vw, 1.75rem);
  --tm-shadow: 0 1.7rem 4.4rem rgba(30, 30, 24, 0.12),
    0 0 0 1px rgba(255, 255, 255, 0.54) inset;
  --ink: var(--tm-ink);
  --ink-soft: var(--tm-muted);
  --paper: var(--tm-paper);
  --paper-blue: var(--tm-paper-soft);
  --panel: rgba(255, 255, 255, 0.9);
  --line: var(--tm-line);
  --blue: var(--tm-dark);
  --blue-strong: #000;
  --violet: #54544f;
  --mint: var(--tm-lime-deep);
  --gold: var(--tm-lime);
  --shadow: var(--tm-shadow);
  --round: var(--tm-radius);
  position: relative;
  isolation: isolate;
  min-height: 100dvh;
  color: var(--tm-ink);
  background:
    radial-gradient(circle at 7% 2%, rgba(230, 255, 0, 0.28), transparent 24rem),
    radial-gradient(circle at 91% 10%, rgba(255, 255, 255, 0.96), transparent 28rem),
    radial-gradient(circle at 72% 46%, rgba(194, 208, 255, 0.18), transparent 25rem),
    linear-gradient(180deg, #f8f8f3 0%, #f0f0e9 50%, #f7f7f1 100%);
  background-attachment: fixed;
}

body.site-tabela:not(.home-tabela)::before {
  position: fixed;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% 14%, rgba(255, 255, 255, 0.95) 0 0.12rem, transparent 0.17rem),
    radial-gradient(circle at 88% 18%, rgba(230, 255, 0, 0.8) 0 0.1rem, transparent 0.16rem),
    radial-gradient(circle at 67% 37%, rgba(255, 255, 255, 0.9) 0 0.08rem, transparent 0.14rem),
    radial-gradient(circle at 23% 62%, rgba(255, 255, 255, 0.78) 0 0.09rem, transparent 0.15rem),
    radial-gradient(circle at 94% 74%, rgba(230, 255, 0, 0.62) 0 0.11rem, transparent 0.17rem);
  opacity: 0.78;
  content: "";
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.72) 52%, transparent 92%);
}

body.site-tabela:not(.home-tabela) > main,
body.site-tabela:not(.home-tabela) > .site-footer {
  position: relative;
  z-index: 1;
}

body.site-tabela:not(.home-tabela) ::selection {
  background: var(--tm-lime);
  color: var(--tm-ink);
}

body.site-tabela:not(.home-tabela) a {
  color: var(--tm-ink);
  text-decoration-color: rgba(16, 16, 16, 0.32);
}

body.site-tabela:not(.home-tabela) a:hover {
  color: var(--tm-ink);
  text-decoration-color: currentColor;
}

body.site-tabela:not(.home-tabela) a:focus-visible,
body.site-tabela:not(.home-tabela) button:focus-visible {
  outline-color: #b9cf00;
}

body.site-tabela:not(.home-tabela) h1,
body.site-tabela:not(.home-tabela) h2,
body.site-tabela:not(.home-tabela) h3,
body.site-tabela:not(.home-tabela) strong {
  color: var(--tm-ink);
}

body.site-tabela:not(.home-tabela) p,
body.site-tabela:not(.home-tabela) li {
  color: var(--tm-muted);
}

body.site-tabela:not(.home-tabela) .shell {
  width: min(78rem, calc(100% - 3rem));
}

/* Navigation -------------------------------------------------------------- */
body.site-tabela:not(.home-tabela) .site-header {
  border-bottom-color: rgba(255, 255, 255, 0.72);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(246, 246, 241, 0.72));
  box-shadow: 0 1px 0 rgba(16, 16, 16, 0.07), 0 0.8rem 2.6rem rgba(30, 30, 24, 0.07);
  backdrop-filter: blur(1.35rem) saturate(155%);
}

body.site-tabela:not(.home-tabela) .header-row {
  min-height: 4.8rem;
}

body.site-tabela:not(.home-tabela) .brand {
  color: var(--tm-ink);
  font-size: 1.03rem;
  letter-spacing: -0.02em;
}

body.site-tabela:not(.home-tabela) .brand-mark {
  display: block;
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
}

body.site-tabela:not(.home-tabela) .primary-nav {
  gap: 0.12rem;
  font-size: 0.84rem;
}

body.site-tabela:not(.home-tabela) .primary-nav a {
  display: inline-flex;
  min-height: 2.35rem;
  align-items: center;
  padding: 0 0.72rem;
  border-radius: 999px;
  color: #383834;
  text-decoration: none;
  white-space: nowrap;
}

body.site-tabela:not(.home-tabela) .primary-nav a:hover,
body.site-tabela:not(.home-tabela) .primary-nav a[aria-current="page"] {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(231, 231, 224, 0.9));
  box-shadow: 0 0 0 1px rgba(16, 16, 16, 0.06), 0 0.38rem 1rem rgba(30, 30, 24, 0.07);
  color: var(--tm-ink);
}

body.site-tabela:not(.home-tabela) .primary-nav .nav-trial {
  margin-left: 0.35rem;
  padding-inline: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.78);
  background: linear-gradient(180deg, #3c3c39 0%, #181817 58%, #050505 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.24) inset, 0 0.65rem 1.4rem rgba(16, 16, 16, 0.2);
  color: #fff;
}

body.site-tabela:not(.home-tabela) .primary-nav .nav-trial:hover {
  background: #000;
  color: #fff;
}

body.site-tabela:not(.home-tabela) .status-pill {
  margin-left: 0.28rem;
  border-color: rgba(16, 16, 16, 0.12);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(239, 239, 232, 0.82));
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95) inset, 0 0.35rem 1rem rgba(30, 30, 24, 0.07);
  color: #41413d;
  letter-spacing: 0.035em;
}

body.site-tabela:not(.home-tabela) .status-pill::before,
body.site-tabela:not(.home-tabela):root[data-release-state="public"] .status-pill::before {
  background: var(--tm-lime-deep);
  box-shadow: 0 0 0 0.2rem rgba(216, 237, 25, 0.2);
}

body.site-tabela:not(.home-tabela) .nav-toggle {
  border-color: var(--tm-line);
  border-radius: 999px;
  background: linear-gradient(145deg, #fff, #ecece6);
  box-shadow: 0 1px 0 #fff inset, 0 0.45rem 1.1rem rgba(30, 30, 24, 0.09);
  color: var(--tm-ink);
}

/* Type, page headers, and content ---------------------------------------- */
body.site-tabela:not(.home-tabela) .eyebrow {
  color: #51514d;
  letter-spacing: 0.09em;
}

body.site-tabela:not(.home-tabela) .page-hero,
body.site-tabela:not(.home-tabela) .article-header {
  position: relative;
  isolation: isolate;
  max-width: 57rem;
  padding-top: clamp(4.4rem, 8vw, 7.6rem);
  padding-bottom: clamp(2.6rem, 5vw, 4rem);
}

body.site-tabela:not(.home-tabela) .page-hero::before,
body.site-tabela:not(.home-tabela) .article-header::before {
  position: absolute;
  z-index: 0;
  top: clamp(1rem, 3vw, 2.5rem);
  right: clamp(-18rem, -15vw, -8rem);
  width: clamp(20rem, 42vw, 34rem);
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, 0.76);
  border-radius: 50%;
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.98), transparent 18%),
    radial-gradient(circle at 48% 48%, rgba(230, 255, 0, 0.34), transparent 43%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.03));
  box-shadow: 0 0 5rem rgba(230, 255, 0, 0.13), 0 0 0 1px rgba(255, 255, 255, 0.34) inset;
  opacity: 0.72;
  pointer-events: none;
  content: "";
}

body.site-tabela:not(.home-tabela) .page-hero > *,
body.site-tabela:not(.home-tabela) .article-header > * {
  position: relative;
  z-index: 1;
}

body.site-tabela:not(.home-tabela) .page-hero::after,
body.site-tabela:not(.home-tabela) .article-header::after {
  display: block;
  width: 4.6rem;
  height: 0.42rem;
  margin-top: 2rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #d7eb18 0%, var(--tm-lime) 45%, #f7ff9d 100%);
  box-shadow: 0 0.45rem 1.4rem var(--tm-glow), 0 1px 0 rgba(255, 255, 255, 0.9) inset;
  content: "";
}

body.site-tabela:not(.home-tabela) .page-hero > .eyebrow::after,
body.site-tabela:not(.home-tabela) .article-header > .eyebrow::after {
  display: inline-block;
  margin-left: 0.5rem;
  color: #adbf00;
  text-shadow: 0 0 0.75rem rgba(230, 255, 0, 0.82);
  content: "✦";
  animation: tm-sparkle-pulse 3.4s ease-in-out infinite;
}

body.site-tabela:not(.home-tabela) .page-hero h1,
body.site-tabela:not(.home-tabela) .article-header h1 {
  max-width: 13ch;
  margin-bottom: 1.15rem;
  font-size: clamp(3.1rem, 6vw, 5.75rem);
  font-weight: 820;
  letter-spacing: -0.058em;
  line-height: 0.98;
}

body.site-tabela:not(.home-tabela) .page-hero > p:not(.eyebrow),
body.site-tabela:not(.home-tabela) .article-deck {
  max-width: 48rem;
  font-size: clamp(1.08rem, 1.55vw, 1.25rem);
  line-height: 1.58;
}

/* This 48rem rule is more specific than the base scene-aware rule, so every
   opening text block has to be capped here or an article deck/meta line can
   run under the artwork. .page-scene is anchored at left: 59%. */
@media (min-width: 56.01rem) {
  body.site-tabela:not(.home-tabela) .page-hero:has(.page-scene),
  body.site-tabela:not(.home-tabela) .article-header:has(.page-scene) {
    width: 100%;
    max-width: none;
  }

  body.site-tabela:not(.home-tabela) .page-hero:has(.page-scene) > h1,
  body.site-tabela:not(.home-tabela) .page-hero:has(.page-scene) > p:not(.eyebrow),
  body.site-tabela:not(.home-tabela) .article-header:has(.page-scene) > h1,
  body.site-tabela:not(.home-tabela) .article-header:has(.page-scene) > .article-deck,
  body.site-tabela:not(.home-tabela) .article-header:has(.page-scene) > .article-meta {
    max-width: min(48rem, 56%);
  }
}

body.site-tabela:not(.home-tabela) .article-meta,
body.site-tabela:not(.home-tabela) .resource-card__eyebrow {
  color: var(--mm-muted);
  font-weight: 780;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

body.site-tabela:not(.home-tabela) .prose h2 {
  max-width: 25ch;
  margin-top: 3.4rem;
  font-size: clamp(1.8rem, 3vw, 2.65rem);
  letter-spacing: -0.043em;
}

body.site-tabela:not(.home-tabela) .prose h3 {
  font-size: 1.28rem;
}

body.site-tabela:not(.home-tabela) .prose p,
body.site-tabela:not(.home-tabela) .prose li {
  max-width: 46rem;
  font-size: 1.01rem;
}

body.site-tabela:not(.home-tabela) .prose code {
  border: 1px solid rgba(16, 16, 16, 0.12);
  border-radius: 0.38rem;
  background: #ecece6;
  color: var(--tm-ink);
}

/* Cards and screenshot proof --------------------------------------------- */
body.site-tabela:not(.home-tabela) .page-card,
body.site-tabela:not(.home-tabela) .resource-card,
body.site-tabela:not(.home-tabela) .release-note,
body.site-tabela:not(.home-tabela) .doc-section {
  border-color: var(--tm-line);
  border-radius: var(--tm-radius);
  border-color: rgba(255, 255, 255, 0.78);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.7)),
    radial-gradient(circle at 100% 0%, rgba(230, 255, 0, 0.13), transparent 42%);
  box-shadow: var(--tm-shadow), 0 0 0 1px rgba(16, 16, 16, 0.075);
  backdrop-filter: blur(0.8rem) saturate(130%);
}

body.site-tabela:not(.home-tabela) .page-aside {
  border-top: 0.32rem solid var(--tm-lime);
  box-shadow: var(--tm-shadow), 0 0 2rem rgba(230, 255, 0, 0.1);
}

body.site-tabela:not(.home-tabela) .resource-grid {
  gap: 1.15rem;
  padding-bottom: clamp(3.8rem, 7vw, 6.1rem);
}

body.site-tabela:not(.home-tabela) .resource-card {
  position: relative;
  min-height: 18rem;
  padding: clamp(1.45rem, 3vw, 2rem);
  overflow: hidden;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

body.site-tabela:not(.home-tabela) .resource-card::before {
  width: 2.6rem;
  height: 0.34rem;
  margin-bottom: 1.35rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #cfe419, var(--tm-lime), #f7ff9d);
  box-shadow: 0 0.35rem 1rem var(--tm-glow);
  content: "";
}

body.site-tabela:not(.home-tabela) .resource-card::after {
  position: absolute;
  top: -7rem;
  right: -7rem;
  width: 15rem;
  height: 15rem;
  border: 1px solid rgba(255, 255, 255, 0.74);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, rgba(255, 255, 255, 0.96), rgba(230, 255, 0, 0.12) 34%, transparent 66%);
  opacity: 0.68;
  pointer-events: none;
  content: "";
}

body.site-tabela:not(.home-tabela) .resource-card > * {
  position: relative;
  z-index: 1;
}

body.site-tabela:not(.home-tabela) .resource-card:hover {
  transform: translateY(-0.34rem);
  border-color: rgba(230, 255, 0, 0.52);
  box-shadow: 0 2rem 5rem rgba(30, 30, 24, 0.16), 0 0 2.4rem rgba(230, 255, 0, 0.12),
    0 0 0 1px rgba(255, 255, 255, 0.76) inset;
}

body.site-tabela:not(.home-tabela) .resource-card h2 {
  max-width: 18ch;
  font-size: clamp(1.55rem, 2.3vw, 2rem);
  line-height: 1.02;
}

body.site-tabela:not(.home-tabela) .resource-card h2 a,
body.site-tabela:not(.home-tabela) .text-link {
  color: var(--tm-ink);
}

body.site-tabela:not(.home-tabela) .text-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: var(--tm-lime-deep);
  text-decoration-thickness: 0.2rem;
}

body.site-tabela:not(.home-tabela) .shot-frame {
  position: relative;
  overflow: hidden;
  border-color: rgba(255, 255, 255, 0.82);
  border-radius: var(--tm-radius);
  box-shadow: 0 1.8rem 4.8rem rgba(30, 30, 24, 0.17), 0 0 0 1px rgba(16, 16, 16, 0.14);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(237, 237, 230, 0.76));
}

body.site-tabela:not(.home-tabela) .shot-frame::after {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 8%;
  left: 8%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.98), transparent);
  pointer-events: none;
  content: "";
}

body.site-tabela:not(.home-tabela) .shot-frame figcaption {
  border-top-color: var(--tm-line);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(246, 246, 241, 0.9));
}

body.site-tabela:not(.home-tabela) .doc-section {
  margin-bottom: 1rem;
  overflow: hidden;
}

body.site-tabela:not(.home-tabela) .doc-summary {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(242, 242, 235, 0.86));
}

/* Clear conversion moments ------------------------------------------------ */
body.site-tabela:not(.home-tabela) .button {
  min-height: 3.15rem;
  padding-inline: 1.25rem;
  border-radius: 999px;
}

body.site-tabela:not(.home-tabela) .button-primary {
  border-color: var(--tm-dark);
  background: linear-gradient(180deg, #454541 0%, #181817 58%, #050505 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.24) inset, 0 0.9rem 2rem rgba(16, 16, 16, 0.2);
  color: #fff;
}

body.site-tabela:not(.home-tabela) .button-primary:hover {
  background: #000;
  box-shadow: 0 0.8rem 1.8rem rgba(16, 16, 16, 0.18);
  color: #fff;
}

body.site-tabela:not(.home-tabela) .button-secondary {
  border-color: var(--tm-line);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(236, 236, 229, 0.88));
  box-shadow: 0 1px 0 #fff inset, 0 0.65rem 1.6rem rgba(30, 30, 24, 0.08);
  color: var(--tm-ink);
}

body.site-tabela:not(.home-tabela) .button-secondary:hover {
  border-color: rgba(16, 16, 16, 0.32);
  background: #fff;
  color: var(--tm-ink);
}

/* Authority-guide dark surfaces need explicit contrast after the global
 * secondary-page typography colors are applied. */
body.site-tabela:not(.home-tabela) .copy-template h2,
body.site-tabela:not(.home-tabela) .copy-template p,
body.site-tabela:not(.home-tabela) .video-card__body strong {
  color: #fff;
}

body.site-tabela:not(.home-tabela) .copy-template .eyebrow,
body.site-tabela:not(.home-tabela) .video-card__label,
body.site-tabela:not(.home-tabela) .video-card__action {
  color: var(--tm-lime);
}

body.site-tabela:not(.home-tabela) .copy-template > p:not(.eyebrow),
body.site-tabela:not(.home-tabela) .video-card__body > span:last-child {
  color: rgba(255, 255, 255, 0.76);
}

body.site-tabela:not(.home-tabela) .article-callout,
body.site-tabela:not(.home-tabela) .release-callout {
  position: relative;
  overflow: hidden;
  border-color: var(--tm-dark);
  border-radius: var(--tm-radius);
  background:
    radial-gradient(circle at 92% 0%, rgba(230, 255, 0, 0.2), transparent 28%),
    linear-gradient(145deg, #3a3a36 0%, #20201e 48%, #0a0a0a 100%);
  box-shadow: 0 2rem 5rem rgba(16, 16, 16, 0.2), 0 1px 0 rgba(255, 255, 255, 0.14) inset;
}

body.site-tabela:not(.home-tabela) .article-callout::after,
body.site-tabela:not(.home-tabela) .release-callout::after {
  position: absolute;
  top: 1rem;
  right: 1.2rem;
  color: rgba(230, 255, 0, 0.72);
  font-size: 1.35rem;
  text-shadow: 0 0 1rem rgba(230, 255, 0, 0.58);
  pointer-events: none;
  content: "✦";
}

body.site-tabela:not(.home-tabela) .article-callout > *,
body.site-tabela:not(.home-tabela) .release-callout > * {
  position: relative;
  z-index: 1;
}

body.site-tabela:not(.home-tabela) .article-callout h2,
body.site-tabela:not(.home-tabela) .article-callout p,
body.site-tabela:not(.home-tabela) .release-callout h2,
body.site-tabela:not(.home-tabela) .release-callout p {
  color: #fff;
}

body.site-tabela:not(.home-tabela) .article-callout .eyebrow,
body.site-tabela:not(.home-tabela) .release-callout .eyebrow {
  color: var(--tm-lime);
}

body.site-tabela:not(.home-tabela) .article-callout .button-primary,
body.site-tabela:not(.home-tabela) .release-callout .button-primary {
  border-color: var(--tm-lime);
  background: linear-gradient(180deg, #f5ff96 0%, var(--tm-lime) 48%, #cfe419 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.92) inset, 0 0.8rem 2rem rgba(230, 255, 0, 0.2);
  color: var(--tm-ink);
}

body.site-tabela:not(.home-tabela) .article-callout .button-secondary,
body.site-tabela:not(.home-tabela) .release-callout .button-secondary {
  border-color: rgba(255, 255, 255, 0.35);
  background: transparent;
  color: #fff;
}

/* Honest comparison pages retain their tables while using the same brand. */
body.site-tabela:not(.home-tabela) .comparison-section {
  background:
    radial-gradient(circle at 85% 12%, rgba(230, 255, 0, 0.15), transparent 23rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.44), rgba(236, 236, 230, 0.84));
}

body.site-tabela:not(.home-tabela) .comparison-table-wrap {
  border-color: rgba(255, 255, 255, 0.82);
  border-radius: var(--tm-radius);
  box-shadow: var(--tm-shadow), 0 0 0 1px rgba(16, 16, 16, 0.1);
}

body.site-tabela:not(.home-tabela) .comparison-table thead,
body.site-tabela:not(.home-tabela) .comparison-table thead th {
  background: var(--tm-dark);
}

body.site-tabela:not(.home-tabela) .comparison-table thead th:nth-child(2) {
  background: #3b3b37;
}

body.site-tabela:not(.home-tabela) .comparison-table tbody td:nth-child(2) {
  background: rgba(230, 255, 0, 0.14);
}

body.site-tabela:not(.home-tabela) .not-right {
  border-color: rgba(16, 16, 16, 0.28);
  border-radius: var(--tm-radius);
  background: #fff;
}

/* Footer ------------------------------------------------------------------ */
body.site-tabela:not(.home-tabela) .site-footer {
  position: relative;
  margin-top: 0;
  overflow: hidden;
  border: 0;
  background:
    radial-gradient(circle at 14% 0%, rgba(230, 255, 0, 0.18), transparent 25rem),
    radial-gradient(circle at 92% 100%, rgba(255, 255, 255, 0.07), transparent 22rem),
    linear-gradient(145deg, #343431 0%, #1e1e1c 52%, #080808 100%);
  box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.7), 0 -2rem 5rem rgba(30, 30, 24, 0.08);
}

body.site-tabela:not(.home-tabela) .site-footer::before {
  position: absolute;
  top: 2.2rem;
  right: 5%;
  width: 12rem;
  height: 12rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  background: radial-gradient(circle at 36% 32%, rgba(255, 255, 255, 0.16), rgba(230, 255, 0, 0.08) 34%, transparent 68%);
  pointer-events: none;
  content: "";
}

body.site-tabela:not(.home-tabela) .site-footer > .shell {
  position: relative;
  z-index: 1;
}

body.site-tabela:not(.home-tabela) .footer-grid {
  grid-template-columns: minmax(15rem, 1.45fr) repeat(3, minmax(8rem, 0.7fr));
  gap: clamp(1.5rem, 4vw, 4rem);
  padding: clamp(3.5rem, 6vw, 5.5rem) 0 2.7rem;
}

body.site-tabela:not(.home-tabela) .footer-grid h2 {
  margin-bottom: 0.8rem;
  color: var(--tm-lime);
  font-size: 0.78rem;
  letter-spacing: 0.095em;
  text-transform: uppercase;
}

/* `.footer-trial` is excluded because it is a solid lime button, not a plain
   footer link: the muted white below is correct on the dark footer but renders
   near-invisible on lime. Its own colour is set with the button rule further
   down, which would otherwise lose to this later, more specific selector. */
body.site-tabela:not(.home-tabela) .footer-grid p,
body.site-tabela:not(.home-tabela) .footer-grid a:not(.footer-trial),
body.site-tabela:not(.home-tabela) .footer-bottom,
body.site-tabela:not(.home-tabela) .footer-bottom p {
  color: rgba(255, 255, 255, 0.74);
}

body.site-tabela:not(.home-tabela) .footer-grid .brand {
  color: #fff;
}

body.site-tabela:not(.home-tabela) .footer-links {
  gap: 0.58rem;
}

body.site-tabela:not(.home-tabela) .footer-links a {
  width: fit-content;
  text-decoration-color: transparent;
}

body.site-tabela:not(.home-tabela) .footer-links a:hover {
  color: #fff;
  text-decoration-color: var(--tm-lime);
}

body.site-tabela:not(.home-tabela) .footer-trial {
  display: inline-flex;
  min-height: 2.8rem;
  align-items: center;
  margin-top: 0.6rem;
  padding: 0.62rem 1rem;
  border-radius: 999px;
  background: linear-gradient(180deg, #f5ff9b, var(--tm-lime) 52%, #cedf20);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.92) inset, 0 0.8rem 2rem rgba(230, 255, 0, 0.18);
  color: var(--tm-ink);
  font-size: 0.86rem;
  font-weight: 850;
  text-decoration: none;
}

body.site-tabela:not(.home-tabela) .footer-trial,
body.site-tabela:not(.home-tabela) .footer-trial span {
  color: var(--tm-ink);
}

body.site-tabela:not(.home-tabela) .footer-trial:hover,
body.site-tabela:not(.home-tabela) .footer-trial:hover span {
  background: #fff;
  color: var(--tm-ink);
}

body.site-tabela:not(.home-tabela) .footer-bottom {
  border-top-color: rgba(255, 255, 255, 0.14);
}

@keyframes tm-sparkle-pulse {
  0%,
  100% {
    opacity: 0.55;
    transform: scale(0.86) rotate(-8deg);
  }
  50% {
    opacity: 1;
    transform: scale(1.08) rotate(8deg);
  }
}

@media (max-width: 56rem) {
  body.site-tabela:not(.home-tabela) .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.site-tabela:not(.home-tabela) .footer-brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 46rem) {
  body.site-tabela:not(.home-tabela) .shell {
    width: calc(100% - 2.25rem);
  }

  body.site-tabela:not(.home-tabela) .primary-nav a,
  body.site-tabela:not(.home-tabela) .primary-nav a:not(.nav-priority) {
    border: 1px solid rgba(16, 16, 16, 0.08);
    background: #fff;
  }

  body.site-tabela:not(.home-tabela) .primary-nav .nav-trial {
    border-color: var(--tm-dark);
    background: var(--tm-dark);
    color: #fff;
  }

  body.site-tabela:not(.home-tabela) .page-hero,
  body.site-tabela:not(.home-tabela) .article-header {
    padding-top: 3.2rem;
    padding-bottom: 2.3rem;
  }

  body.site-tabela:not(.home-tabela) .page-hero::after,
  body.site-tabela:not(.home-tabela) .article-header::after {
    margin-top: 1.45rem;
  }

  body.site-tabela:not(.home-tabela) .page-hero h1,
  body.site-tabela:not(.home-tabela) .article-header h1 {
    font-size: clamp(2.55rem, 12vw, 3.65rem);
  }

  body.site-tabela:not(.home-tabela) .resource-card {
    min-height: auto;
  }

  body.site-tabela:not(.home-tabela) .footer-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  body.site-tabela:not(.home-tabela) .footer-brand {
    grid-column: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.site-tabela:not(.home-tabela) .page-hero > .eyebrow::after,
  body.site-tabela:not(.home-tabela) .article-header > .eyebrow::after,
  body.site-tabela:not(.home-tabela) .resource-card {
    animation: none;
    transition: none;
  }
}

/* --------------------------------------------------------------------------
   MIND MARSHAL 2026 VISUAL SYSTEM

   The files loaded before this one retain layout and no-JS behavior. This final
   layer owns the public visual language: adaptive light/dark palettes, calm
   glass surfaces, one restrained aurora, and the same interaction treatment on
   the homepage, product documentation, resources, and comparison pages.
   -------------------------------------------------------------------------- */

:root {
  color-scheme: light dark;
  --mm-bg: #f4f6ff;
  --mm-bg-deep: #e9edfb;
  --mm-surface: rgba(255, 255, 255, 0.72);
  --mm-surface-strong: rgba(255, 255, 255, 0.92);
  --mm-surface-solid: #ffffff;
  --mm-ink: #101425;
  --mm-ink-soft: #30384f;
  --mm-muted: #535e78;
  --mm-line: rgba(30, 48, 91, 0.13);
  --mm-line-strong: rgba(44, 73, 142, 0.23);
  --mm-blue: #2b6fff;
  --mm-blue-strong: #1454dc;
  --mm-violet: #7c4dff;
  --mm-cyan: #16bfe5;
  --mm-signal: #b6ed24;
  --mm-signal-ink: #182300;
  --mm-glow-blue: rgba(43, 111, 255, 0.25);
  --mm-glow-violet: rgba(124, 77, 255, 0.2);
  --mm-shadow: 0 1.5rem 4.8rem rgba(42, 57, 105, 0.15);
  --mm-shadow-soft: 0 0.75rem 2.4rem rgba(42, 57, 105, 0.1);
  --mm-radius: 1.5rem;
  --mm-radius-sm: 1rem;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --mm-bg: #070914;
  --mm-bg-deep: #0d1122;
  --mm-surface: rgba(16, 21, 41, 0.72);
  --mm-surface-strong: rgba(20, 26, 50, 0.92);
  --mm-surface-solid: #141a31;
  --mm-ink: #f6f8ff;
  --mm-ink-soft: #d8def0;
  --mm-muted: #a4aec8;
  --mm-line: rgba(184, 199, 241, 0.14);
  --mm-line-strong: rgba(151, 177, 255, 0.27);
  --mm-blue: #77a4ff;
  --mm-blue-strong: #9bbcff;
  --mm-violet: #ad91ff;
  --mm-cyan: #4dd9f4;
  --mm-signal: #c9f855;
  --mm-signal-ink: #142000;
  --mm-glow-blue: rgba(72, 126, 255, 0.32);
  --mm-glow-violet: rgba(148, 100, 255, 0.3);
  --mm-shadow: 0 1.8rem 5.5rem rgba(0, 0, 0, 0.48);
  --mm-shadow-soft: 0 0.8rem 2.7rem rgba(0, 0, 0, 0.3);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --mm-bg: #070914;
    --mm-bg-deep: #0d1122;
    --mm-surface: rgba(16, 21, 41, 0.72);
    --mm-surface-strong: rgba(20, 26, 50, 0.92);
    --mm-surface-solid: #141a31;
    --mm-ink: #f6f8ff;
    --mm-ink-soft: #d8def0;
    --mm-muted: #a4aec8;
    --mm-line: rgba(184, 199, 241, 0.14);
    --mm-line-strong: rgba(151, 177, 255, 0.27);
    --mm-blue: #77a4ff;
    --mm-blue-strong: #9bbcff;
    --mm-violet: #ad91ff;
    --mm-cyan: #4dd9f4;
    --mm-signal: #c9f855;
    --mm-signal-ink: #142000;
    --mm-glow-blue: rgba(72, 126, 255, 0.32);
    --mm-glow-violet: rgba(148, 100, 255, 0.3);
    --mm-shadow: 0 1.8rem 5.5rem rgba(0, 0, 0, 0.48);
    --mm-shadow-soft: 0 0.8rem 2.7rem rgba(0, 0, 0, 0.3);
  }
}

html {
  background: var(--mm-bg);
}

body.site-tabela,
body.site-tabela.home-tabela,
body.site-tabela:not(.home-tabela) {
  --ink: var(--mm-ink);
  --ink-soft: var(--mm-muted);
  --paper: var(--mm-bg);
  --paper-blue: var(--mm-bg-deep);
  --panel: var(--mm-surface-strong);
  --line: var(--mm-line);
  --blue: var(--mm-blue);
  --blue-strong: var(--mm-blue-strong);
  --violet: var(--mm-violet);
  --mint: var(--mm-signal);
  --gold: var(--mm-signal);
  --shadow: var(--mm-shadow);
  --round: var(--mm-radius);
  --tm-paper: var(--mm-bg);
  --tm-paper-soft: var(--mm-bg-deep);
  --tm-card: var(--mm-surface);
  --tm-card-solid: var(--mm-surface-solid);
  --tm-ink: var(--mm-ink);
  --tm-muted: var(--mm-muted);
  --tm-dark: var(--mm-ink);
  --tm-dark-soft: var(--mm-ink-soft);
  --tm-lime: var(--mm-signal);
  --tm-lime-deep: var(--mm-signal);
  --tm-line: var(--mm-line);
  --tm-glass-line: rgba(255, 255, 255, 0.58);
  --tm-glow: rgba(96, 130, 255, 0.25);
  --tm-radius: var(--mm-radius);
  --tm-shadow: var(--mm-shadow);
  position: relative;
  isolation: isolate;
  min-height: 100dvh;
  color: var(--mm-ink);
  background:
    radial-gradient(circle at 8% 2%, rgba(90, 132, 255, 0.24), transparent 31rem),
    radial-gradient(circle at 92% 9%, rgba(147, 91, 255, 0.2), transparent 33rem),
    radial-gradient(circle at 62% 48%, rgba(39, 201, 231, 0.1), transparent 34rem),
    linear-gradient(180deg, var(--mm-bg), var(--mm-bg-deep) 54%, var(--mm-bg));
  background-attachment: fixed;
}

body.site-tabela::before,
body.site-tabela.home-tabela::before,
body.site-tabela:not(.home-tabela)::before {
  position: fixed;
  z-index: -2;
  display: block;
  inset: -22rem -16rem auto;
  height: 44rem;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 48%, var(--mm-glow-blue), transparent 31%),
    radial-gradient(circle at 72% 24%, var(--mm-glow-violet), transparent 34%),
    radial-gradient(circle at 52% 72%, rgba(38, 206, 229, 0.12), transparent 30%);
  filter: blur(2rem);
  opacity: 0.88;
  content: "";
  animation: mm-aurora 18s ease-in-out infinite alternate;
}

body.site-tabela::after {
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(78, 99, 158, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(78, 99, 158, 0.035) 1px, transparent 1px);
  background-size: 3.5rem 3.5rem;
  content: "";
  mask-image: linear-gradient(to bottom, #000, transparent 72%);
}

@keyframes mm-aurora {
  from { transform: translate3d(-2%, -1%, 0) scale(1); }
  to { transform: translate3d(3%, 2%, 0) scale(1.07); }
}

body.site-tabela h1,
body.site-tabela h2,
body.site-tabela h3,
body.site-tabela strong {
  color: var(--mm-ink);
}

body.site-tabela p,
body.site-tabela li,
body.site-tabela dd,
body.site-tabela figcaption {
  color: var(--mm-muted);
}

body.site-tabela a {
  color: var(--mm-blue-strong);
  text-decoration-color: rgba(83, 119, 220, 0.38);
}

body.site-tabela a:hover {
  /* #2b6fff on the light page is 3.99:1, under AA for body text. Keep the
     strong blue and let the underline colour carry the hover signal. */
  color: var(--mm-blue-strong);
  text-decoration-color: currentColor;
}

body.site-tabela ::selection {
  background: var(--mm-blue);
  color: #fff;
}

body.site-tabela .shell,
body.site-tabela.home-tabela .shell,
body.site-tabela:not(.home-tabela) .shell {
  width: min(82rem, calc(100% - 3rem));
}

/* Navigation -------------------------------------------------------------- */
body.site-tabela .site-header,
body.site-tabela.home-tabela .site-header,
body.site-tabela:not(.home-tabela) .site-header {
  top: 0.7rem;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

body.site-tabela .header-row,
body.site-tabela.home-tabela .header-row,
body.site-tabela:not(.home-tabela) .header-row {
  min-height: 4.25rem;
  padding: 0.45rem 0.6rem 0.45rem 0.85rem;
  border: 1px solid var(--mm-line);
  border-radius: 1.35rem;
  background: var(--mm-surface);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset, var(--mm-shadow-soft);
  backdrop-filter: blur(1.35rem) saturate(150%);
}

:root[data-theme="dark"] body.site-tabela .header-row {
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08) inset, var(--mm-shadow-soft);
}

body.site-tabela .brand,
body.site-tabela.home-tabela .brand,
body.site-tabela:not(.home-tabela) .brand {
  color: var(--mm-ink);
  font-weight: 790;
  letter-spacing: -0.035em;
}

body.site-tabela .brand-mark {
  width: 2.1rem;
  height: 2.1rem;
  filter: drop-shadow(0 0.35rem 0.65rem rgba(34, 83, 174, 0.2));
}

body.site-tabela .primary-nav,
body.site-tabela.home-tabela .primary-nav,
body.site-tabela:not(.home-tabela) .primary-nav {
  gap: 0.08rem;
}

body.site-tabela .primary-nav a,
body.site-tabela.home-tabela .primary-nav a,
body.site-tabela:not(.home-tabela) .primary-nav a {
  min-height: 2.35rem;
  padding: 0 0.72rem;
  border: 0;
  border-radius: 0.8rem;
  background: transparent;
  box-shadow: none;
  color: var(--mm-ink-soft);
  font-weight: 700;
}

body.site-tabela .primary-nav a:hover,
body.site-tabela .primary-nav a[aria-current="page"] {
  background: var(--mm-surface-strong);
  box-shadow: 0 0 0 1px var(--mm-line), 0 0.35rem 1rem rgba(37, 65, 133, 0.1);
  color: var(--mm-ink);
}

body.site-tabela .primary-nav .nav-trial,
body.site-tabela.home-tabela .primary-nav .nav-trial,
body.site-tabela:not(.home-tabela) .primary-nav .nav-trial {
  margin-left: 0.35rem;
  padding-inline: 1rem;
  border: 1px solid rgba(65, 101, 255, 0.6);
  background: linear-gradient(135deg, var(--mm-blue) 0%, var(--mm-violet) 100%);
  box-shadow: 0 0.75rem 1.8rem var(--mm-glow-blue), 0 1px 0 rgba(255, 255, 255, 0.36) inset;
  color: #fff;
}

body.site-tabela .primary-nav .nav-trial:hover {
  border-color: rgba(255, 255, 255, 0.45);
  background: linear-gradient(135deg, #165bf1, #6940eb);
  box-shadow: 0 0.9rem 2.2rem var(--mm-glow-blue), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
  color: #fff;
  transform: translateY(-1px);
}

body.site-tabela .status-pill,
body.site-tabela.home-tabela .status-pill,
body.site-tabela:not(.home-tabela) .status-pill {
  margin-left: 0.35rem;
  border: 1px solid var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: none;
  color: var(--mm-muted);
}

body.site-tabela .status-pill::before {
  background: var(--mm-signal);
  box-shadow: 0 0 0 0.22rem rgba(182, 237, 36, 0.14), 0 0 1rem rgba(182, 237, 36, 0.75);
}

.theme-toggle {
  display: inline-grid;
  width: 2.35rem;
  height: 2.35rem;
  flex: 0 0 auto;
  place-items: center;
  margin-left: auto;
  border: 1px solid var(--mm-line);
  border-radius: 0.78rem;
  background: var(--mm-surface-strong);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.48) inset;
  color: var(--mm-ink);
  font: inherit;
  cursor: pointer;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.theme-toggle:hover {
  border-color: var(--mm-line-strong);
  box-shadow: 0 0.55rem 1.4rem var(--mm-glow-blue);
  transform: translateY(-1px) rotate(4deg);
}

.theme-toggle-icon {
  font-size: 1.05rem;
  line-height: 1;
}

/* Shared controls and glass surfaces ------------------------------------- */
body.site-tabela .button,
body.site-tabela.home-tabela .button {
  border-radius: 0.95rem;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

body.site-tabela .button:hover {
  transform: translateY(-2px);
}

body.site-tabela .button-primary,
body.site-tabela.home-tabela .button-primary {
  border-color: rgba(69, 102, 255, 0.7);
  background: linear-gradient(135deg, var(--mm-blue), var(--mm-violet));
  box-shadow: 0 0.9rem 2.3rem var(--mm-glow-blue), 0 1px 0 rgba(255, 255, 255, 0.4) inset;
  color: #fff;
}

body.site-tabela .button-primary:hover {
  background: linear-gradient(135deg, #165bf1, #6940eb);
  box-shadow: 0 1.1rem 2.7rem var(--mm-glow-blue);
  color: #fff;
}

body.site-tabela .button-secondary,
body.site-tabela.home-tabela .button-secondary {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: 0 0.55rem 1.5rem rgba(38, 58, 111, 0.08), 0 1px 0 rgba(255, 255, 255, 0.52) inset;
  color: var(--mm-ink);
}

body.site-tabela .button-secondary:hover {
  border-color: var(--mm-line-strong);
  background: var(--mm-surface-solid);
  color: var(--mm-ink);
}

body.site-tabela .eyebrow,
body.site-tabela.home-tabela .eyebrow,
body.site-tabela:not(.home-tabela) .eyebrow {
  color: var(--mm-blue-strong);
  letter-spacing: 0.13em;
}

body.site-tabela .eyebrow::before {
  display: inline-block;
  width: 0.45rem;
  height: 0.45rem;
  margin-right: 0.55rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--mm-blue), var(--mm-violet));
  box-shadow: 0 0 1rem var(--mm-glow-blue);
  content: "";
}

body.site-tabela .page-card,
body.site-tabela .feature-card,
body.site-tabela .resource-card,
body.site-tabela .article-callout,
body.site-tabela .doc-section,
body.site-tabela .step,
body.site-tabela .price-card,
body.site-tabela .comparison-table-wrap,
body.site-tabela .table-scroll,
body.site-tabela .proof-card,
body.site-tabela .faq-list details {
  border: 1px solid var(--mm-line);
  background: var(--mm-surface);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) inset, var(--mm-shadow-soft);
  backdrop-filter: blur(1.15rem) saturate(135%);
}

:root[data-theme="dark"] body.site-tabela .page-card,
:root[data-theme="dark"] body.site-tabela .feature-card,
:root[data-theme="dark"] body.site-tabela .resource-card,
:root[data-theme="dark"] body.site-tabela .article-callout,
:root[data-theme="dark"] body.site-tabela .doc-section,
:root[data-theme="dark"] body.site-tabela .step,
:root[data-theme="dark"] body.site-tabela .price-card,
:root[data-theme="dark"] body.site-tabela .comparison-table-wrap,
:root[data-theme="dark"] body.site-tabela .table-scroll {
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07) inset, var(--mm-shadow-soft);
}

body.site-tabela .resource-card:hover,
body.site-tabela .feature-card:hover,
body.site-tabela .page-card:hover {
  border-color: var(--mm-line-strong);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.56) inset, var(--mm-shadow);
  transform: translateY(-3px);
}

/* Page headers and reading surfaces -------------------------------------- */
body.site-tabela:not(.home-tabela) .page-hero,
body.site-tabela:not(.home-tabela) .article-header {
  max-width: 64rem;
  padding-top: clamp(6rem, 11vw, 10rem);
  padding-bottom: clamp(3rem, 6vw, 5rem);
}

body.site-tabela:not(.home-tabela) .page-hero::before,
body.site-tabela:not(.home-tabela) .article-header::before {
  top: 1.5rem;
  right: -15rem;
  width: clamp(23rem, 44vw, 39rem);
  border-color: var(--mm-line);
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.52), transparent 18%),
    radial-gradient(circle at 50% 50%, var(--mm-glow-blue), transparent 44%),
    linear-gradient(145deg, rgba(117, 151, 255, 0.18), rgba(142, 90, 255, 0.08));
  box-shadow: 0 0 7rem var(--mm-glow-violet), 0 0 0 1px rgba(255, 255, 255, 0.18) inset;
  opacity: 0.78;
}

body.site-tabela:not(.home-tabela) .page-hero::after,
body.site-tabela:not(.home-tabela) .article-header::after {
  width: 5.5rem;
  height: 0.32rem;
  background: linear-gradient(90deg, var(--mm-blue), var(--mm-violet), var(--mm-cyan));
  box-shadow: 0 0.55rem 1.8rem var(--mm-glow-blue);
}

body.site-tabela:not(.home-tabela) .page-hero > .eyebrow::after,
body.site-tabela:not(.home-tabela) .article-header > .eyebrow::after {
  color: var(--mm-violet);
  text-shadow: 0 0 1rem var(--mm-glow-violet);
}

body.site-tabela:not(.home-tabela) .page-hero h1,
body.site-tabela:not(.home-tabela) .article-header h1 {
  max-width: 13ch;
  color: var(--mm-ink);
  font-size: clamp(3.4rem, 7vw, 6.5rem);
  letter-spacing: -0.065em;
  text-wrap: balance;
}

body.site-tabela:not(.home-tabela) .page-hero > p:not(.eyebrow),
body.site-tabela:not(.home-tabela) .article-header > p:not(.eyebrow) {
  max-width: 46rem;
  color: var(--mm-ink-soft);
  font-size: clamp(1.08rem, 1.8vw, 1.3rem);
}

body.site-tabela .toc {
  gap: 0.45rem;
  padding: 0.7rem;
  border: 1px solid var(--mm-line);
  border-radius: 1.25rem;
  background: var(--mm-surface);
  box-shadow: var(--mm-shadow-soft);
  backdrop-filter: blur(1.2rem) saturate(140%);
}

body.site-tabela .toc a {
  display: inline-flex;
  min-height: 2.25rem;
  align-items: center;
  padding: 0.38rem 0.72rem;
  border-radius: 0.75rem;
  color: var(--mm-ink-soft);
  text-decoration: none;
}

body.site-tabela .toc a:hover {
  background: var(--mm-surface-strong);
  color: var(--mm-blue-strong);
}

body.site-tabela .prose {
  --ink: var(--mm-ink);
  --ink-soft: var(--mm-muted);
}

body.site-tabela .prose h2 {
  letter-spacing: -0.045em;
  text-wrap: balance;
}

body.site-tabela .prose code {
  border: 1px solid var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink-soft);
}

body.site-tabela .doc-section {
  overflow: clip;
}

body.site-tabela .doc-summary {
  background: linear-gradient(135deg, rgba(91, 131, 255, 0.08), rgba(129, 80, 255, 0.06));
}

body.site-tabela .doc-summary::after {
  color: var(--mm-blue-strong);
}

body.site-tabela .check-columns > div {
  border: 1px solid var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: 0 0.6rem 1.8rem rgba(40, 57, 103, 0.06);
}

body.site-tabela .check-columns li::marker,
body.site-tabela .feature-list li::marker {
  color: var(--mm-blue);
}

body.site-tabela .step-list {
  --step-line: var(--mm-line-strong);
}

body.site-tabela .step::before {
  background: linear-gradient(135deg, var(--mm-blue), var(--mm-violet));
  box-shadow: 0 0 0 0.45rem var(--mm-bg), 0 0 1.4rem var(--mm-glow-blue);
  color: #fff;
}

body.site-tabela .step-note {
  border-color: rgba(80, 118, 255, 0.24);
  background: linear-gradient(135deg, rgba(74, 118, 255, 0.1), rgba(130, 81, 255, 0.08));
  color: var(--mm-ink-soft);
}

body.site-tabela .spec-table th,
body.site-tabela .comparison-table th {
  color: var(--mm-ink);
}

body.site-tabela .spec-table tr,
body.site-tabela .comparison-table tr {
  border-color: var(--mm-line);
}

/* Product screenshots ----------------------------------------------------- */
body.site-tabela .shot-frame,
body.site-tabela.home-tabela .shot-frame {
  position: relative;
  isolation: isolate;
  overflow: visible;
  padding: 0.45rem;
  border: 1px solid var(--mm-line);
  border-radius: 1.45rem;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(129, 158, 255, 0.16));
  box-shadow: var(--mm-shadow), 0 1px 0 rgba(255, 255, 255, 0.66) inset;
}

body.site-tabela .shot-frame::before {
  position: absolute;
  z-index: -1;
  inset: 8% -3% -7%;
  border-radius: inherit;
  background: linear-gradient(135deg, var(--mm-glow-blue), var(--mm-glow-violet));
  filter: blur(2.2rem);
  opacity: 0.62;
  content: "";
}

body.site-tabela .shot-frame picture,
body.site-tabela .shot-frame img {
  display: block;
  width: 100%;
  border-radius: 1.05rem;
}

body.site-tabela .shot-frame img {
  border: 1px solid rgba(35, 49, 87, 0.12);
  background: var(--mm-surface-solid);
}

body.site-tabela .shot-frame figcaption {
  padding: 0.9rem 0.65rem 0.45rem;
  color: var(--mm-muted);
}

body.site-tabela .shot-frame figcaption strong {
  color: var(--mm-ink);
}

body.site-tabela .shot-frame.is-zoomable:hover {
  border-color: var(--mm-line-strong);
  transform: translateY(-3px);
}

body.site-tabela .lightbox {
  border: 1px solid var(--mm-line-strong);
  background: var(--mm-surface-strong);
  box-shadow: 0 2rem 7rem rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(1.5rem);
}

body.site-tabela .lightbox::backdrop {
  background: rgba(3, 6, 18, 0.78);
  backdrop-filter: blur(0.8rem);
}

/* Homepage --------------------------------------------------------------- */
body.home-tabela .tm-hero {
  padding-top: clamp(5.5rem, 10vw, 9rem);
}

body.home-tabela .tm-hero-scene {
  inset: -18% -6% 45%;
  mix-blend-mode: luminosity;
  opacity: 0.38;
}

body.home-tabela .tm-hero-lead {
  align-items: center;
}

body.home-tabela .tm-hero h1 {
  max-width: 12ch;
  color: var(--mm-ink);
  font-size: clamp(3.7rem, 7.4vw, 7rem);
  font-weight: 830;
  letter-spacing: -0.072em;
  line-height: 0.94;
  text-wrap: balance;
}

body.home-tabela .tm-scribble path {
  stroke: url("#mm-heading-gradient");
  stroke: var(--mm-blue);
  filter: drop-shadow(0 0.4rem 0.7rem var(--mm-glow-blue));
}

body.home-tabela .tm-hero-side {
  padding: 1.45rem;
  border: 1px solid var(--mm-line);
  border-radius: 1.35rem;
  background: var(--mm-surface);
  box-shadow: var(--mm-shadow-soft), 0 1px 0 rgba(255, 255, 255, 0.55) inset;
  backdrop-filter: blur(1.2rem) saturate(140%);
}

body.home-tabela .tm-symbols span {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: 0 0.55rem 1.4rem rgba(38, 58, 111, 0.09);
  color: var(--mm-blue-strong);
}

body.home-tabela .tm-hero-side .hero-deck,
body.home-tabela .tm-hero-side .hero-contrast,
body.home-tabela .tm-hero-side .hero-trust {
  color: var(--mm-muted) !important;
}

body.home-tabela .tm-hero-side .hero-contrast {
  color: var(--mm-ink-soft) !important;
}

body.home-tabela .tm-hero-window {
  padding: 0.5rem;
  border: 1px solid var(--mm-line);
  border-radius: 1.55rem;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(119, 150, 255, 0.14));
  box-shadow: 0 2.4rem 7rem rgba(38, 55, 105, 0.23), 0 0 0 1px rgba(255, 255, 255, 0.48) inset;
}

body.home-tabela .tm-hero-window::before {
  background: linear-gradient(135deg, var(--mm-blue), var(--mm-violet));
  opacity: 0.2;
  filter: blur(2rem);
}

body.home-tabela .tm-hero-window::after {
  background: var(--mm-violet);
  opacity: 0.18;
}

body.home-tabela .tm-window-tag {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: var(--mm-shadow-soft);
  color: var(--mm-ink);
}

body.home-tabela .tm-window-tag-price {
  background: var(--mm-signal);
  color: var(--mm-signal-ink);
}

body.home-tabela .tm-window-tag-local {
  color: var(--mm-blue-strong);
}

body.home-tabela .tm-hero-window img,
body.home-tabela .tm-slide img,
body.home-tabela .tm-tile-shot img,
body.home-tabela .tm-day-shot img {
  border-color: var(--mm-line);
}

body.home-tabela .tm-day-story,
body.home-tabela .tm-bento-section,
body.home-tabela .tm-slideshow,
body.home-tabela .evidence-band,
body.home-tabela .privacy-section,
body.home-tabela .faq-section,
body.home-tabela .pricing-section,
body.home-tabela .roadmap-preview,
body.home-tabela .final-cta {
  position: relative;
}

body.home-tabela .tm-day-panel,
body.home-tabela .tm-tile,
body.home-tabela .tm-slide,
body.home-tabela .tm-receipt,
body.home-tabela .evidence-card,
body.home-tabela .privacy-card,
body.home-tabela .pricing-card,
body.home-tabela .roadmap-card,
body.home-tabela .faq-list details {
  border-color: var(--mm-line);
  background: var(--mm-surface);
  box-shadow: var(--mm-shadow-soft), 0 1px 0 rgba(255, 255, 255, 0.5) inset;
  backdrop-filter: blur(1rem) saturate(135%);
}

body.home-tabela .tm-day-tabs,
body.home-tabela .tm-steps,
body.home-tabela .tm-pills {
  border-color: var(--mm-line);
  background: var(--mm-surface);
}

body.home-tabela .tm-day-time,
body.home-tabela .tm-step-index,
body.home-tabela .tm-tile-kicker,
body.home-tabela .tm-slide-caption strong {
  color: var(--mm-blue-strong);
}

body.home-tabela .tm-day-status,
body.home-tabela .tm-progress-fill {
  background: linear-gradient(90deg, var(--mm-blue), var(--mm-violet));
}

body.home-tabela .tm-sticker,
body.home-tabela .tm-sticker-dark {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: var(--mm-shadow-soft);
  color: var(--mm-ink);
}

body.home-tabela .tm-tile-price,
body.home-tabela .tm-day-outcome {
  background: linear-gradient(145deg, rgba(62, 107, 255, 0.92), rgba(119, 69, 235, 0.94));
  color: #fff;
}

body.home-tabela .tm-tile-price h3,
body.home-tabela .tm-tile-price p,
body.home-tabela .tm-day-outcome h3,
body.home-tabela .tm-day-outcome p {
  color: #fff;
}

/* New setup and learning aids -------------------------------------------- */
.setup-paths {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin: -1rem 0 2rem;
}

.setup-path {
  display: flex;
  min-height: 9.5rem;
  flex-direction: column;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.3rem;
  border: 1px solid var(--mm-line);
  border-radius: 1.25rem;
  background: var(--mm-surface);
  box-shadow: var(--mm-shadow-soft), 0 1px 0 rgba(255, 255, 255, 0.52) inset;
  color: var(--mm-ink);
  text-decoration: none;
  backdrop-filter: blur(1rem) saturate(135%);
  transition: transform 170ms ease, border-color 170ms ease, box-shadow 170ms ease;
}

.setup-path:hover {
  border-color: var(--mm-line-strong);
  box-shadow: var(--mm-shadow);
  color: var(--mm-ink);
  transform: translateY(-3px);
}

.setup-path-kicker {
  color: var(--mm-blue-strong);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.setup-path strong {
  display: block;
  font-size: 1.15rem;
  line-height: 1.2;
}

.setup-path span:last-child {
  color: var(--mm-muted);
  font-size: 0.9rem;
}

.feature-journey {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.65rem;
  margin: 1.6rem 0;
}

.feature-journey > div {
  position: relative;
  padding: 1rem;
  border: 1px solid var(--mm-line);
  border-radius: 1rem;
  background: var(--mm-surface-strong);
}

.feature-journey > div:not(:last-child)::after {
  position: absolute;
  top: 50%;
  right: -0.57rem;
  z-index: 2;
  color: var(--mm-blue);
  content: "→";
  transform: translateY(-50%);
}

.feature-journey strong,
.feature-journey span {
  display: block;
}

.feature-journey strong {
  margin-bottom: 0.25rem;
  font-size: 0.92rem;
}

.feature-journey span {
  color: var(--mm-muted);
  font-size: 0.78rem;
}

/* Footer ----------------------------------------------------------------- */
body.site-tabela .site-footer,
body.site-tabela.home-tabela .site-footer,
body.site-tabela:not(.home-tabela) .site-footer {
  margin-top: clamp(4rem, 8vw, 8rem);
  border-top: 1px solid var(--mm-line);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), var(--mm-surface));
  box-shadow: 0 -2rem 6rem rgba(61, 83, 148, 0.08);
  color: var(--mm-ink);
  backdrop-filter: blur(1rem);
}

body.site-tabela .site-footer::before {
  background: linear-gradient(90deg, transparent, var(--mm-blue), var(--mm-violet), transparent);
  opacity: 0.7;
}

/* The legacy dark-footer block above sets white text with selectors such as
   `body.site-tabela:not(.home-tabela) .footer-grid a:not(.footer-trial)`.
   Those out-rank plain `body.site-tabela .site-footer a`, so the white text
   survived onto this light glass surface and the footer was unreadable in
   light mode. Every foreground here matches or beats that specificity. */
body.site-tabela:not(.home-tabela) .site-footer h2,
body.site-tabela:not(.home-tabela) .footer-grid h2,
body.site-tabela.home-tabela .site-footer h2 {
  color: var(--mm-blue-strong);
}

body.site-tabela:not(.home-tabela) .site-footer a:not(.footer-trial),
body.site-tabela:not(.home-tabela) .footer-grid a:not(.footer-trial),
body.site-tabela:not(.home-tabela) .footer-links a:not(.footer-trial),
body.site-tabela:not(.home-tabela) .footer-grid .brand,
body.site-tabela:not(.home-tabela) .footer-brand .brand,
body.site-tabela.home-tabela .site-footer a:not(.footer-trial),
body.site-tabela.home-tabela .footer-brand .brand {
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .footer-links a:not(.footer-trial):hover,
body.site-tabela.home-tabela .footer-links a:not(.footer-trial):hover {
  color: var(--mm-blue-strong);
  text-decoration-color: var(--mm-blue-strong);
}

body.site-tabela:not(.home-tabela) .site-footer p,
body.site-tabela:not(.home-tabela) .footer-grid p,
body.site-tabela:not(.home-tabela) .footer-bottom,
body.site-tabela:not(.home-tabela) .footer-bottom p,
body.site-tabela.home-tabela .site-footer p,
body.site-tabela.home-tabela .footer-bottom p {
  color: var(--mm-muted);
}

body.site-tabela:not(.home-tabela) .footer-bottom {
  border-top-color: var(--mm-line);
}

/* Callouts: the legacy block paints a dark gradient panel with white text and
   lime eyebrows. The adaptive glass surface rule above is less specific than
   that legacy selector, so on narrow viewports the dark panel won while the
   text had already been re-coloured for glass. Re-declare the surface and
   every foreground at the legacy specificity, later in the sheet. */
body.site-tabela:not(.home-tabela) .article-callout,
body.site-tabela:not(.home-tabela) .release-callout {
  border: 1px solid var(--mm-line);
  background: var(--mm-surface);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) inset, var(--mm-shadow-soft);
}

body.site-tabela:not(.home-tabela) .article-callout h2,
body.site-tabela:not(.home-tabela) .article-callout p,
body.site-tabela:not(.home-tabela) .release-callout h2,
body.site-tabela:not(.home-tabela) .release-callout p {
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .article-callout .eyebrow,
body.site-tabela:not(.home-tabela) .release-callout .eyebrow {
  color: var(--mm-blue-strong);
}

body.site-tabela:not(.home-tabela) .article-callout::after,
body.site-tabela:not(.home-tabela) .release-callout::after {
  color: var(--mm-blue);
  text-shadow: none;
}

body.site-tabela:not(.home-tabela) .article-callout .button-secondary,
body.site-tabela:not(.home-tabela) .release-callout .button-secondary {
  border-color: var(--mm-line-strong);
  color: var(--mm-ink);
}

body.site-tabela .footer-trial {
  border-color: rgba(65, 101, 255, 0.6);
  background: linear-gradient(135deg, var(--mm-blue), var(--mm-violet));
  box-shadow: 0 0.8rem 2rem var(--mm-glow-blue);
  color: #fff;
}

/* Legacy secondary-page surfaces ------------------------------------------
   The Tabela gloss layer at the top of this file paints many surfaces with
   hard-coded near-white paper (comparison tables, spec-table cards on phones,
   inline code, screenshot frames, doc summaries, the light nav button). The
   adaptive layer re-colours the text with semantic ink, but where the legacy
   selector is more specific than the adaptive one the paper stays light and
   dark mode ends up with white text on white. Every pair below re-declares
   the surface *and* its foreground at the legacy specificity, later in the
   sheet, so both themes read. Keep this block after every legacy rule. */
body.site-tabela:not(.home-tabela) .primary-nav .nav-trial,
body.site-tabela:not(.home-tabela) .primary-nav .nav-trial:hover {
  border-color: rgba(29, 84, 212, 0.82);
  background: linear-gradient(135deg, #1d54d4, #5730c5);
  color: #fff;
}

body.site-tabela:not(.home-tabela) .prose code {
  border: 1px solid var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink-soft);
}

body.site-tabela:not(.home-tabela) .shot-frame {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: var(--mm-shadow);
}

body.site-tabela:not(.home-tabela) .shot-frame::after {
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
}

body.site-tabela:not(.home-tabela) .shot-frame figcaption {
  border-top-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-muted);
}

body.site-tabela:not(.home-tabela) .shot-frame figcaption strong {
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .doc-summary {
  background: linear-gradient(135deg, rgba(91, 131, 255, 0.08), rgba(129, 80, 255, 0.06));
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .not-right {
  border-color: var(--mm-line-strong);
  background: var(--mm-surface-strong);
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .comparison-section {
  background: linear-gradient(180deg, var(--mm-bg-deep), var(--mm-bg));
}

body.site-tabela:not(.home-tabela) .comparison-table-wrap {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: var(--mm-shadow-soft);
}

body.site-tabela:not(.home-tabela) .comparison-table thead,
body.site-tabela:not(.home-tabela) .comparison-table thead th {
  background: var(--mm-surface-solid);
  color: var(--mm-ink);
  border-bottom-color: var(--mm-line-strong);
}

body.site-tabela:not(.home-tabela) .comparison-table thead th:nth-child(2) {
  background: linear-gradient(135deg, rgba(43, 111, 255, 0.16), rgba(124, 77, 255, 0.12));
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .comparison-table tbody th,
body.site-tabela:not(.home-tabela) .comparison-table tbody td {
  color: var(--mm-ink-soft);
  border-bottom-color: var(--mm-line);
}

body.site-tabela:not(.home-tabela) .comparison-table tbody th {
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .comparison-table tbody td:nth-child(2) {
  background: linear-gradient(135deg, rgba(43, 111, 255, 0.09), rgba(124, 77, 255, 0.06));
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .comparison-notes p {
  color: var(--mm-muted);
}

body.site-tabela:not(.home-tabela) .table-scroll {
  border-color: var(--mm-line);
  background: var(--mm-surface);
}

body.site-tabela:not(.home-tabela) .spec-table caption {
  color: var(--mm-muted);
}

body.site-tabela:not(.home-tabela) .spec-table th,
body.site-tabela:not(.home-tabela) .spec-table td {
  border-bottom-color: var(--mm-line);
}

body.site-tabela:not(.home-tabela) .spec-table thead th,
body.site-tabela:not(.home-tabela) .spec-table tbody th {
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .spec-table td {
  color: var(--mm-ink-soft);
}

@media (max-width: 46rem) {
  body.site-tabela:not(.home-tabela) .spec-table tr {
    border-color: var(--mm-line);
    background: var(--mm-surface-strong);
  }

  body.site-tabela:not(.home-tabela) .spec-table tbody td[data-label]::before {
    color: var(--mm-muted);
  }
}

body.site-tabela:not(.home-tabela) .page-card,
body.site-tabela:not(.home-tabela) .resource-card,
body.site-tabela:not(.home-tabela) .release-note,
body.site-tabela:not(.home-tabela) .doc-section {
  border-color: var(--mm-line);
  background: var(--mm-surface);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) inset, var(--mm-shadow-soft);
}

:root[data-theme="dark"] body.site-tabela:not(.home-tabela) .page-card,
:root[data-theme="dark"] body.site-tabela:not(.home-tabela) .resource-card,
:root[data-theme="dark"] body.site-tabela:not(.home-tabela) .release-note,
:root[data-theme="dark"] body.site-tabela:not(.home-tabela) .doc-section {
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07) inset, var(--mm-shadow-soft);
}

body.site-tabela:not(.home-tabela) .page-aside {
  border-top-color: var(--mm-signal);
  box-shadow: var(--mm-shadow-soft);
}

body.site-tabela:not(.home-tabela) .resource-card::after {
  background: radial-gradient(circle at 35% 35%, rgba(255, 255, 255, 0.35), rgba(43, 111, 255, 0.1) 34%, transparent 66%);
}

body.site-tabela:not(.home-tabela) .nav-toggle {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: none;
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .toc a {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink-soft);
}

body.site-tabela:not(.home-tabela) .toc a:hover {
  border-color: var(--mm-blue);
  color: var(--mm-blue-strong);
}

body.site-tabela:not(.home-tabela) .article-toc,
body.site-tabela:not(.home-tabela) .evidence-note,
body.site-tabela:not(.home-tabela) .creator-perspectives,
body.site-tabela:not(.home-tabela) .source-panel,
body.site-tabela:not(.home-tabela) .framework-grid article {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink-soft);
}

body.site-tabela:not(.home-tabela) .evidence-note {
  border-color: rgba(182, 237, 36, 0.45);
}

body.site-tabela:not(.home-tabela) .framework-grid strong,
body.site-tabela:not(.home-tabela) .article-toc h2,
body.site-tabela:not(.home-tabela) .evidence-note h2,
body.site-tabela:not(.home-tabela) .creator-perspectives h2,
body.site-tabela:not(.home-tabela) .source-panel h2 {
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .framework-grid span {
  color: var(--mm-muted);
}

/* The Pro section on use-case pages shipped with light-only paper. */
body.site-tabela:not(.home-tabela) .pro-boost {
  border-color: var(--mm-line-strong);
  background: linear-gradient(135deg, rgba(43, 111, 255, 0.08), rgba(124, 77, 255, 0.07)), var(--mm-surface);
}

body.site-tabela:not(.home-tabela) .pro-boost__list li,
body.site-tabela:not(.home-tabela) .pro-boost__example {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink-soft);
}

body.site-tabela:not(.home-tabela) .pro-boost__list strong {
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .pro-boost__boundary {
  color: var(--mm-muted);
}

/* Footer download button: the legacy lime gradient stays and the text stays
   dark on it in both themes. Re-declare the pair at the legacy specificity. */
body.site-tabela:not(.home-tabela) .footer-trial,
body.site-tabela:not(.home-tabela) .footer-trial span,
body.site-tabela:not(.home-tabela) .footer-trial:hover span {
  color: #182300;
}

body.site-tabela:not(.home-tabela) .primary-nav a:hover,
body.site-tabela:not(.home-tabela) .primary-nav a[aria-current="page"] {
  background: var(--mm-surface-strong);
  box-shadow: 0 0 0 1px var(--mm-line), 0 0.35rem 1rem rgba(37, 65, 133, 0.1);
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .article-callout .button-primary,
body.site-tabela:not(.home-tabela) .article-callout .button-primary span,
body.site-tabela:not(.home-tabela) .release-callout .button-primary,
body.site-tabela:not(.home-tabela) .release-callout .button-primary span {
  color: #182300;
}

body.site-tabela:not(.home-tabela) .button-secondary {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  box-shadow: 0 0.55rem 1.5rem rgba(38, 58, 111, 0.08), 0 1px 0 rgba(255, 255, 255, 0.52) inset;
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .button-secondary:hover {
  border-color: var(--mm-line-strong);
  background: var(--mm-surface-solid);
  color: var(--mm-ink);
}

body.site-tabela:not(.home-tabela) .article-callout .button-secondary,
body.site-tabela:not(.home-tabela) .release-callout .button-secondary {
  background: var(--mm-surface-strong);
}

/* Found by the full-sitemap contrast run: reference tables and pull quotes on
   authority articles, and the phone-only screenshots note. */
body.site-tabela:not(.home-tabela) .reference-table-wrap {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
}

body.site-tabela:not(.home-tabela) .reference-table th {
  background: var(--mm-ink);
  color: var(--mm-bg);
}

body.site-tabela:not(.home-tabela) .reference-table td {
  border-color: var(--mm-line);
  color: var(--mm-ink-soft);
}

body.site-tabela:not(.home-tabela) .authority-article blockquote {
  border-left-color: var(--mm-signal);
  background: var(--mm-surface-strong);
}

body.site-tabela:not(.home-tabela) .authority-article blockquote p {
  color: var(--mm-ink);
}

@media (max-width: 46rem) {
  body.site-tabela:not(.home-tabela) .phone-only-note {
    background: var(--mm-surface-strong);
    color: var(--mm-ink-soft);
  }
}

/* Homepage contrast contract ---------------------------------------------
   The campaign layout predates the adaptive theme and intentionally used
   several fixed white and ink-black surfaces. Reusing semantic text colours
   without also adapting those surfaces caused white-on-white copy in dark
   mode and a few ink-on-ink table labels in light mode. Keep every paired
   surface and foreground explicit here, after both legacy homepage sheets. */
body.home-tabela {
  /* These are artwork colours, not text colours. They must stay dark even
     when the semantic page ink becomes light in dark mode. */
  --tm-dark: #101425;
  --tm-dark-soft: #202944;
}

body.home-tabela .proof-strip {
  border-color: var(--mm-line);
  background: var(--mm-bg);
}

body.home-tabela .comparison-section,
body.home-tabela .section-soft {
  border-color: var(--mm-line);
  background: linear-gradient(180deg, var(--mm-bg-deep), var(--mm-bg));
}

body.home-tabela :is(
  .proof-grid article,
  .feature-card,
  .promise-card,
  .page-card,
  .price-card,
  .campaign-faq details,
  .not-right,
  .download-panel
) {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink);
  box-shadow: var(--mm-shadow-soft), 0 1px 0 rgba(255, 255, 255, 0.12) inset;
}

body.home-tabela :is(
  .proof-grid article,
  .feature-card,
  .promise-card,
  .page-card,
  .price-card,
  .campaign-faq details,
  .not-right,
  .download-panel
) :is(h2, h3, h4, strong, summary, .price-amount) {
  color: var(--mm-ink);
}

body.home-tabela :is(
  .proof-grid article,
  .feature-card,
  .promise-card,
  .page-card,
  .price-card,
  .campaign-faq details,
  .not-right,
  .download-panel
) :is(p, li, small, .price-sub, .price-note, .download-note) {
  color: var(--mm-ink-soft);
}

body.home-tabela :is(
  .proof-grid article,
  .feature-card,
  .promise-card,
  .page-card,
  .price-card,
  .campaign-faq details,
  .not-right,
  .download-panel
) a:not(.button) {
  color: var(--mm-blue-strong);
}

body.home-tabela .proof-mark,
body.home-tabela .promise-number,
body.home-tabela .price-eyebrow {
  color: var(--mm-blue-strong);
}

body.home-tabela .comparison-table-wrap {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
}

body.home-tabela .comparison-table thead,
body.home-tabela .control-room,
body.home-tabela .release-callout {
  background: #101425;
  color: #f8faff;
}

body.home-tabela .comparison-table thead th,
body.home-tabela .control-room :is(h2, h3, h4, strong),
body.home-tabela .release-callout :is(h2, h3, h4, strong, p) {
  color: #f8faff;
}

body.home-tabela .comparison-table tbody :is(th, td) {
  color: var(--mm-ink);
}

body.home-tabela .comparison-table tbody td:nth-child(2) {
  background: rgba(93, 132, 255, 0.1);
}

body.home-tabela .comparison-notes p,
body.home-tabela .section-header > p {
  color: var(--mm-ink-soft);
}

body.home-tabela .control-room .eyebrow,
body.home-tabela .release-callout .eyebrow {
  color: #c9f855;
}

body.home-tabela .control-heading p:not(.eyebrow),
body.home-tabela .workflow-rail p {
  color: #d3daec;
}

body.home-tabela .workflow-rail {
  background: rgba(151, 177, 255, 0.24);
}

body.home-tabela .workflow-rail li {
  background: #18213a;
  color: #f8faff;
}

body.home-tabela .workflow-rail li :is(h3, strong) {
  color: #f8faff;
}

body.home-tabela .workflow-rail li > span {
  background: #c9f855;
  color: #142000;
}

body.home-tabela .release-callout a:not(.button),
body.home-tabela .release-callout .button-secondary {
  color: #fff;
}

body.home-tabela .release-callout .button-secondary {
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(255, 255, 255, 0.06);
}

body.home-tabela .release-callout .button-secondary:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

/* Slideshow controls and the full-day story use adaptive paper surfaces. */
body.home-tabela .tm-steps,
body.home-tabela .tm-day-tabs {
  border-color: var(--mm-line);
  background: var(--mm-surface);
}

body.home-tabela .tm-step,
body.home-tabela .tm-day-tabs button {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink);
}

body.home-tabela .tm-step:hover,
body.home-tabela .tm-day-tabs button:hover {
  border-color: var(--mm-line-strong);
  background: var(--mm-surface-solid);
}

body.home-tabela .tm-step-index {
  background: var(--mm-bg-deep);
  color: var(--mm-ink);
}

body.home-tabela .tm-step.is-current {
  border-color: var(--mm-signal);
  background: var(--mm-signal);
  color: var(--mm-signal-ink);
}

body.home-tabela .tm-step.is-current .tm-step-label {
  color: var(--mm-signal-ink);
}

body.home-tabela .tm-step.is-current .tm-step-index,
body.home-tabela .tm-step.is-done .tm-step-index,
body.home-tabela .tm-day-tabs button.is-current,
body.home-tabela .tm-day-tabs button[aria-selected="true"] {
  border-color: #101425;
  background: #101425;
  color: #fff;
}

body.home-tabela .tm-day-tabs button span,
body.home-tabela .tm-day-time {
  color: var(--mm-muted) !important;
}

body.site-tabela.home-tabela .tm-day-time span {
  background: #101425;
  color: #fff;
}

body.home-tabela .tm-day-tabs button.is-current :is(span, strong),
body.home-tabela .tm-day-tabs button[aria-selected="true"] :is(span, strong) {
  color: #fff !important;
}

body.home-tabela .tm-day-panel {
  border-color: var(--mm-line);
  background:
    radial-gradient(circle at 88% 5%, rgba(169, 221, 48, 0.15), transparent 15rem),
    var(--mm-surface);
  color: var(--mm-ink);
}

body.home-tabela .tm-day-copy h3,
body.home-tabela .tm-day-flow strong {
  color: var(--mm-ink);
}

body.home-tabela .tm-day-copy > p:not(.tm-day-time, .tm-day-outcome),
body.home-tabela .tm-day-flow small {
  color: var(--mm-ink-soft);
}

body.home-tabela .tm-day-flow li {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
}

body.home-tabela .tm-day-flow li > span {
  border-color: var(--mm-line);
  background: var(--mm-bg-deep);
  color: var(--mm-ink-soft);
}

body.home-tabela .tm-day-flow li.is-current {
  border-color: var(--mm-signal);
  background: var(--mm-surface-solid);
}

body.home-tabela .tm-day-flow li.is-current > span,
body.home-tabela .tm-day-status li:nth-child(2) {
  background: var(--mm-signal);
  color: var(--mm-signal-ink);
}

body.home-tabela :is(
  .tm-day-receipt,
  .tm-day-receipt-light,
  .tm-day-receipt-close,
  .tm-day-approval,
  .tm-day-status,
  .tm-day-cta,
  .tm-proposals
) {
  border-color: var(--mm-line);
  background: var(--mm-surface-solid);
  color: var(--mm-ink);
}

body.home-tabela :is(
  .tm-day-receipt,
  .tm-day-receipt-light,
  .tm-day-receipt-close,
  .tm-day-approval,
  .tm-day-status,
  .tm-day-cta,
  .tm-proposals
) :is(h3, strong, b, p, span) {
  color: var(--mm-ink);
}

body.home-tabela .tm-proposals > div,
body.home-tabela .tm-day-status li {
  border-color: var(--mm-line);
  background: var(--mm-bg-deep);
  color: var(--mm-ink-soft);
}

body.home-tabela .tm-proposal-icon {
  background: var(--mm-bg-deep);
  color: var(--mm-ink);
}

body.home-tabela .tm-day-approval small,
body.home-tabela .tm-day-receipt div {
  color: var(--mm-muted);
}

body.home-tabela .tm-day-outcome {
  background: linear-gradient(145deg, #315cdb, #6230c8);
  color: #fff;
}

body.home-tabela .tm-day-outcome :is(span, strong, p) {
  color: #fff;
}

/* Bento cards retain their hierarchy while every nested artifact remains
   readable against its own surface. */
body.home-tabela .tm-tile:not(.tm-tile-price, .tm-tile-ownership) {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink);
}

body.home-tabela .tm-tile:not(.tm-tile-price, .tm-tile-ownership) :is(h3, strong) {
  color: var(--mm-ink);
}

body.home-tabela .tm-tile:not(.tm-tile-price, .tm-tile-ownership) p {
  color: var(--mm-ink-soft);
}

body.home-tabela .tm-tile-price {
  background: linear-gradient(145deg, #245de0, #7045dc);
  color: #fff;
}

body.home-tabela .tm-tile-price > :is(h3, p, .tm-tile-kicker, .tm-tile-note) {
  color: #fff !important;
}

body.home-tabela .tm-tile-ownership {
  background: var(--mm-signal);
  color: var(--mm-signal-ink);
}

body.home-tabela .tm-tile-ownership :is(h3, p, li, strong, .tm-tile-kicker) {
  color: var(--mm-signal-ink) !important;
}

body.home-tabela .tm-tile-price .tm-receipt {
  background: #fff;
  color: #101425;
}

body.home-tabela .tm-tile-price .tm-receipt :is(p, div, span, strong, b) {
  color: #101425;
}

body.home-tabela .tm-tile-price .tm-receipt div {
  color: #30384f;
}

body.home-tabela .demo-frame,
body.home-tabela .shot-frame figcaption {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink-soft);
}

body.home-tabela :is(.demo-frame, .shot-frame figcaption) strong {
  color: var(--mm-ink);
}

body.home-tabela .feature-icon {
  background: var(--mm-signal);
  color: var(--mm-signal-ink);
}

body.home-tabela .feature-card .feature-icon {
  color: var(--mm-signal-ink) !important;
}

body.home-tabela .promise-number {
  background: var(--mm-bg-deep);
}

body.home-tabela .tm-tile:not(.tm-tile-price, .tm-tile-ownership) .tm-tile-kicker {
  color: var(--mm-blue-strong) !important;
}

body.home-tabela .tm-proposals b {
  background: var(--mm-signal);
  color: var(--mm-signal-ink);
}

body.home-tabela .tm-proposals b.is-done {
  background: var(--mm-bg-deep);
  color: var(--mm-ink);
}

body.home-tabela .tm-hero-details .platform-support li,
body.home-tabela .demo-chapter,
body.home-tabela .demo-frame figcaption {
  border-color: var(--mm-line);
  background: var(--mm-surface-strong);
  color: var(--mm-ink-soft);
}

body.home-tabela .tm-hero-details .platform-support li span,
body.home-tabela .demo-frame figcaption strong,
body.home-tabela .demo-chapter.is-active,
body.home-tabela .demo-chapter:hover {
  color: var(--mm-ink);
}

body.home-tabela .demo-chapter-time {
  color: var(--mm-blue-strong);
}

body.home-tabela .tm-narration {
  background: var(--mm-surface-solid);
  color: var(--mm-ink);
}

body.home-tabela :is(.hero-caveat, .showcase-caveat) {
  border-left-color: var(--mm-signal);
  color: var(--mm-muted) !important;
}

body.home-tabela .demo-frame video {
  color: #f8faff;
}

body.site-tabela .skip-link,
body.site-tabela .skip-link:focus,
body.site-tabela .skip-link:focus-visible {
  background: #101425 !important;
  color: #fff !important;
}

/* Conversion labels are normal-sized text, so their lightest gradient stop
   must clear the 4.5:1 AA threshold rather than relying on button chrome or
   font weight. The explicit descendant colour also wins over the footer's
   general link rule. */
body.site-tabela.home-tabela :is(.button-primary, .nav-trial, .footer-trial) {
  border-color: rgba(29, 84, 212, 0.82);
  background: linear-gradient(135deg, #1d54d4, #5730c5);
  color: #fff;
}

body.site-tabela.home-tabela .primary-nav .nav-trial,
body.site-tabela.home-tabela .primary-nav .nav-trial:hover {
  border-color: rgba(29, 84, 212, 0.82);
  background: linear-gradient(135deg, #1d54d4, #5730c5);
  color: #fff;
}

body.site-tabela.home-tabela :is(.button-primary, .nav-trial, .footer-trial) span,
body.site-tabela.home-tabela .site-footer .footer-trial {
  color: #fff;
}

/* Responsive and accessibility ------------------------------------------ */
@media (max-width: 72rem) {
  body.site-tabela .status-pill {
    display: none;
  }

  body.site-tabela .primary-nav a {
    padding-inline: 0.55rem;
  }
}

@media (max-width: 58rem) {
  body.site-tabela .site-header {
    top: 0.45rem;
  }

  body.site-tabela .header-row {
    border-radius: 1.1rem;
  }

  body.site-tabela .primary-nav {
    border-color: var(--mm-line);
    background: var(--mm-surface-strong);
    box-shadow: var(--mm-shadow);
    backdrop-filter: blur(1.25rem) saturate(140%);
  }

  body.site-tabela .nav-toggle {
    border-color: var(--mm-line);
    background: var(--mm-surface-strong);
    box-shadow: none;
    color: var(--mm-ink);
  }

  .setup-paths {
    grid-template-columns: 1fr;
  }

  .setup-path {
    min-height: 0;
  }

  .feature-journey {
    grid-template-columns: 1fr 1fr;
  }

  .feature-journey > div:not(:last-child)::after {
    display: none;
  }
}

@media (max-width: 46rem) {
  body.site-tabela .shell,
  body.site-tabela.home-tabela .shell,
  body.site-tabela:not(.home-tabela) .shell {
    width: calc(100% - 1.5rem);
  }

  body.site-tabela .header-row {
    min-height: 3.85rem;
    padding-inline: 0.65rem;
  }

  body.site-tabela .primary-nav a,
  body.site-tabela .primary-nav a:not(.nav-priority) {
    border: 1px solid var(--mm-line);
    background: var(--mm-surface);
    color: var(--mm-ink-soft);
  }

  body.site-tabela .primary-nav .nav-trial {
    border-color: rgba(29, 84, 212, 0.82);
    background: linear-gradient(135deg, #1d54d4, #5730c5);
    color: #fff;
  }

  .theme-toggle {
    position: absolute;
    top: 0.68rem;
    right: 4.1rem;
    margin: 0;
  }

  body.site-tabela:not(.home-tabela) .page-hero,
  body.site-tabela:not(.home-tabela) .article-header {
    padding-top: 5.5rem;
  }

  body.site-tabela:not(.home-tabela) .page-hero h1,
  body.site-tabela:not(.home-tabela) .article-header h1 {
    font-size: clamp(2.65rem, 13vw, 4rem);
  }

  body.home-tabela .tm-hero {
    padding-top: 5rem;
  }

  body.home-tabela .tm-hero h1 {
    font-size: clamp(3.15rem, 15vw, 4.8rem);
  }

  body.home-tabela .tm-hero-side {
    padding: 1.1rem;
  }

  body.site-tabela .shot-frame {
    padding: 0.3rem;
    border-radius: 1.1rem;
  }

  body.site-tabela .shot-frame picture,
  body.site-tabela .shot-frame img {
    border-radius: 0.82rem;
  }

  .feature-journey {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.site-tabela::before,
  body.site-tabela .page-hero > .eyebrow::after,
  body.site-tabela .article-header > .eyebrow::after {
    animation: none;
  }

  body.site-tabela .resource-card,
  body.site-tabela .feature-card,
  body.site-tabela .page-card,
  body.site-tabela .button,
  .theme-toggle,
  .setup-path {
    transition: none;
  }
}

@media print {
  :root {
    color-scheme: light;
    --mm-bg: #fff;
    --mm-bg-deep: #fff;
    --mm-surface: #fff;
    --mm-surface-strong: #fff;
    --mm-ink: #111;
    --mm-ink-soft: #222;
    --mm-muted: #444;
    --mm-line: #bbb;
  }

  body.site-tabela {
    background: #fff;
  }

  body.site-tabela::before,
  body.site-tabela::after,
  .theme-toggle {
    display: none !important;
  }
}
