/* Landing de IA básica: bandeja, resumen y hoja de cálculo del hero, panel de
   "qué hace bien / qué revisar / qué no compartir" y mini ilustraciones. */

/* Hero */
.inbox { position: absolute; left: 6%; top: 7%; width: 54%; z-index: 1; display: grid; gap: 6px; }
.inbox .count { font: 600 11px var(--mono); color: #d92d20; }
.inbox .mail { height: 10px; border-radius: 4px; background: var(--blue-100); }
.inbox .mail:nth-child(4) { width: 80%; } .inbox .mail:nth-child(5) { width: 60%; }
.summary { position: absolute; right: 5%; top: 30%; width: 56%; z-index: 2; display: grid; gap: 4px; box-shadow: 0 30px 50px -20px rgba(0, 0, 0, .6); }
.summary b { color: var(--blue); }
.summary span { color: var(--ink); }
.sheet { position: absolute; left: 7%; bottom: 7%; width: 64%; z-index: 3; display: grid; gap: 8px; transform: rotate(-1.5deg); }
.formula { font: 500 11px var(--mono); color: var(--blue-deep); background: var(--blue-50); border: 1px solid var(--blue-200); border-radius: 6px; padding: 4px 8px; }
.cells { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; }
.cells i { height: 12px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 2px; }
.cells i:nth-child(3n) { background: #e7f8ef; }

/* Qué hace bien / qué revisar / qué no compartir */
.verdict-board { border-radius: var(--r-lg); border: 1.5px solid var(--ink); padding: 28px; display: grid; gap: 14px; align-content: center; min-height: 380px; box-shadow: 10px 10px 0 var(--blue-deep); }
.verdict { position: relative; z-index: 1; background: #fff; border-radius: 14px; padding: 14px 16px 14px 52px; display: grid; gap: 2px; box-shadow: 0 20px 40px -24px rgba(0, 0, 0, .6); }
.verdict::before { position: absolute; left: 14px; top: 14px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font: 700 14px var(--body); color: #fff; }
.verdict.ok::before { content: "✓"; background: var(--ok); }
.verdict.check::before { content: "!"; background: #f79009; }
.verdict.no::before { content: "✕"; background: #d92d20; }
.verdict b { font-family: var(--cond); font-stretch: 75%; font-weight: 800; text-transform: uppercase; font-size: 20px; color: var(--ink); }
.verdict span { font-size: 14px; color: var(--muted); }

/* Respuesta con fórmula */
code { font: 500 .9em var(--mono); background: var(--blue-50); border: 1px solid var(--blue-200); border-radius: 5px; padding: 1px 6px; color: var(--blue-deep); }
.reply-code { gap: 8px; }
.reply-code span { padding-left: 0; }
.reply-code span::before { display: none; }

/* Mini ilustraciones de resultados */
.r-chat .bubble { max-width: 90%; }
.r-list span, .r-done span { background: #fff; border-radius: 8px; padding: 5px 10px; color: var(--ink); font-size: 11.5px; }
.r-done span { color: var(--ok-ink); font-weight: 600; }
.r-flow { grid-auto-flow: column; justify-content: center; align-items: center; gap: 8px; }
.r-flow .node { background: #fff; color: var(--blue-deep); border-radius: 10px; padding: 10px 12px; font: 600 12px var(--mono); }
.r-flow .arrow { color: #fff; font: 700 16px var(--mono); }

@media (max-width: 560px) {
  .inbox { width: 64%; }
  .summary { width: 66%; top: 34%; font-size: 10px; }
  .sheet { width: 80%; }
  .verdict-board { padding: 18px; min-height: 0; }
}