/*
 * NEWTON / AI — Brand system 2026
 * Vibrant, human and direct. Shared across the complete public portal.
 */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&display=swap');

:root {
  --newton-ink: #020202;
  --newton-paper: #fcfbfd;
  --newton-blue: #1b86eb;
  --newton-green: #38b02f;
  --newton-purple: #7f33bd;
  --newton-pink: #fe4efb;
  --newton-yellow: #ffbb04;
  --newton-line: #020202;
  --bg: var(--newton-paper);
  --surface: #fff;
  --surface-low: #fff;
  --surface-soft: #ffe9ff;
  --text: var(--newton-ink);
  --muted: #4c4c4c;
  --line: var(--newton-ink);
  --brand: var(--newton-ink);
  --accent: var(--newton-blue);
  --cta: var(--newton-yellow);
  --soft: #e7f3ff;
}

* { box-sizing: border-box; }

html { background: var(--newton-paper); }

body {
  margin: 0;
  background: var(--newton-paper) !important;
  color: var(--newton-ink) !important;
  font-family: 'Montserrat', system-ui, sans-serif !important;
  letter-spacing: -0.012em;
}

::selection { color: var(--newton-ink); background: var(--newton-yellow); }

h1, h2, h3, .brand, nav > div > a:first-child, footer > div > div:first-child > div:first-child {
  font-family: 'Montserrat', system-ui, sans-serif !important;
  letter-spacing: -0.04em !important;
}

h1, .brand, nav > div > a:first-child { font-weight: 900 !important; }
h2 { font-weight: 800 !important; }
h3 { font-weight: 700 !important; }

h1, h2 { text-wrap: balance; }
p { text-wrap: pretty; }

a, button, input, summary { border-radius: 0; }

/* Brand marks */
nav#top > div > a:first-child,
.site-nav > div > a:first-child {
  display: inline-flex;
  align-items: center;
  gap: 0;
  color: var(--newton-ink) !important;
  font-size: 0 !important;
  text-decoration: none;
  text-transform: uppercase;
}

nav#top > div > a:first-child::before,
.site-nav > div > a:first-child::before {
  content: 'NEWTON';
  font: 900 23px/1 'Montserrat', sans-serif;
  letter-spacing: -0.08em;
}

nav#top > div > a:first-child::after,
.site-nav > div > a:first-child::after {
  content: '/AI';
  display: inline-grid;
  place-items: center;
  margin-left: 7px;
  min-width: 42px;
  height: 28px;
  padding: 0 5px;
  background: var(--newton-yellow);
  border: 0;
  border-radius: 4px;
  color: var(--newton-ink);
  font: 900 14px/1 'Montserrat', sans-serif;
  letter-spacing: -0.07em;
  transform: none;
}

.brand { color: var(--newton-ink) !important; text-transform: uppercase; }

/* Navigation */
#announcement-bar {
  background: var(--newton-ink) !important;
  color: var(--newton-paper) !important;
  border-bottom: 0;
  text-transform: uppercase;
  letter-spacing: .045em;
}

#announcement-bar .bg-secondary-fixed {
  background: var(--newton-yellow) !important;
  color: var(--newton-ink) !important;
  border: 0;
}

#announcement-bar .text-secondary-fixed { color: var(--newton-paper) !important; }

nav#top, nav.site-nav, .nav, .topbar {
  background: rgba(252, 251, 253, .96) !important;
  border-bottom: 1px solid #e6e9ed !important;
  box-shadow: none !important;
  backdrop-filter: blur(16px);
}

nav#top button, nav#top a,
nav.site-nav button, nav.site-nav a { font-weight: 700 !important; }

#desktop-nav-cta > span { display: none !important; }

nav#top .group > div > div,
nav.site-nav .group > div > div {
  border: 1px solid #e4e8ec !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 50px rgba(2, 2, 2, .10) !important;
}

#mobile-menu, .mobile-menu { background: var(--newton-ink) !important; }
.mobile-menu a.mm-link { border-color: rgba(2,2,2,.28) !important; }

/* Buttons become graphic objects */
a[class*='bg-primary-container'],
a[class*='bg-[#0E0142]'],
button[class*='bg-primary-container'],
.button,
.nlf-btn--next,
.nlf-btn--submit,
.cta-btn {
  background: var(--newton-blue) !important;
  color: #fff !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 28px rgba(27, 134, 235, .20) !important;
  font-weight: 700 !important;
  text-transform: none;
  letter-spacing: -.01em;
}

a[class*='border-2'][class*='primary-container'],
.nlf-btn--back {
  background: var(--newton-paper) !important;
  color: var(--newton-ink) !important;
  border: 1px solid #d7dce2 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

a[class*='bg-secondary-fixed'], button[class*='bg-secondary-fixed'] {
  background: var(--newton-yellow) !important;
  color: var(--newton-ink) !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

a[class*='bg-primary-container']:hover,
a[class*='bg-[#0E0142]']:hover,
.button:hover,
.nlf-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 34px rgba(27, 134, 235, .25) !important;
}

/* Main hero */
.newton-hero {
  position: relative;
  isolation: isolate;
  width: 100% !important;
  max-width: none !important;
  min-height: 900px !important;
  margin: 0 !important;
  padding: 160px max(32px, calc((100vw - 1280px) / 2)) 88px !important;
  background: var(--newton-ink) !important;
  color: var(--newton-paper) !important;
  overflow: hidden;
}

.newton-hero::before,
.newton-hero::after {
  content: '';
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  pointer-events: none;
}

.newton-hero::before, .newton-hero::after { display: none; }

.newton-hero::before {
  width: 430px;
  height: 430px;
  top: 76px;
  right: -150px;
  background: var(--newton-blue);
}

.newton-hero::after {
  width: 230px;
  height: 230px;
  bottom: -96px;
  left: 37%;
  background: var(--newton-yellow);
}

.newton-hero > div { position: relative; z-index: 1; }

.newton-hero h1 {
  max-width: 10.5ch;
  color: var(--newton-paper) !important;
  font-size: clamp(3.7rem, 5.2vw, 6rem) !important;
  line-height: .94 !important;
  letter-spacing: -.06em !important;
  text-transform: uppercase;
}

.newton-hero h1 span { color: var(--newton-yellow) !important; }

.newton-hero h2 {
  color: var(--newton-paper) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: clamp(1.25rem, 2vw, 1.65rem) !important;
  line-height: 1.15 !important;
  letter-spacing: -.025em !important;
  font-weight: 700 !important;
}

.newton-hero p, .newton-hero .text-on-surface-variant { color: rgba(252,251,253,.72) !important; }
.newton-hero .text-on-surface { color: var(--newton-paper) !important; }

.newton-hero > div:first-child > div:first-child {
  background: rgba(255, 255, 255, .08) !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  transform: none;
}

.newton-hero > div:first-child > div:first-child * { color: var(--newton-paper) !important; }

.newton-hero .flex.flex-wrap.items-center.gap-2 > span:not(:first-child) {
  background: var(--newton-paper) !important;
  color: var(--newton-ink) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

.newton-hero .border-t { border-color: rgba(252,251,253,.25) !important; }

.newton-hero-art {
  position: absolute;
  z-index: 0;
  top: -10px;
  right: -105px;
  width: min(760px, 122%);
  max-width: none;
  pointer-events: none;
  filter: drop-shadow(0 24px 30px rgba(0,0,0,.28));
}

.newton-hero__visual { min-width: 0; }

.newton-hero__visual .newton-lead-form {
  position: relative;
  z-index: 2;
  margin-top: 300px;
  background: var(--newton-paper) !important;
  color: var(--newton-ink) !important;
  border: 1px solid #e2e6ea !important;
  border-radius: 18px !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .28) !important;
}

.newton-hero__visual .newton-lead-form p,
.newton-hero__visual .newton-lead-form .text-on-surface-variant { color: #545454 !important; }

/* Section rhythm, headlines and cards */
body > section:not(.newton-hero) { border-bottom: 1px solid #edf0f2; }

body > section:not(.newton-hero) h2,
.hero h1,
.article h1,
.section__head h2 {
  color: var(--newton-ink);
  line-height: 1.02 !important;
  text-transform: none;
}

body > section:not(.newton-hero) h2 { font-size: clamp(2.25rem, 4vw, 3.85rem) !important; }

body > section:not(.newton-hero) h3 { line-height: 1.15; }

section .rounded-xl,
section .rounded-2xl,
section .rounded-3xl,
section details,
.post-card,
.article,
.faq-item,
.hero__panel {
  border: 1px solid #e2e6ea !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 34px rgba(2, 2, 2, .06) !important;
}

section .shadow-xl, section .shadow-2xl { box-shadow: 0 18px 50px rgba(2, 2, 2, .09) !important; }

section .bg-surface-container-low,
section .bg-surface-container,
section .bg-surface-container-high,
section .bg-white { background-color: var(--newton-paper) !important; }

#como-funciona { background: #f6f8fa !important; }
#empleados-digitales { background: var(--newton-paper) !important; }
#pipeline { background: #f7f9fb !important; }
#campanas { background: var(--newton-ink) !important; }
#voz { background: var(--newton-paper) !important; }
#contact-center { background: #f6f8fa !important; }
#agenda { background: var(--newton-paper) !important; }
#inventario { background: var(--newton-paper) !important; }
#shopify { background: var(--newton-ink) !important; }
#planes { background: #f7f9fb !important; }
#cobertura { background: #f6f8fa !important; }
#faq { background: var(--newton-paper) !important; }

#campanas h2, #campanas h3, #shopify h2, #shopify h3 { color: var(--newton-paper) !important; }

#campanas .text-secondary-fixed { color: var(--newton-yellow) !important; }

#como-funciona > div > div:first-child::before,
#empleados-digitales > div > div:first-child::before,
#pipeline > div > div:first-child::before,
#planes > div > div:first-child::before {
  display: none;
  margin-bottom: 18px;
  padding: 7px 11px;
  border: 0;
  background: var(--newton-paper);
  box-shadow: none;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  transform: none;
}

#como-funciona > div > div:first-child::before { content: '01 / CONECTA'; }
#empleados-digitales > div > div:first-child::before { content: '02 / AUTOMATIZA'; }
#pipeline > div > div:first-child::before { content: '03 / CIERRA'; }
#planes > div > div:first-child::before { content: '04 / ESCALA'; }

/* Forms */
.newton-lead-form input,
.newton-lead-form select,
.newsletter input,
input[type='email'] {
  border: 1px solid #d8dde3 !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--newton-ink) !important;
}

.nlf-stepper-dot, .nlf-tile, .nlf-pill {
  border: 1px solid #d8dde3 !important;
  border-radius: 10px !important;
}

.nlf-tile:has(input:checked), .nlf-pill:has(input:checked) {
  background: #e7f3ff !important;
  border-color: var(--newton-blue) !important;
  box-shadow: 0 0 0 3px rgba(27, 134, 235, .12) !important;
}

.nlf-stepper-item.active .nlf-stepper-dot,
.nlf-stepper-item.completed .nlf-stepper-dot { background: var(--newton-blue) !important; }

/* Pricing */
#planes .grid > div:nth-child(1) { background: var(--newton-paper) !important; }
#planes .grid > div:nth-child(2) {
  background: #fff !important;
  border-color: var(--newton-blue) !important;
  box-shadow: 0 20px 60px rgba(27, 134, 235, .14) !important;
}
#planes .grid > div:nth-child(3) { background: #fff !important; }

/* Footer */
footer {
  background: var(--newton-ink) !important;
  color: var(--newton-paper) !important;
  border-top: 0;
}

footer a:hover { color: var(--newton-yellow) !important; }
footer > div > div:first-child > div:first-child {
  color: var(--newton-paper) !important;
  font-size: 1.55rem !important;
  text-transform: uppercase;
}

.wa-sticky, #mobile-cta-bar .cta-btn {
  background: var(--newton-green) !important;
  border: 0 !important;
  box-shadow: 0 12px 32px rgba(56, 176, 47, .28) !important;
}

/* Blog, articles and small utility pages */
.nav__inner, .topbar__inner { padding-block: 14px !important; }

.hero:not(.newton-hero) { padding-top: 82px !important; }

.hero__panel {
  position: relative;
  overflow: hidden;
  background: #f4f7fa !important;
  padding: clamp(30px, 6vw, 68px) !important;
}

.hero__panel::after {
  content: '';
  position: absolute;
  right: -60px;
  bottom: -95px;
  width: 230px;
  height: 230px;
  border-radius: 50%;
  background: rgba(27, 134, 235, .08);
  border: 0;
}

.hero__panel > * { position: relative; z-index: 1; }

.eyebrow, .hero__tag, .post-card__tag {
  background: var(--newton-blue) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 8px !important;
  font-weight: 900 !important;
  letter-spacing: .06em;
}

.post-card {
  background: #fff !important;
  transition: transform .18s ease, box-shadow .18s ease !important;
}

.post-card:nth-child(3n + 1),
.post-card:nth-child(3n + 2),
.post-card:nth-child(3n) { box-shadow: 0 12px 34px rgba(2, 2, 2, .06) !important; }
.post-card:hover { transform: translateY(-3px) !important; box-shadow: 0 20px 46px rgba(2,2,2,.10) !important; }

.article { background: #fff !important; }
.article h2 { text-transform: none; }
.article a { color: var(--newton-blue); text-decoration-thickness: 2px; }

.cta {
  background: var(--newton-ink) !important;
  border: 0;
  border-radius: 18px !important;
  box-shadow: 0 24px 60px rgba(2,2,2,.16);
}

.faq-item { background: #fff !important; }

@media (max-width: 1023px) {
  .newton-hero {
    grid-template-columns: 1fr !important;
    padding-top: 154px !important;
  }
  .newton-hero > div:first-child { max-width: 760px; }
  .newton-hero h1 { max-width: 9ch; }
  .newton-hero__visual { min-height: 820px; }
  .newton-hero-art { top: -60px; right: 50%; width: min(760px, 100%); transform: translateX(50%); }
  .newton-hero__visual .newton-lead-form { margin: 460px auto 0; max-width: 680px; }
}

@media (max-width: 767px) {
  nav#top > div > a:first-child::before, .site-nav > div > a:first-child::before { font-size: 20px; }
  nav#top > div > a:first-child::after, .site-nav > div > a:first-child::after { min-width: 36px; height: 25px; font-size: 12px; }

  .newton-hero {
    display: block !important;
    min-height: auto !important;
    padding: 104px 20px 56px !important;
  }

  .newton-hero::before { width: 210px; height: 210px; top: 210px; right: -120px; }
  .newton-hero::after { width: 140px; height: 140px; bottom: -68px; left: -45px; }
  .newton-hero h1 { font-size: clamp(2.8rem, 11.5vw, 3.6rem) !important; line-height: .96 !important; }
  .newton-hero h2 { font-size: 1.08rem !important; line-height: 1.3 !important; }
  .newton-hero p.text-xl { font-size: .96rem !important; line-height: 1.65 !important; }
  .newton-hero .flex.flex-col.sm\:flex-row a { width: 100%; }
  .newton-hero__visual { min-height: 0; margin-top: 52px; }
  .newton-hero-art { position: relative; top: auto; right: auto; width: 118%; margin: 0 -9% -24px; transform: none; }
  .newton-hero__visual .newton-lead-form { margin: 0 !important; padding: 22px !important; box-shadow: 0 22px 55px rgba(0,0,0,.24) !important; }

  body > section:not(.newton-hero) h2 { font-size: clamp(2rem, 8.5vw, 3rem) !important; }
  section .rounded-xl, section .rounded-2xl, section .rounded-3xl, section details { border-radius: 14px !important; }
  #planes .transform.scale-105 { transform: none !important; }
  .hero:not(.newton-hero) { padding-top: 54px !important; }
  .hero__panel { border-radius: 15px !important; }
}

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