/* Eve Intelligence — estilos propios de esta landing.
   El armazón compartido (tokens de respaldo, reset, nav, portada, pie) está en
   base.css, que se genera desde packages/brand/landing/base.css. Aquí solo va
   lo que sea exclusivo de esta página.

   Se carga DESPUÉS de base.css: lo que se declare aquí gana.
   El color de producto no se fija en CSS — va con --p en el marcado. */

/* ── CTA de la portada ───────────────────────────────────────────────────
   El único botón coral de la página (C2). base.css no lo posiciona, así que
   aquí le damos aire y su nota honesta debajo. */
.cta{margin-top:34px}
.cta-nota{margin-top:12px;font-size:.84rem;color:var(--eve-azul-noche)}

/* ── Portada ─────────────────────────────────────────────────────────────
   **Sin ilustración de escena, a propósito.** Esta hoja se calcó de la landing
   de EvePay y venía con su dibujo de tarjetas, datáfono y caja fuerte, que aquí
   no dice nada: se quitó.

   La ilustración de esta línea **está pendiente y no se dibuja a mano**. Las
   ilustraciones de escena se generan con el prompt del manual (§4) y se
   publican en el repositorio de marca; un dibujo programático sale con todos
   los ángulos iguales y ninguna irregularidad, y en una página de producto eso
   no se lee como minimalismo.

   Mientras tanto manda el degradado radial de base.css, que ya deja la portada
   limpia. Cuando exista `ilustraciones/asistente-documental.webp`, se enchufa
   aquí con el mismo patrón que usan las otras dos landings. */


/* ── Secciones ───────────────────────────────────────────────────────────
   Alternancia clara/tinte según la proporción 60/20/10 (§2): casi todo
   claro, un solo bloque de peso (el de la demo) en azul noche. */
.seccion{padding:84px 0}
.seccion-tinte{background:var(--eve-tinte)}
.seccion h2{font-size:clamp(1.3rem,2.6vw,1.6rem);text-align:center}
.seccion-intro{margin:12px auto 0;max-width:560px;text-align:center;
  color:var(--eve-pizarra);font-size:clamp(.9rem,1.6vw,.98rem)}

/* ── Pasos numerados ─────────────────────────────────────────────────────
   El número es Baloo 700 (cifra protagonista, §3) en un círculo hielo;
   nunca coral: aquí no hay acción que pedir. */
.pasos{list-style:none;margin:48px auto 0;padding:0;max-width:960px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
.paso{text-align:center}
.paso-num{display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;margin:0 auto 16px;border-radius:999px;
  background:var(--eve-hielo);color:var(--eve-mezclado);
  font-family:'Baloo 2',system-ui,sans-serif;font-weight:700;font-size:1.1rem}
.paso-num.sm{width:30px;height:30px;margin:0;font-size:.86rem;flex:none}
.paso h3{font-size:1.02rem;font-weight:600}
.paso p{margin-top:8px;font-size:.9rem;color:var(--eve-pizarra)}

/* ── Características ─────────────────────────────────────────────────────
   Variante minimalista del manual (§6): sin fondo ni sombra, la jerarquía la
   da el espacio y el icono de producto teñido con --p. */
.caracts-grid{list-style:none;margin:48px auto 0;padding:0;max-width:980px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:40px 36px}
.caract .p-ico{margin-bottom:16px}
.caract h3{font-size:1.02rem;font-weight:600}
.caract p{margin-top:8px;font-size:.9rem;color:var(--eve-pizarra)}

/* ── Link de pago por WhatsApp ───────────────────────────────────────────
   Dos columnas en escritorio (texto / pasos), una en móvil. Los pasos usan
   el mismo círculo numerado, en tamaño pequeño, alineado al texto. */
/* ── Demo (formulario sobre azul noche) ──────────────────────────────────
   El bloque de peso de la página (§2). El formulario va en tarjeta blanca
   para conservar el patrón de formularios del manual (§6) con su contraste. */
.demo{padding:88px 0;background:var(--eve-azul-noche);color:#fff}
.demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;
  align-items:start;max-width:980px;margin:0 auto}
.demo-texto h2{font-size:clamp(1.3rem,2.6vw,1.6rem)}
.demo-texto > p{margin-top:14px;color:#B9CCE0;font-size:clamp(.9rem,1.6vw,.98rem)}
.demo-puntos{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:14px}
.demo-puntos li{position:relative;padding-left:26px;font-size:.9rem;color:#B9CCE0}
.demo-puntos li::before{content:"";position:absolute;left:2px;top:8px;
  width:8px;height:8px;border-radius:999px;background:var(--eve-cian)}

/* La tarjeta del formulario (.demo-form, .demo-legal) vive en base.css: la
   comparten las dos landings. Aquí solo queda la sección que la rodea. */

/* ── Responsive ────────────────────────────────────────────────────────── */
}

@media (max-width:760px){
  .seccion{padding:64px 0}
  .pasos{grid-template-columns:1fr;gap:32px;max-width:420px}
  .wa{grid-template-columns:1fr;gap:32px}
  .wa-texto h2{text-align:center}
  .wa-pasos{max-width:420px;margin:0 auto}
  .demo{padding:64px 0}
  .demo-grid{grid-template-columns:1fr}
}

@media (min-width:1440px){
  .pasos,.caracts-grid,.wa,.demo-grid{max-width:1060px}
}

/* ── Identidad de la línea ───────────────────────────────────────────────
   El violeta identifica Eve Intelligence y NO se usa en botones (C3). Sobre
   blanco, el texto va en el violeta oscuro: el base no tiene contraste
   suficiente (C7). */
.etiqueta-ia{background:var(--eve-violeta-tinte);color:var(--eve-violeta-texto)}

/* ── Las seis capas ──────────────────────────────────────────────────────
   Lista numerada con el número en violeta. Es el bloque que sostiene la
   promesa del producto, así que se lee como argumento, no como tabla. */
.capas{list-style:none;counter-reset:capa;margin:0;padding:0;display:grid;gap:14px;max-width:760px}
.capas li{counter-increment:capa;position:relative;padding:14px 18px 14px 56px;background:var(--eve-blanco);
  border:1px solid var(--eve-linea);border-radius:14px;color:var(--eve-pizarra);line-height:1.6}
.capas li::before{content:counter(capa);position:absolute;left:16px;top:14px;width:26px;height:26px;
  border-radius:50%;background:var(--eve-violeta-tinte);color:var(--eve-violeta-texto);
  font-family:'Baloo 2',system-ui,sans-serif;font-weight:700;font-size:.85rem;
  display:grid;place-items:center}
.capas li b{color:var(--eve-azul-noche)}
.capas-nota{margin:22px 0 0;max-width:760px;color:var(--eve-pizarra);line-height:1.65}
.capas-nota b{color:var(--eve-azul-noche)}

/* ── Requisitos ──────────────────────────────────────────────────────────
   Sin tarjeta ni sombra: es una conversación franca, no un cuadro de
   características. */
.requisitos{list-style:none;margin:0;padding:0;display:grid;gap:12px;max-width:760px}
.requisitos li{position:relative;padding-left:22px;color:var(--eve-pizarra);line-height:1.65}
.requisitos li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;
  border-radius:50%;background:var(--eve-violeta)}
.requisitos li b{color:var(--eve-azul-noche)}

/* ── Código dentro del texto ─────────────────────────────────────────────
   Aparece una sola vez, en «se instala con una línea». */
code{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.88em;
  background:var(--eve-hielo);padding:1px 6px;border-radius:5px}