/* ==========================================================================
   Lenox HR — Redesign 2026
   Sistema de diseño moderno inspirado en Factorial / Sesame / Linear bento.
   Convive con main.min.css (Tailwind precompilado). Sólo se carga en la
   home rediseñada (site/index.njk en rama "rediseño").
   ========================================================================== */

:root {
  /* Paleta marca — bordo Lenox */
  --lx-bordo-50:  #fdf2f3;
  --lx-bordo-100: #fbe3e5;
  --lx-bordo-200: #f5c0c4;
  --lx-bordo-300: #ec9097;
  --lx-bordo-400: #de5b66;
  --lx-bordo-500: #c93a47;
  --lx-bordo-600: #9b2d30;   /* color base actual rgb(155 45 48) */
  --lx-bordo:     #9b2d30;   /* alias del color base — usado por acentos del hero en index.njk */
  --lx-bordo-700: #7d2528;
  --lx-bordo-800: #682124;
  --lx-bordo-900: #4e191b;

  /* Paleta marca — verde Lenox (normativa, éxito) */
  --lx-green-50:  #f0fdf4;
  --lx-green-100: #dcfce7;
  --lx-green-500: #22c55e;
  --lx-green-600: #16a34a;   /* verde Lenox usado en "Cumple normativa" */
  --lx-green-700: #15803d;
  --lx-green-soft:#dcfce7;

  /* Paleta oscura — carbón Lenox (botones dark, secciones) */
  --lx-carbon:     #0f172a;   /* slate-900 — el dark del site */
  --lx-carbon-2:   #1e293b;   /* slate-800 */
  --lx-carbon-soft:#f8fafc;   /* slate-50  */
  --lx-amber:      #f59e0b;   /* estrellas rating */

  /* Neutros */
  --lx-ink:     #0f172a;
  --lx-ink-2:   #1e293b;
  --lx-muted:   #64748b;
  --lx-soft:    #f8fafc;
  --lx-line:    #e2e8f0;
  --lx-card:    #ffffff;

  /* Gradientes — solo bordo + dark, on-brand 100% */
  --lx-grad-hero: linear-gradient(135deg, #7d2528 0%, #9b2d30 40%, #c93a47 100%);
  --lx-grad-text: linear-gradient(90deg, #9b2d30 0%, #c93a47 100%);
  --lx-grad-dark: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  --lx-grad-green:linear-gradient(135deg, #15803d 0%, #16a34a 100%);

  /* Sombras de color */
  --lx-shadow-bordo: 0 30px 60px -20px rgba(155, 45, 48, .35), 0 8px 18px -12px rgba(155, 45, 48, .25);
  --lx-shadow-dark:  0 30px 60px -20px rgba(15, 23, 42, .35);
  --lx-shadow-card:  0 10px 30px -12px rgba(15, 23, 42, .08), 0 4px 10px -6px rgba(15, 23, 42, .05);
  --lx-shadow-soft:  0 1px 2px rgba(15,23,42,.04), 0 4px 14px -8px rgba(15,23,42,.06);

  /* Radius */
  --lx-r-sm: 12px;
  --lx-r-md: 18px;
  --lx-r-lg: 28px;
  --lx-r-xl: 36px;
  --lx-r-pill: 999px;
}

/* ===== Wrapper de scope para no pisar al resto del sitio ===== */
.lx2026 { color: var(--lx-ink); }
.lx2026 .lx-display {
  font-family: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;
  letter-spacing: -0.03em;
  font-weight: 800;
}
.lx2026 .lx-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .4rem .8rem;
  background: #fff;
  border: 1px solid var(--lx-line);
  color: var(--lx-ink);
  border-radius: var(--lx-r-pill);
  font-size: 11px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  box-shadow: var(--lx-shadow-soft);
}
.lx2026 .lx-eyebrow .dot {
  width: 8px; height: 8px; border-radius: 999px;
  background: var(--lx-bordo-600);
  box-shadow: 0 0 0 4px rgba(155,45,48,.15);
  animation: lx-pulse 2s ease-in-out infinite;
}
@keyframes lx-pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(155,45,48,.4); }
  50%     { box-shadow: 0 0 0 8px rgba(155,45,48,0); }
}

.lx2026 .lx-gradient-text {
  color: var(--lx-bordo-600); /* fallback para browsers sin soporte */
  background: var(--lx-grad-text);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ===== Botones ===== */
.lx2026 .lx-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: .55rem;
  padding: .95rem 1.4rem;
  border-radius: var(--lx-r-pill);
  font-weight: 700; font-size: 15px;
  letter-spacing: -0.01em;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
  white-space: nowrap;
}
.lx2026 .lx-btn-primary {
  background: var(--lx-ink);
  color: #fff;
  box-shadow: 0 10px 30px -10px rgba(11,15,25,.45);
}
.lx2026 .lx-btn-primary:hover { transform: translateY(-2px); background: #000; box-shadow: 0 18px 40px -12px rgba(11,15,25,.55); }
.lx2026 .lx-btn-bordo {
  background: var(--lx-bordo-600);
  color: #fff;
  box-shadow: var(--lx-shadow-bordo);
}
.lx2026 .lx-btn-bordo:hover { transform: translateY(-2px); background: var(--lx-bordo-700); }
.lx2026 .lx-btn-ghost {
  background: #fff;
  color: var(--lx-ink);
  border: 1px solid var(--lx-line);
}
.lx2026 .lx-btn-ghost:hover { border-color: var(--lx-ink); transform: translateY(-2px); }

/* ===== Hero ===== */
.lx2026 .lx-hero {
  position: relative;
  padding: 4.5rem 0 4rem;
  /* Fondo igualado al gris del video del hero (#f7f9fb) para que el
     recuadro del video se funda y el diagrama parezca flotar. Se quita el
     radial morado superior-derecho (caia sobre el video) y se conserva un
     calido suave del lado del texto. */
  background:
    radial-gradient(800px 500px at -10% 20%, rgba(255,178,122,.14), transparent 60%),
    #f7f9fb;
  overflow: hidden;
}
.lx2026 .lx-hero::before {
  content:"";
  position:absolute; inset:auto 0 0 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lx-line), transparent);
}
.lx2026 .lx-hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: center;
}
@media (min-width: 1024px) {
  .lx2026 .lx-hero-grid { grid-template-columns: 1.05fr 1fr; gap: 4rem; }
  .lx2026 .lx-hero { padding: 6rem 0 5rem; }
}
.lx2026 .lx-h1 {
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  line-height: 1.06;
}
.lx2026 .lx-lead {
  font-size: clamp(1.05rem, 1.4vw, 1.25rem);
  color: var(--lx-muted);
  line-height: 1.55;
  max-width: 36rem;
}

/* Mockup hero con sombras de color y badges flotantes */
.lx2026 .lx-mockup {
  position: relative;
  border-radius: var(--lx-r-xl);
  padding: 6px;
  background: linear-gradient(180deg,#ffffff, #fdf2f3);
  box-shadow: var(--lx-shadow-bordo), 0 1px 0 #fff inset;
  border: 1px solid var(--lx-line);
}
.lx2026 .lx-mockup-inner {
  border-radius: calc(var(--lx-r-xl) - 6px);
  overflow: hidden;
  background: #f8fafc;
  display: block;
}
/* Hero: video determina su propia altura */
.lx2026 .lx-mockup-inner video {
  width: 100%; height: auto; display: block;
  max-height: 440px; object-fit: contain;
}
/* Feature strips: imagen cubre el contenedor con relación fija */
.lx2026 .lx-mockup-inner.cover {
  aspect-ratio: 4 / 3;
}
.lx2026 .lx-mockup-inner.cover img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}

/* Hero: mockup sin recuadro — la imagen flota libre con los badges */
.lx2026 .lx-hero .lx-mockup {
  padding: 0;
  background: transparent;
  box-shadow: none;
  border: none;
}
.lx2026 .lx-hero .lx-mockup-inner {
  border-radius: var(--lx-r-xl);
  background: transparent;
}

.lx2026 .lx-float {
  position: absolute;
  background: #fff;
  border: 1px solid var(--lx-line);
  border-radius: var(--lx-r-md);
  padding: .75rem 1rem;
  box-shadow: var(--lx-shadow-card);
  display: flex; align-items: center; gap: .75rem;
  font-size: 13px;
  backdrop-filter: blur(10px);
  animation: lx-float 6s ease-in-out infinite;
}
.lx2026 .lx-float .ic {
  width: 36px; height: 36px; border-radius: 12px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink: 0;
}
.lx2026 .lx-float strong { color: var(--lx-ink); font-weight: 700; }
.lx2026 .lx-float span.sub { color: var(--lx-muted); font-size: 11.5px; display:block; }

.lx2026 .lx-float-a { top: -18px; right: -22px; animation-delay: 0s; }
.lx2026 .lx-float-b { bottom: 30px; left: -32px; animation-delay: 1.2s; }
.lx2026 .lx-float-c { top: 28%; right: -28px; animation-delay: 2.4s; }
@media (max-width: 640px) {
  .lx2026 .lx-float-a, .lx2026 .lx-float-c { display: none; }
  .lx2026 .lx-float-b { left: 8px; bottom: 8px; }
}
@keyframes lx-float {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-6px); }
}

/* ===== Métricas / prueba social ===== */
.lx2026 .lx-metrics {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 768px) { .lx2026 .lx-metrics { grid-template-columns: repeat(4, 1fr); } }
.lx2026 .lx-metric {
  background: #fff;
  border: 1px solid var(--lx-line);
  border-radius: var(--lx-r-md);
  padding: 1.25rem 1.25rem;
  box-shadow: var(--lx-shadow-soft);
  transition: transform .25s ease, box-shadow .25s ease;
}
.lx2026 .lx-metric:hover { transform: translateY(-4px); box-shadow: var(--lx-shadow-card); }
.lx2026 .lx-metric .num {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: clamp(1.7rem, 3vw, 2.2rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--lx-ink);
  line-height: 1;
}
.lx2026 .lx-metric .lbl {
  margin-top: .35rem;
  color: var(--lx-muted);
  font-size: 13px;
}

/* Nota: los logos de la home usan el componente .logo-carousel (main.min.css),
   mismo estilo que /clientes. El antiguo marquee .lx-logos fue removido. */

/* ===== Bento ===== */
.lx2026 .lx-bento {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .lx2026 .lx-bento {
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: minmax(180px, auto);
    gap: 1.25rem;
  }
}
.lx2026 .lx-bento-card {
  position: relative;
  background: var(--lx-card);
  border: 1px solid var(--lx-line);
  border-radius: var(--lx-r-lg);
  padding: 1.5rem;
  box-shadow: var(--lx-shadow-soft);
  overflow: hidden;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.lx2026 .lx-bento-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--lx-shadow-card);
  border-color: #dfe3ec;
}
.lx2026 .lx-bento-card .ic-tile {
  width: 44px; height: 44px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
  margin-bottom: 1rem;
}
.lx2026 .lx-bento-card h3 {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 800; letter-spacing: -0.02em;
  font-size: 1.25rem; color: var(--lx-ink);
  margin-bottom: .5rem;
}
.lx2026 .lx-bento-card p {
  color: var(--lx-muted);
  font-size: 14.5px; line-height: 1.55;
}

@media (min-width: 768px) {
  .lx2026 .lx-b-wide { grid-column: span 4; grid-row: span 2; }
  .lx2026 .lx-b-half { grid-column: span 3; }
  .lx2026 .lx-b-third{ grid-column: span 2; }
  .lx2026 .lx-b-tall { grid-column: span 2; grid-row: span 2; }
  .lx2026 .lx-b-full { grid-column: span 6; }
}

/* Variantes de color de tile — paleta Lenox */
.lx2026 .tile-bordo  { background: var(--lx-bordo-50);  color: var(--lx-bordo-700); }
.lx2026 .tile-bordo2 { background: var(--lx-bordo-100); color: var(--lx-bordo-800); }
.lx2026 .tile-green  { background: var(--lx-green-soft); color: var(--lx-green-700); }
.lx2026 .tile-dark   { background: #eef0f6;              color: var(--lx-ink); }
.lx2026 .tile-carbon { background: var(--lx-carbon);     color: #fff; }
.lx2026 .tile-ink    { background: #eef0f6;              color: var(--lx-ink); }

/* Card oscura destacada */
.lx2026 .lx-bento-card.dark {
  background: linear-gradient(160deg, #0b0f19 0%, #1a1f33 100%);
  color: #fff;
  border-color: #1a1f33;
}
.lx2026 .lx-bento-card.dark h3 { color: #fff; }
.lx2026 .lx-bento-card.dark p  { color: #b8bdcc; }
.lx2026 .lx-bento-card.dark .ic-tile { background: rgba(255,255,255,.08); color: #fff; }

/* Card con gradient hero */
.lx2026 .lx-bento-card.hero-grad {
  background: var(--lx-grad-hero);  /* bordo oscuro → bordo base → bordo claro */
  color: #fff;
  border: none;
}
.lx2026 .lx-bento-card.hero-grad h3 { color: #fff; }
.lx2026 .lx-bento-card.hero-grad p  { color: rgba(255,255,255,.88); }
.lx2026 .lx-bento-card.hero-grad .ic-tile { background: rgba(255,255,255,.16); color:#fff; }

/* Card verde */
.lx2026 .lx-bento-card.green-grad {
  background: var(--lx-grad-green);
  color: #fff; border: none;
}
.lx2026 .lx-bento-card.green-grad h3 { color: #fff; }
.lx2026 .lx-bento-card.green-grad p  { color: rgba(255,255,255,.9); }
.lx2026 .lx-bento-card.green-grad .ic-tile { background: rgba(255,255,255,.18); color:#fff; }

/* Visual chip (mini ilustración dentro de card) */
.lx2026 .lx-chip-row {
  display:flex; flex-wrap: wrap; gap:.5rem; margin-top: 1rem;
}
.lx2026 .lx-chip {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.35rem .7rem;
  background:#f4f5fa; color: var(--lx-ink-2);
  border-radius: var(--lx-r-pill);
  font-size: 12.5px; font-weight: 600;
  border: 1px solid var(--lx-line);
}
.lx2026 .lx-bento-card.dark .lx-chip { background: rgba(255,255,255,.08); color:#fff; border-color: rgba(255,255,255,.15); }

/* ===== Sección genérica ===== */
.lx2026 .lx-section { padding: 2.5rem 0; }
@media (min-width: 768px) { .lx2026 .lx-section { padding: 4rem 0; } }
.lx2026 .lx-container { max-width: 1200px; margin: 0 auto; padding: 0 1.25rem; }
@media (min-width:768px){ .lx2026 .lx-container{ padding:0 2rem; } }

/* Feature grid alternado */
.lx2026 .lx-feature-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
}
@media (min-width: 1024px) {
  .lx2026 .lx-feature-grid { grid-template-columns: 1fr 1fr; }
  .lx2026 .lx-feature-grid > [style*="order:1"] { order: 1; }
  .lx2026 .lx-feature-grid > [style*="order:2"] { order: 2; }
}
@media (max-width: 1023px) {
  .lx2026 .lx-feature-grid > [style*="order:1"] { order: unset; }
  .lx2026 .lx-feature-grid > [style*="order:2"] { order: unset; }
}

.lx2026 .lx-section-head { max-width: 720px; margin: 0 auto 3rem; text-align: center; }
.lx2026 .lx-section-head h2 {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 800; letter-spacing: -0.03em;
  font-size: clamp(2rem, 3.4vw, 3rem);
  line-height: 1.08;
  color: var(--lx-ink);
}
.lx2026 .lx-section-head p {
  margin-top: 1rem; color: var(--lx-muted);
  font-size: 1.05rem; line-height: 1.6;
}

/* ===== Testimonios ===== */
.lx2026 .lx-testimonials {
  display:grid; gap:1.25rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .lx2026 .lx-testimonials { grid-template-columns: repeat(3, 1fr); }
}
.lx2026 .lx-tm {
  background:#fff; border:1px solid var(--lx-line); border-radius: var(--lx-r-lg);
  padding: 1.5rem; box-shadow: var(--lx-shadow-soft);
  display:flex; flex-direction:column; gap: 1rem;
}
.lx2026 .lx-tm .stars { color: var(--lx-amber); letter-spacing: 2px; }
.lx2026 .lx-tm blockquote { color: var(--lx-ink-2); font-size: 15.5px; line-height: 1.55; }
.lx2026 .lx-tm .who {
  display:flex; align-items:center; gap: .75rem;
  border-top: 1px solid var(--lx-line); padding-top: 1rem;
}
.lx2026 .lx-tm .who .name { font-weight: 700; color: var(--lx-ink); font-size: 14px; }
.lx2026 .lx-tm .who .role { color: var(--lx-muted); font-size: 12.5px; }
.lx2026 .lx-tm .tm-source {
  display: flex; align-items: center; justify-content: space-between;
}
.lx2026 .lx-tm .tm-source img,
.lx2026 .lx-tm .tm-source svg { height: 18px; width: auto; display: block; }

/* ===== FAQ ===== */
.lx2026 .lx-faq { max-width: 820px; margin: 0 auto; }
.lx2026 .lx-faq details {
  background:#fff; border:1px solid var(--lx-line); border-radius: var(--lx-r-md);
  padding: 1rem 1.25rem; margin-bottom: .75rem; transition: border-color .2s;
}
.lx2026 .lx-faq details[open] { border-color: var(--lx-bordo-300); box-shadow: var(--lx-shadow-soft); }
.lx2026 .lx-faq summary {
  list-style:none; cursor:pointer; display:flex; align-items:center; gap:.75rem;
  font-weight: 700; color: var(--lx-ink); font-size: 16px;
}
.lx2026 .lx-faq summary::-webkit-details-marker { display:none; }
.lx2026 .lx-faq .lx-faq-icon {
  width: 18px; height: 18px; flex-shrink: 0;
  color: var(--lx-bordo-600);
}
.lx2026 .lx-faq summary::after {
  content:"+"; font-size: 22px; color: var(--lx-bordo-600); font-weight: 400;
  margin-left: auto; flex-shrink: 0;
}
.lx2026 .lx-faq details[open] summary::after { content:"–"; }
.lx2026 .lx-faq .ans { color: var(--lx-muted); margin-top: .75rem; line-height: 1.6; font-size: 14.5px; }

/* ===== CTA Final ===== */
.lx2026 .lx-cta {
  background: var(--lx-grad-hero);
  border-radius: var(--lx-r-xl);
  padding: 3rem 1.5rem;
  text-align:center;
  color:#fff;
  position: relative; overflow: hidden;
}
.lx2026 .lx-cta::before, .lx2026 .lx-cta::after {
  content:""; position:absolute; border-radius:999px; filter: blur(60px); opacity:.5;
}
.lx2026 .lx-cta::before { width:300px; height:300px; background: var(--lx-bordo-800); top:-100px; right:-50px; }
.lx2026 .lx-cta::after  { width:260px; height:260px; background: var(--lx-bordo-400); bottom:-100px; left:-50px; }
.lx2026 .lx-cta > * { position: relative; z-index:1; }
.lx2026 .lx-cta h2 {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 800; letter-spacing: -0.03em;
  font-size: clamp(1.75rem, 3.4vw, 2.75rem); line-height: 1.08; color:#fff;
}
.lx2026 .lx-cta p { color: rgba(255,255,255,.9); margin: 1rem auto 2rem; max-width: 620px; }
.lx2026 .lx-cta .lx-btn-bordo { background:#fff; color: var(--lx-bordo-700); box-shadow: 0 10px 30px -10px rgba(0,0,0,.3); }
.lx2026 .lx-cta .lx-btn-bordo:hover { background:#fff; color: var(--lx-bordo-800); }
.lx2026 .lx-cta .lx-btn-ghost { background: rgba(255,255,255,.1); color:#fff; border-color: rgba(255,255,255,.3); }

/* ===== Pain points ===== */
.lx2026 .lx-pain-grid {
  display: grid; gap: 1rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px)  { .lx2026 .lx-pain-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px)  { .lx2026 .lx-pain-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .lx2026 .lx-pain-grid { grid-template-columns: repeat(4, 1fr); } }

.lx2026 .lx-pain {
  background: #fff;
  border: 1px solid var(--lx-line);
  border-radius: var(--lx-r-md);
  padding: 1.5rem;
  box-shadow: var(--lx-shadow-soft);
  display: flex; flex-direction: column; gap: .75rem;
  transition: border-color .2s, transform .25s;
}
.lx2026 .lx-pain:hover { border-color: var(--lx-bordo-200); transform: translateY(-3px); }
.lx2026 .lx-pain .pain-ico {
  width: 42px; height: 42px; border-radius: 12px;
  background: var(--lx-bordo-50); color: var(--lx-bordo-600);
  display: flex; align-items: center; justify-content: center;
}
.lx2026 .lx-pain h3 {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 700; font-size: 15px; color: var(--lx-ink);
  line-height: 1.35;
}
.lx2026 .lx-pain p { font-size: 13.5px; color: var(--lx-muted); line-height: 1.5; }
.lx2026 .lx-pain .pain-cost {
  margin-top: auto;
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: 12px; font-weight: 700;
  color: var(--lx-bordo-600);
  padding: .3rem .7rem;
  background: var(--lx-bordo-50);
  border-radius: var(--lx-r-pill);
  width: fit-content;
  white-space: nowrap;
}

/* ===== Feature section alternada ===== */
.lx2026 .lx-feature-section {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: center;
}
@media (min-width: 768px) {
  .lx2026 .lx-feature-section { grid-template-columns: 1fr 1fr; gap: 3rem; }
}
@media (min-width: 1024px) {
  .lx2026 .lx-feature-section { gap: 5rem; }
  .lx2026 .lx-feature-section.reverse .lx-feature-text { order: 2; }
  .lx2026 .lx-feature-section.reverse .lx-feature-visual { order: 1; }
}
.lx2026 .lx-feature-text { display: flex; flex-direction: column; gap: 1rem; }
.lx2026 .lx-feature-text h2 {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 800; letter-spacing: -0.03em;
  font-size: clamp(1.6rem, 2.8vw, 2.2rem);
  line-height: 1.1; color: var(--lx-ink);
}
.lx2026 .lx-feature-text p { color: var(--lx-muted); font-size: 1.05rem; line-height: 1.6; }
.lx2026 .lx-check-list { display: flex; flex-direction: column; gap: .6rem; margin-top: .5rem; }
.lx2026 .lx-check-list li {
  display: flex; align-items: flex-start; gap: .65rem;
  font-size: 15px; color: var(--lx-ink-2); line-height: 1.4;
}
.lx2026 .lx-check-list .ck {
  width: 20px; height: 20px; border-radius: 999px; flex-shrink: 0; margin-top: 2px;
  background: var(--lx-green-soft); color: var(--lx-green-700);
  display: flex; align-items: center; justify-content: center;
}

/* Feature visual: img de alta resolución en mockup */
.lx2026 .lx-feature-visual .lx-mockup-inner.cover {
  aspect-ratio: 4 / 3;
  border-radius: 20px;
}
.lx2026 .lx-feature-visual .lx-mockup-inner.cover img {
  width: 100%; height: 100%; object-fit: cover; object-position: top;
  display: block;
}
/* Stat chip flotante sobre la imagen */
.lx2026 .lx-stat-chip {
  position: absolute;
  background: #fff;
  border: 1px solid var(--lx-line);
  border-radius: var(--lx-r-md);
  padding: .65rem 1rem;
  box-shadow: var(--lx-shadow-card);
  display: flex; align-items: center; gap: .65rem;
  font-size: 13px;
  animation: lx-float 5s ease-in-out infinite;
}
.lx2026 .lx-stat-chip strong { color: var(--lx-ink); font-weight: 800; font-size: 16px; display: block; }
.lx2026 .lx-stat-chip span   { color: var(--lx-muted); font-size: 11.5px; }
.lx2026 .lx-stat-chip .chip-ico {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.lx2026 .lx-stat-chip.chip-tl { top: -16px; left: -16px; }
.lx2026 .lx-stat-chip.chip-br { bottom: 20px; right: -16px; animation-delay: 1.5s; }
.lx2026 .lx-stat-chip.chip-tr { top: -16px; right: -16px; animation-delay: .8s; }
/* tablet: chips dentro del bounds del visual */
@media (max-width: 1023px) {
  .lx2026 .lx-stat-chip.chip-tl { top: 12px; left: 12px; }
  .lx2026 .lx-stat-chip.chip-br { bottom: 12px; right: 12px; }
  .lx2026 .lx-stat-chip.chip-tr { top: 12px; right: 12px; }
}
/* mobile: compacto */
@media (max-width: 640px) {
  .lx2026 .lx-stat-chip.chip-tl { top: 8px; left: 8px; }
  .lx2026 .lx-stat-chip.chip-br { bottom: 8px; right: 8px; }
  .lx2026 .lx-stat-chip.chip-tr { top: 8px; right: 8px; }
}

/* ===== Sección LIA (dark) ===== */
.lx2026 .lx-lia {
  background: var(--lx-grad-dark);
  color: #fff;
  border-radius: var(--lx-r-xl);
  padding: 4rem 2rem;
  display: grid; gap: 3rem;
  align-items: center;
  grid-template-columns: 1fr;
  overflow: hidden; position: relative;
}
@media (min-width: 1024px) {
  .lx2026 .lx-lia { grid-template-columns: 1fr 1fr; padding: 5rem 4rem; }
}
.lx2026 .lx-lia::before {
  content:""; position:absolute;
  width:500px; height:500px; border-radius:999px;
  background: radial-gradient(circle, rgba(155,45,48,.35), transparent 70%);
  top:-100px; right:-100px;
}
.lx2026 .lx-lia-text { position: relative; }
.lx2026 .lx-lia-text h2 {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 800; letter-spacing: -0.03em;
  font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.08; color: #fff;
}
.lx2026 .lx-lia-text p { color: rgba(255,255,255,.78); font-size: 1.05rem; line-height: 1.6; margin-top: 1rem; }
.lx2026 .lx-lia-bubbles {
  display: flex; flex-direction: column; gap: .75rem; margin-top: 1.5rem;
  position: relative;
}
.lx2026 .lx-bubble {
  padding: .75rem 1rem;
  border-radius: 16px;
  font-size: 14px; line-height: 1.4; max-width: 320px;
}
.lx2026 .lx-bubble.q {
  background: rgba(255,255,255,.1);
  color: rgba(255,255,255,.9);
  border: 1px solid rgba(255,255,255,.12);
  border-bottom-right-radius: 4px;
  align-self: flex-end;
}
.lx2026 .lx-bubble.a {
  background: var(--lx-bordo-600);
  color: #fff;
  border-bottom-left-radius: 4px;
}
.lx2026 .lx-lia-visual {
  position: relative; display: flex; align-items: center; justify-content: center;
}
.lx2026 .lx-lia-visual img {
  width: 100%; max-width: 420px; height: auto; display: block;
  filter: drop-shadow(0 20px 40px rgba(0,0,0,.4));
}

/* ===== Módulos grid (iconos compactos) ===== */
.lx2026 .lx-modules {
  display: grid; gap: .75rem;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 640px)  { .lx2026 .lx-modules { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .lx2026 .lx-modules { grid-template-columns: repeat(4, 1fr); } }
.lx2026 .lx-mod {
  background: #fff; border: 1px solid var(--lx-line);
  border-radius: var(--lx-r-md); padding: 1rem 1.1rem;
  display: flex; align-items: center; gap: .75rem;
  box-shadow: var(--lx-shadow-soft);
  transition: border-color .2s, transform .2s;
  font-size: 14px; font-weight: 600; color: var(--lx-ink-2);
}
.lx2026 .lx-mod:hover { border-color: var(--lx-bordo-200); transform: translateY(-2px); }
.lx2026 .lx-mod .mic {
  width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}

/* ===== Reveal on scroll (mejora progresiva) ===== */
.lx2026 .lx-reveal {
  opacity: 0; transform: translateY(20px);
  transition: opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1);
}
.lx2026 .lx-reveal.in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .lx2026 *, .lx2026 *::before, .lx2026 *::after {
    animation: none !important; transition: none !important;
  }
  .lx2026 .lx-reveal { opacity: 1; transform: none; }
}


/* ===== Ajustes de revisión home (mobile + consistencia visual) ===== */
.lx2026 .lx-form-card { padding: 2.25rem 2rem; }
.lx2026 #form-contacto-home .form-submit { border-radius: var(--lx-r-pill); }
@media (max-width: 480px) {
  .lx2026 .lx-form-card { padding: 1.5rem 1.15rem; }
}
@media (max-width: 360px) {
  .lx2026 .lx-hero ul li { white-space: normal; }
}

/* FAQ: feedback de hover (las preguntas ya tienen cursor:pointer) */
.lx2026 .lx-faq summary:hover { color: var(--lx-bordo-700); }
.lx2026 .lx-faq details:not([open]):hover { border-color: var(--lx-bordo-200); }