html { scroll-behavior: smooth; }
  body { font-family: 'Inter', system-ui, sans-serif; background: #FAFAFA; color: #181817; -webkit-font-smoothing: antialiased; }
  .font-mono { font-family: 'JetBrains Mono', monospace; }

  /* Wordmark inline component (bichromatic) */
  .wm { font-family: 'Inter', sans-serif; font-weight: 900; letter-spacing: -0.04em; }
  .wm .tar { color: #181817; }
  .wm .ven { color: #3CFE01; }
  .wm.inverse .tar { color: #FAFAFA; }

  /* Linha-horizonte signature */
  .horizon { height: 2px; background: #3CFE01; border: 0; }

  /* Decorative blur radial (bg accent) */
  .blur-radial-green {
    background: radial-gradient(circle at 80% 20%, rgba(60, 254, 1, 0.08) 0%, transparent 60%);
  }
  .blur-radial-green-dark {
    background: radial-gradient(circle at 20% 80%, rgba(60, 254, 1, 0.1) 0%, transparent 60%);
  }

  /* Scroll reveal */
  .reveal { opacity: 0; transform: translateY(20px); transition: opacity 600ms ease-out, transform 600ms ease-out; }
  .reveal.in { opacity: 1; transform: translateY(0); }

  /* Card hover (consistent across cards) */
  .tarven-card {
    transition: border-color 200ms ease, transform 200ms ease;
  }
  .tarven-card:hover {
    border-color: #3CFE01;
    transform: translateY(-2px);
  }

  /* Animated underline link */
  .link-underline {
    position: relative;
    display: inline-block;
  }
  .link-underline::after {
    content: '';
    position: absolute;
    left: 0; bottom: -2px;
    width: 100%; height: 1px;
    background: #3CFE01;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 200ms ease;
  }
  .link-underline:hover::after { transform: scaleX(1); }

  /* (Header sticky shadow agora gerenciado por .pill-header.scrolled .pill-header-inner) */

  /* Mobile menu drawer */
  .mobile-drawer {
    transform: translateX(100%);
    transition: transform 300ms ease;
  }
  .mobile-drawer.open { transform: translateX(0); }

  /* Focus rings — visible, on-brand */
  *:focus-visible {
    outline: 2px solid #3CFE01;
    outline-offset: 2px;
  }

  /* Reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
    .tarven-card:hover { transform: none; }
    html { scroll-behavior: auto; }
  }

  /* Dashboard mockup (hero visual) */
  .mockup-card {
    background: #FAFAFA;
    border: 1px solid #E5E5E5;
    padding: 16px;
  }
  .mockup-card.dark {
    background: #181817;
    border-color: #2A2A29;
    color: #FAFAFA;
  }

  /* Grid pattern background (subtle) */
  .bg-grid {
    background-image:
      linear-gradient(to right, rgba(24, 24, 23, 0.03) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(24, 24, 23, 0.03) 1px, transparent 1px);
    background-size: 32px 32px;
  }
  .bg-grid-dotted {
    background-image: radial-gradient(rgba(24, 24, 23, 0.08) 1px, transparent 1px);
    background-size: 22px 22px;
  }

  /* Hero KLOD-style — orgânico verde radial atravessando */
  .bg-hero-klod {
    background:
      radial-gradient(ellipse 55% 45% at 22% 38%, rgba(60, 254, 1, 0.22) 0%, transparent 55%),
      radial-gradient(ellipse 50% 40% at 78% 62%, rgba(60, 254, 1, 0.18) 0%, transparent 55%),
      radial-gradient(ellipse 40% 30% at 50% 50%, rgba(60, 254, 1, 0.10) 0%, transparent 60%);
  }

  /* Orbit visualization (Amplemarket-style) */
  .orbit-wrap { position: relative; }
  .orbit-circle {
    position: absolute;
    top: 50%; left: 50%;
    border-radius: 50%;
    border: 1.5px dashed rgba(60, 254, 1, 0.25);
    pointer-events: none;
    transform: translate(-50%, -50%);
  }
  .orbit-1 {
    width: 38%; height: 38%;
    animation: orbit-circle-spin 80s linear infinite;
  }
  .orbit-2 {
    width: 68%; height: 68%;
    animation: orbit-circle-spin 130s linear infinite reverse;
  }
  .orbit-3 {
    width: 100%; height: 100%;
    border-color: rgba(24, 24, 23, 0.08);
    animation: orbit-circle-spin 200s linear infinite;
  }
  @keyframes orbit-circle-spin {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to   { transform: translate(-50%, -50%) rotate(360deg); }
  }

  /* Dots em órbita (satélites animados) */
  .orbit-dot-wrap {
    position: absolute;
    top: 50%; left: 50%;
    width: var(--orbit-r, 50%);
    height: var(--orbit-r, 50%);
    transform: translate(-50%, -50%);
    pointer-events: none;
    animation: orbit-dot-spin var(--orbit-speed, 30s) linear infinite;
    animation-direction: var(--orbit-dir, normal);
  }
  .orbit-dot-wrap > .orbit-dot {
    position: absolute;
    top: 0; left: 50%;
    width: 8px; height: 8px;
    margin-left: -4px;
    margin-top: -4px;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.7), 0 0 12px currentColor;
    z-index: 2;
  }
  @keyframes orbit-dot-spin {
    from { transform: translate(-50%, -50%) rotate(var(--orbit-start, 0deg)); }
    to   { transform: translate(-50%, -50%) rotate(calc(var(--orbit-start, 0deg) + 360deg)); }
  }
  /* Mantém as classes antigas pra não quebrar caso outros lugares usem */
  .orbit-dot:not(.orbit-dot-wrap > .orbit-dot) {
    position: absolute;
    width: 8px; height: 8px;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.6);
    z-index: 2;
  }
  @media (prefers-reduced-motion: reduce) {
    .orbit-circle, .orbit-dot-wrap, .orbit-center-halo {
      animation: none !important;
    }
  }
  html.dark .orbit-dot-wrap > .orbit-dot {
    box-shadow: 0 0 0 4px rgba(26, 26, 25, 0.7), 0 0 14px currentColor;
  }
  .orbit-center {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    z-index: 6;
  }
  .orbit-center-halo {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 180px; height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(60, 254, 1, 0.25) 0%, rgba(60, 254, 1, 0.08) 40%, transparent 70%);
    animation: pulse-halo 3s ease-in-out infinite;
  }
  @keyframes pulse-halo {
    0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
    50% { transform: translate(-50%, -50%) scale(1.15); opacity: 0.7; }
  }
  .orbit-center-inner {
    position: relative;
    width: 120px; height: 120px;
    background: #181817;
    border-radius: 28px;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 12px 40px rgba(60, 254, 1, 0.25);
  }
  @media (min-width: 1024px) {
    .orbit-center-inner { width: 140px; height: 140px; }
    .orbit-center-halo { width: 220px; height: 220px; }
  }
  /* Rotor — gira todos os ícones em torno do centro (suave, 480s = 8min/volta) */
  .orbit-rotor {
    position: absolute;
    inset: 0;
    animation: orbit-rotor-spin 480s linear infinite;
    transform-origin: center center;
    pointer-events: none;
  }
  .orbit-rotor > * { pointer-events: auto; }
  @keyframes orbit-rotor-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
  }
  /* Pose — counter-rotation: cancela a rotação do rotor pra labels ficarem em pé */
  .orbit-icon-pose {
    display: flex;
    flex-direction: column;
    align-items: center;
    animation: orbit-rotor-counter 480s linear infinite;
    transform-origin: center center;
  }
  @keyframes orbit-rotor-counter {
    from { transform: rotate(0deg); }
    to   { transform: rotate(-360deg); }
  }
  .orbit-icon {
    position: absolute;
    z-index: 4;
  }
  .orbit-icon-circle {
    transition: transform 200ms ease;
  }
  .orbit-icon:hover { z-index: 5; }
  .orbit-icon:hover .orbit-icon-circle { transform: scale(1.08); }
  @media (prefers-reduced-motion: reduce) {
    .orbit-rotor, .orbit-icon-pose { animation: none !important; }
  }
  .orbit-icon-md .orbit-icon-circle {
    width: 56px; height: 56px;
  }
  .orbit-icon-sm .orbit-icon-circle {
    width: 44px; height: 44px;
  }
  @media (min-width: 1024px) {
    .orbit-icon-md .orbit-icon-circle { width: 64px; height: 64px; }
    .orbit-icon-sm .orbit-icon-circle { width: 52px; height: 52px; }
  }
  .orbit-icon-circle {
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: white;
    box-shadow: 0 8px 24px rgba(24, 24, 23, 0.12);
    border: 3px solid white;
  }
  .orbit-label {
    margin-top: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    font-weight: 500;
    color: rgba(24, 24, 23, 0.7);
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(24, 24, 23, 0.08);
    border-radius: 999px;
    padding: 3px 10px;
    white-space: nowrap;
  }
  @media (prefers-reduced-motion: reduce) {
    .orbit-center-halo { animation: none; }
    .orbit-icon:hover { transform: none; }
  }

  /* Integrations hub (legacy — mantido pra fallback do CSS) */
  .hub-wrap { position: relative; min-height: 480px; }
  @media (min-width: 1024px) { .hub-wrap { min-height: 540px; } }
  .hub-center {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 120px; height: 120px;
    background: #181817;
    display: flex; align-items: center; justify-content: center;
    border-radius: 24px;
    box-shadow: 0 0 0 8px rgba(60, 254, 1, 0.08), 0 0 60px rgba(60, 254, 1, 0.25);
    z-index: 5;
  }
  @media (min-width: 1024px) {
    .hub-center { width: 140px; height: 140px; border-radius: 28px; }
  }
  .hub-node {
    position: absolute;
    width: 52px; height: 52px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700;
    font-size: 14px;
    color: #FAFAFA;
    box-shadow: 0 4px 16px rgba(24, 24, 23, 0.12);
    z-index: 4;
    transition: transform 200ms ease;
  }
  @media (min-width: 1024px) {
    .hub-node { width: 60px; height: 60px; }
  }
  .hub-node:hover { transform: scale(1.08); }
  .hub-node svg { width: 22px; height: 22px; }

  /* Feature cards (4 mini-cards do hero) — versão dinâmica */
  .feature-card {
    position: relative;
    border-radius: 20px;
    padding: 28px;
    min-height: 320px;
    overflow: hidden;
    transition: transform 280ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 280ms ease;
  }
  .feature-card-light {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(24, 24, 23, 0.08);
  }
  .feature-card-light:hover {
    transform: translateY(-6px);
    border-color: rgba(60, 254, 1, 0.5);
    box-shadow: 0 20px 40px -12px rgba(60, 254, 1, 0.15), 0 0 0 1px rgba(60, 254, 1, 0.1);
  }
  .feature-card-dark {
    background: linear-gradient(135deg, #181817 0%, #0A0A0A 100%);
    border: 1px solid rgba(60, 254, 1, 0.18);
  }
  .feature-card-dark:hover {
    transform: translateY(-6px);
    border-color: rgba(60, 254, 1, 0.6);
    box-shadow: 0 24px 48px -16px rgba(60, 254, 1, 0.4), 0 0 0 1px rgba(60, 254, 1, 0.15);
  }
  .feature-card-glow {
    position: absolute;
    top: -40%; right: -40%;
    width: 80%; height: 80%;
    background: radial-gradient(circle, rgba(60, 254, 1, 0.25) 0%, transparent 60%);
    pointer-events: none;
    transition: opacity 280ms ease;
    opacity: 0.6;
  }
  .feature-card-dark:hover .feature-card-glow { opacity: 1; }

  /* Método tabs (Why choose us-style) */
  .metodo-tab {
    display: inline-flex;
    align-items: center;
    padding: 10px 18px;
    border-radius: 999px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: rgba(24, 24, 23, 0.7);
    background: rgba(24, 24, 23, 0.02);
    border: 1px solid rgba(24, 24, 23, 0.12);
    cursor: pointer;
    transition: all 200ms ease;
    white-space: nowrap;
  }
  .metodo-tab:hover {
    background: rgba(24, 24, 23, 0.05);
    border-color: rgba(24, 24, 23, 0.2);
  }
  .metodo-tab-active {
    background: #181817 !important;
    color: #3CFE01 !important;
    border-color: #181817 !important;
  }
  .metodo-tab-active:hover {
    background: #0A0A0A !important;
  }

  /* Método card */
  .metodo-card {
    background: #FAFAFA;
    border: 1px solid rgba(24, 24, 23, 0.08);
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 8px 40px -12px rgba(24, 24, 23, 0.06);
  }
  .metodo-panel {
    animation: fade-in-soft 300ms ease;
  }
  @keyframes fade-in-soft {
    from { opacity: 0; }
    to { opacity: 1; }
  }

  /* Método dots pagination */
  .metodo-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: rgba(24, 24, 23, 0.15);
    border: 0;
    cursor: pointer;
    transition: all 200ms ease;
  }
  .metodo-dot:hover { background: rgba(24, 24, 23, 0.3); }
  .metodo-dot-active {
    width: 24px;
    background: #3CFE01 !important;
    border-radius: 999px;
  }

  /* Pulse dot animation for live status */
  .pulse-dot {
    animation: pulse-green 1.6s ease-in-out infinite;
  }
  @keyframes pulse-green {
    0%, 100% { box-shadow: 0 0 0 0 rgba(60, 254, 1, 0.6); }
    50% { box-shadow: 0 0 0 4px rgba(60, 254, 1, 0); }
  }
  @media (prefers-reduced-motion: reduce) {
    .pulse-dot { animation: none; }
    .feature-card:hover { transform: none; }
  }

  /* Bento card */
  .bento-card {
    background: #FAFAFA;
    border: 1px solid rgba(24, 24, 23, 0.08);
    border-radius: 16px;
    padding: 28px;
    transition: border-color 200ms ease, transform 200ms ease;
    overflow: hidden;
    position: relative;
  }
  .bento-card:hover {
    border-color: #3CFE01;
    transform: translateY(-2px);
  }
  .bento-mockup {
    background: #FFFFFF;
    border: 1px solid rgba(24, 24, 23, 0.06);
    border-radius: 10px;
    padding: 14px;
  }

  /* Marca-texto highlight (depoimentos) */
  .marker-highlight {
    position: relative;
    display: inline-block;
    padding: 0 0.18em;
    z-index: 0;
  }
  .marker-highlight::before {
    content: '';
    position: absolute;
    left: -0.1em; right: -0.1em;
    top: 18%; bottom: 8%;
    background: rgba(60, 254, 1, 0.55);
    z-index: -1;
    transform: skewX(-6deg) rotate(-1deg);
    border-radius: 2px;
  }

  /* FAQ accordion */
  .faq-item {
    background: #FAFAFA;
    border: 1px solid rgba(24, 24, 23, 0.08);
    border-radius: 12px;
    overflow: hidden;
    transition: border-color 200ms ease, box-shadow 200ms ease;
  }
  .faq-item[open] {
    border-color: rgba(60, 254, 1, 0.4);
    box-shadow: 0 8px 24px -16px rgba(60, 254, 1, 0.18);
  }
  .faq-item:hover { border-color: rgba(24, 24, 23, 0.18); }
  .faq-item[open]:hover { border-color: rgba(60, 254, 1, 0.5); }
  .faq-summary {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 18px 22px;
    cursor: pointer;
    list-style: none;
    user-select: none;
    font-size: 16px;
  }
  .faq-summary::-webkit-details-marker { display: none; }
  .faq-icon {
    flex-shrink: 0;
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 999px;
    background: rgba(24, 24, 23, 0.04);
    color: #181817;
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    transition: transform 200ms ease, background 200ms ease, color 200ms ease;
  }
  .faq-item[open] .faq-icon {
    background: #3CFE01;
    color: #181817;
    transform: rotate(45deg);
  }
  .faq-body {
    padding: 0 22px 20px 22px;
    color: rgba(24, 24, 23, 0.7);
    font-size: 15px;
    line-height: 1.65;
    max-width: 60ch;
  }
  .faq-body p { margin: 0; }
  .faq-body strong { color: #181817; font-weight: 600; }

  /* Comparativo (Tarven vs alternativas) */
  .comparativo {
    border-radius: 12px;
    overflow: hidden;
  }
  .comparativo th, .comparativo td {
    vertical-align: middle;
    transition: background 200ms ease;
  }
  .comparativo thead th {
    border-bottom: 1px solid rgba(24, 24, 23, 0.08);
  }
  .comparativo tbody td:first-child {
    background: rgba(24, 24, 23, 0.025);
    border-right: 1px solid rgba(24, 24, 23, 0.05);
  }
  .comparativo tbody tr:hover td:not(:first-child):not(.bg-tarven-dark\/95) {
    background: rgba(60, 254, 1, 0.04);
  }
  .comparativo tbody tr:hover td:first-child {
    background: rgba(60, 254, 1, 0.08);
  }
  .comparativo tbody tr:last-child td:nth-child(2) {
    border-bottom-left-radius: 8px;
  }
  .comparativo-wrap {
    -webkit-overflow-scrolling: touch;
  }
  /* Indicador de scroll horizontal no mobile */
  @media (max-width: 1023px) {
    .comparativo-wrap {
      mask-image: linear-gradient(to right, black calc(100% - 24px), transparent);
      -webkit-mask-image: linear-gradient(to right, black calc(100% - 24px), transparent);
    }
  }

  /* Card depoimento */
  .quote-card {
    background: #FAFAFA;
    border: 1px solid rgba(24, 24, 23, 0.08);
    border-radius: 16px;
    padding: 28px;
    transition: border-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
    position: relative;
  }
  .quote-card:hover {
    border-color: #3CFE01;
    transform: translateY(-2px);
    box-shadow: 0 12px 32px -16px rgba(60, 254, 1, 0.18);
  }
  .quote-avatar {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(60, 254, 1, 0.25), rgba(60, 254, 1, 0.08));
    border: 1px solid rgba(60, 254, 1, 0.4);
    display: flex; align-items: center; justify-content: center;
    font-weight: 600; font-size: 13px;
    color: #181817;
    flex-shrink: 0;
  }

  /* Mega menu */
  .nav-item {
    position: relative;
    display: inline-flex;
  }
  .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #181817;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 4px;
    background: transparent;
    border: 0;
    cursor: pointer;
    transition: color 150ms ease;
    white-space: nowrap;
  }
  .nav-link:hover, .nav-item:hover .nav-link {
    color: #2BC100;
  }
  .nav-link.active {
    color: #3CFE01;
    font-weight: 600;
    background: #181817;
    border-radius: 999px;
    padding: 8px 12px;
  }
  .nav-link svg.chevron {
    transition: transform 200ms ease;
  }
  .nav-item:hover .nav-link svg.chevron {
    transform: rotate(180deg);
  }

  .mega-menu {
    position: absolute;
    top: calc(100% + 16px);
    left: 50%;
    transform: translateX(-50%) translateY(-8px);
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(24, 24, 23, 0.08);
    border-radius: 24px;
    box-shadow: 0 24px 60px -10px rgba(24, 24, 23, 0.18), 0 4px 12px rgba(24, 24, 23, 0.06);
    padding: 18px;
    width: 820px;
    max-width: calc(100vw - 48px);
    opacity: 0;
    visibility: hidden;
    /* delay de 120ms só no fechamento — dá tempo do cursor cruzar o gap */
    transition: opacity 200ms ease, transform 200ms ease, visibility 0ms 120ms;
    pointer-events: none;
    z-index: 60;
  }
  /* Ponte invisível que cobre o gap entre o botão e o menu */
  .mega-menu::before {
    content: '';
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    height: 20px;
  }
  .nav-item:hover .mega-menu,
  .mega-menu:hover,
  .mega-menu.open {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
    /* sem delay ao abrir */
    transition: opacity 200ms ease, transform 200ms ease, visibility 0ms;
  }

  .mega-grid {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 18px;
  }
  .mega-hero {
    position: relative;
    background: linear-gradient(160deg, #181817 0%, #0A0A0A 100%);
    border-radius: 16px;
    padding: 24px;
    color: #FAFAFA;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    min-height: 280px;
  }
  .mega-hero::before {
    content: '';
    position: absolute;
    top: -40%; right: -40%;
    width: 80%; height: 80%;
    background: radial-gradient(circle, rgba(60, 254, 1, 0.18) 0%, transparent 65%);
    pointer-events: none;
  }
  .mega-hero h4 {
    position: relative;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.01em;
    margin-bottom: 8px;
  }
  .mega-hero h4 em {
    font-style: italic;
    color: #3CFE01;
    font-weight: 700;
  }
  .mega-hero p {
    position: relative;
    font-size: 13px;
    color: rgba(250, 250, 250, 0.7);
    margin-bottom: 16px;
    line-height: 1.5;
  }
  .mega-hero-cta {
    position: relative;
    align-self: flex-start;
    background: #3CFE01;
    color: #181817;
    font-size: 13px;
    font-weight: 600;
    padding: 9px 18px;
    border-radius: 999px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background 150ms ease;
  }
  .mega-hero-cta:hover { background: #5FFF36; }

  .mega-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 16px;
  }
  .mega-col-title {
    grid-column: span 1;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #181817;
    padding: 0 10px;
    margin-bottom: 4px;
  }
  .mega-link {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px;
    border-radius: 12px;
    text-decoration: none;
    transition: background 150ms ease, transform 150ms ease;
  }
  .mega-link:hover {
    background: rgba(60, 254, 1, 0.08);
  }
  .mega-link-icon {
    width: 36px; height: 36px;
    background: rgba(24, 24, 23, 0.05);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 150ms ease;
  }
  .mega-link:hover .mega-link-icon {
    background: rgba(60, 254, 1, 0.18);
  }
  .mega-link-text {
    flex: 1; min-width: 0;
  }
  .mega-link-text strong {
    display: block;
    font-size: 13.5px;
    font-weight: 600;
    color: #181817;
    margin-bottom: 2px;
    line-height: 1.3;
  }
  .mega-link-text span {
    display: block;
    font-size: 11.5px;
    color: rgba(24, 24, 23, 0.55);
    line-height: 1.4;
  }

  /* Mobile accordion (mega menu mobile) */
  .m-acc {
    border-bottom: 1px solid rgba(250, 250, 250, 0.06);
  }
  .m-acc-trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 8px;
    background: transparent;
    border: 0;
    color: #FAFAFA;
    font-size: 17px;
    font-weight: 500;
    cursor: pointer;
    text-align: left;
  }
  .m-acc-trigger:hover {
    color: #3CFE01;
  }
  .m-acc-trigger.active {
    color: #3CFE01;
    font-weight: 700;
  }
  .m-acc-chev {
    transition: transform 250ms cubic-bezier(0.16, 1, 0.3, 1);
    color: rgba(250, 250, 250, 0.4);
  }
  .m-acc-trigger.open .m-acc-chev {
    transform: rotate(180deg);
    color: #3CFE01;
  }
  .m-acc-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 300ms cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .m-acc-panel.open {
    max-height: 1200px;
    padding-bottom: 12px;
  }
  .m-acc-link {
    display: block;
    position: relative;
    padding: 10px 12px 10px 22px;
    background: rgba(250, 250, 250, 0.03);
    border: 1px solid rgba(250, 250, 250, 0.08);
    border-radius: 10px;
    text-decoration: none;
    transition: background 150ms ease, border-color 150ms ease;
  }
  .m-acc-link::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 50%;
    width: 4px;
    height: 4px;
    margin-top: -2px;
    border-radius: 50%;
    background: rgba(60, 254, 1, 0.5);
    transition: background 150ms ease, transform 150ms ease;
  }
  .m-acc-link:hover, .m-acc-link:active {
    background: rgba(60, 254, 1, 0.08);
    border-color: rgba(60, 254, 1, 0.3);
  }
  .m-acc-link:hover::before, .m-acc-link:active::before {
    background: #3CFE01;
    transform: scale(1.5);
  }
  .m-acc-link strong {
    display: block;
    color: #FAFAFA;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 2px;
    line-height: 1.3;
  }
  .m-acc-link span {
    display: block;
    font-size: 12px;
    color: rgba(250, 250, 250, 0.55);
    line-height: 1.4;
  }
  .m-acc-link-highlight {
    background: rgba(60, 254, 1, 0.08);
    border-color: rgba(60, 254, 1, 0.3);
  }
  .m-acc-link-highlight::before {
    background: #3CFE01;
  }
  .m-acc-section-label {
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    font-weight: 500;
    color: rgba(250, 250, 250, 0.4);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 8px 12px 4px;
    margin-top: 4px;
  }
  .m-acc-section-label:first-child {
    margin-top: 0;
  }
  .m-acc-link-simple {
    display: block;
    padding: 16px 8px;
    color: #FAFAFA;
    font-size: 17px;
    font-weight: 500;
    text-decoration: none;
    border-bottom: 1px solid rgba(250, 250, 250, 0.06);
    transition: color 150ms ease;
  }
  .m-acc-link-simple:hover {
    color: #3CFE01;
  }

  /* Theme toggle */
  .theme-toggle {
    width: 38px; height: 38px;
    border: 1px solid rgba(24, 24, 23, 0.1);
    border-radius: 999px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 200ms ease;
    color: #181817;
  }
  .theme-toggle:hover {
    background: rgba(24, 24, 23, 0.05);
    border-color: rgba(24, 24, 23, 0.2);
  }
  .theme-toggle svg { width: 16px; height: 16px; }
  .theme-toggle .icon-moon { display: none; }
  html.dark .theme-toggle .icon-sun { display: none; }
  html.dark .theme-toggle .icon-moon { display: block; }

  /* ============================================
     DARK MODE — overrides globais
     ============================================ */
  html.dark body {
    background: #0A0A0A;
    color: #FAFAFA;
  }

  /* — Backgrounds — */
  html.dark .bg-tarven-white { background-color: #0A0A0A !important; }
  html.dark .bg-white { background-color: #1A1A19 !important; }
  html.dark .bg-white\/70,
  html.dark .bg-white\/75,
  html.dark .bg-white\/85,
  html.dark .bg-white\/96,
  html.dark .bg-white\/97 {
    background-color: rgba(26, 26, 25, 0.75) !important;
  }
  html.dark .bg-tarven-darker { background-color: #050505 !important; }

  /* Sections explicitamente dark mantêm */
  html.dark .bg-tarven-dark { background-color: #181817 !important; }

  /* — Text — */
  html.dark .text-tarven-dark { color: #FAFAFA !important; }
  html.dark .text-tarven-dark\/80 { color: rgba(250, 250, 250, 0.8) !important; }
  html.dark .text-tarven-dark\/70 { color: rgba(250, 250, 250, 0.7) !important; }
  html.dark .text-tarven-dark\/65 { color: rgba(250, 250, 250, 0.65) !important; }
  html.dark .text-tarven-dark\/60 { color: rgba(250, 250, 250, 0.6) !important; }
  html.dark .text-tarven-dark\/55 { color: rgba(250, 250, 250, 0.55) !important; }
  html.dark .text-tarven-dark\/50 { color: rgba(250, 250, 250, 0.5) !important; }
  html.dark .text-tarven-dark\/40 { color: rgba(250, 250, 250, 0.4) !important; }
  html.dark .text-tarven-dark\/30 { color: rgba(250, 250, 250, 0.25) !important; }

  /* — Borders — */
  html.dark .border-tarven-dark\/5 { border-color: rgba(250, 250, 250, 0.05) !important; }
  html.dark .border-tarven-dark\/8 { border-color: rgba(250, 250, 250, 0.08) !important; }
  html.dark .border-tarven-dark\/10 { border-color: rgba(250, 250, 250, 0.1) !important; }
  html.dark .border-tarven-dark\/12 { border-color: rgba(250, 250, 250, 0.12) !important; }
  html.dark .border-tarven-dark { border-color: #FAFAFA !important; }

  /* — Backgrounds com opacity — */
  html.dark .bg-tarven-dark\/5 { background-color: rgba(250, 250, 250, 0.04) !important; }

  /* — Hero blur radial mais sutil em dark — */
  html.dark .bg-hero-klod {
    background:
      radial-gradient(ellipse 55% 45% at 22% 38%, rgba(60, 254, 1, 0.16) 0%, transparent 55%),
      radial-gradient(ellipse 50% 40% at 78% 62%, rgba(60, 254, 1, 0.10) 0%, transparent 55%);
  }
  html.dark .bg-grid-dotted {
    background-image: radial-gradient(rgba(250, 250, 250, 0.06) 1px, transparent 1px);
  }
  html.dark .bg-grid {
    background-image:
      linear-gradient(to right, rgba(250, 250, 250, 0.04) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(250, 250, 250, 0.04) 1px, transparent 1px);
  }

  /* — Pill header — */
  html.dark .pill-header-inner {
    background: rgba(24, 24, 23, 0.85);
    border-color: rgba(60, 254, 1, 0.15);
  }
  html.dark .pill-header.scrolled .pill-header-inner {
    background: rgba(24, 24, 23, 0.95);
  }
  html.dark .nav-link { color: #FAFAFA; }
  html.dark .nav-link:hover, html.dark .nav-item:hover .nav-link { color: #3CFE01; }
  html.dark .nav-link.active { color: #3CFE01; background: #0A0A0A; }
  html.dark .theme-toggle {
    color: #FAFAFA;
    border-color: rgba(250, 250, 250, 0.15);
  }
  html.dark .theme-toggle:hover {
    background: rgba(250, 250, 250, 0.1);
    border-color: rgba(250, 250, 250, 0.25);
  }
  html.dark .wm .tar { color: #FAFAFA; }

  /* — Mega menu — */
  html.dark .mega-menu {
    background: rgba(15, 15, 14, 0.97);
    border-color: rgba(250, 250, 250, 0.08);
    box-shadow: 0 24px 60px -10px rgba(0, 0, 0, 0.6), 0 4px 12px rgba(0, 0, 0, 0.3);
  }
  html.dark .mega-link:hover {
    background: rgba(60, 254, 1, 0.1);
  }
  html.dark .mega-link-icon {
    background: rgba(250, 250, 250, 0.06);
  }
  html.dark .mega-link:hover .mega-link-icon {
    background: rgba(60, 254, 1, 0.18);
  }
  html.dark .mega-link-icon svg {
    stroke: #FAFAFA !important;
  }
  html.dark .mega-link-text strong { color: #FAFAFA; }
  html.dark .mega-link-text span { color: rgba(250, 250, 250, 0.55); }
  html.dark .mega-col-title { color: #FAFAFA; }
  html.dark .mega-link-text strong .bg-tarven-green {
    background-color: #3CFE01 !important;
    color: #181817 !important;
  }

  /* — Feature cards — */
  html.dark .feature-card-light {
    background: rgba(26, 26, 25, 0.7) !important;
    border-color: rgba(250, 250, 250, 0.08) !important;
  }
  html.dark .feature-card-light h3 { color: #FAFAFA !important; }
  html.dark .feature-card-light p { color: rgba(250, 250, 250, 0.6) !important; }
  html.dark .feature-card-light .bg-tarven-dark\/5 {
    background-color: rgba(250, 250, 250, 0.05) !important;
  }

  /* — Tarven cards (genéricos) — */
  html.dark .tarven-card {
    background: rgba(26, 26, 25, 0.5);
    border-color: rgba(250, 250, 250, 0.08);
  }

  /* — Bento card — */
  html.dark .bento-card {
    background: #1A1A19;
    border-color: rgba(250, 250, 250, 0.08);
  }
  html.dark .bento-mockup {
    background: #2A2A29;
    border-color: rgba(250, 250, 250, 0.06);
  }

  /* — Método (tabs + card + dots) — */
  html.dark .metodo-tab {
    color: rgba(250, 250, 250, 0.7);
    background: rgba(250, 250, 250, 0.04);
    border-color: rgba(250, 250, 250, 0.12);
  }
  html.dark .metodo-tab:hover {
    background: rgba(250, 250, 250, 0.08);
    border-color: rgba(250, 250, 250, 0.2);
  }
  html.dark .metodo-tab-active {
    background: #3CFE01 !important;
    color: #181817 !important;
    border-color: #3CFE01 !important;
  }
  html.dark .metodo-tab-active:hover {
    background: #5FFF36 !important;
  }
  html.dark .metodo-card {
    background: #1A1A19;
    border-color: rgba(250, 250, 250, 0.08);
    box-shadow: 0 8px 40px -12px rgba(0, 0, 0, 0.5);
  }
  html.dark .metodo-dot { background: rgba(250, 250, 250, 0.2); }
  html.dark .metodo-dot:hover { background: rgba(250, 250, 250, 0.4); }
  html.dark .metodo-dot-active {
    background: #3CFE01 !important;
  }

  /* — Orbit (integrações) — */
  html.dark .orbit-circle { border-color: rgba(60, 254, 1, 0.2); }
  html.dark .orbit-circle.orbit-3 { border-color: rgba(250, 250, 250, 0.06); }
  html.dark .orbit-label {
    background: rgba(26, 26, 25, 0.85) !important;
    border-color: rgba(250, 250, 250, 0.1) !important;
    color: rgba(250, 250, 250, 0.7) !important;
  }
  html.dark .orbit-icon-circle {
    border-color: #1A1A19;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
  }
  html.dark .orbit-center-inner {
    background: #FAFAFA;
  }
  html.dark .orbit-center-inner img {
    filter: invert(1);
  }

  /* — Mockup card — */
  html.dark .mockup-card {
    background: #1A1A19;
    border-color: rgba(250, 250, 250, 0.08);
  }
  html.dark .mockup-card.dark { background: #181817; }

  /* — FAQ accordion — */
  html.dark .faq-item {
    background: #1A1A19;
    border-color: rgba(250, 250, 250, 0.08);
  }
  html.dark .faq-item:hover { border-color: rgba(250, 250, 250, 0.18); }
  html.dark .faq-item[open] { border-color: rgba(60, 254, 1, 0.5); }
  html.dark .faq-summary .text-tarven-dark { color: #FAFAFA !important; }
  html.dark .faq-icon {
    background: rgba(250, 250, 250, 0.08);
    color: #FAFAFA;
  }
  html.dark .faq-item[open] .faq-icon { color: #181817; }
  html.dark .faq-body { color: rgba(250, 250, 250, 0.7); }
  html.dark .faq-body strong { color: #FAFAFA; }

  /* — Comparativo (Tarven vs alternativas) — */
  html.dark .comparativo thead th { border-bottom-color: rgba(250, 250, 250, 0.08); }
  html.dark .comparativo tbody tr { border-color: rgba(250, 250, 250, 0.08) !important; }
  html.dark .comparativo tbody td:first-child {
    background: rgba(250, 250, 250, 0.04);
    border-right-color: rgba(250, 250, 250, 0.08);
    color: #FAFAFA !important;
  }
  html.dark .comparativo tbody td { color: rgba(250, 250, 250, 0.7) !important; }
  html.dark .comparativo tbody td.bg-tarven-dark\/95 {
    background: #0A0A0A !important;
    color: #FAFAFA !important;
  }
  html.dark .comparativo thead th .text-tarven-dark\/70 { color: rgba(250, 250, 250, 0.7) !important; }
  html.dark .comparativo thead th .text-tarven-dark\/40 { color: rgba(250, 250, 250, 0.4) !important; }
  html.dark .comparativo .font-medium.text-tarven-dark { color: #FAFAFA !important; }
  html.dark .comparativo tbody tr:hover td:not(:first-child):not(.bg-tarven-dark\/95) {
    background: rgba(60, 254, 1, 0.06);
  }
  html.dark .comparativo tbody tr:hover td:first-child {
    background: rgba(60, 254, 1, 0.10);
  }

  /* — Quote card (depoimentos) — */
  html.dark .quote-card {
    background: #1A1A19;
    border-color: rgba(250, 250, 250, 0.08);
  }
  html.dark .quote-card:hover {
    border-color: #3CFE01;
    box-shadow: 0 12px 32px -16px rgba(60, 254, 1, 0.3);
  }
  html.dark .quote-card blockquote span.text-tarven-dark {
    color: #FAFAFA !important;
  }
  html.dark .quote-card blockquote span.text-tarven-dark\/40 {
    color: rgba(250, 250, 250, 0.5) !important;
  }
  html.dark .quote-card .text-tarven-dark { color: #FAFAFA !important; }
  html.dark .quote-card .text-tarven-dark\/60 { color: rgba(250, 250, 250, 0.6) !important; }
  html.dark .quote-card .border-tarven-dark\/10 { border-color: rgba(250, 250, 250, 0.1) !important; }
  html.dark .quote-avatar {
    color: #FAFAFA;
    background: linear-gradient(135deg, rgba(60, 254, 1, 0.35), rgba(60, 254, 1, 0.12));
    border-color: rgba(60, 254, 1, 0.5);
  }

  /* — Marker highlight (verde brush) mantém visível em dark — */
  html.dark .marker-highlight::before {
    background: rgba(60, 254, 1, 0.5);
  }
  html.dark .marker-highlight {
    color: #FAFAFA !important;
  }

  /* — Blur radial green sutil (aside cards/sections) — */
  html.dark .blur-radial-green {
    background: radial-gradient(circle at 80% 20%, rgba(60, 254, 1, 0.05) 0%, transparent 60%);
  }
  html.dark .blur-radial-green-dark {
    background: radial-gradient(circle at 20% 80%, rgba(60, 254, 1, 0.08) 0%, transparent 60%);
  }

  /* — Linha-horizonte e divisores específicos — */
  html.dark .horizon { background: #3CFE01; }

  /* — Form blur (cards translúcidos) — */
  html.dark .backdrop-blur,
  html.dark .backdrop-blur-sm,
  html.dark .backdrop-blur-md {
    background-color: rgba(26, 26, 25, 0.7);
  }

  /* — Pill tags em hero (text-tarven-green-dark) — fica mais brilhante em dark — */
  html.dark .text-tarven-green-dark { color: #3CFE01 !important; }

  /* — CTA primary (dark sobre light) inverte: agora vira light sobre dark — */
  html.dark .bg-tarven-dark.text-tarven-green {
    background-color: #FAFAFA !important;
    color: #181817 !important;
  }
  html.dark .bg-tarven-dark.text-tarven-green:hover,
  html.dark .hover\:bg-tarven-darker:hover {
    background-color: #FFFFFF !important;
  }
  html.dark .border-tarven-dark.text-tarven-dark {
    border-color: #FAFAFA !important;
    color: #FAFAFA !important;
  }
  html.dark .border-tarven-dark.text-tarven-dark:hover {
    background-color: #FAFAFA !important;
    color: #181817 !important;
  }

  /* — Strong text dentro de p (hero) — */
  html.dark p strong.text-tarven-dark {
    color: #FAFAFA !important;
  }

  /* — Italics / highlights italic verde — */
  html.dark .italic.text-tarven-green-dark {
    color: #5FFF36 !important;
  }

  /* — Stats borders — */
  html.dark .border-l.border-tarven-dark\/10 { border-color: rgba(250, 250, 250, 0.1) !important; }

  /* — Dotted border (orbit) override garantido — */
  html.dark .orbit-circle { border-style: dashed; }

  @media (prefers-reduced-motion: reduce) {
    .mega-menu, .mega-link, .theme-toggle, .nav-link svg.chevron {
      transition: none !important;
    }
  }

  /* Pill header */
  .pill-header {
    transition: all 250ms ease;
  }
  .pill-header-inner {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(24, 24, 23, 0.08);
    box-shadow: 0 1px 2px rgba(24, 24, 23, 0.04), 0 8px 24px rgba(24, 24, 23, 0.05);
  }
  .pill-header.scrolled .pill-header-inner {
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 1px 2px rgba(24, 24, 23, 0.06), 0 12px 32px rgba(24, 24, 23, 0.08);
  }
/* ============================================
   LEAD FORMS — micro-forms inline + form longo
   ============================================ */
.lead-form {
  background: #FAFAFA;
  border: 1px solid rgba(24, 24, 23, 0.08);
  border-radius: 16px;
  padding: 24px;
  position: relative;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}
.lead-form:focus-within {
  border-color: rgba(60, 254, 1, 0.5);
  box-shadow: 0 8px 24px -16px rgba(60, 254, 1, 0.18);
}
.lead-form.is-success { border-color: #3CFE01; }
.lead-form-fields {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
}
@media (min-width: 640px) {
  .lead-form-fields { grid-template-columns: 1fr 1fr; }
  .lead-form-fields:has(>:only-child) { grid-template-columns: 1fr; }
}
.lead-form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.lead-form-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(24, 24, 23, 0.55);
}
.lead-form-field input,
.lead-form-field select,
.lead-form-field textarea {
  width: 100%;
  padding: 10px 12px;
  background: #FFFFFF;
  border: 1px solid rgba(24, 24, 23, 0.12);
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #181817;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}
.lead-form-field input:focus,
.lead-form-field select:focus,
.lead-form-field textarea:focus {
  border-color: #3CFE01;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(60, 254, 1, 0.15);
}
.lead-form-field input.is-invalid,
.lead-form-field select.is-invalid {
  border-color: #FF3344;
  box-shadow: 0 0 0 3px rgba(255, 51, 68, 0.12);
}
.lead-form-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 12px 22px;
  background: #181817;
  color: #3CFE01;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  transition: background 150ms ease, transform 150ms ease;
}
.lead-form-submit:hover { background: #0A0A0A; }
.lead-form-submit:active { transform: scale(0.98); }
.lead-form-submit:disabled { opacity: 0.6; cursor: not-allowed; }
.lead-form-submit.is-loading::after {
  content: '';
  width: 14px; height: 14px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: lead-spin 600ms linear infinite;
}
@keyframes lead-spin { to { transform: rotate(360deg); } }
.lead-form-disclaimer {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(24, 24, 23, 0.5);
  margin-top: 12px;
  margin-bottom: 0;
  line-height: 1.5;
}
.lead-form-success {
  background: rgba(60, 254, 1, 0.1);
  border: 1px solid rgba(60, 254, 1, 0.4);
  color: #181817;
  padding: 14px 16px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  margin-top: 14px;
}
.lead-form-error {
  background: rgba(255, 51, 68, 0.08);
  border: 1px solid rgba(255, 51, 68, 0.3);
  color: #B91C1C;
  padding: 12px 14px;
  border-radius: 10px;
  font-size: 13px;
  margin-top: 12px;
}

/* Form longo (diagnóstico) */
.lead-form.lead-form-long { padding: 32px; }
.lead-form-section {
  padding-top: 24px;
  margin-top: 24px;
  border-top: 1px solid rgba(24, 24, 23, 0.08);
}
.lead-form-section:first-of-type {
  padding-top: 0;
  margin-top: 0;
  border-top: 0;
}
.lead-form-section-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #2BC100;
  margin-bottom: 12px;
}
.lead-form-help {
  font-size: 13px;
  color: rgba(24, 24, 23, 0.55);
  margin-top: 4px;
  font-family: 'Inter', sans-serif;
}
.lead-form-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.lead-form-radio { position: relative; }
.lead-form-radio input { position: absolute; opacity: 0; pointer-events: none; }
.lead-form-radio span {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  background: #FFFFFF;
  border: 1px solid rgba(24, 24, 23, 0.12);
  border-radius: 999px;
  font-size: 13px;
  cursor: pointer;
  transition: all 150ms ease;
}
.lead-form-radio:hover span { border-color: rgba(24, 24, 23, 0.25); }
.lead-form-radio input:checked + span {
  background: #181817;
  color: #3CFE01;
  border-color: #181817;
}
.lead-form-radio input:focus-visible + span {
  box-shadow: 0 0 0 3px rgba(60, 254, 1, 0.3);
}

html.dark .lead-form { background: #1A1A19; border-color: rgba(250, 250, 250, 0.08); }
html.dark .lead-form-field input,
html.dark .lead-form-field select,
html.dark .lead-form-field textarea {
  background: #0A0A0A;
  border-color: rgba(250, 250, 250, 0.12);
  color: #FAFAFA;
}
html.dark .lead-form-field input:focus,
html.dark .lead-form-field select:focus,
html.dark .lead-form-field textarea:focus { border-color: #3CFE01; }
html.dark .lead-form-label { color: rgba(250, 250, 250, 0.55); }
html.dark .lead-form-disclaimer { color: rgba(250, 250, 250, 0.5); }
html.dark .lead-form-section { border-top-color: rgba(250, 250, 250, 0.08); }
html.dark .lead-form-radio span {
  background: rgba(250, 250, 250, 0.04);
  border-color: rgba(250, 250, 250, 0.12);
  color: #FAFAFA;
}
html.dark .lead-form-radio input:checked + span {
  background: #3CFE01;
  color: #181817;
  border-color: #3CFE01;
}

/* Inline CTA banner */
.inline-cta {
  background: linear-gradient(135deg, #181817 0%, #0A0A0A 100%);
  border: 1px solid rgba(60, 254, 1, 0.18);
  border-radius: 16px;
  padding: 28px 32px;
  position: relative;
  overflow: hidden;
}
.inline-cta::before {
  content: '';
  position: absolute;
  top: -50%; right: -20%;
  width: 60%; height: 200%;
  background: radial-gradient(circle, rgba(60, 254, 1, 0.18) 0%, transparent 60%);
  pointer-events: none;
}
.inline-cta > * { position: relative; }

/* Article prose (long-form) */
.prose-tarven {
  max-width: 68ch;
  font-size: 17px;
  line-height: 1.7;
  color: rgba(24, 24, 23, 0.85);
}
.prose-tarven h2 {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: #181817;
  margin-top: 2.5em;
  margin-bottom: 0.6em;
}
.prose-tarven h3 {
  font-size: 1.4rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: #181817;
  margin-top: 1.8em;
  margin-bottom: 0.5em;
}
.prose-tarven h4 {
  font-size: 1.125rem;
  font-weight: 600;
  color: #181817;
  margin-top: 1.5em;
  margin-bottom: 0.4em;
}
.prose-tarven p { margin: 0.9em 0; }
.prose-tarven a {
  color: #181817;
  text-decoration: underline;
  text-decoration-color: #3CFE01;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
.prose-tarven a:hover { color: #2BC100; }
.prose-tarven ul, .prose-tarven ol {
  margin: 0.9em 0;
  padding-left: 1.4em;
}
.prose-tarven li { margin: 0.4em 0; }
.prose-tarven ul li::marker { color: #3CFE01; }
.prose-tarven blockquote {
  border-left: 4px solid #3CFE01;
  padding: 0.6em 1.2em;
  margin: 1.5em 0;
  font-style: italic;
  color: rgba(24, 24, 23, 0.7);
}
.prose-tarven code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.92em;
  background: rgba(24, 24, 23, 0.06);
  padding: 0.15em 0.4em;
  border-radius: 4px;
}
.prose-tarven hr {
  border: 0;
  border-top: 1px solid rgba(24, 24, 23, 0.1);
  margin: 2.5em 0;
}
.prose-tarven table {
  border-collapse: collapse;
  width: 100%;
  margin: 1.5em 0;
  font-size: 14px;
}
.prose-tarven th, .prose-tarven td {
  text-align: left;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(24, 24, 23, 0.08);
}
.prose-tarven th {
  background: rgba(24, 24, 23, 0.03);
  font-weight: 600;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.prose-tarven .lead {
  font-size: 1.25rem;
  line-height: 1.55;
  color: rgba(24, 24, 23, 0.7);
  margin-bottom: 1.5em;
}

html.dark .prose-tarven { color: rgba(250, 250, 250, 0.85); }
html.dark .prose-tarven h2,
html.dark .prose-tarven h3,
html.dark .prose-tarven h4 { color: #FAFAFA; }
html.dark .prose-tarven a { color: #FAFAFA; }
html.dark .prose-tarven a:hover { color: #5FFF36; }
html.dark .prose-tarven blockquote { color: rgba(250, 250, 250, 0.7); }
html.dark .prose-tarven code { background: rgba(250, 250, 250, 0.08); color: #FAFAFA; }
html.dark .prose-tarven hr { border-top-color: rgba(250, 250, 250, 0.1); }
html.dark .prose-tarven th { background: rgba(250, 250, 250, 0.04); color: rgba(250, 250, 250, 0.7); }
html.dark .prose-tarven th, html.dark .prose-tarven td { border-bottom-color: rgba(250, 250, 250, 0.08); }
html.dark .prose-tarven .lead { color: rgba(250, 250, 250, 0.7); }

/* TOC (Table of contents) flutuante para pillars */
.toc-side {
  position: sticky;
  top: 100px;
  font-size: 13px;
}
.toc-side ol {
  list-style: none;
  padding: 0;
  margin: 0;
  border-left: 1px solid rgba(24, 24, 23, 0.1);
}
.toc-side li { margin: 0; }
.toc-side a {
  display: block;
  padding: 6px 14px;
  color: rgba(24, 24, 23, 0.55);
  text-decoration: none;
  border-left: 2px solid transparent;
  margin-left: -1px;
  transition: color 150ms ease, border-color 150ms ease;
}
.toc-side a:hover { color: #181817; }
.toc-side a.is-active {
  color: #181817;
  border-left-color: #3CFE01;
  font-weight: 500;
}
html.dark .toc-side ol { border-left-color: rgba(250, 250, 250, 0.1); }
html.dark .toc-side a { color: rgba(250, 250, 250, 0.55); }
html.dark .toc-side a:hover { color: #FAFAFA; }
html.dark .toc-side a.is-active { color: #FAFAFA; }

/* Comparativo simples (tabela) — usado em /comparacoes */
.comp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.comp-table th, .comp-table td {
  padding: 14px 16px;
  text-align: left;
  border-bottom: 1px solid rgba(24, 24, 23, 0.08);
  vertical-align: top;
}
.comp-table th {
  background: rgba(24, 24, 23, 0.03);
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(24, 24, 23, 0.6);
  font-weight: 600;
}
.comp-table tbody tr:hover { background: rgba(60, 254, 1, 0.03); }
.comp-table .col-tarven { background: rgba(60, 254, 1, 0.06); }
html.dark .comp-table th { background: rgba(250, 250, 250, 0.04); color: rgba(250, 250, 250, 0.6); }
html.dark .comp-table th, html.dark .comp-table td { border-bottom-color: rgba(250, 250, 250, 0.08); }
html.dark .comp-table tbody tr:hover { background: rgba(60, 254, 1, 0.05); }

/* Breadcrumb */
.breadcrumb {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(24, 24, 23, 0.5);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.breadcrumb a { color: rgba(24, 24, 23, 0.7); text-decoration: none; }
.breadcrumb a:hover { color: #2BC100; }
.breadcrumb .sep { opacity: 0.5; }
.breadcrumb [aria-current="page"] { color: rgba(24, 24, 23, 0.85); }
html.dark .breadcrumb { color: rgba(250, 250, 250, 0.45); }
html.dark .breadcrumb a { color: rgba(250, 250, 250, 0.65); }
html.dark .breadcrumb [aria-current="page"] { color: rgba(250, 250, 250, 0.9); }

/* Pricing card destacado */
.price-card {
  background: linear-gradient(135deg, #181817 0%, #0A0A0A 100%);
  border: 1px solid rgba(60, 254, 1, 0.25);
  border-radius: 20px;
  padding: 40px;
  color: #FAFAFA;
  position: relative;
  overflow: hidden;
}
.price-card::before {
  content: '';
  position: absolute;
  top: -30%; right: -10%;
  width: 50%; height: 200%;
  background: radial-gradient(circle, rgba(60, 254, 1, 0.18) 0%, transparent 60%);
  pointer-events: none;
}
.price-card > * { position: relative; }
.price-amount {
  font-family: 'JetBrains Mono', monospace;
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #3CFE01;
  line-height: 1;
}

/* Vertical card (advocacia/educação/info) */
.vertical-card {
  background: #FAFAFA;
  border: 1px solid rgba(24, 24, 23, 0.08);
  border-radius: 16px;
  padding: 28px;
  transition: all 200ms ease;
}
.vertical-card:hover {
  border-color: #3CFE01;
  transform: translateY(-2px);
}
html.dark .vertical-card { background: #1A1A19; border-color: rgba(250, 250, 250, 0.08); }

/* Form de busca no blog */
.blog-search {
  width: 100%;
  padding: 14px 18px 14px 44px;
  background: #FAFAFA;
  border: 1px solid rgba(24, 24, 23, 0.12);
  border-radius: 999px;
  font-size: 15px;
  color: #181817;
}
.blog-search:focus {
  outline: 0;
  border-color: #3CFE01;
  box-shadow: 0 0 0 3px rgba(60, 254, 1, 0.15);
}
html.dark .blog-search { background: #1A1A19; border-color: rgba(250, 250, 250, 0.12); color: #FAFAFA; }

/* Post card (blog) */
.post-card {
  background: #FAFAFA;
  border: 1px solid rgba(24, 24, 23, 0.08);
  border-radius: 16px;
  padding: 0;
  overflow: hidden;
  transition: all 220ms cubic-bezier(0.16, 1, 0.3, 1);
}
.post-card:hover { border-color: #3CFE01; transform: translateY(-3px); }
.post-card-thumb {
  aspect-ratio: 16 / 9;
  background: linear-gradient(135deg, #181817 0%, #0A0A0A 100%);
  position: relative;
  display: flex; align-items: center; justify-content: center;
  color: #3CFE01;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  overflow: hidden;
}
.post-card-thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 70% 30%, rgba(60, 254, 1, 0.15) 0%, transparent 50%);
}
.post-card-body { padding: 24px; }
html.dark .post-card { background: #1A1A19; border-color: rgba(250, 250, 250, 0.08); }