/* build-marker: parte-noesis-calido */
/* ==========================================================================
   Noesis — sistema de diseño (hecho a mano, sin frameworks externos).
   Estética: profesional, minimalista cálida, mucho aire, jerarquía clara.
   ========================================================================== */
:root {
  /* Paleta Noesis: verde bosque de marca sobre un lienzo CÁLIDO (crema). No es
     una fintech: es un asistente. Ver docs/design/DESIGN.md §6. */
  --bg: #f4f1e8;
  --surface: #ffffff;
  --surface-2: #faf7f0;
  --border: #e8e3d6;
  --border-strong: #dcd6c6;
  --text: #15211c;
  --muted: #5d6b66;
  --faint: #98a0a6;
  --brand: #14463b;          /* verde bosque (acciones, nav activo) */
  --brand-2: #2e8b74;        /* teal (acentos, gráficos) */
  --brand-soft: #e4efe9;     /* sage muy claro (fondos suaves) */
  --brand-ink: #0f3d34;      /* verde más profundo (texto sobre soft) */
  --green: #1f8a6d;  --green-soft: #e2f1ea;
  --red: #c0533f;    --red-soft: #f7e8e3;
  --amber: #b7831f;  --amber-soft: #f5edd6;
  --radius: 12px;
  --radius-sm: 10px;
  --shadow: 0 1px 2px rgba(20,22,31,.04), 0 4px 14px rgba(20,22,31,.05);
  --shadow-sm: 0 1px 2px rgba(20,22,31,.05);
  --sidebar-w: 248px;
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  /* Serif editorial para titulares (Fraunces, autoalojada, sin CDN). */
  --serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
}

/* Fraunces variable (latin). Da el aire editorial/premium de los titulares. */
@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/static/fonts/fraunces-latin.woff2") format("woff2");
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  font-size: 14.5px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
h1, h2, h3 { margin: 0; font-weight: 650; letter-spacing: 0; }

/* ---------- Layout ---------- */
.app { display: flex; min-height: 100vh; }

.sidebar {
  width: var(--sidebar-w);
  flex-shrink: 0;
  background: #0e302a;
  color: #b9c9c2;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}
.sidebar .brand {
  flex-shrink: 0;
  padding: 16px 22px 12px;
  color: #fff;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -.02em;
  display: flex; align-items: center; gap: 9px;
}
.sidebar .brand .mark { width: 34px; height: 34px; background: #f4f1e8;
  border-radius: 9px; padding: 4px; box-shadow: 0 1px 4px rgba(0,0,0,.25); }
.sidebar .section { padding: 4px 12px; flex: 1 1 auto; min-height: 0; overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: #1a443c transparent; }
.sidebar .section::-webkit-scrollbar { width: 8px; }
.sidebar .section::-webkit-scrollbar-thumb { background: #1a443c; border-radius: 8px; }
.sidebar .section::-webkit-scrollbar-track { background: transparent; }
.sidebar .section-label {
  font-size: 11px; text-transform: uppercase; letter-spacing: .07em;
  color: #5c7068; padding: 9px 10px 4px;
}
.nav-item {
  display: flex; align-items: center; gap: 11px;
  padding: 7px 11px; border-radius: 9px; margin: 1px 0;
  color: #a9bcb4; font-weight: 500; font-size: 13.5px;
  transition: background .12s, color .12s;
}
.nav-item .ic { width: 18px; height: 18px; display: inline-flex;
  align-items: center; justify-content: center; opacity: .82; }
.nav-item .ic svg { width: 18px; height: 18px; }
.nav-item.active .ic, .nav-item:hover .ic { opacity: 1; }
.nav-item:hover { background: #15403a; color: #fff; }
.nav-item.active { background: #1d4c43; color: #fff; }
.nav-item.active .ic { opacity: 1; }
.sidebar .spacer { flex: 0 0 0; }
.sidebar .foot { flex-shrink: 0; padding: 10px 14px; border-top: 1px solid #1a443c;
  display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.sidebar .biz { font-size: 13px; color: #fff; font-weight: 600; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar .biz small { display:block; color: #6d847b; font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; }
.logout-btn { flex-shrink: 0; width: 34px; height: 34px; display: inline-flex;
  align-items: center; justify-content: center; padding: 0; border: 1px solid #1a443c;
  background: transparent; border-radius: 9px; color: #a9bcb4; cursor: pointer;
  transition: color .12s, border-color .12s; }
.logout-btn:hover { color: #fff; border-color: #2e8b74; }
.logout-btn svg { width: 18px; height: 18px; }

.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.topbar {
  height: 60px; background: rgba(255,255,255,.8);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 28px; position: sticky; top: 0; z-index: 20;
}
.topbar .crumb { color: var(--muted); font-size: 13.5px; }
.topbar .crumb b { color: var(--text); font-weight: 600; }
.wa-pill { display:inline-flex; align-items:center; gap:7px; font-size:12.5px;
  padding: 5px 11px; border-radius: 999px; font-weight: 600; }
.wa-on { background: var(--green-soft); color: var(--green); }
.wa-off { background: var(--amber-soft); color: var(--amber); }
.wa-pill .dot { width:7px; height:7px; border-radius:50%; background:currentColor; }

.content { padding: 28px; max-width: 1200px; width: 100%; margin: 0 auto; }
.page-head { margin-bottom: 22px; display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.page-title { min-width:0; }
.page-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.page-head h1 { font-family: var(--serif); font-weight: 500; font-size: 28px; letter-spacing: -.01em; }
.page-head p { color: var(--muted); margin: 8px 0 0; max-width: 60ch; line-height: 1.55; }
.kicker { color: var(--brand-2); font-size: 12px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 4px; }
.meta { color: var(--faint); font-size: 12.5px; }
.muted { color: var(--muted); }
.nowrap { white-space: nowrap; }

/* ---------- Grids ---------- */
.grid { display: grid; gap: 16px; }
.grid > *, .split > * { min-width: 0; }
.g2 { grid-template-columns: repeat(2, 1fr); }
.g3 { grid-template-columns: repeat(3, 1fr); }
.g4 { grid-template-columns: repeat(4, 1fr); }
.col-2 { grid-column: span 2; }
@media (max-width: 900px) { .g3,.g4 { grid-template-columns: repeat(2,1fr); }
  .col-2 { grid-column: span 1; } }
@media (max-width: 600px) { .g2,.g3,.g4 { grid-template-columns: 1fr; } }

/* ---------- Móvil: menú lateral deslizable ---------- */
.burger { display: none; background: none; border: none; cursor: pointer;
  color: var(--text); padding: 5px; line-height: 1; width:32px; height:32px; }
.burger span { display:block; width:18px; height:2px; background:currentColor;
  border-radius:999px; margin:4px auto; }
.nav-overlay { display: none; }
@media (max-width: 820px) {
  .burger { display: block; }
  .sidebar { position: fixed; left: 0; top: 0; z-index: 60;
    transform: translateX(-100%); transition: transform .22s ease; }
  body.nav-open .sidebar { transform: translateX(0);
    box-shadow: 0 0 40px rgba(0,0,0,.3); }
  body.nav-open .nav-overlay { display: block; position: fixed; inset: 0;
    background: rgba(8,20,16,.45); z-index: 50; }
  .content { padding: 18px; }
  .page-head { display:block; }
  .page-actions { justify-content:flex-start; margin-top:12px; }
}

/* ---------- Cards ---------- */
.card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow-sm); min-width: 0;
}
.card.pad { padding: 20px; }
.card-h { display:flex; align-items:center; justify-content:space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--border); }
.card-h h2 { font-size: 15px; }
.card-h .hint { color: var(--faint); font-size: 12.5px; }
.card-b { padding: 18px 20px; }
.card.subtle { background: var(--surface-2); box-shadow: none; }
.card-action { border-color: #cfe2da; background: var(--surface-2); }
.split { display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:16px; align-items:start; }
@media (max-width: 980px) { .split { grid-template-columns: 1fr; } }

/* ---------- Metric ---------- */
.metric { background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 18px 20px; box-shadow: var(--shadow-sm); }
.metric .label { color: var(--muted); font-size: 12.5px; font-weight: 500;
  display:flex; align-items:center; gap:7px; }
.metric .value { font-size: 27px; font-weight: 700; letter-spacing: -.02em;
  margin-top: 8px; }
.metric .sub { font-size: 12.5px; color: var(--faint); margin-top: 4px; }
.metric .value.green { color: var(--green); }
.metric .value.red { color: var(--red); }
.metric .value.amber { color: var(--amber); }
.metric.feature { background: var(--brand); color: #fff; border: none; }
.metric.feature .value { font-family: var(--serif); font-weight: 500; }
.metric.feature .label, .metric.feature .sub { color: rgba(255,255,255,.78); }
.metric.compact { padding: 14px 16px; }
.metric.compact .value { font-size: 22px; }

/* ---------- Tables ---------- */
table { width: 100%; border-collapse: collapse; font-size: 13.8px; }
thead th { text-align: left; color: var(--faint); font-weight: 600;
  font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em;
  padding: 0 12px 10px; }
tbody td { padding: 12px; border-top: 1px solid var(--border); }
tbody tr:hover { background: var(--surface-2); }
.t-right { text-align: right; }
.num { font-variant-numeric: tabular-nums; }
.num.red { color: var(--red); }
.num.amber { color: var(--amber); }
.table-wrap { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table-wrap table { min-width: 760px; }
.table-actions { white-space:nowrap; }
@media (max-width: 720px) {
  .table-wrap { margin: 0 -12px; padding: 0 12px; }
  .card-b.table-pad { padding-left: 12px; padding-right: 12px; }
}

/* ---------- Badges ---------- */
.badge { display:inline-block; padding: 3px 9px; border-radius: 999px;
  font-size: 11.5px; font-weight: 600; }
.b-green { background: var(--green-soft); color: var(--green); }
.b-amber { background: var(--amber-soft); color: var(--amber); }
.b-gray { background: #f0f1f4; color: #6b7280; }
.b-red { background: var(--red-soft); color: var(--red); }

/* ---------- Buttons / forms ---------- */
.btn { display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  font-family: inherit; font-size: 13.5px; font-weight: 600;
  padding: 9px 15px; border-radius: 10px; border: 1px solid var(--border-strong);
  background: var(--surface); color: var(--text); transition: .12s; }
.btn:hover { background: var(--surface-2); }
.btn.primary { background: var(--brand); border-color: var(--brand); color:#fff; }
.btn.primary:hover { background: #0f3d34; }
.btn.green { background: var(--green); border-color: var(--green); color:#fff; }
.btn.sm { padding: 6px 10px; font-size: 12.5px; }
.btn.ghost { background: transparent; }
.btn.full { width:100%; justify-content:center; }
.iconbtn { background: none; border: none; cursor: pointer; color: var(--faint);
  padding: 5px 6px; border-radius: 8px; display: inline-flex; align-items: center; }
.iconbtn:hover { color: var(--red); background: var(--red-soft); }
.row { display:flex; gap: 10px; flex-wrap: wrap; }
.input, select, textarea {
  width: 100%; font-family: inherit; font-size: 14px;
  padding: 10px 12px; border: 1px solid var(--border-strong);
  border-radius: 10px; background: #fff; color: var(--text); outline: none;
}
.input:focus, select:focus, textarea:focus {
  border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
label.fld { display:block; font-size: 13px; font-weight: 600; margin: 0 0 6px; }

/* ---------- List rows ---------- */
.lrow { display:flex; align-items:center; justify-content:space-between;
  padding: 11px 0; border-top: 1px solid var(--border); }
.lrow:first-child { border-top: none; }
.lrow .meta { color: var(--faint); font-size: 12.5px; }
.empty { color: var(--faint); font-size: 13.5px; padding: 18px 0; text-align:center; }
.empty-state { text-align:center; padding: 28px 18px; color: var(--muted); }
.empty-state b { display:block; color: var(--text); margin-bottom:4px; font-size:15px; }
.empty-state .btn { margin-top:14px; }
.action-list { display:flex; flex-direction:column; gap:10px; }
.action-item { display:flex; justify-content:space-between; gap:12px; padding:12px;
  border:1px solid var(--border); border-radius:var(--radius-sm); background:#fff; }
.action-item strong { display:block; font-size:13.5px; }
.action-item small { display:block; color:var(--faint); margin-top:2px; }
.priority { display:inline-flex; align-items:center; height:22px; padding:0 8px;
  border-radius:999px; font-size:11px; font-weight:700; }
.priority.high { background:var(--red-soft); color:var(--red); }
.priority.medium { background:var(--amber-soft); color:var(--amber); }
.priority.low { background:var(--brand-soft); color:var(--brand-ink); }
.steps-list { display:grid; gap:10px; margin:0; padding:0; list-style:none; }
.steps-list li { display:flex; gap:10px; align-items:flex-start; }
.step-dot { flex:0 0 24px; width:24px; height:24px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; background:var(--brand-soft);
  color:var(--brand); font-size:12px; font-weight:700; }
.progress { height:8px; background:var(--border); border-radius:999px; overflow:hidden; }
.progress > span { display:block; height:100%; background:var(--brand-2); border-radius:999px; }

/* ---------- Insight / explanation boxes ---------- */
.insight { background: var(--brand-soft); border: 1px solid #cfe2da;
  border-radius: var(--radius-sm); padding: 14px 16px; font-size: 13.3px;
  color: var(--brand-ink); }
.insight b { font-weight: 700; }

/* ---------- Páginas legales (públicas) ---------- */
.legal-wrap { max-width: 820px; margin: 0 auto; padding: 40px 24px 72px; }
.legal-back { display:inline-flex; align-items:center; gap:7px; color:var(--brand);
  font-size:13.5px; font-weight:600; margin-bottom:22px; }
.legal h1 { font-family:var(--serif); font-weight:500; font-size:34px; color:var(--brand);
  letter-spacing:-.01em; margin-bottom:6px; }
.legal .updated { color:var(--faint); font-size:13px; margin-bottom:24px; }
.legal h2 { font-family:var(--serif); font-weight:500; font-size:21px; color:var(--brand);
  margin:30px 0 10px; }
.legal h3 { font-size:15px; margin:18px 0 6px; }
.legal p, .legal li { color:var(--text); font-size:15px; line-height:1.7; }
.legal ul { padding-left:20px; margin:8px 0; }
.legal li { margin:4px 0; }
.legal a { color:var(--brand-2); text-decoration:underline; }
.legal .note { background:var(--amber-soft); border:1px solid #e8d9b0; color:#7a5a14;
  border-radius:var(--radius-sm); padding:14px 16px; font-size:13.5px; line-height:1.6; margin:18px 0; }
.legal .meta-box { background:var(--surface-2); border:1px solid var(--border);
  border-radius:var(--radius-sm); padding:14px 16px; font-size:14px; margin:10px 0; }
.legal-table { width:100%; border-collapse:collapse; margin:14px 0; font-size:13.5px; }
.legal-table th, .legal-table td { border:1px solid var(--border); padding:9px 12px;
  text-align:left; vertical-align:top; line-height:1.55; }
.legal-table th { background:var(--surface-2); color:var(--brand); font-weight:600; }
.legal-links a { color:var(--brand-2); }

/* ---------- Modal ---------- */
.modal-overlay { position:fixed; inset:0; background:rgba(8,20,16,.5); z-index:100;
  display:flex; align-items:center; justify-content:center; padding:20px;
  animation:fade .12s ease; }
@keyframes fade { from { opacity:0; } to { opacity:1; } }
.modal { background:var(--surface); border-radius:16px; width:100%; max-width:440px;
  box-shadow:0 24px 60px rgba(8,20,16,.32); overflow:hidden; }
.modal-h { display:flex; align-items:center; justify-content:space-between;
  padding:18px 20px; border-bottom:1px solid var(--border); }
.modal-h h2 { font-family:var(--serif); font-weight:500; font-size:19px; }
.modal-x { font-size:15px; }
.modal-x:hover { color:var(--text); background:var(--surface-2); }
.modal-b { padding:6px 20px 18px; }

/* Modal de compartir: previsualización de lo que recibirá el cliente. */
.share-preview { display:flex; align-items:center; gap:12px; padding:13px 14px;
  background:linear-gradient(135deg, var(--brand) 0%, #1d5c4e 100%); border-radius:13px;
  color:#fff; box-shadow:var(--shadow-sm); }
.share-ic { flex:0 0 auto; width:36px; height:36px; border-radius:10px;
  background:rgba(255,255,255,.16); display:flex; align-items:center; justify-content:center; }
.share-ic svg { width:18px; height:18px; }
.share-meta { min-width:0; display:flex; flex-direction:column; gap:2px; }
.share-meta b { font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.share-meta span { font-size:11.5px; opacity:.75; white-space:nowrap; overflow:hidden;
  text-overflow:ellipsis; }
.share-badge { margin-left:auto; flex:0 0 auto; font-size:10.5px; letter-spacing:.4px;
  text-transform:uppercase; padding:3px 9px; border-radius:999px;
  background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.28); }
.share-msg { margin:12px 2px 0; font-size:13px; color:var(--muted); font-style:italic;
  line-height:1.5; }
.share-msg::before { content:'“'; } .share-msg::after { content:' …” + enlace'; opacity:.6; font-style:normal; font-size:12px; }
.share-copyrow { display:flex; gap:8px; margin-top:12px; }
.share-copyrow .input { flex:1; min-width:0; font-size:12.5px; color:var(--muted); }
.share-copyrow .modal-copy { flex:0 0 auto; }
.btn.wa-share { display:flex; align-items:center; justify-content:center; gap:9px;
  margin-top:10px; background:#1fa855; border-color:#1fa855; color:#fff; font-weight:600; }
.btn.wa-share:hover { background:#178f47; border-color:#178f47; color:#fff; }
.share-note { margin:12px 2px 2px; font-size:11.5px; color:var(--faint); line-height:1.5; }

.modal-f { display:flex; justify-content:flex-end; gap:8px; padding:14px 20px;
  border-top:1px solid var(--border); background:var(--surface-2); }

/* ---------- Ratios / análisis financiero ---------- */
.ratios { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width: 720px) { .ratios { grid-template-columns:1fr; } }
.ratio { border:1px solid var(--border); border-radius:var(--radius-sm); padding:14px 16px;
  background:var(--surface-2); }
.ratio-top { display:flex; align-items:center; gap:10px; }
.ratio-name { font-weight:600; font-size:13.5px; flex:1; }
.ratio-val { font-size:18px; font-weight:700; font-family:var(--serif); letter-spacing:-.01em; }
.ratio-text { color:var(--muted); font-size:12.8px; margin-top:7px; line-height:1.5; }
.health { font-size:11px; font-weight:700; padding:3px 9px; border-radius:999px;
  text-transform:uppercase; letter-spacing:.04em; }
.h-good { background:var(--green-soft); color:var(--green); }
.h-ok { background:var(--amber-soft); color:var(--amber); }
.h-bad { background:var(--red-soft); color:var(--red); }
.dot-help { display:inline-flex; align-items:center; justify-content:center; width:15px; height:15px;
  border-radius:50%; background:var(--border); color:var(--muted); font-size:10px; font-weight:700; cursor:help; }

/* ---------- Calendario (vista de mes) ---------- */
.cal-head { display:flex; align-items:center; gap:12px; }
.cal-head h2 { font-family:var(--serif); font-weight:500; font-size:19px; text-transform:capitalize;
  min-width:170px; }
.cal-nav { display:inline-flex; gap:6px; }
.cal-nav button { width:32px; height:32px; border:1px solid var(--border-strong); background:#fff;
  border-radius:9px; cursor:pointer; color:var(--muted); display:inline-flex; align-items:center;
  justify-content:center; font-size:15px; }
.cal-nav button:hover { border-color:var(--brand); color:var(--brand); }
.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.cal-wd { font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--faint);
  font-weight:700; text-align:center; padding:2px 0 6px; }
.cal-cell { min-height:88px; border:1px solid var(--border); border-radius:10px; padding:6px 7px;
  background:#fff; cursor:pointer; text-align:left; transition:border-color .12s; overflow:hidden; }
.cal-cell:hover { border-color:#c7d6cd; }
.cal-cell.out { background:var(--surface-2); }
.cal-cell.out .cal-date { color:var(--faint); }
.cal-cell.today { border-color:var(--brand-2); }
.cal-cell.sel { border-color:var(--brand); box-shadow:0 0 0 2px var(--brand-soft); }
.cal-date { font-size:12.5px; font-weight:700; color:var(--text); display:inline-flex;
  align-items:center; justify-content:center; min-width:22px; height:22px; }
.cal-cell.today .cal-date { background:var(--brand); color:#fff; border-radius:50%; }
.cal-ev { font-size:10.5px; line-height:1.4; background:var(--brand-soft); color:var(--brand-ink);
  border-radius:5px; padding:2px 6px; margin-top:3px; white-space:nowrap; overflow:hidden;
  text-overflow:ellipsis; }
.cal-ev b { font-weight:700; }
.cal-more { font-size:10px; color:var(--faint); margin-top:3px; padding-left:2px; }
@media (max-width: 640px) {
  .cal-cell { min-height:56px; padding:4px; }
  .cal-ev { display:none; }
  .cal-cell.has::after { content:''; display:block; width:6px; height:6px; border-radius:50%;
    background:var(--brand-2); margin:4px auto 0; }
}

/* ---------- Chat ---------- */
.chat-wrap { display:flex; flex-direction:column; height: calc(100vh - 60px - 56px);
  max-width: 820px; margin: 0 auto; }
.chat-log { flex:1; overflow-y:auto; padding: 8px 4px; display:flex;
  flex-direction:column; gap: 12px; }
.bubble { max-width: 78%; padding: 11px 15px; border-radius: 16px;
  font-size: 14px; white-space: pre-wrap; line-height: 1.45; }
.bubble.me { align-self: flex-end; background: var(--brand); color:#fff;
  border-bottom-right-radius: 5px; }
.bubble.bot { align-self: flex-start; background: #fff; border: 1px solid var(--border);
  border-bottom-left-radius: 5px; box-shadow: var(--shadow-sm); }
.bubble .src { display:block; margin-top: 6px; font-size: 11px; opacity: .6; }
.chat-input { display:flex; gap: 8px; align-items: center; margin: 10px 0 6px;
  padding: 7px 7px 7px 10px; background:#fff; border: 1px solid var(--border-strong);
  border-radius: 16px; box-shadow: var(--shadow-sm); }
.chat-input:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.chat-input .input { border: none; background: transparent; padding: 8px; }
.chat-input .input:focus { box-shadow: none; }
/* Botón de nota de voz: latido rojo mientras graba. */
.mic-btn { position:relative; flex:0 0 auto; width:40px; height:40px; border-radius:12px;
  border:1px solid var(--border-strong); background:#fff; color:var(--muted);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition: color .15s ease, border-color .15s ease, background .15s ease; }
.mic-btn svg { width:19px; height:19px; }
.mic-btn:hover { color:var(--brand); border-color:var(--brand); }
.mic-btn .rec-dot { display:none; position:absolute; top:5px; right:5px; width:8px;
  height:8px; border-radius:50%; background:var(--red, #c0533f); }
.mic-btn.recording { color:#fff; background:var(--red, #c0533f); border-color:var(--red, #c0533f); }
.mic-btn.recording .rec-dot { display:block; background:#fff; animation: rec-pulse 1.1s ease infinite; }
@keyframes rec-pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.35; transform:scale(.72); } }

.chips { display:flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.chip { font-size: 12.5px; padding: 7px 12px; border-radius: 999px;
  background:#fff; border: 1px solid var(--border-strong); cursor: pointer; color: var(--muted); }
.chip:hover { border-color: var(--brand); color: var(--brand); }

/* Noesis no es una pestaña: acompaña la pantalla actual y conserva el hilo. */
.noesis-trigger img { width:18px; height:18px; }
.companion-scrim { position:fixed; inset:0; z-index:78; border:0; padding:0;
  background:rgba(13,35,29,.28); opacity:0; pointer-events:none;
  transition:opacity .18s ease; }
.companion { position:fixed; top:0; right:0; bottom:0; z-index:79; width:min(440px, 94vw);
  display:flex; flex-direction:column; background:var(--bg); border-left:1px solid var(--border);
  box-shadow:-18px 0 50px rgba(20,35,30,.16); transform:translateX(102%);
  transition:transform .2s ease; }
body.companion-open { overflow:hidden; }
body.companion-open .companion { transform:none; }
body.companion-open .companion-scrim { opacity:1; pointer-events:auto; }
.companion-head { display:flex; align-items:center; gap:11px; padding:15px 16px;
  background:var(--brand); color:#fff; }
.companion-mark { width:36px; height:36px; display:grid; place-items:center;
  border-radius:11px; background:#fff; flex:none; }
.companion-mark img { width:22px; height:22px; }
.companion-head div { display:flex; flex-direction:column; min-width:0; flex:1; }
.companion-head b { font-family:var(--serif); font-size:18px; font-weight:650; }
.companion-head small { color:rgba(255,255,255,.72); font-size:11.5px; }
.companion-head .iconbtn { color:#fff; border-color:rgba(255,255,255,.22); }
.companion-context { margin:14px 14px 0; padding:11px 12px; display:grid;
  grid-template-columns:auto 1fr auto; align-items:center; gap:7px;
  border:1px solid var(--border); border-radius:12px; background:var(--brand-soft); }
.companion-context span { font-size:11px; color:var(--muted); }
.companion-context b { font-size:12.5px; color:var(--brand-ink); }
.companion-context button { border:0; background:transparent; color:var(--brand);
  font-size:12px; font-weight:750; cursor:pointer; }
.companion-reading { margin:10px 14px 0; padding:13px 14px; border:1px solid var(--border);
  border-radius:14px; background:linear-gradient(145deg, var(--brand-soft), #fff);
  color:var(--text); font-size:13px; line-height:1.5; }
.companion-reading > b { display:block; margin-bottom:4px; color:var(--brand-ink);
  font-family:var(--serif); font-size:15px; }
.companion-reading p { margin:0; }
.companion-focus { margin-top:10px; padding-top:10px; border-top:1px solid rgba(20,70,59,.12); }
.companion-focus small { display:block; margin-bottom:3px; color:var(--muted); font-size:10.5px;
  font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.companion-focus b { display:block; font-size:12.5px; color:var(--text); }
.companion-focus span { display:block; margin-top:3px; color:var(--muted); }
.companion-prompts { display:flex; gap:7px; margin:9px 14px 0; overflow-x:auto;
  scrollbar-width:none; padding-bottom:2px; }
.companion-prompts::-webkit-scrollbar { display:none; }
.companion-prompt { flex:0 0 auto; border:1px solid var(--border-strong); border-radius:999px;
  background:#fff; color:var(--brand-ink); padding:7px 10px; font:inherit; font-size:11.5px;
  font-weight:700; cursor:pointer; white-space:nowrap; }
.companion-prompt:hover { border-color:var(--brand); background:var(--brand-soft); }
.companion-log { flex:1; min-height:0; overflow-y:auto; padding:16px 14px;
  display:flex; flex-direction:column; gap:10px; }
.companion-log .bubble { font-size:13.5px; max-width:88%; }
.companion-day { align-self:center; color:var(--faint); font-size:10.5px;
  text-transform:uppercase; letter-spacing:.05em; margin:3px 0; }
.companion-empty { margin:auto 18px; text-align:center; color:var(--muted); line-height:1.5; }
.companion-empty b { display:block; font-family:var(--serif); color:var(--brand-ink);
  font-size:19px; margin-bottom:5px; }
.companion-input { margin:0 14px 8px; padding:6px; display:flex; gap:7px; align-items:center;
  background:#fff; border:1px solid var(--border-strong); border-radius:15px; }
.companion-input:focus-within { border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-soft); }
.companion-input .input { border:0; box-shadow:none; background:transparent; min-width:0; }
.companion-full { margin:0 14px 14px; text-align:center; font-size:12px; font-weight:700;
  color:var(--brand); }
.companion-subscribe { margin:12px 14px 8px; padding:11px 13px; border-radius:12px;
  background:var(--brand); color:#fff; text-align:center; text-decoration:none;
  font-size:12.5px; font-weight:800; }
.client-signal { display:grid; grid-template-columns:auto minmax(0,1fr) auto;
  gap:12px; align-items:start; padding:12px 0; border-bottom:1px solid var(--border); }
.client-signal:last-child { border-bottom:0; }
.client-signal p { margin:4px 0 3px; color:var(--muted); font-size:13px; line-height:1.45; }
.client-signal small { color:var(--faint); font-size:11px; }
.client-signal .client-observed { display:block; margin-top:5px; line-height:1.45; }
.client-signal .client-confirmed { display:block; color:var(--brand); margin-top:4px; }
@media (max-width:600px) {
  .client-signal { grid-template-columns:auto 1fr; }
  .client-signal .btn { grid-column:2; justify-self:start; }
}

/* Formulario de nueva factura: fila compacta base/IVA/IRPF + total en vivo. */
.nf-row { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:10px; margin-top:12px; }
.nf-total { margin-top:12px; padding:10px 12px; background:var(--brand-soft);
  border-radius:10px; color:var(--brand); font-weight:650; font-size:13.5px; }
.modal-b .chips { margin-bottom:0; }
.modal-b .chips .chip { font-size:12px; padding:5px 10px; }

/* ---------- Landing pública ---------- */
.landing-body { background: var(--bg); }
.site-nav { max-width:1180px; margin:0 auto; padding:18px 24px; display:flex;
  align-items:center; justify-content:space-between; gap:18px; }
.site-brand { display:flex; align-items:center; gap:9px; font-size:20px; font-weight:750;
  color:var(--brand); }
.site-brand img { width:34px; height:34px; }
.site-links { display:flex; gap:18px; color:var(--muted); font-size:13.5px; }
.site-links a:hover { color:var(--brand); }
.site-links a.active { color:var(--brand); font-weight:700; }

/* Cabecera de las páginas interiores del sitio (producto, precios, preguntas). */
.page-hero { max-width:1180px; margin:0 auto; padding:56px 24px 8px; }
.page-hero .kicker { margin-bottom:14px; }
.page-hero h1 { font-family:var(--serif); font-weight:500; color:var(--brand);
  font-size:clamp(32px, 4.4vw, 52px); line-height:1.06; letter-spacing:-.01em;
  max-width:22ch; }
.page-hero p { color:var(--muted); font-size:17px; max-width:58ch; margin-top:16px;
  line-height:1.6; }
.landing-section.slim { padding-top:36px; }

/* Tarjetas-apartado de la home: cada sección del sitio, presentada y enlazada. */
.explore-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.explore-card { display:flex; flex-direction:column; gap:8px; background:#fff;
  border:1px solid var(--border); border-radius:14px; padding:24px;
  transition:border-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.explore-card:hover { border-color:var(--brand-2); transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(20,70,59,.08); }
.explore-card h3 { font-size:18px; margin:2px 0 0; color:var(--text); }
.explore-card p { color:var(--muted); margin:0; line-height:1.55; font-size:14px; }
.explore-more { margin-top:auto; padding-top:12px; color:var(--brand); font-weight:700;
  font-size:13.5px; }

/* Listas de características en las tarjetas de precio. */
.price-list { list-style:none; padding:0; margin:14px 0 0; text-align:left; }
.price-list li { padding:5px 0 5px 22px; position:relative; color:var(--muted);
  font-size:13.2px; line-height:1.45; }
.price-list li::before { content:"✓"; position:absolute; left:0; color:var(--green);
  font-weight:700; }
.price-card.featured .price-list li { color:#cfe2d8; }
.price-card.featured .price-list li::before { color:#9fd6bd; }
.pricing-grid.pricing-3 { grid-template-columns:repeat(3,1fr); max-width:1020px; }

/* Pie del sitio en columnas. */
.footer-cols { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:24px; width:100%; }
.footer-col { display:flex; flex-direction:column; gap:7px; font-size:13px; }
.footer-col b { color:var(--text); font-size:13px; margin-bottom:2px; }
.footer-col a { color:var(--faint); }
.footer-col a:hover { color:var(--brand); }
.footer-col p { color:var(--faint); margin:6px 0 0; max-width:30ch; line-height:1.5; }
.footer-col .site-brand { font-size:17px; }
.footer-col .site-brand img { width:26px; height:26px; }
.site-actions { display:flex; gap:8px; align-items:center; }
.landing-hero { max-width:1180px; margin:0 auto; min-height:calc(100vh - 86px);
  display:grid; grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr); gap:34px;
  align-items:center; padding:32px 24px 56px; }
.landing-copy h1 { font-family:var(--serif); font-weight:500; font-size: clamp(40px, 5.6vw, 66px);
  line-height:1.04; color:var(--brand); max-width:13ch; letter-spacing:-.01em; margin:18px 0 0; }
.landing-copy p { color:var(--muted); font-size:18px; max-width:48ch; margin:18px 0 0; line-height:1.6; }
.landing-cta { display:flex; gap:10px; flex-wrap:wrap; margin-top:26px; }
.trust-row { display:flex; gap:8px; flex-wrap:wrap; margin-top:24px; }
.trust-row span { border:1px solid var(--border); background:rgba(255,255,255,.65);
  border-radius:999px; padding:6px 10px; color:var(--muted); font-size:12.5px; font-weight:650; }
.hero-product { background:#fff; border:1px solid var(--border-strong); border-radius:16px;
  box-shadow:0 10px 30px rgba(20,40,33,.08); overflow:hidden; padding:8px; }
.hero-product img { display:block; width:100%; height:auto; min-height:340px; object-fit:cover;
  object-position:left top; border-radius:10px; }

/* --- Héroe: conversación de WhatsApp en vivo (CSS puro, sin imágenes) --- */
.hero-phone { max-width:410px; width:100%; justify-self:center; background:#fff;
  border:1px solid var(--border-strong); border-radius:26px; overflow:hidden;
  box-shadow:0 18px 48px rgba(20,40,33,.14); }
.wa-top { display:flex; align-items:center; gap:11px; padding:13px 16px;
  background:var(--brand); color:#fff; }
.wa-avatar { width:36px; height:36px; border-radius:50%; background:#fff; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center; overflow:hidden; }
.wa-avatar img { width:24px; height:24px; }
.wa-who { display:flex; flex-direction:column; line-height:1.25; }
.wa-who b { font-size:14.5px; }
.wa-who span { font-size:11.5px; opacity:.75; }
.wa-chat { display:flex; flex-direction:column; gap:9px; padding:16px 13px 18px;
  background:linear-gradient(180deg, #ece5d8 0%, #e7e2d3 100%); min-height:380px; }
.wa-day { align-self:center; font-size:10.5px; letter-spacing:.4px; text-transform:uppercase;
  color:#8a8574; background:rgba(255,255,255,.72); border-radius:999px; padding:3px 11px; }
.wa-bubble { position:relative; max-width:84%; padding:8px 11px 20px; border-radius:10px;
  font-size:13.2px; line-height:1.45; box-shadow:0 1px 1px rgba(0,0,0,.07);
  opacity:0; transform:translateY(10px); animation:wa-in .5s ease forwards; }
.wa-bubble.in { align-self:flex-start; background:#fff; border-top-left-radius:3px; }
.wa-bubble.out { align-self:flex-end; background:#d7f0c8; border-top-right-radius:3px; }
.wa-bubble.d1 { animation-delay:.5s; } .wa-bubble.d2 { animation-delay:1.5s; }
.wa-bubble.d3 { animation-delay:2.6s; } .wa-bubble.d4 { animation-delay:3.5s; }
@keyframes wa-in { to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) {
  .wa-bubble { animation:none; opacity:1; transform:none; }
}
.wa-time { position:absolute; right:9px; bottom:4px; font-size:10px; color:#7d8a80; }
.wa-time b { color:#3aa6db; font-weight:600; letter-spacing:-1px; }
.wa-voice { display:flex; align-items:center; gap:8px; color:var(--brand); padding:2px 0 4px; }
.wa-voice svg { width:20px; height:20px; flex:0 0 auto; }
.wa-len { font-size:11px; color:#7d8a80; }
.wa-wave { display:flex; align-items:center; gap:2.5px; height:20px; }
.wa-wave i { display:block; width:2.5px; border-radius:2px; background:#7fae9e; }
.wa-wave i:nth-child(1){height:7px} .wa-wave i:nth-child(2){height:13px}
.wa-wave i:nth-child(3){height:17px} .wa-wave i:nth-child(4){height:10px}
.wa-wave i:nth-child(5){height:15px} .wa-wave i:nth-child(6){height:8px}
.wa-wave i:nth-child(7){height:16px} .wa-wave i:nth-child(8){height:12px}
.wa-wave i:nth-child(9){height:6px} .wa-wave i:nth-child(10){height:14px}
.wa-wave i:nth-child(11){height:9px} .wa-wave i:nth-child(12){height:5px}
.wa-transcript { display:block; font-size:11.5px; color:#66705f; font-style:italic;
  border-top:1px dashed #b9ceab; margin-top:4px; padding-top:5px; }

/* Etiqueta de referencia legal en las tarjetas de cumplimiento. */
.law-tag { display:inline-block; font-size:10.5px; font-weight:750; letter-spacing:.5px;
  text-transform:uppercase; color:var(--brand); background:var(--brand-soft);
  border-radius:999px; padding:4px 11px; margin-bottom:12px; }
.logo-strip { max-width:1180px; margin:-18px auto 0; padding:0 24px 36px; display:flex;
  gap:10px; flex-wrap:wrap; color:var(--faint); }
.logo-strip span { padding:8px 12px; border:1px solid var(--border); border-radius:999px;
  background:rgba(255,255,255,.55); font-weight:650; font-size:13px; }
.landing-section, .landing-band, .final-cta { max-width:1180px; margin:0 auto; padding:72px 24px; }
.section-intro { max-width:760px; margin-bottom:24px; }
.section-intro h2, .landing-band h2, .final-cta h2 { font-family:var(--serif); font-weight:500;
  font-size: clamp(26px, 3.4vw, 40px); line-height:1.08; color:var(--brand); letter-spacing:-.01em; }
.landing-band h2 { color:#fff; }
.section-intro p, .landing-band p, .final-cta p { color:var(--muted); font-size:16px; }
.feature-grid, .pricing-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.feature-card, .price-card, .flow-step, .faq-grid details { background:#fff; border:1px solid var(--border);
  border-radius:14px; padding:22px; box-shadow:none; }
.feature-card { transition:border-color .15s ease, transform .15s ease; }
.feature-card:hover { border-color:#c7d6cd; transform:translateY(-2px); }
.feature-ic { width:40px; height:40px; border-radius:11px; background:var(--brand-soft);
  display:inline-flex; align-items:center; justify-content:center; color:var(--brand); margin-bottom:14px; }
.feature-ic svg { width:21px; height:21px; }
.feature-card h3, .price-card h3 { font-size:17px; margin-top:0; }
.feature-card p, .price-card p { color:var(--muted); margin-bottom:0; line-height:1.55; }
.feature-num { color:var(--brand-2); font-size:12px; font-weight:800; }
.landing-band { background:var(--brand); color:#fff; border-radius:12px; padding:44px;
  display:grid; grid-template-columns:.75fr 1.25fr; gap:28px; }
.landing-band .kicker, .landing-band p { color:rgba(255,255,255,.76); }
.landing-band h2, .landing-band h3 { color:#fff; }
.mission-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.flow-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.flow-grid.workflow-5 { grid-template-columns:repeat(5,1fr); }
.flow-step { display:flex; align-items:flex-start; gap:12px; }
.flow-step b { background:var(--brand-soft); color:var(--brand); width:28px; height:28px;
  border-radius:50%; display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; }
.price-card { position:relative; }
.price-card .badge { position:absolute; top:-10px; left:22px; font-size:11px;
  padding:4px 11px; border-radius:999px; font-weight:700; }
.price-card.featured { background:var(--brand); border-color:var(--brand); }
.price-card.featured h3 { color:#cfe2d8; }
.price-card.featured .price { color:#fff; }
.price-card.featured p { color:#bcd2c8; }
.price-card.featured .badge { background:var(--brand-2); color:#f4f1e8; }
.price-card.featured .btn.primary { background:#fff; border-color:#fff; color:var(--brand); }
.price { font-family:var(--serif); font-size:32px; font-weight:500; color:var(--brand); margin:8px 0 10px; }
.price-card .btn { margin-top:18px; }
.faq-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.faq-grid summary { cursor:pointer; font-weight:750; }
.faq-grid p { color:var(--muted); }
.final-cta { text-align:center; }
.final-cta p { max-width:620px; margin:14px auto 24px; }
.site-footer { max-width:1180px; margin:0 auto; padding:26px 24px 40px; display:flex;
  justify-content:space-between; gap:16px; color:var(--faint); border-top:1px solid var(--border); }
@media (max-width: 900px) {
  .site-links { display:none; }
  .landing-hero { grid-template-columns:1fr; min-height:auto; padding-top:20px; }
  .landing-copy h1 { max-width:12ch; }
  .feature-grid, .pricing-grid, .pricing-grid.pricing-3, .mission-grid, .flow-grid,
  .flow-grid.workflow-5, .faq-grid, .explore-grid, .footer-cols { grid-template-columns:1fr; }
  .landing-band { grid-template-columns:1fr; margin-left:18px; margin-right:18px; padding:28px; }
}
@media (max-width: 560px) {
  .site-nav { align-items:flex-start; padding:14px 18px; }
  .site-actions { flex-wrap:wrap; justify-content:flex-end; }
  .site-actions .btn { padding:7px 10px; font-size:12.5px; }
  .landing-hero, .landing-section, .final-cta { padding-left:18px; padding-right:18px; }
  .landing-copy h1 { font-size:42px; }
  .hero-product img { min-height:230px; }
  .site-footer { display:block; padding-left:18px; padding-right:18px; }
  .site-footer span { display:block; margin-top:6px; }
}

/* ---- Impuestos: filas de liquidación ---- */
.taxrow { display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:11px 2px; border-bottom:1px solid var(--border); font-size:14px; }
.taxrow:last-child { border-bottom:none; }
.taxrow span { color:var(--muted); }
.taxrow b { font-variant-numeric:tabular-nums; font-size:15px; }
.taxrow.total { margin-top:6px; border-top:2px solid var(--border-strong); border-bottom:none;
  padding-top:13px; }
.taxrow.total span { color:var(--text); font-weight:600; }
.taxrow.total b { font-family:var(--serif); font-size:20px; color:var(--brand); }

/* ---- Suscripción: planes ---- */
.plan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:8px; }
@media (max-width:980px){ .plan-grid { grid-template-columns:1fr; max-width:520px; } }
.plan { border:1px solid var(--border); border-radius:var(--radius); padding:22px;
  background:var(--surface); box-shadow:var(--shadow-sm); }
.plan.featured { border-color:var(--brand-2); box-shadow:0 6px 24px rgba(20,70,59,.10); }
.plan h3 { margin:0 0 4px; font-size:18px; }
.plan .price { font-size:34px; margin:6px 0 4px; }
.plan .price small { font-size:14px; color:var(--muted); font-family:var(--font); }
.plan ul { list-style:none; padding:0; margin:14px 0 18px; }
.plan li { padding:6px 0 6px 24px; position:relative; color:var(--muted); font-size:13.8px; }
.plan li::before { content:"✓"; position:absolute; left:0; color:var(--green); font-weight:700; }
.sub-state { display:inline-flex; align-items:center; gap:8px; padding:7px 14px;
  border-radius:999px; font-size:13px; font-weight:600; }
.sub-state.trial { background:var(--amber-soft); color:var(--amber); }
.sub-state.active { background:var(--green-soft); color:var(--green); }
.sub-state.past_due, .sub-state.canceled { background:var(--red-soft); color:var(--red); }

/* ---- Onboarding SaaS: cuenta -> perfil -> canal ---- */
.onboarding-center { min-height:100vh; display:grid; place-items:center; padding:28px; }
.onboarding-card { width:100%; max-width:640px; background:var(--surface);
  border:1px solid var(--border); border-radius:18px; padding:28px;
  box-shadow:0 14px 42px rgba(20,70,59,.08); }
.onboarding-brand { width:max-content; margin-bottom:22px; }
.onboarding-steps { display:flex; align-items:center; gap:8px; color:var(--faint);
  font-size:12.5px; margin-bottom:28px; }
.onboarding-step { width:26px; height:26px; flex:0 0 26px; border-radius:50%;
  display:grid; place-items:center; background:var(--border); color:var(--muted);
  font-size:12px; font-weight:750; }
.onboarding-step.complete { background:var(--green-soft); color:var(--green); }
.onboarding-step.current { background:var(--brand); color:#fff; }
.onboarding-line { flex:1; height:1px; background:var(--border-strong); }
.onboarding-card h1 { font-family:var(--serif); color:var(--brand); font-size:34px;
  font-weight:500; line-height:1.08; margin:10px 0; }
.onboarding-lead { color:var(--muted); line-height:1.6; margin:0 0 24px; }
.choice-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-top:7px; }
.choice-card { cursor:pointer; }
.choice-card input { position:absolute; opacity:0; pointer-events:none; }
.choice-card span { display:block; padding:12px 10px; text-align:center;
  border:1px solid var(--border-strong); border-radius:10px; color:var(--muted);
  font-size:13px; font-weight:650; transition:.15s ease; }
.choice-card input:checked + span { border-color:var(--brand); background:var(--brand-soft);
  color:var(--brand); box-shadow:0 0 0 1px var(--brand); }
.choice-card input:focus-visible + span { outline:3px solid rgba(46,139,116,.22); }
.ai-choice-grid { grid-template-columns:1fr 1fr; }
.ai-choice-card span { min-height:104px; padding:15px; text-align:left; }
.ai-choice-card b { display:block; color:var(--text); font-size:14px; }
.ai-choice-card small { display:block; margin-top:6px; color:var(--muted);
  font-size:12px; font-weight:500; line-height:1.45; }
.ai-choice-card input:checked + span b { color:var(--brand); }
.form-error { background:var(--red-soft); color:var(--red); border-radius:9px;
  padding:11px 13px; font-size:13px; margin-bottom:16px; }
@media (max-width:620px) {
  .onboarding-center { padding:16px; align-items:start; }
  .onboarding-card { padding:22px 18px; border-radius:14px; }
  .onboarding-card h1 { font-size:29px; }
  .onboarding-steps span:not(.onboarding-step):not(.onboarding-line),
  .onboarding-steps b { display:none; }
  .choice-grid { grid-template-columns:1fr 1fr; }
  .ai-choice-grid { grid-template-columns:1fr; }
}

/* ---- Panel admin (fundador) ---- */
.admin-wrap { max-width:1240px; margin:40px auto; padding:0 24px; }
.admin-wrap .card { margin-top:16px; }
.admin-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin:20px 0; }
.admin-charts, .admin-ops { margin-top:16px; }
.admin-charts .card, .admin-ops .card { margin-top:0; }
.admin-ops.g3 { grid-template-columns:repeat(3,1fr); }
.chart-box { height:250px; position:relative; }
.admin-alerts { border-color:var(--red); }
@media (max-width:1000px){ .admin-grid { grid-template-columns:repeat(3,1fr); }
  .admin-ops.g3 { grid-template-columns:1fr; } }
@media (max-width:720px){ .admin-grid { grid-template-columns:1fr 1fr; }
  .admin-wrap { margin-top:20px; padding:0 14px; }
  .chart-box { height:210px; } }
.danger-zone { border:1px solid var(--red); border-radius:var(--radius); padding:18px 20px;
  background:var(--red-soft); margin-top:20px; }
.danger-zone h3 { margin:0 0 6px; color:var(--red); }

/* ==========================================================================
   Capa "fintech": dashboards densos y legibles dentro de la app (no landing).
   Cabeceras sans, KPIs limpios, banda destacada, mini-barras tipo "Top X".
   ========================================================================== */
.content .page-head h1 { font-family: var(--font); font-weight: 750; font-size: 23px;
  letter-spacing: -.02em; }
.page-count { color: var(--faint); font-size: 13px; font-weight: 500; margin-top: 3px; }

/* Banda destacada (resumen): el "saldo/beneficio" como héroe oscuro de marca. */
.hero-band { background: linear-gradient(135deg, #103229, #18483c 60%, #1d5446);
  color: #fff; border-radius: 16px; padding: 22px 24px; display: grid;
  grid-template-columns: 1.3fr 1fr; gap: 22px; box-shadow: 0 8px 26px rgba(16,50,41,.18); }
.hero-band .hb-label { font-size: 12.5px; font-weight: 600; letter-spacing: .04em;
  text-transform: uppercase; color: rgba(255,255,255,.72); }
.hero-band .hb-value { font-family: var(--serif); font-weight: 500; font-size: 40px;
  line-height: 1.05; margin-top: 8px; letter-spacing: -.01em; }
.hero-band .hb-chip { display:inline-flex; align-items:center; gap:6px; margin-top:12px;
  background: rgba(255,255,255,.12); border-radius:999px; padding:5px 11px; font-size:12.5px;
  font-weight:650; }
.hero-band .hb-side { display:flex; flex-direction:column; justify-content:center; gap:12px;
  border-left:1px solid rgba(255,255,255,.16); padding-left:22px; }
.hero-band .hb-side .r { display:flex; justify-content:space-between; align-items:baseline; gap:14px; }
.hero-band .hb-side .r span { color: rgba(255,255,255,.74); font-size:13px; }
.hero-band .hb-side .r b { font-size:16px; font-variant-numeric:tabular-nums; }
@media (max-width: 720px) { .hero-band { grid-template-columns:1fr; }
  .hero-band .hb-side { border-left:none; padding-left:0; border-top:1px solid rgba(255,255,255,.16);
    padding-top:14px; } }

/* Recorrido de activación: mide valor real y conduce al siguiente paso. */
.activation-card { background:var(--surface); border:1px solid var(--border-strong);
  border-radius:16px; padding:20px; margin-bottom:16px; box-shadow:var(--shadow-sm); }
.activation-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.activation-head h2 { font-size:18px; margin:4px 0; }
.activation-head p { color:var(--muted); font-size:13.5px; margin:0; }
.activation-score { text-align:right; color:var(--brand); }
.activation-score b { display:block; font-size:22px; }
.activation-score span { color:var(--faint); font-size:12px; }
.activation-progress { height:7px; border-radius:999px; overflow:hidden;
  background:var(--border); margin:16px 0; }
.activation-progress span { display:block; height:100%; background:var(--brand-2);
  border-radius:999px; transition:width .3s ease; }
.activation-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.activation-step { display:grid; grid-template-columns:auto 1fr auto; gap:10px;
  align-items:center; min-width:0; padding:11px; border:1px solid var(--border);
  border-radius:11px; background:var(--bg); }
.activation-step:hover { border-color:var(--brand-2); }
.activation-step.next { border-color:var(--brand-2); background:var(--brand-soft); }
.activation-step.done { opacity:.68; }
.activation-index { width:25px; height:25px; display:grid; place-items:center;
  border-radius:8px; background:#fff; border:1px solid var(--border); color:var(--brand);
  font-size:12px; font-weight:750; }
.activation-step > span:nth-child(2) { min-width:0; }
.activation-step b { display:block; font-size:12.8px; overflow-wrap:anywhere; }
.activation-step small { display:block; color:var(--faint); font-size:11.5px;
  line-height:1.35; margin-top:2px; }
.activation-state { color:var(--brand-2); font-size:11px; font-weight:700; }
.activation-step.done .activation-state { color:var(--green); }
@media (max-width:900px) { .activation-steps { grid-template-columns:1fr 1fr; } }
@media (max-width:600px) {
  .activation-head { display:block; }
  .activation-score { text-align:left; display:flex; gap:6px; align-items:baseline; margin-top:10px; }
  .activation-steps { grid-template-columns:1fr; }
}

/* KPI limpio (más fintech que .metric: borde fino, número grande, delta con color). */
.stat { background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
  padding: 15px 18px; }
.stat .lbl { font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em;
  color: var(--faint); font-weight: 600; }
.stat .val { font-size: 25px; font-weight: 750; letter-spacing: -.02em; margin-top: 7px;
  font-variant-numeric: tabular-nums; }
.stat .val.green { color: var(--green); }
.stat .val.red { color: var(--red); }
.stat .val.amber { color: var(--amber); }
.stat .delta { font-size: 12px; font-weight: 650; margin-top: 6px; display:inline-flex;
  align-items:center; gap:5px; }
.delta.up { color: var(--green); } .delta.down { color: var(--red); }
.delta.flat { color: var(--faint); }

/* Mini-barras tipo "Top clientes / por categoría / canales de venta". */
.barlist { display:flex; flex-direction:column; gap: 13px; }
.barlist .b-row { display:grid; grid-template-columns: 1fr auto; gap: 5px 12px; align-items:center; }
.barlist .b-name { font-size: 13.5px; font-weight: 600; min-width:0; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
.barlist .b-val { font-size: 13px; font-variant-numeric: tabular-nums; color: var(--muted);
  text-align:right; white-space:nowrap; }
.barlist .b-track { grid-column: 1 / -1; height: 7px; background: var(--border);
  border-radius: 999px; overflow:hidden; }
.barlist .b-fill { height: 100%; border-radius: 999px; background: var(--brand-2);
  transition: width .5s ease; }
.barlist .b-fill.alt { background: #6b8cff; }
.barlist .b-fill.warn { background: var(--amber); }

/* Mini-leyenda de "cómo va" para el plan del copiloto en el dashboard. */
.plan-list { display:flex; flex-direction:column; gap:10px; margin:0; padding:0; list-style:none; }
.plan-list li { display:flex; gap:11px; align-items:flex-start; padding:11px 12px;
  border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); }
.plan-list .pl-n { flex:0 0 22px; width:22px; height:22px; border-radius:7px; background:var(--brand-soft);
  color:var(--brand); font-size:12px; font-weight:750; display:flex; align-items:center;
  justify-content:center; margin-top:1px; }
.plan-list .pl-do { font-size:13.6px; font-weight:600; }
.plan-list .pl-why { font-size:12.4px; color:var(--muted); margin-top:2px; line-height:1.45; }
.plan-list .pl-acts { display:flex; gap:6px; margin-top:9px; flex-wrap:wrap; align-items:center; }

/* ==========================================================================
   Panel del día — rediseño 2026 (plano, con aire, jerarquía de acción).
   Inspirado en Linear/Stripe/Tabler: verde de marca como ACENTO, no relleno.
   ========================================================================== */
.daily-head { display:flex; align-items:center; justify-content:space-between;
  gap:16px; margin-bottom:18px; flex-wrap:wrap; }
.daily-greet { display:flex; align-items:center; gap:12px; min-width:0; }
.daily-greet .avatar { flex:0 0 42px; width:42px; height:42px; border-radius:12px;
  background:var(--brand); color:#f4f1e8; display:flex; align-items:center;
  justify-content:center; font-weight:700; font-size:15px; letter-spacing:-.01em; }
.daily-greet h1 { font-family:var(--font); font-weight:750; font-size:20px;
  letter-spacing:-.02em; line-height:1.2; }
.daily-greet .date { color:var(--faint); font-size:13px; margin-top:1px;
  text-transform:capitalize; }

/* Hero de mando: lo PRIMERO que hacer hoy + el dinero del mes, plano y de marca. */
.cmd-hero { background:var(--brand); color:#eaf3ee; border-radius:16px;
  padding:22px 24px; display:grid; grid-template-columns:1.4fr 1fr; gap:22px; }
.cmd-hero .ch-kicker { font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;
  color:#86b3a3; font-weight:650; }
.cmd-hero .ch-focus { font-size:19px; font-weight:600; line-height:1.4; margin-top:9px;
  letter-spacing:-.01em; }
.cmd-hero .ch-btn { margin-top:15px; display:inline-flex; align-items:center; gap:7px;
  background:#f4f1e8; color:var(--brand); border:none; border-radius:10px;
  padding:9px 16px; font-size:13.5px; font-weight:700; cursor:pointer; }
.cmd-hero .ch-btn:hover { background:#fff; }
.cmd-hero .ch-side { display:flex; flex-direction:column; justify-content:center; gap:11px;
  border-left:1px solid rgba(255,255,255,.16); padding-left:22px; }
.cmd-hero .ch-side .r { display:flex; justify-content:space-between; align-items:baseline; gap:14px; }
.cmd-hero .ch-side .r span { color:#9cc3b4; font-size:13px; }
.cmd-hero .ch-side .r b { font-size:16px; font-weight:600; font-variant-numeric:tabular-nums; }
@media (max-width:720px) { .cmd-hero { grid-template-columns:1fr; }
  .cmd-hero .ch-side { border-left:none; padding-left:0;
    border-top:1px solid rgba(255,255,255,.16); padding-top:14px; } }

/* Timeline "hoy, por horas". */
.tl-row { display:flex; align-items:center; gap:13px; padding:11px 0;
  border-top:1px solid var(--border); }
.tl-row:first-child { border-top:none; }
.tl-time { flex:0 0 48px; width:48px; font-size:13.5px; font-weight:700;
  color:var(--text); font-variant-numeric:tabular-nums; }
.tl-body { flex:1; min-width:0; }
.tl-body .t1 { font-size:13.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tl-body .t2 { font-size:12px; color:var(--faint); margin-top:1px; }
.tl-row .ti-chev { color:var(--faint); flex:0 0 auto; }

/* ==========================================================================
   Capa final de refinamiento premium (2026) — plano, nítido, mucho aire.
   Sube TODAS las pantallas a la vez (todas usan estos componentes). Lenguaje
   Tabler/Linear/Stripe: hairlines limpios, sombra mínima, tipografía confiada.
   ========================================================================== */
:root {
  --border: #e8e3d6;         /* hairlines cálidos, a juego con el lienzo crema */
  --border-strong: #dcd6c6;
  --shadow-sm: 0 1px 2px rgba(60,50,25,.035);
  --shadow: 0 1px 3px rgba(60,50,25,.05), 0 6px 16px rgba(60,50,25,.04);
}
body { font-size: 14px; }

/* Cabeceras de página consistentes y confiadas. */
.content .page-head h1 { font-size: 22px; font-weight: 750; letter-spacing: -.02em; }

/* Tarjetas: borde nítido, sombra casi imperceptible, ritmo interno claro. */
.card-h { padding: 15px 18px 12px; }
.card-h h2 { font-size: 14px; font-weight: 700; letter-spacing: -.01em; }
.card-h .hint { font-size: 12px; }
.card-b { padding: 16px 18px; }

/* KPIs: aire y jerarquía. */
.stat { padding: 16px 18px; border-radius: 13px; }
.stat .lbl { font-size: 11px; letter-spacing: .055em; }
.stat .val { font-size: 24px; margin-top: 8px; }

/* Tablas con acabado de producto serio. */
thead th { font-size: 11px; letter-spacing: .05em; color: var(--faint);
  padding: 2px 14px 11px; }
tbody td { padding: 13px 14px; font-size: 13.5px; }
tbody tr:hover { background: #fafbfc; }

/* Controles: radios y pesos coherentes. */
.btn { border-radius: 9px; font-weight: 650; }
.btn.primary:hover { background: #103a31; }
.badge { font-weight: 650; padding: 3px 10px; }
.input, select, textarea { border-radius: 9px; }

/* Filas de lista: respiración. */
.lrow { padding: 12px 0; }
.lrow .meta { font-size: 12px; }

/* "Trabajos de hoy" destacado en el inicio (¿dónde tengo que ir?). */
.today-summary { font-size: 12.5px; color: var(--muted); font-weight: 600;
  padding-bottom: 10px; margin-bottom: 4px; border-bottom: 1px solid var(--border); }
.tl-where { display: inline-flex; align-items: center; gap: 4px; }
.tl-where svg { width: 13px; height: 13px; opacity: .8; }
.tl-price { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums;
  color: var(--brand); flex: 0 0 auto; }
.today-card .tl-time { color: var(--brand); }

/* Balance / posición (debe-haber) en el inicio: el "control de cuentas". */
.bal-grid { display:grid; grid-template-columns: 1fr 1fr 1fr; gap:18px; }
.bal-col { min-width:0; }
.bal-col + .bal-col { border-left:1px solid var(--border); padding-left:18px; }
.bal-label { font-size:11px; text-transform:uppercase; letter-spacing:.05em;
  color:var(--faint); font-weight:700; margin-bottom:9px; }
.bal-row { display:flex; justify-content:space-between; align-items:baseline; gap:12px;
  padding:6px 0; font-size:13.5px; }
.bal-row span { color:var(--muted); }
.bal-row b { font-variant-numeric:tabular-nums; font-weight:700; }
.bal-col.fav .bal-row b { color:var(--green); }
.bal-col.pay .bal-row b { color:var(--red); }
.bal-net { font-size:26px; font-weight:750; letter-spacing:-.02em; color:var(--brand);
  font-variant-numeric:tabular-nums; }
.bal-hint { font-size:12px; color:var(--muted); margin-top:7px; line-height:1.45; }
@media (max-width:760px) { .bal-grid { grid-template-columns:1fr; }
  .bal-col + .bal-col { border-left:none; padding-left:0;
    border-top:1px solid var(--border); padding-top:12px; } }

/* ==========================================================================
   Panel personalizable — el autónomo ordena y oculta los bloques del inicio.
   Los bloques se colocan con flex `order`; la barra de control solo aparece
   en modo edición (body.panel-editing).
   ========================================================================== */
.panel-blocks { display:flex; flex-direction:column; gap:14px; margin-top:14px; }
.pblock { position:relative; }
.pblock-hidden { display:none; }

/* Barra de control sobre cada bloque (oculta fuera de edición). */
.pblock-bar { display:none; }
.pblock-name { font-size:12.5px; font-weight:600; color:var(--text);
  display:inline-flex; align-items:center; gap:8px; }
.pblock-flag { display:none; }
.pblock-tools { display:flex; gap:5px; }
.pbt { width:30px; height:30px; display:inline-flex; align-items:center;
  justify-content:center; padding:0; border:1px solid var(--border);
  background:var(--surface); border-radius:8px; color:var(--muted);
  cursor:pointer; transition:border-color .12s, color .12s; }
.pbt:hover { color:var(--text); border-color:var(--muted); }
.pbt svg { width:16px; height:16px; }

/* Modo edición: se muestra la barra y se marca cada bloque como reordenable. */
body.panel-editing .pblock-bar { display:flex; align-items:center;
  justify-content:space-between; gap:10px; margin-bottom:8px;
  padding:7px 10px; background:var(--brand-soft);
  border:1px solid var(--border); border-radius:10px; }
body.panel-editing .pblock { outline:1px dashed var(--border); outline-offset:7px;
  border-radius:14px; }
/* Los bloques ocultos siguen visibles (atenuados) para poder reactivarlos. */
body.panel-editing .pblock-hidden { display:block; }
body.panel-editing .pblock-hidden .cmd-hero,
body.panel-editing .pblock-hidden .card,
body.panel-editing .pblock-hidden .grid,
body.panel-editing .pblock-hidden .split { opacity:.4; filter:grayscale(.5); }
body.panel-editing .pblock-hidden .pblock-flag { display:inline-block;
  font-size:10.5px; font-weight:600; letter-spacing:.02em; text-transform:uppercase;
  color:var(--red); background:var(--red-soft); border-radius:20px; padding:2px 8px; }
body.panel-editing .pblock-hidden .pbt-eye { color:var(--red); border-color:var(--red); }

/* ==========================================================================
   Equipo y fichaje: personas, estado de jornada y ubicación puntual.
   ========================================================================== */
.worker-person { display:inline-flex; align-items:center; gap:10px; }
.worker-person > i { width:10px; height:34px; border-radius:999px; flex:0 0 10px; }
.worker-person strong, .worker-person small { display:block; }
.worker-person small { color:var(--faint); font-size:11.5px; margin-top:1px; }
.worker-inactive { opacity:.62; }
.coord { color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.map-link { color:var(--brand-2); font-size:12px; font-weight:650; }
.map-link:hover { text-decoration:underline; }
.job-worker-select { width:160px; min-width:130px; padding:6px 28px 6px 9px;
  font-size:12px; background-color:#fff; }
.agenda-job { display:grid; grid-template-columns:1fr; }
.agenda-job > span:last-child { justify-content:space-between; width:100%;
  padding-top:9px; margin-top:4px; border-top:1px solid var(--border); }
.agenda-job .job-worker-select { flex:1; width:auto; }
.clockins-modal { max-width:760px; }
.clockins-modal .modal-b { max-height:70vh; overflow-y:auto; }
.clock-admin-list { display:flex; flex-direction:column; }
.clock-admin-row { display:flex; justify-content:space-between; gap:16px;
  align-items:center; padding:11px 0; border-top:1px solid var(--border); }
.clock-admin-row:first-child { border-top:0; }
.clock-admin-row.is-annulled { opacity:.62; }
.clock-admin-row.is-annulled b { text-decoration:line-through; }
.clock-admin-row b, .clock-admin-row small { display:block; }
.clock-admin-row small { color:var(--muted); font-size:11.5px; margin-top:2px; }
.clock-admin-row .clock-correction { color:var(--amber); }
@media (max-width:620px) {
  .clock-admin-row { align-items:flex-start; flex-direction:column; }
}

/* Portal móvil del trabajador. */
.clock-page { min-height:100vh; background:var(--bg); padding:18px 14px 48px; }
.clock-shell { width:100%; max-width:560px; margin:0 auto; }
.clock-head { display:flex; align-items:center; gap:13px; padding:18px;
  border-radius:16px; color:#fff; margin-bottom:14px; }
.clock-mark { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center;
  border-radius:11px; background:#fff; font-weight:800; font-size:17px; overflow:hidden; }
.clock-mark img { width:100%; height:100%; object-fit:contain; padding:4px; }
.clock-head .kicker { color:rgba(255,255,255,.76); margin:0; }
.clock-head h1 { font-size:21px; line-height:1.15; margin-top:2px; }
.clock-card { background:var(--surface); border:1px solid var(--border);
  border-radius:14px; padding:18px; margin-top:12px; box-shadow:var(--shadow-sm); }
.clock-state { display:flex; align-items:center; justify-content:space-between;
  gap:14px; }
.clock-state strong { display:block; font-size:16px; }
.clock-state span { color:var(--muted); font-size:12.5px; }
.clock-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:16px; }
.clock-actions .btn { min-height:50px; justify-content:center; font-size:15px; }
.clock-job { display:block; border:1px solid var(--border); border-radius:11px;
  padding:12px 13px; margin-top:9px; cursor:pointer; background:#fff; }
.clock-job:has(input:checked) { border-color:var(--brand-2);
  box-shadow:0 0 0 2px var(--brand-soft); }
.clock-job input { margin-right:7px; accent-color:var(--brand); }
.clock-job b { font-size:13.5px; }
.clock-job small { display:block; color:var(--muted); margin:3px 0 0 23px; }
.clock-job .clock-project { color:var(--brand); font-weight:700; }
.clock-job-wrap { border-bottom:1px solid var(--border); padding-bottom:12px; }
.clock-job-wrap:last-child { border-bottom:0; padding-bottom:0; }
.clock-field-status { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px;
  color:var(--muted); font-size:11.5px; margin:7px 4px 0; }
.clock-field-actions { display:flex; flex-wrap:wrap; gap:7px; margin:8px 4px 0; }
.clock-field-actions .btn { min-height:34px; }
.field-dialog { width:min(520px, calc(100% - 22px)); max-height:90vh; padding:0;
  border:1px solid var(--border); border-radius:16px; box-shadow:0 20px 70px rgba(20,36,30,.2); }
.field-dialog::backdrop { background:rgba(15,31,26,.45); }
.field-dialog form { padding:18px; overflow-y:auto; max-height:calc(90vh - 36px); }
.field-dialog .modal-h { padding:0 0 10px; }
.field-dialog .fld { display:block; margin-top:12px; }
.field-dialog-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:16px; }
.field-sign-box { margin-top:16px; padding:13px; border:1px solid var(--border);
  border-radius:12px; background:var(--surface-2); }
.field-sign-box > p { color:var(--muted); font-size:12px; line-height:1.45; margin:4px 0; }
.field-signature { width:100%; height:150px; background:#fff; border:1px solid var(--border-strong);
  border-radius:10px; display:block; margin:6px 0 9px; touch-action:none; }
.project-job-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.job-field-modal { width:min(680px, calc(100% - 24px)); }
.job-field-modal .modal-b { max-height:72vh; overflow-y:auto; }
.job-field-modal h3 { font-size:13px; color:var(--muted); margin:20px 0 4px; }
.job-field-total { display:flex; justify-content:space-between; align-items:center;
  padding:12px 14px; border-radius:11px; background:var(--brand-soft); color:var(--brand-ink); }
.job-close-box { display:flex; flex-direction:column; align-items:flex-start; gap:9px;
  padding:13px; border:1px solid var(--border); border-radius:11px; background:var(--surface-2); }
.job-close-box p { margin:0; line-height:1.5; }
.job-close-box small { color:var(--muted); }
.clock-task-list { margin-top:8px; }
.clock-task { display:grid; grid-template-columns:minmax(0,1fr) 120px; gap:12px;
  align-items:center; padding:12px 0; border-top:1px solid var(--border); }
.clock-task:first-child { border-top:0; }
.clock-task strong, .clock-task small { display:block; }
.clock-task strong { color:var(--brand-ink); font-size:13.5px; }
.clock-task small { color:var(--brand); font-size:11px; margin-top:3px; }
.clock-task p { color:var(--muted); font-size:11.5px; line-height:1.45; margin:6px 0 0; }
.clock-task select { width:100%; font-size:12px; }
.clock-privacy { display:flex; gap:9px; align-items:flex-start; color:var(--muted);
  font-size:12.5px; line-height:1.5; margin:16px 4px 0; }
.clock-privacy svg { flex:0 0 17px; width:17px; height:17px; margin-top:1px;
  color:var(--brand-2); }
.clock-message { border-radius:10px; padding:10px 12px; margin-top:12px;
  font-size:13px; display:none; }
.clock-message.ok { display:block; background:var(--green-soft); color:var(--green); }
.clock-message.warn { display:block; background:var(--amber-soft); color:var(--amber); }
.clock-message.error { display:block; background:var(--red-soft); color:var(--red); }
.clock-pin { max-width:300px; margin:0 auto; text-align:center; padding:8px 0; }
.clock-pin h2 { font-size:19px; margin-bottom:5px; }
.clock-pin p { color:var(--muted); font-size:13px; margin:0 0 14px; }
.clock-pin .input { text-align:center; font-size:20px; letter-spacing:.2em; }
.clock-foot { text-align:center; color:var(--faint); font-size:11.5px; margin-top:24px; }
.clock-history { display:flex; flex-direction:column; margin-top:8px; }
.clock-history-row { display:grid; grid-template-columns:72px 1fr auto; gap:10px;
  align-items:start; padding:11px 0; border-top:1px solid var(--border); }
.clock-history-row:first-child { border-top:0; }
.clock-history-row.is-annulled { opacity:.62; }
.clock-history-row.is-annulled b { text-decoration:line-through; }
.clock-history-action { font-size:10.5px; font-weight:750; text-transform:uppercase;
  letter-spacing:.04em; color:var(--brand); background:var(--brand-soft);
  border-radius:999px; padding:3px 7px; text-align:center; }
.clock-history-row b, .clock-history-row small { display:block; }
.clock-history-row b { font-size:13px; }
.clock-history-row small { color:var(--muted); font-size:11.5px; margin-top:2px; }
.clock-history-row .clock-correction { color:var(--amber); }
.clock-history-row code { color:var(--faint); font-size:9.5px; padding-top:3px; }
.clock-legal h2 { font-size:16px; margin:4px 0 8px; }
.clock-legal ul { margin:0 0 14px; padding-left:20px; color:var(--muted);
  font-size:12.5px; line-height:1.55; }
.clock-policy { background:var(--surface-2); border:1px solid var(--border);
  border-radius:10px; padding:11px 12px; margin:12px 0; font-size:12.5px; }
.clock-policy p { white-space:pre-wrap; margin:5px 0 0; color:var(--muted); }
@media (max-width:480px) {
  .clock-page { padding:10px 10px 36px; }
  .clock-head { border-radius:14px; }
  .clock-actions { grid-template-columns:1fr; }
  .clock-task { grid-template-columns:1fr; }
  .clock-history-row { grid-template-columns:66px 1fr; }
  .clock-history-row code { grid-column:2; padding:0; }
}

/* ==========================================================================
   Sitio público 2026 — editorial, operativo y sin apariencia de plantilla.
   Todas las clases se aíslan de la aplicación interna.
   ========================================================================== */
.public-site { --public-max: 1200px; background:#f4f1ea; }
.public-site main { overflow:hidden; }
.public-header { position:relative; z-index:30; color:#f8faf8; background:#102820; border-bottom:1px solid rgba(255,255,255,.1); }
.public-header-inner { width:min(var(--public-max), calc(100% - 40px)); min-height:76px; margin:0 auto;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:30px; }
.public-header .site-brand { color:#fff; font-family:var(--serif); font-size:25px; font-weight:520; letter-spacing:-.02em; }
.public-header .site-brand img { width:32px; height:32px; }
.public-nav { display:flex; align-items:center; justify-content:center; gap:30px; color:rgba(255,255,255,.74); font-size:13px; }
.public-nav a { padding:27px 0 24px; border-bottom:2px solid transparent; }
.public-nav a:hover, .public-nav a.active { color:#fff; border-bottom-color:#9fd6bd; }
.public-header .site-actions { gap:10px; }
.public-header .site-actions .btn.ghost { color:#fff; border-color:rgba(255,255,255,.2); background:rgba(255,255,255,.08); }
.public-header .site-actions .btn.primary { color:var(--brand); border-color:#fff; background:#fff; }
.public-menu { display:none; position:relative; }
.public-menu summary { list-style:none; cursor:pointer; border:1px solid var(--border-strong); border-radius:9px;
  padding:9px 12px; font-weight:700; color:var(--brand); background:#fff; }
.public-menu summary::-webkit-details-marker { display:none; }
.public-menu nav { position:absolute; right:0; top:47px; width:220px; padding:8px; background:#fff;
  border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow); display:grid; }
.public-menu nav a { padding:10px 12px; border-radius:8px; }
.public-menu nav a:hover { background:var(--brand-soft); color:var(--brand); }
.public-site .btn { min-height:42px; padding:10px 16px; border-radius:8px; }
.public-site .btn.light { background:#fff; border-color:#fff; color:var(--brand); font-weight:750; }
.public-site .btn.light:hover { background:#f7f4ec; border-color:#f7f4ec; }
.text-link { display:inline-flex; align-items:center; gap:8px; color:var(--brand); font-weight:750; font-size:13.5px; }
.text-link span { transition:transform .15s ease; }
.text-link:hover span { transform:translateX(3px); }
.light-link { color:#fff; }
.eyebrow, .hero-kicker { display:block; color:var(--brand-2); font-size:11px; font-weight:800;
  letter-spacing:.105em; text-transform:uppercase; }
.light-eyebrow { color:#9fd6bd; }
.section-heading { max-width:690px; margin-bottom:38px; }
.section-heading.centered { margin-left:auto; margin-right:auto; text-align:center; }
.section-heading h2, .public-site .public-page-hero h1, .public-site .public-final-cta h2,
.pilot-stories h2, .team-manifesto h2, .principles-list h2, .team-contact h2,
.companion-section h2, .compliance-section h2, .price-included h2, .faq-preview h2 {
  font-family:var(--serif); font-weight:500; color:var(--brand); letter-spacing:-.025em; line-height:1.05; }
.section-heading h2 { font-size:clamp(32px, 4vw, 48px); margin-top:10px; }
.section-heading p { color:var(--muted); font-size:16px; line-height:1.65; margin:15px 0 0; }
.public-section, .workflow-section, .moments-section, .pricing-preview, .faq-preview,
.pilot-stories, .companion-section, .compliance-section, .price-included,
.team-manifesto, .principles-list, .team-contact { width:min(var(--public-max), calc(100% - 40px)); margin:0 auto; }
.public-section, .workflow-section, .moments-section, .pricing-preview { padding:92px 0; }

/* Home: jerarquía de campaña clara y el producto real como prueba principal. */
.marketing-hero { background:#102820; color:#fff; }
.marketing-hero-inner { width:min(1420px, calc(100% - 64px)); min-height:0; margin:0 auto; padding:96px 0 72px; }
.hero-impact { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:18px 64px;
  max-width:960px; margin:44px auto 0; padding-top:30px; border-top:1px solid rgba(255,255,255,.14); }
.hero-impact > div { display:flex; align-items:baseline; gap:10px; }
.hero-impact strong { font-family:var(--serif); font-weight:550; font-size:36px; letter-spacing:-.01em; color:#fff; }
.hero-impact span { max-width:21ch; color:rgba(255,255,255,.66); font-size:13px; line-height:1.4; }
.hero-impact-note { margin:16px 0 0; text-align:center; color:rgba(255,255,255,.38); font-size:11px; }
.marketing-hero-copy { max-width:960px; margin:0 auto; text-align:center; }
.hero-kicker { color:#9fd6bd; }
.marketing-hero-copy h1 { font-family:var(--serif); font-weight:500; font-size:clamp(52px, 5.6vw, 84px);
  line-height:.98; letter-spacing:-.045em; color:#fff; margin:20px 0 0; }
.marketing-hero-copy h1 span { display:block; }
.marketing-hero-copy h1 span:first-child { white-space:normal; }
.marketing-hero-copy > p { max-width:62ch; margin:25px auto 0; color:rgba(255,255,255,.7); font-size:18px; line-height:1.6; }
.hero-actions { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:31px; }
.hero-how { display:inline-flex; margin-top:19px; color:#c9ddd5; font-size:13px; font-weight:750; }
.hero-how:hover { color:#fff; }
.hero-trust { justify-content:center; display:flex; flex-wrap:wrap; gap:14px 20px; margin-top:14px; color:rgba(255,255,255,.55); font-size:11.5px; }
.hero-trust span::before { content:""; display:inline-block; width:6px; height:6px; margin-right:7px;
  border:1px solid #9fd6bd; border-radius:50%; vertical-align:1px; }
.hero-operating-proof { width:100%; max-width:960px; min-width:0; display:block; margin:66px auto 0; background:#f9f7f1;
  border:1px solid rgba(255,255,255,.28); border-radius:18px; overflow:hidden; box-shadow:0 18px 42px rgba(4,20,15,.28); }
.hero-desk { display:grid; grid-template-columns:102px 1fr; min-width:0; color:var(--text); }
.hero-desk-nav { display:flex; flex-direction:column; gap:4px; padding:18px 10px; background:#103f35; color:#c9ddd5; }
.hero-desk-nav > b { font-family:var(--serif); color:#fff; font-size:18px; padding:3px 8px 16px; }
.hero-desk-main { min-width:0; padding:20px; background:#f9f7f1; }
.desk-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:17px; }
.desk-heading small { color:var(--brand-2); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.desk-heading h2 { font-family:var(--serif); font-size:24px; color:var(--brand); font-weight:500; margin-top:2px; }
.desk-heading > span { border:1px solid var(--border-strong); background:#fff; border-radius:7px; padding:7px 9px; font-size:9px; font-weight:700; }
.desk-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.desk-grid section { min-width:0; display:flex; flex-direction:column; gap:6px; min-height:126px; padding:13px;
  background:#fff; border:1px solid var(--border); border-radius:8px; }
.desk-grid section small { color:var(--brand-2); font-size:9px; font-weight:750; text-transform:uppercase; letter-spacing:.05em; }
.desk-grid section b { font-size:10.5px; color:var(--brand); line-height:1.35; }
.desk-grid section span, .desk-grid section p { color:var(--muted); font-size:9.5px; line-height:1.4; margin:0; }
.desk-grid .desk-focus { background:#edf5f0; border-color:#c9ddd4; }
.desk-grid .desk-action { width:max-content; margin-top:auto; padding:5px 8px; border-radius:6px; color:#fff; background:var(--brand); font-weight:700; }

/* Vista navegable: una empresa de ejemplo completa, no una captura decorativa. */
.interactive-product-demo { display:block; background:#f9f7f1; }
.interactive-product-demo .hero-desk, .product-home-preview .hero-desk { grid-template-columns:142px minmax(0,1fr); min-height:480px; }
.interactive-product-demo .hero-desk-nav, .product-home-preview .hero-desk-nav { gap:2px; padding:12px 9px 8px; }
.demo-panel-brand { display:flex; align-items:center; gap:7px; padding:0 7px 9px; }
.demo-panel-brand img { width:22px; height:22px; border-radius:6px; }
.interactive-product-demo .demo-panel-brand b, .product-home-preview .demo-panel-brand b { padding:0; color:#fff; font-family:var(--serif); font-size:16px; font-weight:550; }
.demo-nav-section { padding:7px 7px 2px; color:#78a99a; font-size:7px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.interactive-product-demo .hero-desk-nav button, .product-home-preview .hero-desk-nav button { width:100%; display:flex; align-items:center; gap:7px; padding:5px 7px; border:0; border-radius:6px;
  color:#c9ddd5; background:transparent; text-align:left; font:inherit; font-size:8.5px; cursor:pointer; }
.demo-nav-icon { width:14px; height:14px; flex:0 0 14px; padding:0; }
.demo-nav-icon svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.interactive-product-demo .hero-desk-nav button:hover,
.interactive-product-demo .hero-desk-nav button:focus-visible { color:#fff; background:rgba(255,255,255,.08); outline:0; }
.interactive-product-demo .hero-desk-nav button.active, .product-home-preview .hero-desk-nav button.active { color:var(--brand); background:#f4f1e8; }
.demo-nav-footer { display:flex; flex-direction:column; gap:1px; margin-top:auto; padding:8px 7px 2px; border-top:1px solid rgba(255,255,255,.1); }
.interactive-product-demo .demo-nav-footer b, .product-home-preview .demo-nav-footer b { padding:0; color:#fff; font-family:var(--sans); font-size:8px; font-weight:750; }
.demo-nav-footer small { color:#94b8ad; font-size:7px; }
.demo-app-main { min-width:0; display:flex; flex-direction:column; background:#f4f1e8; }
.demo-app-topbar { min-height:36px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 10px;
  color:#66756f; background:#f8f6ef; border-bottom:1px solid var(--border); font-size:8px; }
.demo-app-topbar > span { white-space:nowrap; }
.demo-app-topbar b { color:var(--text); }
.demo-topbar-actions { min-width:0; display:flex; align-items:center; justify-content:flex-end; gap:5px; color:var(--brand); font-size:7px; font-weight:700; white-space:nowrap; }
.demo-topbar-actions > span { min-height:24px; display:flex; align-items:center; gap:4px; padding:0 7px; border:1px solid var(--border); border-radius:7px; background:#fff; }
.demo-topbar-actions .demo-topbar-mark { width:25px; justify-content:center; padding:0; }
.demo-topbar-mark img { width:13px; height:13px; }
.demo-topbar-actions kbd { padding:1px 3px; border:0; border-radius:3px; color:#87908c; background:#eeece6; font:inherit; }
.demo-topbar-actions .primary { color:#fff; background:var(--brand); border-color:var(--brand); }
.demo-topbar-actions .whatsapp { color:#a16d13; background:#fff8e8; border-color:#eedfb9; }
.interactive-product-demo .hero-desk-main, .product-home-preview .hero-desk-main { min-height:444px; padding:12px; }
.demo-panel[hidden] { display:none; }
.demo-panel.active { display:block; }

/* Inicio de la demo: misma jerarquía y componentes que el panel real, con datos de ejemplo. */
.demo-real-dashboard { max-height:420px; overflow:auto; padding:2px; scrollbar-color:#b8c9c1 transparent; scrollbar-width:thin; }
.product-home-preview .hero-desk { min-height:610px; }
.product-home-preview .hero-desk-main { min-height:574px; }
.product-home-preview .demo-real-dashboard { max-height:548px; }
.product-home-preview .hero-desk-nav button:not(.active) { cursor:pointer; }
.demo-real-dashboard .home-v2 { gap:8px; }
.demo-real-dashboard .home-brief { gap:14px; padding:14px 15px; border-radius:11px; }
.demo-real-dashboard .home-eyebrow { gap:5px; font-size:7px; }
.demo-real-dashboard .home-eyebrow img { width:13px; height:13px; }
.demo-real-dashboard .home-brief h1 { font-size:18px; margin-top:5px; }
.demo-real-dashboard .home-brief > .home-brief-copy > p { margin:4px 0 9px; font-size:10.5px; line-height:1.4; }
.demo-real-dashboard .home-brief-side { gap:10px; font-size:8px; }
.demo-real-dashboard .home-brief-side button, .demo-real-dashboard .home-panel > header > button { padding:0; border:0; color:var(--brand); background:transparent; font:inherit; font-size:8px; font-weight:750; cursor:pointer; }
.demo-real-dashboard .home-priority { gap:7px; padding:7px 8px; border-radius:8px; }
.demo-real-dashboard .priority-label { padding:3px 5px; font-size:6.5px; }
.demo-real-dashboard .home-priority strong { font-size:9px; }
.demo-real-dashboard .home-priority small { font-size:8px; }
.demo-real-dashboard .home-priority .btn { min-height:0; padding:6px 7px; border-radius:5px; font-size:7px; }
.demo-real-dashboard .home-setup { gap:10px; padding:7px 10px; border-radius:8px; }
.demo-real-dashboard .home-setup span { font-size:6.5px; }
.demo-real-dashboard .home-setup strong { margin-top:0; font-size:7.5px; }
.demo-real-dashboard .home-setup-track { height:4px; }
.demo-real-dashboard .demo-setup-ready { color:var(--brand); white-space:nowrap; }
.demo-real-dashboard .home-metrics { border-radius:9px; }
.demo-real-dashboard .home-metric { width:100%; padding:9px 10px; border-top:0; border-right:0; border-bottom:0; color:inherit; background:transparent; font:inherit; text-align:left; cursor:pointer; }
.demo-real-dashboard .home-metric span { font-size:7.5px; }
.demo-real-dashboard .home-metric strong { margin-top:2px; font-size:15px; }
.demo-real-dashboard .home-metric small { font-size:7px; }
.demo-real-dashboard .home-main-grid, .demo-real-dashboard .home-lower-grid { gap:8px; }
.demo-real-dashboard .home-panel { border-radius:10px; }
.demo-real-dashboard .home-panel > header { gap:8px; padding:10px 11px 8px; }
.demo-real-dashboard .home-panel > header h2 { font-size:13px; }
.demo-real-dashboard .panel-kicker { font-size:6.5px; }
.demo-real-dashboard .home-panel-body { padding:0 11px 9px; }
.demo-real-dashboard .home-list-row, .demo-real-dashboard .work-row, .demo-real-dashboard .pending-row { width:100%; padding:7px 0; border-right:0; border-left:0; border-bottom:0; color:inherit; background:transparent; font:inherit; text-align:left; cursor:pointer; }
.demo-real-dashboard .home-row-time { flex-basis:31px; font-size:8px; }
.demo-real-dashboard .home-row-copy strong, .demo-real-dashboard .work-row strong, .demo-real-dashboard .pending-row strong { font-size:8.5px; }
.demo-real-dashboard .home-row-copy small, .demo-real-dashboard .work-row small, .demo-real-dashboard .pending-row small { font-size:7.5px; }
.demo-real-dashboard .home-row-state, .demo-real-dashboard .work-row > b { font-size:7px; }
.demo-real-dashboard .work-status { width:6px; height:6px; flex-basis:6px; margin-top:3px; }
.demo-real-dashboard .work-status.active { box-shadow:0 0 0 3px var(--brand-soft); }
.demo-real-dashboard .money-summary { gap:12px; padding:0 11px 3px; }
.demo-real-dashboard .money-summary span { font-size:6.5px; }
.demo-real-dashboard .money-summary strong { font-size:13px; }
.demo-real-dashboard .money-summary p { font-size:8px; }
.demo-real-dashboard .home-chart { height:84px; padding:4px 8px 8px; }

/* Pantallas reales del panel replicadas en la demo pública, reducidas con zoom
   para conservar exactamente su maquetación. */
.demo-screen { zoom:.62; max-height:884px; overflow:auto; padding:4px 6px 14px;
  scrollbar-width:thin; scrollbar-color:#b8c9c1 transparent; }
.demo-screen .chat-wrap { height:auto; }
.demo-screen .btn, .demo-screen .chip, .demo-screen input, .demo-screen .cal-cell { cursor:default; }
.demo-app-main .demo-subnav { margin:0; padding:7px 14px 0; max-width:none; gap:3px;
  background:#f3f0e8; border-bottom:1px solid var(--border); }
/* .subnav trae display:flex, que gana al atributo hidden: hay que reafirmarlo. */
.demo-app-main .demo-subnav[hidden] { display:none; }
.demo-app-main .demo-subnav button { flex:0 0 auto; padding:5px 12px; border:1px solid transparent;
  border-radius:999px; color:var(--muted); background:transparent; font:inherit; font-size:10px;
  font-weight:700; cursor:pointer; margin-bottom:6px; }
.demo-app-main .demo-subnav button:hover { color:var(--brand); }
.demo-app-main .demo-subnav button.active { color:var(--brand); background:var(--surface);
  border-color:var(--border-strong); }
.demo-noesis-reading { display:flex; flex-direction:column; gap:3px; margin-bottom:10px; padding:11px 13px;
  background:#edf5f0; border:1px solid #c9ddd4; border-radius:8px; }
.demo-noesis-reading b { font-family:var(--serif); color:var(--brand); font-size:13px; font-weight:550; }
.demo-noesis-reading span { color:#587067; font-size:9.5px; line-height:1.45; }
.demo-noesis-reading.compact { margin:12px 0 0; }
.demo-list { border-top:1px solid var(--border-strong); }
.demo-list > div { min-height:66px; display:grid; grid-template-columns:48px minmax(0,1fr) auto; gap:12px;
  align-items:center; padding:10px 3px; border-bottom:1px solid var(--border); }
.demo-list time { color:var(--brand); font-size:11px; font-weight:750; }
.demo-list span { min-width:0; }
.demo-list span b, .demo-list span small { display:block; }
.demo-list span b { color:var(--brand); font-size:10.5px; line-height:1.35; }
.demo-list span small { margin-top:3px; color:var(--muted); font-size:9px; line-height:1.4; }
.demo-list em, .demo-list strong { color:var(--brand); font-size:9.5px; font-style:normal; font-weight:750; white-space:nowrap; }
.demo-status { padding:4px 7px; border-radius:5px; color:#5e6b66!important; background:#eceeea; }
.demo-status.good { color:#316b57!important; background:#e4efe9; }
.demo-status.amber { color:#725c2c!important; background:#f6efd9; }
.demo-status.late { color:#934c3f!important; background:#f7e8e3; }
.demo-footnote { margin:13px 0 0; color:var(--muted); font-family:var(--serif); font-size:11.5px; line-height:1.5; }
.clients-list > div, .team-list > div { grid-template-columns:30px minmax(0,1fr) auto; }
.demo-avatar { width:28px; height:28px; display:flex!important; align-items:center; justify-content:center;
  border-radius:50%; color:var(--brand)!important; background:var(--brand-soft); font-size:8px!important; font-weight:800; }
.invoice-list > div { grid-template-columns:minmax(0,1fr) auto auto; }
.document-list > div { grid-template-columns:minmax(0,1fr) auto; }
.demo-money-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--border-strong); border-bottom:1px solid var(--border-strong); }
.demo-money-grid > div { padding:19px 13px; border-right:1px solid var(--border); }
.demo-money-grid > div:last-child { border-right:0; }
.demo-money-grid small, .demo-money-grid b, .demo-money-grid span { display:block; }
.demo-money-grid small { color:var(--brand-2); font-size:8.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.demo-money-grid b { margin:7px 0 4px; color:var(--brand); font-family:var(--serif); font-size:20px; font-weight:550; }
.demo-money-grid span { color:var(--muted); font-size:8.5px; }
.demo-conversation { display:grid; gap:9px; }
.demo-conversation p { max-width:85%; margin:0; padding:10px 12px; border-radius:8px; color:#53635c;
  background:#fff; border:1px solid var(--border); font-size:9.5px; line-height:1.5; }
.demo-conversation p.from-user { justify-self:end; background:var(--brand-soft); border-color:#c9ddd4; }
.demo-conversation b { display:block; margin-bottom:3px; color:var(--brand); font-size:8.5px; }
.demo-composer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:13px; padding:9px 10px;
  color:var(--faint); background:#fff; border:1px solid var(--border-strong); border-radius:7px; font-size:9px; }
.demo-composer b { padding:5px 8px; border-radius:5px; color:#fff; background:var(--brand); font-size:8px; }

/* Flujo y momentos: editorial antes que tarjetas. */
.workflow-section { border-bottom:1px solid var(--border); }
.workflow-line { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4,1fr); }
.workflow-line li { position:relative; padding:0 28px; text-align:center; border-right:1px solid var(--border); }
.workflow-line li:last-child { border-right:0; }
.workflow-line li > b { display:flex; width:28px; height:28px; margin:0 auto 18px; align-items:center; justify-content:center;
  border-radius:50%; background:var(--brand); color:#fff; font-size:11px; }
.workflow-line h3 { font-family:var(--serif); font-weight:500; color:var(--brand); font-size:22px; }
.workflow-line p { color:var(--muted); font-size:13px; line-height:1.6; margin:9px auto 0; max-width:25ch; }
.moments-section { padding-top:76px; }
.moments-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.moments-grid article { padding:30px 26px; border-right:1px solid var(--border); }
.moments-grid article:last-child { border-right:0; }
.moments-grid article > span, .product-moment-list article span, .team-responsibilities article span { color:var(--brand-2); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.moments-grid h3 { font-family:var(--serif); font-size:20px; font-weight:500; color:var(--brand); margin:9px 0 15px; }
.moments-grid ul, .companion-copy ul, .public-price-list { list-style:none; padding:0; margin:0; }
.moments-grid li { position:relative; padding:5px 0 5px 14px; color:var(--muted); font-size:12.5px; }
.moments-grid li::before { content:""; position:absolute; left:0; top:11px; width:4px; height:4px; border-radius:50%; background:var(--brand-2); }
.pilot-stories { min-height:260px; display:grid; grid-template-columns:1fr .9fr; gap:40px; align-items:center;
  padding:28px 28px 28px 48px; background:#f8f5ed; border:1px solid var(--border); border-radius:14px; }
.pilot-stories h2 { font-size:clamp(28px,3vw,40px); margin:10px 0 14px; }
.pilot-stories p { color:var(--muted); line-height:1.65; max-width:58ch; }
.pilot-stories img { width:100%; max-height:230px; object-fit:cover; object-position:center; mix-blend-mode:multiply; }

/* Precios y preguntas. */
.pricing-preview { padding-bottom:78px; }
.public-pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:stretch; }
.public-pricing-grid.compact { max-width:1050px; margin:0 auto; }
.public-price-card { position:relative; display:flex; flex-direction:column; min-width:0; padding:30px 28px 24px;
  background:#fff; border:1px solid var(--border); border-radius:12px; }
.public-price-card.recommended { border:1.5px solid var(--brand-2); box-shadow:0 12px 28px rgba(20,70,59,.08); }
.recommendation-label { align-self:flex-start; margin:-13px 0 20px; padding:5px 9px; border-radius:5px;
  color:#fff; background:var(--brand); font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.plan-label { font-family:var(--serif); font-size:19px; color:var(--brand); }
.public-price { font-family:var(--serif); font-size:46px; line-height:1; color:var(--brand); margin:14px 0 17px; }
.public-price small { font-family:var(--font); font-size:11px; font-weight:600; color:var(--muted); }
.public-price-card > p:not(.public-price) { color:var(--muted); line-height:1.6; font-size:13px; margin:0 0 20px; }
.public-price-card .btn { margin-top:auto; }
.plan-buy-link { display:block; margin-top:11px; color:var(--brand); font-size:11.5px;
  font-weight:750; text-align:center; text-decoration:underline; text-underline-offset:3px; }
.public-price-list { margin-bottom:24px; }
.public-price-list li { position:relative; padding:6px 0 6px 18px; color:#4f5e58; font-size:12.5px; line-height:1.45; }
.public-price-list li::before { content:""; position:absolute; left:0; top:12px; width:6px; height:6px; border-radius:50%; border:1px solid var(--brand-2); }
.beta-line, .beta-feature { display:block; margin:0 0 18px; padding:10px 12px; border-left:2px solid var(--amber); background:#fbf7e9; color:#725c2c; font-size:11.5px; line-height:1.45; }
.beta-feature { display:flex; flex-direction:column; gap:2px; }
.beta-feature b { color:#614d22; }
.plan-footnote { display:block; color:var(--faint); text-align:center; font-size:10.5px; margin-top:11px; }
.center-link { text-align:center; margin-top:28px; }
.trial-banner { display:flex; justify-content:space-between; gap:20px; margin-bottom:24px; padding:16px 20px;
  background:var(--brand-soft); border-radius:10px; color:var(--brand); }
.trial-banner span { color:#48675c; }
.billing-choice, .account-billing-choice { display:flex; align-items:center; justify-content:space-between; gap:24px;
  margin-bottom:24px; padding:16px 18px; background:#fff; border:1px solid var(--border); border-radius:10px; }
.billing-choice > div:first-child, .account-billing-choice > div:first-child { display:flex; flex-direction:column; gap:3px; }
.billing-choice > div:first-child span, .account-billing-choice > div:first-child span { color:var(--muted); font-size:11.5px; }
.billing-toggle { width:max-content; display:flex; align-items:center; padding:3px; margin:0 auto 25px;
  background:#e7e4dc; border-radius:9px; }
.billing-choice .billing-toggle, .account-billing-choice .billing-toggle { flex:0 0 auto; margin:0; }
.billing-toggle button { min-height:34px; padding:7px 12px; border:0; border-radius:7px; color:#61706a;
  background:transparent; font:inherit; font-size:11px; font-weight:750; cursor:pointer; }
.billing-toggle button.active { color:var(--brand); background:#fff; box-shadow:var(--shadow-sm); }
.billing-toggle button span { margin-left:4px; color:#376e5c; font-size:9px; }
.annual-price-note { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:7px; min-height:34px; margin:-10px 0 15px; padding:6px 7px;
  color:#9a3f31; background:#f7e8e3; border:1px solid #ebc8bd; border-radius:7px; font-size:9px; line-height:1.35; }
.annual-price-note b { padding:3px 5px; border-radius:4px; color:#fff; background:#c0533f; font-size:8px; font-weight:800; letter-spacing:.01em; white-space:nowrap; }
.annual-price-note span { font-weight:750; }
.annual-price-note[hidden] { display:none; }
.account-billing-choice { margin:0 0 16px; }
.selected-plan-summary { display:grid; grid-template-columns:1fr auto; gap:3px 12px; margin:0 0 20px; padding:12px 14px;
  background:var(--brand-soft); border-radius:9px; }
.selected-plan-summary span { grid-column:1/-1; color:var(--brand-2); font-size:9px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.selected-plan-summary b { color:var(--brand); font-size:12px; }
.selected-plan-summary a { color:var(--brand); font-size:10.5px; font-weight:750; text-decoration:underline; text-underline-offset:2px; }
.signup-commercial-choice { margin:0 0 22px; }
.signup-intent-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:12px; }
.signup-intent-card { position:relative; display:block; cursor:pointer; }
.signup-intent-card input { position:absolute; opacity:0; pointer-events:none; }
.signup-intent-card span { min-height:76px; display:flex; flex-direction:column; justify-content:center;
  gap:4px; padding:12px 13px; border:1px solid var(--border-strong); border-radius:10px;
  background:var(--surface-2); }
.signup-intent-card b { color:var(--brand); font-size:12.5px; }
.signup-intent-card small { color:var(--muted); font-size:10.5px; line-height:1.35; }
.signup-intent-card input:checked + span { border-color:var(--brand-2); background:var(--brand-soft);
  box-shadow:0 0 0 2px rgba(46,139,116,.08); }
.signup-plan-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px; }
.signup-plan-row label { display:grid; gap:5px; color:var(--muted); font-size:10.5px; font-weight:750; }
.signup-plan-row select { min-height:40px; background:var(--surface); }
.signup-annual-offer { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px;
  align-items:start; margin-top:10px; padding:11px 12px; color:var(--red);
  background:var(--red-soft); border:1px solid var(--red);
  border-radius:var(--radius-sm); }
.signup-annual-offer[hidden] { display:none; }
.signup-annual-badge { padding:4px 7px; color:var(--surface); background:var(--red); border-radius:6px;
  font-size:9px; font-weight:850; letter-spacing:.02em; text-transform:uppercase; white-space:nowrap; }
.signup-annual-offer > div { display:grid; gap:2px; }
.signup-annual-offer > div > span { color:var(--red); font-size:10px; }
.signup-annual-offer s { color:var(--muted); }
.signup-annual-offer b { color:var(--red); font-size:13px; }
.signup-annual-offer small { color:var(--red); font-size:10.5px; }
.signup-annual-offer strong { color:var(--red); }
.signup-annual-offer-static { margin:-6px 0 14px; }
.faq-preview { display:grid; grid-template-columns:.58fr 1.42fr; gap:80px; padding:70px 0 90px; border-top:1px solid var(--border); }
.faq-preview h2 { font-size:clamp(30px,3.4vw,43px); margin:10px 0 22px; }
.public-accordion { border-top:1px solid var(--border-strong); }
.public-accordion details { padding:0; background:transparent; border:0; border-bottom:1px solid var(--border-strong); border-radius:0; }
.public-accordion summary { position:relative; cursor:pointer; list-style:none; padding:18px 38px 18px 0; color:var(--text); font-weight:700; }
.public-accordion summary::-webkit-details-marker { display:none; }
.public-accordion summary::after { content:"+"; position:absolute; right:3px; top:17px; color:var(--brand-2); font-size:20px; font-weight:400; }
.public-accordion details[open] summary::after { content:"−"; }
.public-accordion p { max-width:72ch; color:var(--muted); line-height:1.65; margin:-3px 38px 18px 0; }

/* Páginas interiores: cada una conserva una estructura propia. */
.public-page-hero { width:min(var(--public-max), calc(100% - 40px)); margin:0 auto; display:grid;
  grid-template-columns:1.12fr .88fr; gap:80px; align-items:end; padding:92px 0 72px; border-bottom:1px solid var(--border); }
.public-page-hero h1 { font-size:clamp(48px,5.2vw,72px); margin-top:15px; max-width:15ch; }
.public-page-hero > p, .public-page-hero > div > p { color:var(--muted); font-size:17px; line-height:1.7; max-width:55ch; margin:0; }
.public-hero-actions { display:flex; align-items:center; gap:22px; margin-top:28px; }
.product-page-hero { align-items:center; border-bottom:0; }
.product-thread { border-left:1px solid var(--border-strong); }
.product-thread > div { display:grid; grid-template-columns:110px 1fr; gap:4px 22px; padding:18px 0 18px 28px; border-bottom:1px solid var(--border); }
.product-thread > div:last-child { border-bottom:0; }
.product-thread small { grid-row:1/3; color:var(--brand-2); font-size:10px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.product-thread b { color:var(--brand); }
.product-thread span { color:var(--muted); font-size:12px; }
.process-rows { border-top:1px solid var(--border-strong); }
.process-rows article { display:grid; grid-template-columns:54px 1fr .9fr; gap:28px; align-items:start; padding:30px 0; border-bottom:1px solid var(--border); }
.process-rows article > b { color:var(--brand-2); font-size:11px; letter-spacing:.08em; }
.process-rows article span { color:var(--brand-2); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.process-rows article h3 { font-family:var(--serif); color:var(--brand); font-size:24px; font-weight:500; line-height:1.2; margin-top:6px; }
.process-rows article p { color:var(--muted); line-height:1.65; margin:0; }
.companion-section { display:grid; grid-template-columns:1fr .9fr; gap:70px; align-items:center; padding:64px;
  background:var(--brand); border-radius:14px; color:#fff; }
.companion-section h2 { color:#fff; font-size:clamp(34px,4vw,50px); margin:12px 0 20px; }
.companion-copy > p { color:rgba(255,255,255,.75); line-height:1.7; }
.companion-copy li { position:relative; padding:7px 0 7px 17px; color:rgba(255,255,255,.8); }
.companion-copy li::before { content:""; position:absolute; left:0; top:15px; width:6px; height:6px; border-radius:50%; background:#9fd6bd; }
.companion-demo { padding:28px; background:#f8f5ed; color:var(--text); border-radius:12px; }
.companion-demo small { color:var(--brand-2); text-transform:uppercase; font-weight:800; letter-spacing:.07em; }
.companion-demo blockquote { font-family:var(--serif); color:var(--brand); font-size:23px; line-height:1.4; margin:20px 0 24px; }
.companion-demo > div { display:flex; flex-wrap:wrap; gap:8px; }
.companion-demo > div span { padding:7px 10px; border:1px solid var(--border-strong); border-radius:7px; color:var(--muted); font-size:11px; }
.product-moment-list { border-top:1px solid var(--border-strong); }
.product-moment-list article { display:grid; grid-template-columns:1.1fr 1fr auto; gap:38px; align-items:center; padding:27px 0; border-bottom:1px solid var(--border); }
.product-moment-list h3 { font-family:var(--serif); color:var(--brand); font-size:22px; font-weight:500; margin-top:6px; }
.product-moment-list p { color:var(--muted); line-height:1.6; }
.product-moment-list a { color:var(--brand); font-size:12px; font-weight:750; }
.compliance-section, .price-included { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; padding:66px;
  background:#e7efe9; border-radius:14px; }
.compliance-section h2, .price-included h2 { font-size:clamp(32px,3.5vw,46px); margin:12px 0 18px; }
.compliance-section > div p { color:var(--muted); line-height:1.65; }
.compliance-section dl { margin:0; display:grid; grid-template-columns:1fr 1fr; }
.compliance-section dl div { padding:20px; border-left:1px solid #c5d7ce; border-bottom:1px solid #c5d7ce; }
.compliance-section dl div:nth-last-child(-n+2) { border-bottom:0; }
.compliance-section dt { color:var(--brand); font-weight:800; }
.compliance-section dd { color:var(--muted); line-height:1.55; margin:8px 0 0; font-size:12.5px; }
.pricing-page-hero { align-items:center; }
.pricing-section { padding-top:52px; }
.price-included { background:var(--brand); color:#fff; }
.price-included h2 { color:#fff; }
.price-included ul { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; }
.price-included li { padding:18px; border-left:1px solid rgba(255,255,255,.18); border-bottom:1px solid rgba(255,255,255,.18); color:rgba(255,255,255,.82); }
.pricing-faq { display:grid; grid-template-columns:.55fr 1fr; gap:80px; }
.faq-page-hero { align-items:center; }
.faq-layout { display:grid; grid-template-columns:220px 1fr; gap:84px; align-items:start; }
.faq-index { position:sticky; top:24px; display:flex; flex-direction:column; gap:4px; padding:18px 0; border-top:1px solid var(--border-strong); border-bottom:1px solid var(--border-strong); }
.faq-index b { color:var(--brand); margin-bottom:9px; }
.faq-index a { color:var(--muted); padding:6px 0; font-size:12.5px; }
.faq-index a:hover { color:var(--brand); }
.faq-groups { display:grid; gap:70px; }
.faq-groups section { scroll-margin-top:25px; }
.faq-groups h2 { font-family:var(--serif); color:var(--brand); font-weight:500; font-size:32px; margin:8px 0 22px; }

/* Equipo: transparencia en vez de perfiles inventados. */
.team-manifesto { display:grid; grid-template-columns:.9fr 1.1fr; gap:90px; padding:68px; background:var(--brand); color:#fff; border-radius:14px; }
.team-manifesto h2 { color:#fff; font-size:clamp(38px,4.3vw,56px); margin-top:12px; }
.team-manifesto p { color:rgba(255,255,255,.76); font-size:16px; line-height:1.72; margin:0 0 18px; }
.team-responsibilities { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--border-strong); border-bottom:1px solid var(--border-strong); }
.team-responsibilities article { padding:34px 30px; border-right:1px solid var(--border); }
.team-responsibilities article:last-child { border-right:0; }
.team-responsibilities h3 { font-family:var(--serif); color:var(--brand); font-weight:500; font-size:23px; line-height:1.25; margin:10px 0 15px; }
.team-responsibilities p { color:var(--muted); line-height:1.65; }
.principles-list { display:grid; grid-template-columns:.75fr 1.25fr; gap:80px; padding:88px 0; }
.principles-list h2 { font-size:clamp(34px,4vw,50px); margin-top:12px; }
.principles-list ol { list-style:none; padding:0; margin:0; border-top:1px solid var(--border-strong); }
.principles-list li { display:grid; grid-template-columns:46px 1fr; gap:18px; padding:22px 0; border-bottom:1px solid var(--border); }
.principles-list li > b { color:var(--brand-2); font-size:11px; }
.principles-list h3 { color:var(--brand); font-size:16px; }
.principles-list p { color:var(--muted); line-height:1.6; margin:6px 0 0; }
.team-contact { display:flex; align-items:center; justify-content:space-between; gap:50px; padding:52px 58px; background:#e7efe9; border-radius:14px; }
.team-contact h2 { font-size:clamp(30px,3.4vw,43px); margin:10px 0 12px; }
.team-contact p { color:var(--muted); max-width:67ch; line-height:1.65; }

/* Cierre y pie. */
.public-final-cta { width:min(var(--public-max), calc(100% - 40px)); margin:88px auto 0; padding:28px 34px;
  display:flex; align-items:center; justify-content:space-between; gap:35px; background:var(--brand); border-radius:12px; color:#fff; }
.public-final-cta h2 { color:#fff; font-size:30px; margin:6px 0 5px; }
.public-final-cta p { color:rgba(255,255,255,.7); margin:0; }
.public-footer { width:min(var(--public-max), calc(100% - 40px)); margin:0 auto; padding:60px 0 28px; }
.public-footer-grid { display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:54px; }
.public-footer-brand .site-brand { font-family:var(--serif); font-weight:500; font-size:22px; }
.public-footer-brand .site-brand img { width:28px; height:28px; }
.public-footer-brand p { color:var(--muted); max-width:29ch; line-height:1.6; }
.public-footer-col { display:flex; flex-direction:column; gap:8px; font-size:12.5px; }
.public-footer-col b { color:var(--brand); margin-bottom:5px; }
.public-footer-col a { color:var(--muted); }
.public-footer-col a:hover { color:var(--brand); }
.public-footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:45px; padding-top:20px;
  border-top:1px solid var(--border); color:var(--faint); font-size:11.5px; }

/* Cabeceras legales antiguas: alineadas con el nuevo sistema sin alterar el texto. */
.landing-body > .site-nav { width:min(var(--public-max,1200px), calc(100% - 40px)); max-width:none; min-height:76px;
  padding:0; border-bottom:1px solid rgba(20,70,59,.1); }
.legal-wrap { margin-top:44px; background:#fff; border:1px solid var(--border); border-radius:12px; padding:48px 56px; }

@media (max-width: 1040px) {
  .public-nav { gap:18px; }
  .marketing-hero-inner { grid-template-columns:1fr; padding:65px 0; }
  .marketing-hero-copy { max-width:720px; }
  .hero-operating-proof { max-width:850px; }
  .public-page-hero { gap:45px; }
}
@media (max-width: 1300px) and (min-width: 1041px) {
  .marketing-hero-inner { width:min(100% - 64px, 900px); grid-template-columns:1fr; padding:65px 0; }
  .marketing-hero-copy { max-width:720px; }
  .hero-operating-proof { max-width:850px; }
}
@media (max-width: 820px) {
  .public-header-inner { grid-template-columns:auto 1fr auto; gap:12px; }
  .public-nav { display:none; }
  .public-header .public-login { display:none; }
  .public-menu { display:block; }
  .public-header .site-actions { justify-self:end; }
  .marketing-hero-inner { grid-template-columns:1fr; min-height:auto; }
  .interactive-product-demo .hero-desk, .product-home-preview .hero-desk { grid-template-columns:112px 1fr; }
  .workflow-line, .moments-grid, .public-pricing-grid, .team-responsibilities { grid-template-columns:1fr 1fr; }
  .workflow-line li:nth-child(2), .moments-grid article:nth-child(2) { border-right:0; }
  .workflow-line li, .moments-grid article { padding-top:25px; padding-bottom:25px; border-bottom:1px solid var(--border); }
  .workflow-line li:nth-last-child(-n+2), .moments-grid article:nth-last-child(-n+2) { border-bottom:0; }
  .public-pricing-grid .recommended { order:-1; grid-column:1/-1; }
  .pilot-stories, .faq-preview, .public-page-hero, .companion-section, .compliance-section,
  .price-included, .pricing-faq, .team-manifesto, .principles-list { grid-template-columns:1fr; }
  .pilot-stories img { max-height:260px; }
  .process-rows article { grid-template-columns:42px 1fr; }
  .process-rows article > p { grid-column:2; }
  .product-moment-list article { grid-template-columns:1fr; gap:10px; }
  .faq-layout { grid-template-columns:1fr; gap:35px; }
  .faq-index { position:static; display:grid; grid-template-columns:1fr 1fr; }
  .faq-index b { grid-column:1/-1; }
  .public-footer-grid { grid-template-columns:1.3fr 1fr 1fr; }
  .public-footer-grid .public-footer-col:last-child { grid-column:2/4; }
  .billing-choice, .account-billing-choice { align-items:flex-start; }
}
@media (max-width: 580px) {
  .public-header-inner, .marketing-hero-inner, .public-page-hero, .public-section,
  .workflow-section, .moments-section, .pricing-preview, .faq-preview, .pilot-stories,
  .companion-section, .compliance-section, .price-included, .team-manifesto,
  .principles-list, .team-contact, .public-final-cta, .public-footer { width:min(100% - 28px, var(--public-max)); }
  .public-header .site-brand span { display:none; }
  .public-header .site-actions .btn { padding:8px 10px; font-size:11px; }
  .public-menu summary { font-size:11px; }
  .marketing-hero-copy h1 { font-size:46px; }
  .marketing-hero-copy h1 span:first-child { white-space:normal; }
  .marketing-hero-copy > p { font-size:15px; }
  .hero-desk, .interactive-product-demo .hero-desk, .product-home-preview .hero-desk { grid-template-columns:1fr; }
  .hero-desk-nav { flex-direction:row; overflow-x:auto; padding:10px; scrollbar-width:thin; }
  .demo-panel-brand, .demo-nav-section, .demo-nav-footer { display:none; }
  .interactive-product-demo .hero-desk-nav button, .product-home-preview .hero-desk-nav button { flex:0 0 auto; width:auto; padding:7px 9px; white-space:nowrap; }
  .demo-app-topbar { min-height:34px; }
  .demo-topbar-actions > span:nth-child(n+3) { display:none; }
  .hero-desk-main, .interactive-product-demo .hero-desk-main, .product-home-preview .hero-desk-main { min-height:0; padding:14px; }
  .demo-money-grid { grid-template-columns:1fr; }
  .demo-money-grid > div { padding:12px 4px; border-right:0; border-bottom:1px solid var(--border); }
  .demo-money-grid > div:last-child { border-bottom:0; }
  .demo-list > div { grid-template-columns:42px minmax(0,1fr); }
  .demo-list > div > :last-child { grid-column:2; justify-self:start; }
  .clients-list > div, .team-list > div { grid-template-columns:30px minmax(0,1fr); }
  .invoice-list > div, .document-list > div { grid-template-columns:minmax(0,1fr) auto; }
  .invoice-list > div > :last-child { grid-column:1/-1; }
  .desk-grid { grid-template-columns:1fr; }
  .demo-real-dashboard { max-height:520px; }
  .demo-real-dashboard .home-brief { grid-template-columns:1fr; }
  .demo-real-dashboard .home-brief-side { flex-direction:row; align-items:center; }
  .demo-real-dashboard .home-priority { grid-template-columns:1fr; }
  .demo-real-dashboard .home-priority .btn { width:100%; justify-content:center; }
  .demo-real-dashboard .home-metrics { grid-template-columns:1fr 1fr; }
  .demo-real-dashboard .home-metric:nth-child(3) { border-left:0; border-top:1px solid var(--border); }
  .demo-real-dashboard .home-metric:nth-child(4) { border-top:1px solid var(--border); }
  .demo-real-dashboard .home-main-grid, .demo-real-dashboard .home-lower-grid { grid-template-columns:1fr; }
  .demo-real-dashboard .money-summary { grid-template-columns:1fr 1fr; }
  .demo-real-dashboard .money-summary p { grid-column:1/-1; text-align:left; }
  .workflow-line, .moments-grid, .public-pricing-grid, .team-responsibilities { grid-template-columns:1fr; }
  .workflow-line li, .workflow-line li:nth-child(2), .moments-grid article, .moments-grid article:nth-child(2) { border-right:0; border-bottom:1px solid var(--border); }
  .workflow-line li:last-child, .moments-grid article:last-child { border-bottom:0; }
  .public-pricing-grid .recommended { grid-column:auto; }
  .public-section, .workflow-section, .moments-section, .pricing-preview { padding:68px 0; }
  .pilot-stories { padding:30px 24px; grid-template-columns:1fr; }
  .public-page-hero { grid-template-columns:1fr; gap:24px; padding:65px 0 50px; }
  .public-page-hero h1 { font-size:45px; }
  .product-thread { border-left:0; border-top:1px solid var(--border-strong); }
  .product-thread > div { grid-template-columns:1fr; padding-left:0; }
  .product-thread small { grid-row:auto; }
  .companion-section, .compliance-section, .price-included, .team-manifesto { padding:34px 24px; }
  .compliance-section dl, .price-included ul { grid-template-columns:1fr; }
  .compliance-section dl div, .price-included li { border-left:0; border-bottom:1px solid rgba(20,70,59,.16); }
  .pricing-faq { gap:35px; }
  .trial-banner { flex-direction:column; gap:4px; }
  .billing-choice, .account-billing-choice { flex-direction:column; gap:13px; }
  .billing-choice .billing-toggle, .account-billing-choice .billing-toggle { width:100%; }
  .billing-toggle button { flex:1; }
  .faq-index { grid-template-columns:1fr; }
  .team-contact, .public-final-cta { align-items:flex-start; flex-direction:column; padding:30px 24px; }
  .public-footer-grid { grid-template-columns:1fr 1fr; }
  .public-footer-brand { grid-column:1/-1; }
  .public-footer-grid .public-footer-col:last-child { grid-column:auto; }
  .public-footer-bottom { flex-direction:column; }
  .legal-wrap { margin-top:22px; padding:28px 20px; }
}

/* Alta y acceso: misma voz pública, formulario preciso y sin decoración gratuita. */
.public-auth-body { min-height:100vh; background:#f4f1ea; }
.auth-topbar { width:min(1160px, calc(100% - 40px)); min-height:76px; margin:0 auto; display:flex;
  align-items:center; justify-content:space-between; border-bottom:1px solid rgba(20,70,59,.1); }
.auth-topbar .site-brand { font-family:var(--serif); font-size:24px; font-weight:500; }
.auth-topbar .site-brand img { width:31px; height:31px; }
.auth-topbar > a:last-child { color:var(--brand); font-size:12.5px; font-weight:750; }
.public-auth-layout, .public-login-layout { width:min(1080px, calc(100% - 40px)); margin:0 auto; display:grid;
  grid-template-columns:1fr 480px; gap:80px; align-items:center; padding:64px 0 80px; }
.public-auth-story, .login-message { align-self:stretch; display:flex; flex-direction:column; justify-content:center;
  padding:52px; border-radius:14px; background:var(--brand); color:#fff; }
.public-auth-story h1, .login-message h1 { font-family:var(--serif); font-size:clamp(42px,5vw,62px); font-weight:500;
  line-height:1.04; letter-spacing:-.03em; margin:18px 0 20px; }
.public-auth-story > p, .login-message > p { color:rgba(255,255,255,.75); font-size:16px; line-height:1.7; }
.public-auth-story dl { margin:36px 0 0; border-top:1px solid rgba(255,255,255,.18); }
.public-auth-story dl div { padding:16px 0; border-bottom:1px solid rgba(255,255,255,.18); }
.public-auth-story dt { font-weight:750; }
.public-auth-story dd { color:rgba(255,255,255,.65); margin:3px 0 0; font-size:12.5px; }
.public-auth-panel { padding:38px; background:#fff; border:1px solid var(--border); border-radius:14px; box-shadow:0 14px 34px rgba(20,70,59,.06); }
.public-auth-panel h2 { font-family:var(--serif); color:var(--brand); font-size:38px; font-weight:500; margin:8px 0 7px; }
.auth-lead { color:var(--muted); margin:0 0 25px; }
.auth-progress { display:flex; align-items:center; gap:7px; margin-bottom:28px; color:var(--faint); font-size:10px; }
.auth-progress b { width:22px; height:22px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#e8ece8; color:#69766f; }
.auth-progress b:first-child { background:var(--brand); color:#fff; }
.auth-progress i { flex:1; height:1px; background:var(--border-strong); }
.public-auth-form { display:grid; gap:16px; }
.auth-google-btn { min-height:46px; display:flex; align-items:center; justify-content:center; width:100%; padding:11px 16px;
  border:1px solid var(--border-strong); border-radius:8px; color:var(--text); background:#fff; font-size:13px; font-weight:750; }
.auth-google-btn:hover { color:var(--brand); border-color:var(--brand-2); background:var(--surface-2); }
.auth-divider { display:flex; align-items:center; gap:10px; margin:17px 0; color:var(--faint); font-size:11px; text-align:center; }
.auth-divider::before, .auth-divider::after { content:""; flex:1; height:1px; background:var(--border); }
.public-auth-form > label:not(.auth-consent) { display:grid; gap:7px; color:var(--text); font-size:12px; font-weight:750; }
.public-auth-form .input, .public-auth-form select { min-height:46px; background:#fbfaf7; border-color:var(--border-strong); }
.public-auth-form .input:focus, .public-auth-form select:focus { background:#fff; border-color:var(--brand-2); box-shadow:0 0 0 3px rgba(46,139,116,.12); }
.auth-consent { display:flex; align-items:flex-start; gap:9px; color:var(--muted); font-size:11.5px; line-height:1.5; cursor:pointer; }
.auth-consent input { margin-top:3px; }
.auth-consent a, .login-links a, .auth-error a { color:var(--brand); text-decoration:underline; text-underline-offset:2px; }
.auth-error, .auth-success { padding:11px 13px; margin-bottom:17px; border-radius:8px; color:var(--red); background:var(--red-soft); font-size:12.5px; }
.auth-success { color:var(--green); background:var(--green-soft); }
.auth-safe { display:block; margin-top:16px; color:var(--faint); text-align:center; line-height:1.5; }
.public-login-layout { min-height:calc(100vh - 76px); grid-template-columns:1fr 430px; }
.login-message { min-height:490px; }
.login-links { display:flex; justify-content:space-between; gap:15px; margin-top:19px; font-size:11.5px; }
.public-auth-body .onboarding-center { min-height:calc(100vh - 76px); padding-top:36px; }
.public-auth-body .onboarding-card { border:1px solid var(--border); border-radius:14px; box-shadow:0 14px 34px rgba(20,70,59,.06); }
.public-auth-body .onboarding-card h1 { font-size:39px; letter-spacing:-.02em; }
.public-auth-body .onboarding-brand { display:none; }
.complete-progress b { background:var(--green-soft); color:var(--green); }
.complete-progress b:last-of-type { background:var(--brand); color:#fff; }
.connect-steps { list-style:none; padding:0; margin:0 0 22px; border-top:1px solid var(--border); }
.connect-steps li { display:grid; grid-template-columns:28px 1fr; gap:12px; align-items:start; padding:14px 0; border-bottom:1px solid var(--border); color:var(--muted); line-height:1.55; }
.connect-steps li b { width:24px; height:24px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--brand-soft); color:var(--brand); font-size:10px; }
.connect-code { margin:14px 0 20px; color:var(--muted); text-align:center; font-size:11.5px; }
.connect-code b { color:var(--brand); user-select:all; }
.connect-code span { display:block; margin-top:5px; color:var(--faint); }
.whatsapp-auth-layout .public-auth-panel form { margin-top:10px; }
.onboarding-operations-center { align-items:start; }
.onboarding-operations-card { max-width:880px; }
.onboarding-operations-form { display:grid; gap:14px; }
.onboarding-config-section { padding:22px; border:1px solid var(--border); border-radius:12px;
  background:var(--surface-2); }
.onboarding-config-heading { display:flex; gap:12px; align-items:flex-start; margin-bottom:17px; }
.onboarding-config-heading > span { width:26px; height:26px; flex:0 0 26px; display:grid;
  place-items:center; border-radius:8px; color:var(--brand); background:var(--brand-soft);
  font-size:11px; font-weight:800; }
.onboarding-config-heading h2 { font-family:var(--serif); color:var(--brand); font-size:22px;
  font-weight:500; margin:0 0 3px; }
.onboarding-config-heading p { color:var(--muted); font-size:11.5px; margin:0; }
.onboarding-fields { gap:12px; }
.onboarding-fields label, .onboarding-field-full, .onboarding-config-section > label:not(.onboarding-switch-row) {
  display:grid; gap:6px; color:var(--text); font-size:11.5px; font-weight:750; }
.onboarding-field-full { margin-top:12px; }
.onboarding-config-section .input, .onboarding-config-section select { min-height:42px; background:var(--surface); }
.onboarding-helper { margin:12px 0 0; color:var(--muted); font-size:11px; line-height:1.5; }
.onboarding-switch-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.onboarding-switch-row { display:flex; gap:10px; align-items:flex-start; padding:12px;
  border:1px solid var(--border); border-radius:10px; background:var(--surface); cursor:pointer; }
.onboarding-switch-row input { margin-top:3px; accent-color:var(--brand-2); }
.onboarding-switch-row span { display:flex; flex-direction:column; gap:3px; }
.onboarding-switch-row b { color:var(--text); font-size:12px; }
.onboarding-switch-row small { color:var(--muted); font-size:10.5px; line-height:1.4; }
.onboarding-reminder-days { display:flex; align-items:center; gap:8px; margin:10px 0 0 34px;
  color:var(--muted); font-size:11px; }
.onboarding-reminder-days .input { width:92px; min-height:36px; }
.onboarding-close-hour { max-width:220px; margin-top:12px; }
.onboarding-submit-bar { position:sticky; bottom:12px; z-index:4; display:flex; align-items:center;
  justify-content:space-between; gap:18px; padding:14px 16px; border:1px solid var(--border-strong);
  border-radius:12px; background:var(--surface); box-shadow:var(--shadow-md); }
.onboarding-submit-bar > div { display:flex; flex-direction:column; gap:2px; }
.onboarding-submit-bar b { color:var(--brand); font-size:12px; }
.onboarding-submit-bar span { color:var(--muted); font-size:10.5px; }
.subscription-ready { display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:22px; border:1px solid var(--border); border-radius:14px; background:var(--brand-soft); }
.subscription-ready h2 { font-family:var(--serif); color:var(--brand); font-size:27px;
  font-weight:500; margin:5px 0; }
.subscription-ready p { color:var(--muted); margin:0; }
.subscription-ready-checks { display:grid; gap:6px; min-width:185px; color:var(--brand); font-size:11.5px; }
.plan { position:relative; }
.plan.selected-plan { border-color:var(--brand-2); box-shadow:0 0 0 2px rgba(46,139,116,.1); }
.plan-choice-badge { position:absolute; top:12px; right:12px; padding:4px 7px; border-radius:6px;
  color:var(--brand); background:var(--brand-soft); font-size:9px; font-weight:800;
  letter-spacing:.05em; text-transform:uppercase; }
.subscription-success { border-color:var(--green); background:var(--green-soft); }
.subscription-payment-note { margin:16px 0 0; color:var(--muted); font-size:11px; text-align:center; }

@media (max-width: 820px) {
  .public-auth-layout, .public-login-layout { grid-template-columns:1fr; gap:22px; padding-top:28px; }
  .public-auth-story, .login-message { min-height:auto; padding:35px; }
  .public-auth-story dl { display:grid; grid-template-columns:repeat(3,1fr); }
  .public-auth-story dl div { padding:14px 10px; border-right:1px solid rgba(255,255,255,.18); }
  .onboarding-switch-grid { grid-template-columns:1fr; }
  .subscription-ready { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 520px) {
  .auth-topbar, .public-auth-layout, .public-login-layout { width:calc(100% - 28px); }
  .public-auth-story, .login-message { padding:28px 22px; }
  .public-auth-story h1, .login-message h1 { font-size:39px; }
  .public-auth-story dl { grid-template-columns:1fr; }
  .public-auth-story dl div { border-right:0; }
  .public-auth-panel { padding:28px 20px; }
  .auth-progress span { display:none; }
  .login-links { flex-direction:column; }
  .signup-intent-grid, .signup-plan-row { grid-template-columns:1fr; }
  .onboarding-config-section { padding:17px 15px; }
  .onboarding-submit-bar { align-items:stretch; flex-direction:column; bottom:6px; }
  .onboarding-submit-bar .btn { width:100%; }
}

/* ==========================================================================
   Rendimiento del equipo (quién factura, quién completa) + controles finos
   que elevan todas las pantallas: selects compactos en cabeceras de tarjeta.
   ========================================================================== */
.select-inline { width:auto; min-width:150px; padding:6px 30px 6px 10px;
  font-size:12.5px; font-weight:600; color:var(--muted); background-color:#fff; }
.perf-grid { gap:22px; }
.perf-sub { font-size:12px; font-weight:700; text-transform:uppercase;
  letter-spacing:.05em; color:var(--faint); margin-bottom:12px;
  display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.perf-sub .hint { font-size:11.5px; font-weight:500; text-transform:none;
  letter-spacing:0; color:var(--faint); }
@media (max-width:720px) { .perf-grid { gap:16px; } }

/* ==========================================================================
   "+ Crear" global (topbar) y Pulso del negocio (resumen) — capa Holded-like.
   ========================================================================== */
.quick-create { position:relative; }
.qc-btn { gap:6px; }
.qc-btn svg { width:14px; height:14px; }
.qc-menu { display:none; position:absolute; right:0; top:calc(100% + 8px); z-index:80;
  min-width:210px; background:var(--surface); border:1px solid var(--border);
  border-radius:12px; box-shadow:0 12px 34px rgba(18,28,23,.14); padding:6px; }
.quick-create.open .qc-menu { display:block; animation:fade .1s ease; }
.qc-menu a { display:block; padding:9px 12px; border-radius:8px; font-size:13.5px;
  font-weight:600; color:var(--text); }
.qc-menu a:hover { background:var(--brand-soft); color:var(--brand-ink); }
@media (max-width:560px) { .qc-btn span-label { display:none; } .qc-menu { right:-8px; } }

.pulse-card { display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:16px 20px; transition:border-color .15s ease, box-shadow .15s ease; }
.pulse-card:hover { border-color:var(--brand-2); box-shadow:0 6px 20px rgba(20,70,59,.08); }
.pulse-main { display:flex; align-items:center; gap:13px; min-width:0; }
.pulse-dot { flex:0 0 14px; width:14px; height:14px; border-radius:50%;
  background:var(--border-strong); box-shadow:0 0 0 4px var(--surface-2); }
.pulse-dot.pu-good { background:var(--green); box-shadow:0 0 0 4px var(--green-soft);
  animation:pulse-beat 2.2s ease infinite; }
.pulse-dot.pu-ok { background:var(--amber); box-shadow:0 0 0 4px var(--amber-soft); }
.pulse-dot.pu-bad { background:var(--red); box-shadow:0 0 0 4px var(--red-soft);
  animation:pulse-beat 1.1s ease infinite; }
@keyframes pulse-beat { 0%,100% { transform:scale(1); } 50% { transform:scale(1.18); } }
@media (prefers-reduced-motion: reduce) { .pulse-dot { animation:none !important; } }
.pulse-state { font-size:14.5px; font-weight:700; letter-spacing:-.01em; }
.pulse-text { font-size:12.5px; color:var(--muted); margin-top:2px; }
.pulse-chips { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.pulse-chip { display:flex; flex-direction:column; gap:1px; min-width:86px;
  padding:7px 11px; border-radius:10px; border:1px solid var(--border);
  background:var(--surface-2); }
.pulse-chip small { font-size:10.5px; text-transform:uppercase; letter-spacing:.05em;
  color:var(--faint); font-weight:700; }
.pulse-chip b { font-size:14px; font-variant-numeric:tabular-nums; }
.pulse-chip.pu-good { background:var(--green-soft); border-color:transparent; }
.pulse-chip.pu-good b { color:var(--green); }
.pulse-chip.pu-ok { background:var(--amber-soft); border-color:transparent; }
.pulse-chip.pu-ok b { color:var(--amber); }
.pulse-chip.pu-bad { background:var(--red-soft); border-color:transparent; }
.pulse-chip.pu-bad b { color:var(--red); }
@media (max-width:760px) {
  .pulse-card { flex-direction:column; align-items:stretch; }
  .pulse-chips { justify-content:flex-start; }
  .pulse-chip { flex:1 1 40%; min-width:0; }
}

/* ==========================================================================
   Móvil primero: barra inferior de navegación, hoja "Crear" y objetivos
   táctiles. La mayoría usará Noesis desde el teléfono.
   ========================================================================== */
.bottom-nav { display:none; }
@media (max-width:820px) {
  .bottom-nav { position:fixed; left:0; right:0; bottom:0; z-index:55;
    display:grid; grid-template-columns:1fr 1fr auto 1fr 1fr; align-items:center;
    gap:2px; background:rgba(255,255,255,.96); backdrop-filter:blur(12px);
    border-top:1px solid var(--border);
    padding:6px 10px calc(7px + env(safe-area-inset-bottom)); }
  .bn-item { display:flex; flex-direction:column; align-items:center; gap:3px;
    padding:4px 0 2px; font-size:10.5px; font-weight:650; color:var(--faint);
    border-radius:10px; border:0; background:transparent; font-family:inherit; cursor:pointer; }
  .bn-item .ic { width:22px; height:22px; display:inline-flex; }
  .bn-item .ic svg { width:22px; height:22px; }
  .bn-item.active { color:var(--brand); }
  .bn-create { width:50px; height:50px; margin:-22px 8px 0; border:none;
    border-radius:17px; background:var(--brand); color:#fff; cursor:pointer;
    display:inline-flex; align-items:center; justify-content:center;
    box-shadow:0 10px 24px rgba(16,50,41,.32); }
  .bn-create svg { width:24px; height:24px; }
  .bn-create:active { transform:scale(.94); }
  /* Deja sitio a la barra y quita el "+ Crear" del topbar (ya está abajo). */
  .content { padding-bottom:96px; }
  .topbar .quick-create { display:none; }
  .chat-wrap { height:auto; min-height:calc(100vh - 60px - 78px); }
  .chat-wrap > .chips { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none;
    margin-right:0; padding-right:0; max-width:100%; }
  .chat-wrap > .chips::-webkit-scrollbar { display:none; }
  .chat-wrap > .chips .chip { flex:0 0 auto; }
  .chat-log { flex:0 0 auto; min-height:210px; max-height:34vh; padding-bottom:12px; }
  .chat-input { position:static; margin:12px 0 18px; }

  /* Objetivos táctiles cómodos en toda la app. */
  .btn { padding:10px 16px; }
  .btn.sm { padding:8px 12px; font-size:13px; }
  .iconbtn { padding:8px 9px; }
  tbody td { padding:14px 12px; }
  .lrow { padding:13px 0; }
  .input, select, textarea { font-size:16px; } /* evita el zoom de iOS */
}

@media (max-width:600px) {
  .companion { top:auto; width:100%; height:min(82vh, 720px); border-left:0;
    border-top:1px solid var(--border); border-radius:20px 20px 0 0;
    transform:translateY(102%); }
  body.companion-open .companion { transform:none; }
  .companion-head { border-radius:20px 20px 0 0; padding-top:13px; }
  .companion-context { grid-template-columns:auto 1fr; }
  .companion-context button { grid-column:1 / -1; text-align:left; padding:3px 0 0; }
  .companion-input { margin-bottom:calc(8px + env(safe-area-inset-bottom)); }
}

/* Hoja inferior "Crear" (bottom sheet). */
.sheet-overlay { align-items:flex-end; padding:0; }
.sheet { width:100%; max-width:none; border-radius:20px 20px 0 0;
  padding:8px 14px calc(16px + env(safe-area-inset-bottom));
  animation:sheet-up .18s ease; }
@keyframes sheet-up { from { transform:translateY(40px); opacity:.4; }
  to { transform:none; opacity:1; } }
.sheet-grip { width:40px; height:4px; border-radius:999px;
  background:var(--border-strong); margin:6px auto 12px; }
.sheet-title { font-size:15px; font-weight:750; letter-spacing:-.01em;
  padding:0 6px 10px; }
.sheet-item { display:block; padding:13px 12px; border-radius:12px; }
.sheet-item b { display:block; font-size:15px; }
.sheet-item small { display:block; color:var(--faint); font-size:12px;
  margin-top:1px; }
.sheet-item:active { background:var(--brand-soft); }
@media (min-width:821px) { .sheet-overlay { display:none; } }

/* Cabeceras de departamento del centro de mando (fundador). */
.dept-head { display:flex; gap:14px; align-items:flex-start; margin:30px 0 12px;
  padding-top:18px; border-top:2px solid var(--border-strong); }
.dept-ic { flex:0 0 40px; width:40px; height:40px; display:grid; place-items:center;
  font-size:20px; background:var(--brand-soft); border-radius:12px; }
.dept-head h2 { font-size:17px; font-weight:750; letter-spacing:-.01em; }
.dept-head p { margin:3px 0 0; color:var(--muted); font-size:13px; line-height:1.5;
  max-width:78ch; }
.fin-grid { grid-template-columns:repeat(4,1fr); margin:0 0 14px; }
@media (max-width:1000px) { .fin-grid { grid-template-columns:repeat(2,1fr); } }

/* ==========================================================================
   Buscador global (Ctrl+K) y pestañas de sección (Tesorería / Facturación).
   ========================================================================== */
.search-btn { display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  font-family:inherit; font-size:12.5px; font-weight:600; color:var(--faint);
  padding:7px 11px; border:1px solid var(--border-strong); border-radius:10px;
  background:var(--surface); transition:border-color .12s, color .12s; }
.search-btn:hover { border-color:var(--brand); color:var(--brand); }
.search-btn svg { width:15px; height:15px; }
.search-btn kbd { font-family:inherit; font-size:10.5px; font-weight:700;
  border:1px solid var(--border); border-bottom-width:2px; border-radius:5px;
  padding:1px 5px; color:var(--faint); }
@media (max-width:820px) {
  .search-btn { padding:8px 9px; }
  .search-btn .search-hint, .search-btn kbd { display:none; }
}

.search-overlay { align-items:flex-start; padding-top:min(14vh, 120px); }
.search-modal { max-width:560px; }
.search-box { display:flex; align-items:center; gap:10px; padding:13px 16px;
  border-bottom:1px solid var(--border); }
.search-box svg { flex:0 0 18px; width:18px; height:18px; color:var(--faint); }
.search-box .input { border:none; padding:4px 0; font-size:15.5px; }
.search-box .input:focus { box-shadow:none; }
.search-box kbd { flex:0 0 auto; font-size:10.5px; font-weight:700;
  border:1px solid var(--border); border-bottom-width:2px; border-radius:5px;
  padding:2px 6px; color:var(--faint); }
.search-results { max-height:min(52vh, 420px); overflow-y:auto; padding:8px; }
.gs-group { font-size:10.5px; font-weight:750; text-transform:uppercase;
  letter-spacing:.06em; color:var(--faint); padding:10px 10px 5px; }
.gs-row { display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:9px 10px; border-radius:9px; }
.gs-row:hover { background:var(--brand-soft); }
.gs-main { min-width:0; }
.gs-main b { display:block; font-size:13.5px; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
.gs-main small { display:block; color:var(--faint); font-size:12px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gs-side { flex:0 0 auto; font-size:12.5px; font-variant-numeric:tabular-nums;
  color:var(--muted); display:inline-flex; align-items:center; gap:7px; }

.subnav { display:flex; gap:4px; padding:10px 28px 0; max-width:1200px;
  margin:0 auto; width:100%; overflow-x:auto; scrollbar-width:none; }
.subnav::-webkit-scrollbar { display:none; }
.subnav a { flex:0 0 auto; padding:7px 14px; border-radius:999px;
  font-size:13px; font-weight:650; color:var(--muted);
  border:1px solid transparent; }
.subnav a:hover { color:var(--brand); }
.subnav a.active { background:var(--surface); border-color:var(--border-strong);
  color:var(--brand); box-shadow:var(--shadow-sm); }
@media (max-width:820px) { .subnav { padding:10px 18px 0; } }

/* ============ Línea de parte de Noesis (cabecera de cada pantalla) ============
   Noesis te lee la pantalla en su voz (serif). Discreta pero siempre presente:
   "la mente" está en todas las páginas, no solo en el Home. */
.readonly-banner { margin:14px clamp(16px,3vw,34px) 0; padding:11px 13px;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  border:1px solid rgba(177,116,20,.25); border-radius:14px; background:#fff8e8; }
.readonly-banner > div { display:flex; flex-direction:column; gap:2px; min-width:0; }
.readonly-banner b { color:var(--text); font-size:13px; }
.readonly-banner span { color:var(--muted); font-size:12px; line-height:1.35; }
.subscription-notice { padding:14px 16px; border:1px solid rgba(177,116,20,.25);
  border-radius:14px; background:#fff8e8; color:var(--text); }
.subscription-notice b { display:block; margin-bottom:3px; }
.bn-create.locked { text-decoration:none; font-size:20px; font-weight:800; }
.page-note {
  display: flex; align-items: center; gap: 12px;
  background: var(--brand-soft);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 12px 16px;
  margin-bottom: 16px;
}
.page-note .pn-mark {
  width: 30px; height: 30px; border-radius: 9px; background: var(--brand);
  display: grid; place-items: center; flex: none;
}
.page-note .pn-mark img { width: 18px; height: 18px; }
.page-note .pn-body { flex: 1; min-width: 0; }
.page-note p {
  margin: 0; font-family: var(--serif); font-size: 15px; line-height: 1.45;
  color: var(--brand-ink);
}
/* Las cifras clave, presentadas por Noesis dentro de su parte (no una pared
   de KPIs muda): chips compactos bajo la lectura. */
.pn-stats { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 9px; }
.pn-chip { display: inline-flex; flex-direction: column; gap: 0;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 9px; padding: 5px 11px; }
.pn-chip small { font-size: 10.5px; color: var(--faint);
  text-transform: uppercase; letter-spacing: .04em; }
.pn-chip b { font-size: 13.5px; color: var(--text); font-weight: 750; }
.pn-chip.good b { color: var(--green); }
.pn-chip.warn b { color: var(--amber); }
.pn-chip.bad b { color: var(--red); }
.pn-focus { margin-top:9px; padding-top:9px; border-top:1px solid rgba(20,70,59,.1);
  display:flex; flex-wrap:wrap; gap:4px 8px; font-size:12px; line-height:1.4; }
.pn-focus b { color:var(--brand-ink); }
.pn-focus span { color:var(--muted); }
.pn-ask { flex:none; border:0; background:transparent; color:var(--brand); font-size:12px;
  font-weight:750; cursor:pointer; padding:7px 4px; }
@media (max-width: 600px) {
  .readonly-banner { margin:10px 12px 0; align-items:flex-start; }
  .readonly-banner .btn { flex:none; }
  .page-note { align-items:flex-start; flex-wrap:wrap; }
  .page-note p { font-size:14px; }
  .page-note .pn-body { flex: 1 1 calc(100% - 48px); }
  .pn-ask { margin-left:42px; padding-top:0; }
}

/* ===================== El parte de Noesis (Home) =====================
   "La app no es un tablero que lees; es un parte que recibes." Noesis, como
   figura con carácter, te habla en primera persona (serif = su voz). Ver
   docs/design/DESIGN.md. */
.parte {
  background: linear-gradient(180deg, var(--brand-soft), var(--surface) 78%);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 22px 24px 20px;
  margin-bottom: 18px;
  box-shadow: var(--shadow-sm);
}
.parte-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.parte-who { display: flex; align-items: center; gap: 12px; }
.parte-mark { width: 40px; height: 40px; border-radius: 12px; background: var(--brand);
  display: grid; place-items: center; flex: none; }
.parte-mark img { width: 24px; height: 24px; }
.parte-hello { font-family: var(--serif); font-size: 20px; font-weight: 600;
  color: var(--brand-ink); letter-spacing: -.01em; }
.parte-date { font-size: 12.5px; color: var(--muted); text-transform: capitalize; margin-top: 1px; }
.parte-tools { display: flex; gap: 8px; align-items: center; }
.pchip { width: 34px; height: 34px; border-radius: 10px; border: 1px solid var(--border);
  background: var(--surface); color: var(--muted); display: grid; place-items: center; cursor: pointer; }
.pchip svg { width: 16px; height: 16px; }
.pchip:hover { color: var(--brand); border-color: var(--border-strong); }

.parte-lead { font-family: var(--serif); font-size: 19px; line-height: 1.5;
  color: var(--text); margin: 16px 2px 4px; max-width: 62ch; }

.parte-items { list-style: none; margin: 12px 0 4px; padding: 0;
  display: flex; flex-direction: column; gap: 8px; }
.parte-item { display: flex; align-items: center; gap: 14px; justify-content: space-between;
  background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; }
.pi-text { min-width: 0; }
.pi-do { font-weight: 600; font-size: 14.5px; color: var(--text); }
.pi-why { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.parte-item .btn { flex: none; }

.parte-money { display: flex; gap: 10px; flex-wrap: wrap; margin: 14px 0 2px; }
.parte-money .pm { display: flex; flex-direction: column; gap: 1px;
  background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 8px 14px; }
.parte-money .pm small { font-size: 11px; color: var(--faint);
  text-transform: uppercase; letter-spacing: .04em; }
.parte-money .pm b { font-size: 16px; color: var(--text); font-weight: 700; }

.parte-cta { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }

@media (max-width: 600px) {
  .parte { padding: 18px 16px; }
  .parte-hello { font-size: 18px; }
  .parte-lead { font-size: 17px; }
  .parte-item { flex-direction: column; align-items: stretch; gap: 10px; }
  .parte-item .btn { width: 100%; }
}

/* ============ Listas densas de objeto (Facturas y sucesivas) ============
   El objeto protagonista en pocas columnas: quién+qué, cuánto, estado, acción.
   El detalle fiscal (base/IVA/IRPF) vive en el tooltip del total y en el PDF. */
.fx-main { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.fx-table td { vertical-align: top; }
.fx-table .table-actions { white-space: nowrap; }
@media (max-width: 700px) {
  .fx-table .table-actions { white-space: normal; }
  .fx-table .table-actions .btn { margin: 2px 0; }
}

/* ===========================================================================
   Dirección visual MVP: Noesis como parte diario, no como panel financiero.
   Esta capa unifica navegación, jerarquía y Home sin borrar profundidad.
   ========================================================================== */
:root {
  --bg: #f3f0e7;
  --surface-2: #f8f6ef;
  --sidebar-w: 222px;
  --radius: 15px;
  --shadow-sm: 0 1px 2px rgba(35, 52, 44, .035);
}
body { background: var(--bg); }
.sidebar { background: #123e34; }
.sidebar .brand { padding: 20px 20px 14px; font-family: var(--serif); font-size: 22px; font-weight: 600; }
.sidebar .brand .mark { width: 31px; height: 31px; border-radius: 9px; }
.sidebar .section { padding: 6px 11px; }
.sidebar .section-label { color: #789087; padding: 16px 11px 5px; }
.nav-item { min-height: 39px; padding: 9px 11px; color: #b6c9c1; }
.nav-item.active { background: #f3f0e7; color: #123e34; font-weight: 700; }
.nav-item:hover { background: rgba(255,255,255,.08); }
.nav-item.active:hover { background: #fff; }
.topbar { height: 66px; padding: 0 30px; background: rgba(243,240,231,.9); }
.topbar-actions { display:flex; align-items:center; gap:9px; }
.integration-link { font-size: 12px; font-weight: 650; color: var(--brand); padding: 5px 9px; border-left: 1px solid var(--border-strong); }
.content { max-width: 1280px; padding: 30px 34px 48px; }
.nav-overlay { border: 0; padding: 0; }
.btn, .nav-item, .home-panel a, .home-metric { transition: background .16s, border-color .16s, color .16s, transform .16s; }
:focus-visible { outline: 3px solid rgba(46,139,116,.3); outline-offset: 2px; }

.home-v2 { display:flex; flex-direction:column; gap:16px; }
.home-brief { background:#e7eee6; border:1px solid #d7e1d7; border-radius:20px; padding:25px 27px;
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:26px; }
.home-brief-copy { min-width:0; }
.home-eyebrow { display:flex; align-items:center; gap:8px; color:var(--brand); font-size:11px;
  text-transform:uppercase; letter-spacing:.075em; font-weight:800; }
.home-eyebrow img { width:21px; height:21px; }
.home-brief h1 { font-family:var(--serif); color:var(--brand-ink); font-size:29px; line-height:1.18;
  font-weight:550; letter-spacing:-.02em; margin-top:9px; }
.home-brief > .home-brief-copy > p { color:#40594f; font-family:var(--serif); font-size:17px; line-height:1.45;
  margin:6px 0 16px; max-width:70ch; }
.home-brief-side { display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; gap:20px;
  color:var(--muted); text-transform:capitalize; font-size:12px; white-space:nowrap; }
.home-brief-side a { color:var(--brand); font-weight:750; text-transform:none; }
.home-priority { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:13px;
  background:rgba(255,255,255,.72); border:1px solid rgba(20,70,59,.12); border-radius:13px; padding:11px 12px; }
.priority-label { color:var(--brand); background:#dce9df; border-radius:999px; padding:4px 9px; font-size:10px;
  text-transform:uppercase; letter-spacing:.055em; font-weight:800; white-space:nowrap; }
.home-priority strong, .home-priority small { display:block; }
.home-priority strong { font-size:13.5px; }
.home-priority small { color:var(--muted); font-size:12px; margin-top:1px; }
.home-priority.is-clear .priority-label { color:var(--green); background:var(--green-soft); }

.home-setup { display:grid; grid-template-columns:auto minmax(130px,1fr) auto; align-items:center; gap:18px;
  background:#fff; border:1px solid var(--border); border-radius:13px; padding:11px 15px; }
.home-setup span, .home-setup strong { display:block; }
.home-setup span { color:var(--faint); font-size:10px; text-transform:uppercase; letter-spacing:.06em; font-weight:750; }
.home-setup strong { font-size:12.5px; margin-top:1px; }
.home-setup-track { height:6px; border-radius:999px; background:var(--border); overflow:hidden; }
.home-setup-track i { display:block; height:100%; background:var(--brand-2); border-radius:999px; }
.home-setup > a { color:var(--brand); font-weight:700; font-size:12px; }

.home-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); background:#fff; border:1px solid var(--border);
  border-radius:15px; overflow:hidden; }
.home-metric { min-width:0; padding:16px 18px; border-left:1px solid var(--border); }
.home-metric:first-child { border-left:0; }
.home-metric:hover { background:var(--surface-2); }
.home-metric span, .home-metric small, .home-metric strong { display:block; }
.home-metric span { font-size:11.5px; color:var(--muted); }
.home-metric strong { font-size:23px; color:var(--text); letter-spacing:-.025em; margin-top:5px; font-variant-numeric:tabular-nums; }
.home-metric small { color:var(--faint); font-size:11px; margin-top:2px; }

.home-main-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:16px; }
.home-lower-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:16px; }
.home-panel { min-width:0; background:#fff; border:1px solid var(--border); border-radius:15px; overflow:hidden; }
.home-panel > header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:17px 19px 13px; }
.home-panel > header h2 { font-family:var(--serif); font-size:19px; font-weight:600; color:var(--brand-ink); margin-top:1px; }
.home-panel > header > a { color:var(--brand); font-size:11.5px; font-weight:750; margin-top:5px; }
.panel-kicker { display:block; color:var(--faint); font-size:9.5px; text-transform:uppercase; letter-spacing:.075em; font-weight:800; }
.home-panel-body { padding:0 19px 17px; }
.home-list-row, .work-row, .pending-row { display:flex; align-items:center; gap:12px; border-top:1px solid var(--border); padding:12px 0; }
.home-list-row:hover, .work-row:hover, .pending-row:hover { color:var(--brand); }
.home-row-time { flex:0 0 48px; color:var(--brand); font-weight:750; font-variant-numeric:tabular-nums; }
.home-row-copy { flex:1; min-width:0; }
.home-row-copy strong, .home-row-copy small, .work-row strong, .work-row small, .pending-row strong, .pending-row small { display:block; }
.home-row-copy strong, .work-row strong, .pending-row strong { font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-row-copy small, .work-row small, .pending-row small { color:var(--muted); font-size:11.5px; margin-top:2px; }
.home-row-state { color:var(--brand-2); font-size:10px; font-weight:750; text-transform:uppercase; }
.work-row { align-items:flex-start; }
.work-row > span:nth-child(2) { flex:1; min-width:0; }
.work-row > b { color:var(--brand); font-size:11px; margin-top:2px; }
.work-status { width:8px; height:8px; border-radius:50%; background:#b6c3bd; margin-top:5px; flex:0 0 8px; }
.work-status.active { background:var(--brand-2); box-shadow:0 0 0 4px var(--brand-soft); }
.pending-row { justify-content:space-between; }
.pending-row > span { min-width:0; }
.pending-row > span:last-child { text-align:right; flex:0 0 auto; }
.pending-row .late { color:var(--red); }
.home-empty { border-top:1px solid var(--border); padding:18px 0 3px; }
.home-empty strong { font-family:var(--serif); color:var(--brand-ink); font-size:16px; }
.home-empty p { color:var(--muted); font-size:12px; margin:4px 0 12px; }
.money-summary { display:grid; grid-template-columns:auto auto 1fr; gap:24px; align-items:end; padding:0 19px 5px; }
.money-summary span, .money-summary strong { display:block; }
.money-summary span { color:var(--faint); font-size:10px; text-transform:uppercase; letter-spacing:.06em; }
.money-summary strong { font-size:20px; margin-top:3px; font-variant-numeric:tabular-nums; }
.money-summary p { color:var(--muted); font-size:12px; margin:0; text-align:right; }
.home-chart { height:135px; padding:8px 14px 14px; }

@media (max-width:1050px) {
  .home-main-grid, .home-lower-grid { grid-template-columns:1fr; }
  .home-metrics { grid-template-columns:repeat(2,1fr); }
  .home-metric:nth-child(3) { border-left:0; border-top:1px solid var(--border); }
  .home-metric:nth-child(4) { border-top:1px solid var(--border); }
}
@media (max-width:820px) {
  .topbar { padding:0 16px; }
  .content { padding:20px 16px 92px; }
  .integration-link, .search-hint, .search-btn kbd { display:none; }
  .nav-overlay { background:rgba(8,20,16,.45); }
}
@media (max-width:620px) {
  .home-brief { grid-template-columns:1fr; padding:20px 17px; gap:10px; }
  .home-brief h1 { font-size:25px; }
  .home-brief > .home-brief-copy > p { font-size:15.5px; }
  .home-brief-side { flex-direction:row; align-items:center; }
  .home-priority { grid-template-columns:1fr; }
  .home-priority .btn { width:100%; justify-content:center; }
  .home-setup { grid-template-columns:1fr; gap:8px; }
  .home-metrics { grid-template-columns:1fr 1fr; }
  .home-metric { padding:14px; }
  .home-metric strong { font-size:20px; }
  .money-summary { grid-template-columns:1fr 1fr; gap:12px; }
  .money-summary p { grid-column:1 / -1; text-align:left; }
  .wa-pill { display:none; }
}

.project-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) minmax(240px,1.35fr);
  background:#fff; border:1px solid var(--border); border-radius:15px; overflow:hidden; margin-bottom:16px; }
.project-summary > div { padding:17px 18px; border-left:1px solid var(--border); }
.project-summary > div:first-child { border-left:0; }
.project-summary span, .project-summary strong, .project-summary small { display:block; }
.project-summary span { color:var(--muted); font-size:11px; }
.project-summary strong { font-size:23px; margin-top:5px; letter-spacing:-.02em; }
.project-summary small { color:var(--faint); font-size:11px; margin-top:2px; }
.project-summary-reading { background:var(--brand-soft); }
.project-summary-reading span { color:var(--brand); text-transform:uppercase; letter-spacing:.06em; font-size:9.5px; font-weight:800; }
.project-summary-reading p { color:var(--brand-ink); font-family:var(--serif); line-height:1.45; margin:7px 0 0; font-size:14px; }
.project-list-panel > header { border-bottom:1px solid var(--border); }
.project-list-panel > header select { width:auto; min-width:120px; padding:6px 28px 6px 9px; font-size:12px; }
.project-list { padding:0 18px 10px; }
.project-row { width:100%; display:grid; grid-template-columns:minmax(210px,1.5fr) minmax(140px,.8fr) repeat(3,minmax(85px,.55fr)) auto;
  align-items:center; gap:16px; text-align:left; font:inherit; color:inherit; background:none; border:0; border-top:1px solid var(--border); padding:15px 1px; cursor:pointer; }
.project-row:first-child { border-top:0; }
.project-row:hover { background:var(--surface-2); box-shadow:0 0 0 8px var(--surface-2); }
.project-row-main, .project-row > span { min-width:0; }
.project-row b, .project-row small { display:block; }
.project-row-main > b { font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.project-row small { color:var(--muted); font-size:10.5px; margin-bottom:2px; }
.project-row-progress i { display:block; height:5px; background:var(--border); border-radius:99px; overflow:hidden; margin-bottom:5px; }
.project-row-progress i b { display:block; height:100%; background:var(--brand-2); border-radius:99px; }
.project-margin.negative b { color:var(--red); }
.project-empty { text-align:center; padding:50px 20px 56px; }
.project-empty img { width:36px; height:36px; }
.project-empty h3 { font-family:var(--serif); color:var(--brand-ink); font-size:20px; margin:10px 0 4px; }
.project-empty p { max-width:48ch; margin:0 auto 17px; color:var(--muted); font-size:13px; }
@media (max-width:1000px) { .project-summary { grid-template-columns:repeat(3,1fr); }
  .project-summary-reading { grid-column:1/-1; border-left:0!important; border-top:1px solid var(--border); } }
@media (max-width:620px) { .project-summary { grid-template-columns:1fr 1fr; }
  .project-summary > div:nth-child(3) { border-left:0; border-top:1px solid var(--border); }
  .project-summary > div:nth-child(4) { border-top:1px solid var(--border); }
  .project-summary-reading { grid-column:1/-1; } }

#project-detail[hidden], #projects-index[hidden] { display:none; }
.project-back { border:0; background:none; color:var(--brand); font:inherit; font-size:12px; font-weight:750; padding:0; margin-bottom:16px; cursor:pointer; }
.project-detail-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.project-detail-head h1 { font-family:var(--serif); color:var(--brand-ink); font-size:28px; font-weight:600; }
.project-detail-head p { color:var(--muted); margin:5px 0 0; }
.project-detail-actions { display:flex; gap:8px; align-items:center; }
.project-detail-actions select { width:auto; min-width:130px; }
.project-progress { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:14px; margin:18px 0 14px; color:var(--muted); font-size:12px; }
.project-progress > div { height:7px; background:var(--border); overflow:hidden; border-radius:999px; }
.project-progress i { display:block; height:100%; background:var(--brand-2); border-radius:999px; }
.project-detail-summary { display:grid; grid-template-columns:repeat(4,1fr); background:#fff; border:1px solid var(--border); border-radius:15px; overflow:hidden; }
.project-detail-summary > div { padding:17px 18px; border-left:1px solid var(--border); }
.project-detail-summary > div:first-child { border-left:0; }
.project-detail-summary span, .project-detail-summary strong, .project-detail-summary small { display:block; }
.project-detail-summary span { color:var(--muted); font-size:11px; }
.project-detail-summary strong { font-size:22px; margin-top:5px; }
.project-detail-summary small { color:var(--faint); font-size:11px; }
.project-reading { display:flex; align-items:center; gap:12px; background:var(--brand-soft); border:1px solid #cfe0d7; border-radius:14px; padding:12px 15px; margin:14px 0; }
.project-reading img { width:29px; height:29px; }
.project-reading span { color:var(--brand); text-transform:uppercase; letter-spacing:.06em; font-size:9.5px; font-weight:800; }
.project-reading p { margin:2px 0 0; color:var(--brand-ink); font-family:var(--serif); font-size:14px; }
.project-detail-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:14px; }
.project-detail-list { padding:0 18px 12px; }
.project-detail-row { display:flex; justify-content:space-between; gap:14px; align-items:center; border-top:1px solid var(--border); padding:12px 0; }
.project-detail-row b, .project-detail-row small { display:block; }
.project-detail-row b { font-size:13px; }
.project-detail-row small { color:var(--muted); font-size:11px; margin-top:2px; }
.project-detail-row > strong { flex:0 0 auto; }
.project-detail-row.is-automatic { background:var(--brand-soft); margin:0 -10px; padding:12px 10px; border-radius:10px; border-top-color:transparent; }
.project-task-state { width:auto; min-width:108px; padding:6px 27px 6px 8px; font-size:11px; }
.project-mini-empty { color:var(--muted); font-size:12px; border-top:1px solid var(--border); padding:18px 0 7px; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.autonomy-card .card-h { align-items:center; }
.autonomy-card .card-h h2 { margin:3px 0 0; font-family:var(--serif); color:var(--brand-ink); font-size:22px; font-weight:600; }
.autonomy-card .noesis-voice { max-width:70ch; color:var(--brand-ink); font-family:var(--serif); font-size:17px; line-height:1.5; }
.autonomy-promise { margin:14px 0 4px; }
.autonomy-list { margin-top:14px; }
.autonomy-group { margin:20px 0 5px; color:var(--muted); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.autonomy-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,220px); align-items:center; gap:20px; padding:13px 0; border-top:1px solid var(--border); }
.autonomy-copy strong, .autonomy-copy span { display:block; }
.autonomy-copy strong { color:var(--brand-ink); font-size:13px; }
.autonomy-copy span { margin-top:3px; color:var(--muted); font-size:11.5px; line-height:1.45; }
.autonomy-select { width:100%; font-size:12px; }
#automation-msg { min-height:18px; margin-top:8px; color:var(--brand); }
.autonomy-history { margin-top:12px; border-top:1px solid var(--border); padding-top:13px; }
.autonomy-history summary { color:var(--brand); font-size:12px; font-weight:750; cursor:pointer; }
.autonomy-action-list { margin-top:10px; }
.autonomy-action { display:flex; align-items:flex-start; gap:10px; padding:10px 0; border-top:1px solid var(--border); }
.autonomy-action strong, .autonomy-action small { display:block; }
.autonomy-action strong { font-size:12px; }
.autonomy-action small { margin-top:2px; color:var(--muted); font-size:10.5px; }
.memory-card { grid-column:1/-1; }
.memory-form { display:grid; grid-template-columns:minmax(150px,.7fr) minmax(240px,1.3fr) auto; gap:10px; align-items:end; }
.memory-form label { min-width:0; }
.memory-list { margin-top:14px; border-top:1px solid var(--border); }
.memory-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--border); }
.memory-row strong, .memory-row span { display:block; }
.memory-row strong { color:var(--brand-ink); font-size:12px; }
.memory-row span { color:var(--muted); font-size:12px; margin-top:2px; overflow-wrap:anywhere; }
.memory-row .icon-btn::before { content:'×'; font-size:20px; line-height:1; color:var(--muted); }
.memory-empty { color:var(--muted); font-size:12px; padding:16px 0 2px; line-height:1.5; }
.gestoria-deliveries { margin-top:18px; padding-top:14px; border-top:1px solid var(--border); }
.gestoria-delivery { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--border); }
.gestoria-delivery small { display:block; margin-top:3px; }
@media (max-width:1050px) { .project-row { grid-template-columns:minmax(200px,1.4fr) minmax(140px,.8fr) repeat(2,minmax(80px,.5fr)) auto; }
  .project-row > span:nth-child(4) { display:none; } }
@media (max-width:760px) {
  .autonomy-card .card-h { align-items:flex-start; }
  .autonomy-card .card-h > .badge { display:none; }
  .autonomy-row { grid-template-columns:1fr; gap:8px; }
  .memory-form { grid-template-columns:1fr; }
  .memory-form .btn { width:100%; justify-content:center; }
  .project-detail-head { display:block; } .project-detail-actions { margin-top:13px; flex-wrap:wrap; }
  .project-detail-summary { grid-template-columns:1fr 1fr; }
  .project-detail-summary > div:nth-child(3) { border-left:0; border-top:1px solid var(--border); }
  .project-detail-summary > div:nth-child(4) { border-top:1px solid var(--border); }
  .project-detail-grid { grid-template-columns:1fr; }
  .project-row { grid-template-columns:minmax(160px,1fr) auto; gap:10px; }
  .project-row-progress { grid-column:1/-1; } .project-row > span:nth-child(3), .project-row > span:nth-child(4), .project-row > span:nth-child(5) { display:none; }
}
@media (max-width:480px) {
  .integration-grid { grid-template-columns:1fr; }
  .integration-item { margin-right:0; padding-right:0; }
  .integration-item:last-child { border-bottom:0; }
  .operational-grid { grid-template-columns:1fr; }
  .operational-grid > div { border-left:0; border-top:1px solid var(--border); }
  .operational-grid > div:first-child { border-top:0; }
}
