/* ============================================================
   VERUS — Landing premium · design tokens & base
   ============================================================ */
:root {
  /* Teal — cor-assinatura */
  --teal-100: #d3f2ee;
  --teal-300: #6ed8cb;
  --teal:     #12B5A6;
  --teal-600: #0E9B8B;
  --teal-700: #0E7E70;
  --teal-800: #0b6358;

  /* Secundárias */
  --violet:   #7C6CF5;
  --violet-soft: #ece9fe;
  --amber:    #F59E0B;
  --amber-soft: #fdecc8;

  /* Tinta-petróleo (escuro) */
  --ink:      #0C1A19;
  --ink-2:    #0E1413;
  --ink-card: #122322;
  --ink-line: rgba(255,255,255,0.10);

  /* Areia / osso (claro) */
  --sand:     #F6F7F4;
  --sand-2:   #eef0ea;
  --white:    #FFFFFF;

  /* Texto */
  --slate-900:#0E1116;
  --slate-700:#33403f;
  --slate-500:#65726f;
  --slate-400:#8b9794;
  --bone:     #e7eeec;
  --bone-dim: #9fb2ae;

  --border:   #e4e7e2;
  --border-2: #d6dbd4;

  --shadow-sm: 0 1px 2px rgba(12,26,25,.05), 0 1px 3px rgba(12,26,25,.04);
  --shadow:    0 12px 32px -12px rgba(12,26,25,.16), 0 4px 12px -6px rgba(12,26,25,.10);
  --shadow-lg: 0 40px 80px -32px rgba(12,26,25,.32), 0 12px 32px -12px rgba(12,26,25,.18);
  --shadow-teal: 0 18px 40px -14px rgba(14,126,112,.45);

  --r-sm: 10px;
  --r:    16px;
  --r-lg: 22px;
  --r-xl: 28px;

  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', monospace;

  --maxw: 1320px;
  --pad: clamp(14px, 3vw, 48px);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-sans);
  background: var(--sand);
  color: var(--slate-900);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  letter-spacing: -0.011em;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
::selection { background: var(--teal); color: #fff; }

/* Lenis */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

/* ---------- Type ---------- */
.display {
  font-family: var(--font-display);
  font-optical-sizing: auto;
  font-weight: 380;
  line-height: 0.98;
  letter-spacing: -0.025em;
  font-variation-settings: "SOFT" 0, "WONK" 0;
}
.serif { font-family: var(--font-display); font-optical-sizing: auto; }

.eyebrow {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 500;
}
.sec-num {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: 0.1em;
  color: var(--teal-700);
  font-weight: 500;
}

/* ---------- Layout ---------- */
.wrap { max-width: var(--maxw); margin: 0 auto; padding-inline: var(--pad); }
section { position: relative; }

.sec-dark  { background: var(--ink);  color: var(--bone); }
.sec-ink2  { background: var(--ink-2); color: var(--bone); }
.sec-light { background: var(--sand);  color: var(--slate-900); }
.sec-white { background: var(--white); color: var(--slate-900); }

/* ---------- Buttons ---------- */
.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-sans);
  font-weight: 540;
  font-size: 15.5px;
  letter-spacing: -0.01em;
  padding: 15px 26px;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s, background .25s, color .25s, border-color .25s;
  white-space: nowrap;
  will-change: transform;
}
.btn svg { width: 17px; height: 17px; }
.btn-primary {
  background: linear-gradient(180deg, var(--teal) 0%, var(--teal-700) 100%);
  color: #fff;
  box-shadow: var(--shadow-teal);
}
.btn-primary:hover { box-shadow: 0 22px 48px -14px rgba(14,126,112,.6); }
.btn-ghost {
  background: transparent;
  color: var(--slate-900);
  border-color: var(--border-2);
}
.btn-ghost:hover { border-color: var(--teal); color: var(--teal-700); }
.sec-dark .btn-ghost, .sec-ink2 .btn-ghost, .hero .btn-ghost, .fcta .btn-ghost { color: var(--bone); border-color: var(--ink-line); }
.sec-dark .btn-ghost:hover, .sec-ink2 .btn-ghost:hover, .hero .btn-ghost:hover, .fcta .btn-ghost:hover { border-color: var(--teal-300); color: #fff; }
.btn-sm { padding: 11px 19px; font-size: 14px; }

.link-arrow {
  display: inline-flex; align-items: center; gap: 7px;
  font-weight: 520; font-size: 14.5px; color: var(--teal-700);
}
.link-arrow svg { width: 15px; height: 15px; transition: transform .3s; }
.link-arrow:hover svg { transform: translateX(4px); }

/* ---------- Reveal primitives ---------- */
.line-mask { display: block; overflow: hidden; }
.line-inner { display: block; will-change: transform; }
[data-reveal] { will-change: transform, opacity; }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
  .line-inner { transform: none !important; }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}