/* ─── DESIGN TOKENS ─────────────────────────────────── */
    :root {
      --ink:       #0A0F0D;
      --ink-90:    rgba(10,15,13,.9);
      --paper:     #F7F4EE;
      --green:     #1D6F42;
      --lime:      #A8E063;
      --lime-dim:  #7FB83A;
      --stone:     #E8E4DC;
      --slate:     #2D3B35;
      --mist:      #C4D4C9;
      --red-flag:  #E84040;
      --radius:    12px;
      --nav-h:     72px;
    }

    /* ─── RESET ──────────────────────────────────────────── */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {
      font-family: 'Plus Jakarta Sans', sans-serif;
      background: var(--paper);
      color: var(--ink);
      overflow-x: hidden;
      font-size: 16px;
      line-height: 1.6;
    }
    img { display: block; max-width: 100%; }
    a { color: inherit; text-decoration: none; }
    ul { list-style: none; }

    /* ─── GRAIN OVERLAY ──────────────────────────────────── */
    body::before {
      content: '';
      position: fixed;
      inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
      pointer-events: none;
      z-index: 9999;
      opacity: .5;
    }

    /* ─── TYPOGRAPHY ─────────────────────────────────────── */
    .font-display { font-family: 'Fraunces', serif; }
    .font-mono    { font-family: 'DM Mono', monospace; }
    h1, h2, h3 { font-family: 'Fraunces', serif; line-height: 1.1; font-weight: 600; }

    /* ─── CONTAINER ──────────────────────────────────────── */
    .container { max-width: 1160px; margin: 0 auto; padding: 0 24px; }

    /* ─── SECTION LABELS ─────────────────────────────────── */
    .tag {
      display: inline-flex; align-items: center; gap: 8px;
      font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: .12em;
      text-transform: uppercase; color: var(--green);
      border: 1px solid var(--mist); border-radius: 100px;
      padding: 5px 14px;
      background: rgba(29,111,66,.06);
    }
    .tag--light { color: var(--lime); border-color: rgba(168,224,99,.3); background: rgba(168,224,99,.06); }

    /* ─── BUTTONS ─────────────────────────────────────────── */
    .btn {
      display: inline-flex; align-items: center; justify-content: center; gap: 10px;
      padding: 14px 32px; border-radius: 6px;
      font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 600; font-size: 15px;
      cursor: pointer; border: none; transition: all .2s ease;
      white-space: nowrap;
    }
    .btn--primary { background: var(--lime); color: var(--ink); }
    .btn--primary:hover { background: var(--lime-dim); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(168,224,99,.35); }
    .btn--ghost  { background: transparent; color: var(--ink); border: 1.5px solid var(--ink); }
    .btn--ghost:hover  { background: var(--ink); color: var(--paper); }
    .btn--ghost-light  { background: transparent; color: var(--paper); border: 1.5px solid rgba(247,244,238,.4); }
    .btn--ghost-light:hover  { background: var(--paper); color: var(--ink); }
    .btn--wa { background: #25D366; color: #fff; }
    .btn--wa:hover { background: #1db954; transform: translateY(-2px); }
    .btn--outline { background: transparent; color: var(--ink); border: 1.5px solid var(--mist); font-size: 14px; }
    .btn--outline:hover { border-color: var(--ink); }
    .btn--lg { padding: 18px 40px; font-size: 16px; }

    /* ─── REVEAL ANIMATIONS ──────────────────────────────── */
    .reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s ease; }
    .reveal.visible { opacity: 1; transform: translateY(0); }
    .reveal-left { opacity: 0; transform: translateX(-32px); transition: opacity .7s ease, transform .7s ease; }
    .reveal-left.visible { opacity: 1; transform: translateX(0); }
    .reveal-right { opacity: 0; transform: translateX(32px); transition: opacity .7s ease, transform .7s ease; }
    .reveal-right.visible { opacity: 1; transform: translateX(0); }

    /* ─── MASCOTE ANIMATIONS ──────────────────────────────── */
    @keyframes mascote-float {
      0%,100% { transform: translateY(0) rotate(-1deg); }
      50%      { transform: translateY(-10px) rotate(1deg); }
    }
    @keyframes mascote-wiggle {
      0%,100% { transform: rotate(-3deg); }
      50%      { transform: rotate(3deg); }
    }
    @keyframes mascote-bob {
      0%,100% { transform: translateY(0); }
      50%      { transform: translateY(-6px); }
    }
    @keyframes wiggle {
      0%,100% { transform: rotate(-6deg); }
      50%      { transform: rotate(6deg); }
    }
    @keyframes blink {
      0%,90%,100% { transform: scaleY(1); }
      95% { transform: scaleY(0.1); }
    }
    .mascote { display: block; }
    .mascote-eye { animation: blink 4s ease-in-out infinite; transform-origin: center; }

    /* ─── NAV ────────────────────────────────────────────── */
    .nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 100;
      height: var(--nav-h);
      background: rgba(247,244,238,.88);
      backdrop-filter: blur(16px);
      border-bottom: 1px solid transparent;
      transition: border-color .3s;
    }
    .nav.scrolled { border-bottom-color: var(--mist); }
    .nav__inner { max-width: 1160px; margin: 0 auto; padding: 0 24px; height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 32px; }

    .nav__logo { display: flex; align-items: center; gap: 12px; }
    .nav__logo-svg { width: 40px; height: 40px; }
    .logo-path { stroke-dasharray: 200; stroke-dashoffset: 200; animation: draw 1.4s ease forwards; }
    .logo-path-2 { stroke-dasharray: 80; stroke-dashoffset: 80; animation: draw 1s .4s ease forwards; }
    @keyframes draw { to { stroke-dashoffset: 0; } }
    .nav__logo-name { font-family: 'Fraunces', serif; font-size: 20px; font-weight: 600; color: var(--ink); }
    .nav__logo-sub  { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: .1em; color: var(--green); text-transform: uppercase; display: block; line-height: 1; }

    .nav__links { display: flex; align-items: center; gap: 32px; }
    .nav__links a { font-size: 14px; font-weight: 500; color: var(--slate); transition: color .2s; }
    .nav__links a:hover { color: var(--ink); }
    .nav__cta { padding: 10px 22px; background: var(--lime); color: var(--ink) !important; border-radius: 6px; font-weight: 600; }
    .nav__cta:hover { background: var(--lime-dim); }

    .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
    .hamburger span { display: block; width: 22px; height: 1.5px; background: var(--ink); transition: all .3s; }

    .mobile-menu {
      display: none; position: fixed; inset: 0; top: var(--nav-h);
      background: var(--paper); z-index: 99; padding: 32px 24px;
      flex-direction: column; gap: 8px;
    }
    .mobile-menu.open { display: flex; }
    .mobile-menu a { font-size: 22px; font-family: 'Fraunces', serif; font-weight: 500; padding: 12px 0; border-bottom: 1px solid var(--mist); display: block; }

    @media (max-width: 768px) {
      .nav__links { display: none; }
      .hamburger { display: flex; }
    }

    /* ─── HERO ───────────────────────────────────────────── */
    .hero {
      min-height: 100vh; padding-top: var(--nav-h);
      background: var(--paper);
      display: flex; align-items: center;
      position: relative; overflow: hidden;
    }
    .hero__bg-circle {
      position: absolute; width: 800px; height: 800px;
      border-radius: 50%; background: radial-gradient(circle, rgba(168,224,99,.12) 0%, transparent 70%);
      top: -200px; right: -200px; pointer-events: none;
    }
    /* Decorative ink splat behind hero mascote */
    .hero__mascote-wrap {
      position: absolute; bottom: 0; right: 0;
      width: 320px; pointer-events: none; opacity: .07;
    }
    .hero__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; padding: 80px 0; position: relative; }
    .hero__left { display: flex; flex-direction: column; gap: 28px; }
    .hero__title { font-size: clamp(38px, 4.8vw, 64px); line-height: 1.06; font-weight: 600; letter-spacing: -.02em; }
    .hero__title em { font-style: italic; color: var(--green); }
    .hero__title mark { background: none; color: var(--red-flag); }
    .hero__sub { font-size: 17px; line-height: 1.7; color: var(--slate); max-width: 500px; }
    .hero__sub strong { color: var(--ink); }
    .hero__actions { display: flex; gap: 12px; flex-wrap: wrap; }

    /* Trust strip */
    .hero__trust { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
    .hero__trust-item { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--slate); }
    .hero__trust-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); flex-shrink:0; }

    /* Dashboard Mockup */
    .hero__mockup {
      background: var(--ink); border-radius: 16px;
      overflow: hidden; box-shadow: 0 40px 100px rgba(10,15,13,.22);
      border: 1px solid rgba(255,255,255,.06);
      animation: float 6s ease-in-out infinite;
    }
    @keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
    .mockup__bar { background: rgba(255,255,255,.04); padding: 12px 20px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid rgba(255,255,255,.06); }
    .mockup__dot { width: 10px; height: 10px; border-radius: 50%; }
    .mockup__dot:nth-child(1) { background: #FF5F57; }
    .mockup__dot:nth-child(2) { background: #FEBC2E; }
    .mockup__dot:nth-child(3) { background: #28C840; }
    .mockup__title { font-family: 'DM Mono', monospace; font-size: 11px; color: rgba(247,244,238,.35); margin-left: 8px; }
    .mockup__body { padding: 20px; }

    /* Mockup alert banner */
    .mockup__alert-banner {
      background: rgba(232,64,64,.12); border: 1px solid rgba(232,64,64,.25);
      border-radius: 8px; padding: 10px 14px; margin-bottom: 14px;
      display: flex; align-items: center; gap: 10px;
    }
    .mockup__alert-dot { width: 8px; height: 8px; border-radius: 50%; background: #FF6B6B; flex-shrink:0; animation: pulse-red 2s ease-in-out infinite; }
    @keyframes pulse-red { 0%,100% { box-shadow: 0 0 0 0 rgba(232,64,64,.5); } 50% { box-shadow: 0 0 0 5px rgba(232,64,64,0); } }
    .mockup__alert-text { font-family: 'DM Mono', monospace; font-size: 10px; color: #FF8C8C; }
    .mockup__alert-val { font-family: 'DM Mono', monospace; font-size: 10px; font-weight: 600; color: #FF6B6B; margin-left: auto; white-space: nowrap; }

    .mockup__head-row { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 12px; padding: 8px 12px; }
    .mockup__head-row span { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: rgba(247,244,238,.3); }
    .mockup__row { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 12px; padding: 10px 12px; border-radius: 8px; margin-bottom: 4px; align-items: center; }
    .mockup__row--ok   { background: rgba(168,224,99,.07); }
    .mockup__row--err  { background: rgba(232,64,64,.09); }
    .mockup__row--warn { background: rgba(254,188,46,.07); }
    .mockup__cell { font-family: 'DM Mono', monospace; font-size: 11px; color: rgba(247,244,238,.7); }
    .mockup__badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 100px; font-size: 10px; font-weight: 600; }
    .badge--ok   { background: rgba(168,224,99,.18); color: var(--lime); }
    .badge--err  { background: rgba(232,64,64,.18); color: #FF6B6B; }
    .badge--warn { background: rgba(254,188,46,.18); color: #FEBC2E; }
    .mockup__summary { margin-top: 16px; padding: 14px 16px; background: rgba(168,224,99,.08); border-radius: 10px; border: 1px solid rgba(168,224,99,.15); display: flex; justify-content: space-between; align-items: center; }
    .mockup__summary-label { font-family: 'DM Mono', monospace; font-size: 10px; color: rgba(247,244,238,.4); text-transform: uppercase; letter-spacing: .1em; }
    .mockup__summary-val { font-family: 'Fraunces', serif; font-size: 22px; font-weight: 600; color: var(--lime); }

    /* Mockup mini-chart */
    .mockup__mini-chart { margin-top: 14px; padding: 12px 16px; background: rgba(255,255,255,.03); border-radius: 8px; border: 1px solid rgba(255,255,255,.06); }
    .mockup__chart-label { font-family: 'DM Mono', monospace; font-size: 9px; color: rgba(247,244,238,.25); text-transform: uppercase; letter-spacing: .1em; margin-bottom: 8px; }
    .mockup__bars { display: flex; align-items: flex-end; gap: 6px; height: 40px; }
    .mockup__bar-item { flex: 1; border-radius: 3px 3px 0 0; transition: opacity .3s; }
    .mockup__bar-item.bar-err { background: rgba(232,64,64,.6); }
    .mockup__bar-item.bar-ok  { background: rgba(168,224,99,.35); }

    /* Mockup exec summary */
    .mockup__exec { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .mockup__exec-item { background: rgba(255,255,255,.03); border-radius: 8px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.05); }
    .mockup__exec-label { font-family: 'DM Mono', monospace; font-size: 8px; color: rgba(247,244,238,.25); text-transform: uppercase; letter-spacing: .1em; }
    .mockup__exec-val { font-family: 'Fraunces', serif; font-size: 15px; font-weight: 600; margin-top: 2px; }
    .mockup__exec-val.val-danger { color: #FF6B6B; }
    .mockup__exec-val.val-safe   { color: var(--lime); }

    @media (max-width: 900px) {
      .hero__inner { grid-template-columns: 1fr; }
      .hero__mockup { max-width: 480px; margin: 0 auto; }
    }

    /* ─── LOGOS STRIP ────────────────────────────────────── */
    .logos {
      padding: 28px 0; border-top: 1px solid var(--mist); border-bottom: 1px solid var(--mist);
      background: var(--stone);
    }
    .logos__inner { display: flex; align-items: center; gap: 48px; overflow: hidden; }
    .logos__label { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--mist); white-space: nowrap; flex-shrink: 0; }
    .logos__track { display: flex; align-items: center; gap: 48px; overflow-x: auto; scrollbar-width: none; }
    .logos__track::-webkit-scrollbar { display: none; }
    .logos__item { font-family: 'DM Mono', monospace; font-size: 13px; font-weight: 500; color: rgba(10,15,13,.35); white-space: nowrap; flex-shrink: 0; }

    /* ─── FLOW ANIMATION SECTION ─────────────────────────── */
    .flow {
      padding: 80px 0; background: var(--ink); overflow: hidden; position: relative;
    }
    .flow::after {
      content: ''; position: absolute; inset: 0;
      background: radial-gradient(ellipse at 50% 0%, rgba(29,111,66,.15) 0%, transparent 65%);
      pointer-events: none;
    }
    .flow__header { text-align: center; margin-bottom: 56px; position: relative; z-index: 1; }
    .flow__header h2 { font-size: clamp(28px,3.5vw,44px); color: var(--paper); }
    .flow__header h2 em { color: var(--lime); font-style: italic; }
    .flow__header p { color: rgba(247,244,238,.5); font-size: 15px; margin-top: 12px; }

    .flow__track { display: flex; align-items: center; justify-content: center; gap: 0; flex-wrap: wrap; position: relative; z-index: 1; }
    .flow__step {
      display: flex; flex-direction: column; align-items: center; gap: 16px;
      flex: 1; min-width: 160px; max-width: 220px; text-align: center;
    }
    .flow__icon-wrap {
      width: 80px; height: 80px; border-radius: 16px;
      background: rgba(247,244,238,.05); border: 1px solid rgba(247,244,238,.1);
      display: flex; align-items: center; justify-content: center;
      position: relative;
    }
    .flow__icon-wrap.active { background: rgba(168,224,99,.1); border-color: rgba(168,224,99,.3); }
    .flow__icon-wrap.danger { background: rgba(232,64,64,.1); border-color: rgba(232,64,64,.3); }
    .flow__step-label { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: rgba(247,244,238,.4); }
    .flow__step-name { font-family: 'Fraunces', serif; font-size: 16px; color: var(--paper); font-weight: 500; }
    .flow__step-val { font-family: 'DM Mono', monospace; font-size: 12px; }
    .flow__step-val.text-lime { color: var(--lime); }
    .flow__step-val.text-red  { color: #FF6B6B; }

    .flow__arrow { color: rgba(247,244,238,.2); font-size: 24px; margin: 0 8px; align-self: center; padding-bottom: 32px; }

    /* Animated scanning line */
    .flow__scan-anim {
      position: absolute; inset: 0; border-radius: 16px; overflow: hidden;
    }
    .flow__scan-line {
      position: absolute; left: 0; right: 0; height: 2px;
      background: linear-gradient(90deg, transparent, var(--lime), transparent);
      animation: scan 2.5s ease-in-out infinite;
    }
    @keyframes scan { 0% { top: 0%; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { top: 100%; opacity: 0; } }

    .flow__pulse {
      position: absolute; inset: 0; border-radius: 16px;
      animation: flow-pulse 2s ease-in-out infinite;
    }
    @keyframes flow-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(232,64,64,.4); } 50% { box-shadow: 0 0 0 6px rgba(232,64,64,0); } }

    /* ─── IMPACTO (números) ──────────────────────────────── */
    .impacto {
      background: var(--slate); padding: 96px 0; position: relative; overflow: hidden;
    }
    .impacto::before {
      content: '';
      position: absolute; width: 600px; height: 600px; border-radius: 50%;
      background: radial-gradient(circle, rgba(29,111,66,.25) 0%, transparent 70%);
      top: -200px; left: -100px; pointer-events: none;
    }
    /* Mascote de canto no impacto */
    .impacto__mascote {
      position: absolute; right: 40px; bottom: 0; width: 120px; opacity: .12;
      pointer-events: none;
    }
    .impacto__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
    .impacto__left h2 { font-size: clamp(36px, 4vw, 56px); color: var(--paper); line-height: 1.1; }
    .impacto__left h2 em { font-style: italic; color: var(--lime); }
    .impacto__left p { color: rgba(247,244,238,.55); margin-top: 20px; font-size: 16px; line-height: 1.7; }
    .impacto__disclaimer { margin-top: 16px; font-family: 'DM Mono', monospace; font-size: 10px; color: rgba(247,244,238,.3); letter-spacing: .06em; border-left: 2px solid rgba(168,224,99,.3); padding-left: 12px; }
    .impacto__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
    .impacto__stat {
      background: rgba(247,244,238,.04); padding: 32px 28px;
      border: 1px solid rgba(247,244,238,.06); position: relative; overflow: hidden;
    }
    .impacto__stat:nth-child(1) { border-radius: 12px 0 0 0; }
    .impacto__stat:nth-child(2) { border-radius: 0 12px 0 0; }
    .impacto__stat:nth-child(3) { border-radius: 0 0 0 12px; }
    .impacto__stat:nth-child(4) { border-radius: 0 0 12px 0; }
    .impacto__num { font-family: 'Fraunces', serif; font-size: clamp(32px, 4vw, 48px); font-weight: 700; color: var(--lime); line-height: 1; }
    .impacto__label { font-size: 13px; color: rgba(247,244,238,.45); margin-top: 8px; }
    .impacto__stat-note { font-family: 'DM Mono', monospace; font-size: 9px; color: rgba(247,244,238,.2); margin-top: 6px; letter-spacing: .06em; }

    @media (max-width: 768px) {
      .impacto__inner { grid-template-columns: 1fr; }
      .impacto__grid { grid-template-columns: 1fr 1fr; }
    }

    /* ─── PROBLEMA ───────────────────────────────────────── */
    .problema { padding: 112px 0; background: var(--paper); position: relative; }
    .problema__mascote {
      position: absolute; right: 0; top: 80px;
      width: 160px; pointer-events: none; opacity: 1;
    }
    .section-header { margin-bottom: 64px; }
    .section-header--center { text-align: center; }
    .section-title { font-size: clamp(32px, 4vw, 52px); margin-top: 16px; line-height: 1.1; }
    .section-sub { font-size: 17px; color: var(--slate); margin-top: 16px; max-width: 580px; line-height: 1.7; }
    .section-header--center .section-sub { margin: 16px auto 0; }

    .problema__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; margin-bottom: 48px; }
    .problema__card {
      background: var(--stone); padding: 40px 32px;
      border: 1px solid var(--mist); position: relative; overflow: hidden;
      transition: transform .3s, box-shadow .3s;
    }
    .problema__card:nth-child(1) { border-radius: 12px 0 0 12px; }
    .problema__card:nth-child(3) { border-radius: 0 12px 12px 0; }
    .problema__card:hover { transform: translateY(-6px); box-shadow: 0 20px 60px rgba(10,15,13,.1); z-index: 1; }
    .problema__num {
      font-family: 'Fraunces', serif; font-size: 96px; font-weight: 700;
      color: var(--ink); opacity: .05; position: absolute; top: -16px; right: 16px; line-height: 1; pointer-events: none;
    }
    .problema__icon-wrap { width: 48px; height: 48px; background: var(--ink); border-radius: 10px; display: flex; align-items: center; justify-content: center; margin-bottom: 24px; }
    .problema__icon-wrap svg { width: 22px; height: 22px; stroke: var(--lime); }
    .problema__card h3 { font-size: 20px; margin-bottom: 14px; }
    .problema__card p { font-size: 14px; color: var(--slate); line-height: 1.75; }
    .problema__impact { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--mist); display: flex; justify-content: space-between; align-items: baseline; }
    .problema__impact span { font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: rgba(10,15,13,.35); }
    .problema__impact strong { font-family: 'Fraunces', serif; font-size: 17px; font-weight: 600; color: var(--red-flag); }

    @media (max-width: 768px) {
      .problema__grid { grid-template-columns: 1fr; }
      .problema__card { border-radius: 12px !important; }
      .problema__mascote { display: none; }
    }

    /* Destaque calc */
    .destaque {
      background: var(--ink); border-radius: 16px; padding: 48px 48px;
      display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center;
    }
    .destaque__eyebrow { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--lime); display: block; margin-bottom: 16px; }
    .destaque p { color: rgba(247,244,238,.7); font-size: 16px; line-height: 1.75; }
    .destaque p strong { color: var(--paper); }
    .calc { background: rgba(247,244,238,.04); border-radius: 12px; overflow: hidden; border: 1px solid rgba(247,244,238,.06); }
    .calc__row { display: flex; justify-content: space-between; align-items: center; padding: 16px 24px; border-bottom: 1px solid rgba(247,244,238,.06); }
    .calc__row:last-child { border-bottom: none; }
    .calc__row span:first-child { font-size: 13px; color: rgba(247,244,238,.45); }
    .calc__row span:last-child { font-family: 'DM Mono', monospace; font-size: 14px; color: rgba(247,244,238,.7); }
    .calc__row--total { background: rgba(168,224,99,.06); }
    .calc__row--total span:first-child { color: rgba(247,244,238,.7); font-weight: 500; }
    .calc__row--total span:last-child { color: var(--lime); font-weight: 600; font-size: 16px; }

    @media (max-width: 768px) {
      .destaque { grid-template-columns: 1fr; padding: 32px 24px; }
    }

    /* ─── COMO FUNCIONA ──────────────────────────────────── */
    .como { padding: 112px 0; background: var(--stone); position: relative; overflow: hidden; }
    .como__bg-mascote {
      position: absolute; left: -40px; bottom: 0; width: 180px; opacity: .06; pointer-events: none;
    }
    .steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 2px; margin-top: 56px; }
    .step {
      background: var(--paper); border: 1px solid var(--mist); border-radius: 0;
      padding: 40px 28px; position: relative; text-align: center;
      transition: transform .3s, box-shadow .3s;
    }
    .step:first-child { border-radius: 12px 0 0 12px; }
    .step:last-child  { border-radius: 0 12px 12px 0; }
    .step:hover { transform: translateY(-6px); box-shadow: 0 20px 60px rgba(10,15,13,.1); z-index: 1; }
    .step__mascote-wrap { width: 80px; height: 80px; margin: 0 auto 20px; position: relative; }
    .step__num-badge {
      position: absolute; top: -6px; right: -6px;
      width: 22px; height: 22px; border-radius: 50%;
      background: var(--lime); color: var(--ink);
      font-family: 'DM Mono', monospace; font-size: 10px; font-weight: 600;
      display: flex; align-items: center; justify-content: center;
      border: 2px solid var(--stone);
    }
    .step h3 { font-size: 18px; margin-bottom: 12px; }
    .step p { font-size: 14px; color: var(--slate); line-height: 1.75; }
    .step__connector {
      position: absolute; right: -20px; top: 50%; transform: translateY(-50%);
      width: 40px; height: 2px; background: var(--mist); z-index: 2;
    }
    @media (max-width: 768px) {
      .steps { grid-template-columns: 1fr; }
      .step { border-radius: 12px !important; }
      .step__connector { display: none; }
    }

    /* ─── DIFERENCIAIS ────────────────────────────────────── */
    .diferenciais { padding: 112px 0; background: var(--ink); position: relative; overflow: hidden; }
    .diferenciais::before {
      content: ''; position: absolute; width: 500px; height: 500px; border-radius: 50%;
      background: radial-gradient(circle, rgba(168,224,99,.08) 0%, transparent 70%);
      top: -100px; right: -100px; pointer-events: none;
    }
    .diferenciais__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
    .diferenciais__left h2 { color: var(--paper); font-size: clamp(32px, 4vw, 52px); }
    .diferenciais__left h2 em { color: var(--lime); font-style: italic; }
    .diferenciais__left > p { color: rgba(247,244,238,.5); font-size: 16px; line-height: 1.75; margin-top: 20px; }
    .diferenciais__left > p + p { margin-top: 16px; }
    .diferenciais__left .btn { margin-top: 36px; }
    .features { display: flex; flex-direction: column; gap: 24px; }
    .feature { display: flex; align-items: flex-start; gap: 16px; padding: 20px; background: rgba(247,244,238,.04); border-radius: 12px; border: 1px solid rgba(247,244,238,.06); }
    .feature__icon { width: 40px; height: 40px; background: rgba(168,224,99,.12); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .feature__icon svg { width: 20px; height: 20px; stroke: var(--lime); }
    .feature strong { display: block; font-size: 15px; color: var(--paper); margin-bottom: 4px; }
    .feature span { font-size: 13px; color: rgba(247,244,238,.45); line-height: 1.7; }

    /* Mascote diferenciais */
    .diferenciais__mascote-corner {
      position: absolute; left: 40px; bottom: 0; width: 100px; opacity: .1; pointer-events: none;
    }

    @media (max-width: 768px) { .diferenciais__inner { grid-template-columns: 1fr; } }

    /* ─── OBJEÇÕES ────────────────────────────────────────── */
    .objections { padding: 96px 0; background: var(--paper); }
    .objections__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; margin-top: 56px; }
    .obj-card { padding: 36px 28px; background: var(--stone); border-radius: 12px; border: 1px solid var(--mist); display: flex; gap: 20px; align-items: flex-start; transition: transform .3s; }
    .obj-card:hover { transform: translateY(-4px); }
    .obj-icon { width: 44px; height: 44px; background: var(--ink); border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .obj-icon svg { width: 22px; height: 22px; stroke: var(--lime); }
    .obj-card h3 { font-size: 16px; margin-bottom: 10px; }
    .obj-card p { font-size: 14px; color: var(--slate); line-height: 1.75; }
    @media (max-width: 768px) { .objections__grid { grid-template-columns: 1fr; } }

    /* ─── PROVA SOCIAL ────────────────────────────────────── */
    .social-proof { padding: 96px 0; background: var(--stone); }
    .social-proof__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
    .social-proof__inner > div > p { color: var(--slate); font-size: 16px; line-height: 1.7; margin-top: 16px; }
    .states-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
    .state-badge { font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: .06em; padding: 6px 14px; background: var(--paper); border: 1px solid var(--mist); border-radius: 100px; color: var(--slate); }
    .erp-logos { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
    .erp-logo-card { background: var(--paper); border: 1px solid var(--mist); border-radius: 10px; padding: 16px; display: flex; align-items: center; justify-content: center; transition: border-color .2s; }
    .erp-logo-card:hover { border-color: var(--ink); }
    .erp-logo-name { font-family: 'DM Mono', monospace; font-size: 13px; font-weight: 500; color: rgba(10,15,13,.5); }
    @media (max-width: 768px) { .social-proof__inner { grid-template-columns: 1fr; } .erp-logos { grid-template-columns: 1fr 1fr; } }

    /* ─── PILOTO ──────────────────────────────────────────── */
    .piloto { padding: 112px 0; background: var(--paper); position: relative; overflow: hidden; }
    /* Mascote piloto — thumbs up */
    .piloto__mascote-wrap {
      position: absolute; left: 50%; bottom: 0;
      transform: translateX(-300px);
      width: 140px; pointer-events: none; z-index: 0;
      animation: mascote-bob 3s ease-in-out infinite;
    }
    .piloto__inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: 64px; align-items: start; position: relative; z-index: 1; }
    .piloto__left h2 { font-size: clamp(34px, 4vw, 54px); }
    .piloto__left p { color: var(--slate); margin-top: 20px; font-size: 16px; line-height: 1.75; }
    .piloto__list { margin-top: 32px; display: flex; flex-direction: column; gap: 14px; }
    .piloto__item { display: flex; align-items: flex-start; gap: 14px; font-size: 15px; }
    .piloto__check { width: 22px; height: 22px; background: var(--lime); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
    .piloto__check svg { width: 12px; height: 12px; stroke: var(--ink); stroke-width: 2.5; }
    .piloto__card { background: var(--ink); border-radius: 16px; padding: 40px 36px; position: sticky; top: calc(var(--nav-h) + 24px); }
    .piloto__card h3 { font-family: 'Fraunces', serif; font-size: 26px; color: var(--paper); margin-bottom: 12px; }
    .piloto__card > p { font-size: 14px; color: rgba(247,244,238,.45); margin-bottom: 32px; line-height: 1.7; }
    .piloto__or { text-align: center; margin: 20px 0; font-size: 12px; color: rgba(247,244,238,.3); font-family: 'DM Mono', monospace; letter-spacing: .1em; text-transform: uppercase; }
    .piloto__disclaimer { font-size: 12px; color: rgba(247,244,238,.3); text-align: center; margin-top: 20px; line-height: 1.6; }

    @media (max-width: 768px) {
      .piloto__inner { grid-template-columns: 1fr; }
      .piloto__card { position: static; }
      .piloto__mascote-wrap { display: none; }
    }

    /* ─── FAQ ────────────────────────────────────────────── */
    .faq { padding: 96px 0; background: var(--stone); }
    .faq__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-top: 56px; }
    .faq__item { background: var(--paper); border: 1px solid var(--mist); border-radius: 12px; padding: 32px 28px; transition: transform .25s; }
    .faq__item:hover { transform: translateY(-3px); }
    .faq__item h3 { font-family: 'Fraunces', serif; font-size: 17px; margin-bottom: 12px; line-height: 1.3; }
    .faq__item p { font-size: 14px; color: var(--slate); line-height: 1.75; }
    @media (max-width: 640px) { .faq__grid { grid-template-columns: 1fr; } }

    /* ─── FOOTER ─────────────────────────────────────────── */
    .footer { background: var(--ink); padding: 64px 0 32px; }
    .footer__top { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 48px; padding-bottom: 48px; border-bottom: 1px solid rgba(247,244,238,.06); }
    .footer__brand .nav__logo-name { color: var(--paper); }
    .footer__brand p { font-size: 13px; color: rgba(247,244,238,.35); margin-top: 16px; line-height: 1.7; max-width: 280px; }
    .footer__col h4 { font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: rgba(247,244,238,.3); margin-bottom: 20px; }
    .footer__col a { display: block; font-size: 14px; color: rgba(247,244,238,.55); margin-bottom: 12px; transition: color .2s; }
    .footer__col a:hover { color: var(--lime); }
    .footer__bottom { padding-top: 28px; display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; align-items: center; }
    .footer__copy { font-family: 'DM Mono', monospace; font-size: 11px; color: rgba(247,244,238,.2); }
    .footer__disc { font-size: 11px; color: rgba(247,244,238,.2); max-width: 540px; line-height: 1.6; }
    @media (max-width: 640px) { .footer__top { grid-template-columns: 1fr; gap: 32px; } }

    /* ─── SCROLL TO TOP ──────────────────────────────────── */
    .scroll-top { position: fixed; bottom: 32px; right: 32px; width: 44px; height: 44px; background: var(--lime); border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; opacity: 0; transform: translateY(12px); transition: all .3s; z-index: 50; border: none; box-shadow: 0 8px 24px rgba(168,224,99,.35); }
    .scroll-top.show { opacity: 1; transform: translateY(0); }
    .scroll-top svg { width: 18px; height: 18px; stroke: var(--ink); }
/* Brand mark and hero badge */
.nav__logo-mark{
  width:40px;height:40px;border-radius:12px;object-fit:cover;
  box-shadow:0 10px 30px rgba(10,15,13,.18);
  border:1px solid rgba(10,15,13,.08);
  background:#f4efe6;
}
.hero__brand-badge{
  display:inline-flex;align-items:center;gap:12px;
  padding:10px 14px;border:1px solid var(--mist);border-radius:999px;
  background:rgba(255,255,255,.58);
  box-shadow:0 12px 30px rgba(10,15,13,.06);
  width:max-content;
}
.hero__brand-badge img{width:42px;height:42px;border-radius:12px;object-fit:cover;}
.hero__brand-badge span{display:block;font-family:'Fraunces',serif;font-size:16px;line-height:1;color:var(--ink);}
.hero__brand-badge small{display:block;font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);margin-top:3px;}
@media (max-width:768px){
  .nav__logo-mark{width:36px;height:36px}
  .hero__brand-badge{padding:8px 12px;gap:10px}
  .hero__brand-badge img{width:36px;height:36px}
}

/* Keep all animations smoother on mobile */
@media (max-width:768px){
  .hero__mockup,
  .impacto__mascote,
  .problema__mascote,
  .como__bg-mascote,
  .diferenciais__mascote-corner,
  .piloto__mascote-wrap{
    animation-duration:8s !important;
  }
}

/* ─── UNITY REWORK ───────────────────────────────────── */
:root{
  --accent-core:#97c95a;
  --accent-core-2:#6f9e3c;
  --paper-soft:#f6f1e7;
  --paper-warm:#f1ebdf;
  --ink-soft:#111816;
  --line-soft: rgba(17,24,22,.08);
  --line-olive: rgba(151,201,90,.18);
}

body{
  background:
    radial-gradient(circle at 50% -8%, rgba(151,201,90,.11) 0%, rgba(151,201,90,.04) 16%, transparent 38%),
    linear-gradient(180deg, #f7f2e8 0%, #f4efe3 100%);
}

body::before{
  opacity:.28;
  mix-blend-mode:multiply;
}

.page-spine{
  position: fixed;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, transparent 0%, rgba(151,201,90,.16) 10%, rgba(151,201,90,.08) 50%, rgba(151,201,90,.16) 90%, transparent 100%);
  opacity: .55;
  pointer-events: none;
  z-index: 0;
}

@media (max-width: 1100px){
  .page-spine{ display:none; }
}

.hero, .logos, .flow, .impacto, .problema, .como, .diferenciais, .objections, .social-proof, .piloto, .faq, .footer{
  position: relative;
  isolation: isolate;
  box-shadow: inset 0 1px 0 var(--line-soft);
}

.hero, .problema, .como, .objections, .social-proof, .piloto, .faq{
  background:
    radial-gradient(circle at 50% 0%, rgba(151,201,90,.07) 0%, transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.48) 0%, rgba(255,255,255,.24) 100%),
    var(--paper);
}

.logos{
  background:
    linear-gradient(180deg, rgba(151,201,90,.04), rgba(255,255,255,.40)),
    var(--stone);
}

.flow, .impacto, .diferenciais, .footer{
  background:
    radial-gradient(circle at 50% 0%, rgba(151,201,90,.14) 0%, transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,0) 28%),
    var(--ink);
}

.section-header{
  max-width: 760px;
}

.section-sub{
  max-width: 680px;
}

.hero .reveal,
.hero .reveal-left,
.hero .reveal-right{
  opacity: 1 !important;
  transform: none !important;
}

.hero__inner{
  gap: 56px;
}

.hero__title{
  text-wrap: balance;
}

.hero__mockup{
  border: 1px solid rgba(168,224,99,.16);
  box-shadow: 0 34px 90px rgba(10,15,13,.26), inset 0 1px 0 rgba(255,255,255,.04);
}

.hero__bg-circle{
  background: radial-gradient(circle, rgba(151,201,90,.10) 0%, transparent 68%);
  filter: blur(8px);
}

.hero__brand-badge{
  border-color: rgba(151,201,90,.20);
  background: rgba(255,255,255,.72);
}

.nav{
  background: rgba(247,242,232,.82);
  border-bottom: 1px solid rgba(17,24,22,.06);
}

.nav.scrolled{
  border-bottom-color: rgba(151,201,90,.18);
}

.nav__cta{
  box-shadow: 0 8px 20px rgba(151,201,90,.18);
}

.btn--primary{
  box-shadow: 0 12px 30px rgba(151,201,90,.18);
}

.btn--primary:hover{
  box-shadow: 0 16px 34px rgba(151,201,90,.24);
}

.tag,
.tag--light{
  border-color: rgba(151,201,90,.22);
}

.tag{
  background: rgba(151,201,90,.06);
  color: var(--accent-core-2);
}

.tag--light{
  background: rgba(151,201,90,.08);
  color: var(--accent-core);
}

.problema__card,
.step,
.faq__item,
.obj-card,
.impacto__stat,
.feature,
.piloto__card{
  box-shadow: 0 14px 36px rgba(10,15,13,.04);
}

.problema__card:hover,
.step:hover,
.obj-card:hover,
.faq__item:hover{
  box-shadow: 0 24px 60px rgba(10,15,13,.10);
}

.hero__trust-dot,
.piloto__check,
.mockup__summary-val,
.impacto__num,
.flow__step-val.text-lime,
.feature__icon,
.obj-icon{
  color: var(--accent-core);
}

.hero__actions .btn--primary{
  background: linear-gradient(180deg, #b0e06c 0%, #97c95a 100%);
}

.hero__actions .btn--primary:hover{
  background: linear-gradient(180deg, #c0eb7d 0%, #8abd4d 100%);
}

@media (max-width: 768px){
  .hero__inner{
    gap: 32px;
  }
  .hero__mockup{
    box-shadow: 0 24px 56px rgba(10,15,13,.18);
  }
}