/* BlimxCard: contenido de las cards de la segunda columna (las secciones usan main.css). */
:root {
  --bx-cyan: #12B5FF;
  --bx-violet: #6D4AFF;
  --bx-pink: #FF2D7A;
  --bx-grad: linear-gradient(120deg, #12B5FF 0%, #6D4AFF 55%, #FF2D7A 100%);
}

.o-header .m-logo img,
.o-footer .m-logo img {
  height: 79px;
  max-width: min(900px, 82vw);
  transform: none;
}
@media (max-width: 899px) {
  .o-header .m-logo img,
  .o-footer .m-logo img {
    height: 59px;
    max-width: min(255px, 56vw);
    transform: none;
  }
}

.o-hero__ico--idcard { mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><rect x='3' y='5' width='18' height='14' rx='2.5'/><circle cx='8.5' cy='11' r='2'/><path d='M5.8 16c.5-1.5 1.5-2.2 2.7-2.2s2.2.7 2.7 2.2M14 10h4M14 13.5h3'/></svg>"); }
.o-hero__ico--qr { mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><rect x='4' y='4' width='6' height='6' rx='1'/><rect x='14' y='4' width='6' height='6' rx='1'/><rect x='4' y='14' width='6' height='6' rx='1'/><path d='M14 14h2v2h-2zM18 18h2v2h-2zM18 14h2M14 18v2'/></svg>"); }
.o-hero__ico--contacts { mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><rect x='5' y='3' width='14' height='18' rx='2'/><circle cx='12' cy='10' r='2.6'/><path d='M8.2 17c.6-2 2-3 3.8-3s3.2 1 3.8 3'/></svg>"); }
.o-hero__ico--wallet { mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><rect x='3' y='6' width='18' height='13' rx='2.5'/><path d='M3 10h18M16 14.5h2'/></svg>"); }
.o-hero__ico--nfc { mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'><path d='M6 8.5a5 5 0 0 1 0 7M9.5 6a9 9 0 0 1 0 12M13 3.5a13 13 0 0 1 0 17'/></svg>"); }
.o-hero__ico--sig { mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><rect x='3' y='5' width='18' height='14' rx='2'/><path d='m4 7 8 6 8-6'/></svg>"); }

.o-hero__rail .o-hero__ico {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  background: var(--bx-violet);
}

/* Hero card: tarjeta digital */
.bx-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #16a34a;
  white-space: nowrap;
}
.bx-live i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 4px rgb(34 197 94 / 18%);
  animation: bx-pulse 1.8s ease-in-out infinite;
}
@keyframes bx-pulse {
  50% { box-shadow: 0 0 0 7px rgb(34 197 94 / 0%); }
}

.bx-hc {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: end;
  gap: 12px;
  padding: 46px 14px 12px;
  border-radius: 18px;
  background: #f6f7fc;
  overflow: hidden;
}
.bx-hc__cover {
  position: absolute;
  inset: 0 0 auto;
  height: 46px;
  background: var(--bx-grad);
}
.bx-hc__avatar { margin-top: -30px; align-self: start; }
.bx-hc__avatar {
  position: relative;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #0B1B3A;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  border: 3px solid #fff;
  box-shadow: 0 6px 16px rgb(11 27 58 / 22%);
}
.bx-hc__who { display: grid; gap: 1px; min-width: 0; padding-bottom: 2px; }
.bx-hc__who strong { font-size: 16px; line-height: 1.2; color: #0B1B3A; }
.bx-hc__who span { font-size: 12px; color: #4b5470; }
.bx-hc__who em { font-style: normal; font-size: 12px; font-weight: 700; color: var(--bx-violet); }
.bx-hc__qr {
  position: relative;
  width: 58px;
  height: 58px;
  padding: 5px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgb(11 27 58 / 12%);
}

.o-hero__slots i { transition: background-color .25s, color .25s, transform .25s; }
.o-hero__slots i.is-on { transform: translateY(-1px); }
.o-hero__book { background: var(--bx-grad); }

.o-hero__ok,
.o-hero__tip,
.o-hero__stat { transition: opacity .45s, transform .45s; }
.o-hero__board.bx-anim .o-hero__ok:not(.is-in),
.o-hero__board.bx-anim .o-hero__tip:not(.is-in),
.o-hero__board.bx-anim .o-hero__stat:not(.is-in) { opacity: 0; transform: translateY(10px); }
.o-hero__tip-bell .o-hero__ico--qr { background: var(--bx-pink); }
.o-hero__stat { color: var(--bx-violet); }
.o-hero__stat i {
  background:
    linear-gradient(var(--bx-violet), var(--bx-violet)) 0 10px / 3px 6px no-repeat,
    linear-gradient(var(--bx-violet), var(--bx-violet)) 5px 6px / 3px 10px no-repeat,
    linear-gradient(var(--bx-violet), var(--bx-violet)) 10px 2px / 3px 14px no-repeat;
}
@media (prefers-reduced-motion: reduce) {
  .bx-live i { animation: none; }
}

.o-hero .a-btn--ghost-light.bx-noicon { padding-left: 22px; }

/* Así funciona: tarjeta pública + formulario de captura */
.pk-book__logo.bx-ava {
  display: grid;
  place-items: center;
  background: var(--bx-grad);
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  border-radius: 50%;
}
.bx-form { display: grid; gap: 10px; margin-top: 4px; }
.bx-form label {
  display: grid;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  color: #8b8b99;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.bx-form b {
  display: block;
  min-height: 38px;
  padding: 9px 12px;
  border: 1px solid #e3e6f0;
  border-radius: 10px;
  background: #fff;
  font-size: 14px;
  font-weight: 400;
  color: #0B1B3A;
  text-transform: none;
  letter-spacing: 0;
  white-space: nowrap;
  overflow: hidden;
}
.bx-form b.is-typing { border-color: var(--bx-violet); box-shadow: 0 0 0 3px rgb(109 74 255 / 14%); }
.bx-form b.is-typing::after { content: "|"; color: var(--bx-violet); animation: bx-caret 1s steps(1) infinite; }
@keyframes bx-caret { 50% { opacity: 0; } }
.bx-form__go { grid-template-columns: 1fr; }
.bx-form__go span { background: var(--bx-grad); border-color: transparent; color: #fff; transition: transform .15s; }
.bx-form__go span.is-press { transform: scale(.96); }
.bx-form__ok {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 10px 0 0;
  font-size: 13px;
  font-weight: 700;
  color: #15803d;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .35s, transform .35s;
}
.bx-form__ok.is-on { opacity: 1; transform: none; }
.bx-form__ok i {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  border-radius: 50%;
  background: #22c55e;
  position: relative;
}
.bx-form__ok i::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 4px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* IA: el chat del teléfono es el asistente de BlimxCard, no WhatsApp */
.o-ai .wa { background: #f4f2ff; }
.o-ai .wa-status, .o-ai .wa-top { background: #0B1B3A; }
.o-ai .wa-top em { color: #b9b2ff; }
.bx-ai-ava {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--bx-grad);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}
.o-ai .wa-msg--me { background: #e6e0ff; }
.o-ai .wa-slots { flex-wrap: wrap; }
.o-ai .wa-slots b { border-color: #c9bdff; color: #5433E6; }
.o-ai .wa-slots b.is-pick { background: #6D4AFF; border-color: #6D4AFF; color: #fff; }
.o-ai .wa-acts b { background: #6D4AFF; }
.o-ai .wa-acts b.is-pay { background: #fff; color: #0B1B3A; box-shadow: inset 0 0 0 1px #d8d4ee; }
.o-ai .wa-acts b.is-press { box-shadow: 0 0 0 3px rgb(109 74 255 / 35%); }
.o-ai .ai-rail .ai-feat__ico { width: 18px; height: 18px; flex: 0 0 18px; color: #6D4AFF; }
.o-ai .ai-rail .ai-feat__ico svg { width: 18px; height: 18px; }

/* IA: pestaña Marca */
.bx-brand-logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #0B1B3A;
  color: #fff;
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
}
.o-ai .ai-swatch.is-on { box-shadow: 0 0 0 3px #fff, 0 0 0 5px #0B1B3A; }
.bx-mini { background: #0B1B3A; color: #fff; }
.bx-mini .bx-brand-logo { width: 44px; height: 44px; background: var(--bx-grad); font-size: 14px; }
.bx-mini small { color: #FF3D8A; }
.bx-mini p, .bx-mini .ai-mini__meta { color: #b9c2dc; }
.bx-mini .ai-mini__times i { border-color: #2c3b63; color: #fff; }
.bx-mini .ai-mini__times i.is-on { background: #FF3D8A; border-color: #FF3D8A; color: #fff; }
.bx-mini em { background: #FF3D8A; color: #fff; }

/* Casos de uso */
.o-proof .proof-stars.bx-case {
  justify-self: start;
  padding: 4px 10px;
  border-radius: 999px;
  background: #efeaff;
  color: #5433E6;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.o-proof .proof-chip { background: #6D4AFF; color: #fff; }
.o-proof .proof-chip--mint { background: #12B5FF; }
.o-proof .proof-chip--gold { background: #0B1B3A; }
.o-proof .proof-chip--rose { background: #FF3D8A; }
.o-proof .proof-chip.bx-chip-sm { padding: 0 10px; font-size: 13px; }
.o-proof .proof-active__face img { outline-color: #6D4AFF; }
.proof-ico--team { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23001b7c' stroke-width='2'%3E%3Ccircle cx='9' cy='8' r='3.2'/%3E%3Cpath d='M3 20c.6-3.6 3-5.5 6-5.5s5.4 1.9 6 5.5'/%3E%3Ccircle cx='17' cy='9' r='2.6'/%3E%3Cpath d='M16 14.6c2.6.2 4.4 2 5 5.4'/%3E%3C/svg%3E"); }
.proof-float--wa { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236D4AFF' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M8 7a7 7 0 0 1 0 10M12 4.5a11 11 0 0 1 0 15M4.5 9.5a3.5 3.5 0 0 1 0 5'/%3E%3C/svg%3E"); }
.o-proof .m-rate strong { background: var(--bx-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- Réplica de la UI real de BlimX Cards ---------- */
.sx-ico { display: inline-grid; place-items: center; width: 16px; height: 16px; flex: 0 0 16px; }
.sx-ico svg { width: 100%; height: 100%; }

/* Tarjeta pública /c/<slug> (template Modern, layout Standard) */
.sx-pub {
  --sx-c: #2ebe4a;
  position: relative;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  font-family: Inter, Arial, sans-serif;
  color: #111827;
  box-shadow: 0 1px 2px rgb(15 23 42 / 6%), 0 0 0 1px #eef0f4;
}
.sx-pub__cover { height: 92px; overflow: hidden; }
.sx-pub__cover img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; }
.sx-pub__logo {
  position: absolute;
  left: 12px;
  top: 64px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 3px solid #fff;
  background: #fff;
  box-shadow: 0 2px 6px rgb(0 0 0 / 12%);
}
.sx-pub__body { display: grid; gap: 6px; padding: 30px 12px 12px; }
.sx-pub__co { font-size: 13.5px; font-weight: 700; line-height: 1.2; }
.sx-pub__name { font-size: 11.5px; color: #111827; margin-top: -4px; }
.sx-pub__bio { margin: 0; font-size: 11px; line-height: 1.45; color: #6b7280; }
.sx-pub__rows { display: grid; gap: 5px; margin: 2px 0 0; padding: 0; list-style: none; }
.sx-pub__rows li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: #111827;
  border-radius: 8px;
  padding: 1px 4px 1px 0;
  transition: background-color .25s;
}
.sx-pub__rows li span { display: grid; line-height: 1.2; }
.sx-pub__rows li small { font-size: 9px; color: #9ca3af; }
.sx-pub__rows li.is-on { background: color-mix(in srgb, var(--sx-c) 12%, #fff); }
.sx-pub__dot {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  border-radius: 50%;
  background: var(--sx-c);
  color: #fff;
}
.sx-pub__dot svg { width: 11px; height: 11px; }
.sx-pub__save,
.sx-pub__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 500;
  padding: 7px 8px;
}
.sx-pub__save { background: var(--sx-c); color: #fff; margin-top: 4px; transition: transform .15s, filter .15s; }
.sx-pub__save.is-press { transform: scale(.97); filter: brightness(.92); }
.sx-pub__btn { background: #f1f5f9; color: #111827; }
.sx-pub__save .sx-ico,
.sx-pub__btn .sx-ico { width: 12px; height: 12px; flex-basis: 12px; }
.sx-pub__pair { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }

/* Hero: tablero = editor de tarjetas */
.o-hero__nav .sx-ico { color: #6b7280; }
.o-hero__nav li.is-on, .o-hero__nav li.is-on .sx-ico { color: #111827; }
.o-hero__nav li.is-on { background: #eef2ff; border-radius: 8px; }
.o-hero__card-top b { font-family: Inter, Arial, sans-serif; }
.o-hero__tip-bell { display: grid; place-items: center; color: #111827; }
.o-hero__tip-bell .sx-ico { width: 14px; height: 14px; }
.o-hero__tip b, .o-hero__stat b span:first-child { font-weight: 800; }
.o-hero__rail li .sx-ico { width: 15px; height: 15px; flex-basis: 15px; color: #111827; }
.o-hero__rail li:first-child { background: #111827; color: #fff; }
.o-hero__rail li:first-child .sx-ico { color: #fff; }

/* Replica: app shell (sidebar, screens, tables) */
.sx-app, .sx-home, .sx-screen, .sx-side { font-family: Inter, system-ui, sans-serif; }
.sx-side { padding: 12px 8px; background: #fff; border-right: 1px solid #eef0f4; display: flex; flex-direction: column; gap: 1px; overflow: hidden; }
.sx-side__g { margin: 10px 10px 4px; font-size: 10px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: #94a3b8; }
.sx-side .ui-dash__item { display: flex; align-items: center; gap: 9px; padding: 6px 10px; border-radius: 8px; font-size: 12.5px; color: #334155; background: none; }
.sx-side .ui-dash__item.is-on { background: #eef2ff; color: #1d4ed8; font-weight: 600; }
.sx-side .ui-dash__item.is-lock { color: #94a3b8; }
.sx-side .sx-ico { width: 15px; height: 15px; flex: none; display: inline-flex; }
.sx-ico svg { width: 100%; height: 100%; }

.sx-screen { padding: 18px 20px; background: #f8fafc; min-width: 0; }
.sx-screen__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.sx-screen__head h4, .sx-home h4 { margin: 0; font-size: 17px; font-weight: 700; color: #0f172a; }
.sx-screen__acts { display: flex; gap: 8px; }
.sx-btn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 8px; background: #0f172a; color: #fff; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.sx-btn--ghost { background: #fff; color: #0f172a; border: 1px solid #e2e8f0; }
.sx-btn .sx-ico { width: 13px; height: 13px; }
.sx-search { display: flex; align-items: center; gap: 8px; max-width: 260px; padding: 7px 10px; margin-bottom: 12px; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 12px; color: #94a3b8; }
.sx-search .sx-ico { width: 14px; height: 14px; }
.sx-table { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; overflow: hidden; font-size: 12px; color: #334155; }
.sx-table th { padding: 9px 12px; text-align: left; font-size: 11px; font-weight: 600; color: #64748b; background: #f8fafc; border-bottom: 1px solid #e2e8f0; }
.sx-table td { padding: 9px 12px; border-bottom: 1px solid #f1f5f9; white-space: nowrap; }
.sx-table tr:last-child td { border-bottom: 0; }
.sx-table tbody tr { transition: opacity .5s ease, transform .5s ease, background .6s ease; }
.sx-table tbody tr.is-wait { opacity: 0; transform: translateY(-6px); }
.sx-table tbody tr.is-fresh { background: #f0fdf4; }
.sx-person { display: inline-flex; align-items: center; gap: 9px; }
.sx-person > i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #e2e8f0; color: #475569; font: 600 10px/1 Inter, sans-serif; font-style: normal; }
.sx-person > span { display: flex; flex-direction: column; line-height: 1.25; }
.sx-person b { font-weight: 600; color: #0f172a; }
.sx-person small { font-size: 11px; color: #64748b; }
.sx-chip { display: inline-block; padding: 2px 8px; border-radius: 999px; background: #f1f5f9; color: #475569; font-size: 11px; font-weight: 500; }

/* Replica: Home */
.sx-home { padding: 20px 22px; background: #f8fafc; height: 100%; }
.sx-home__grid { display: grid; grid-template-columns: 250px 1fr; gap: 18px; margin-top: 14px; align-items: start; }
.sx-phone { padding: 8px; background: #fff; border: 1px solid #e2e8f0; border-radius: 24px; box-shadow: 0 10px 30px rgba(15,23,42,.08); }
.sx-phone .sx-pub { border: 0; box-shadow: none; }
.sx-home__btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.sx-home__btns .sx-btn { justify-content: center; }
.sx-home__side { display: grid; gap: 14px; min-width: 0; }
.sx-box { padding: 14px; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; }
.sx-box > b, .sx-box__h b { font-size: 13.5px; color: #0f172a; }
.sx-box > small { display: block; margin-top: 2px; font-size: 11.5px; color: #64748b; }
.sx-box--flush { padding: 0; overflow: hidden; }
.sx-box--flush .sx-table { border: 0; border-radius: 0; }
.sx-box__h, .sx-box__f { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; }
.sx-box__h a { font-size: 12px; color: #2563eb; }
.sx-box__f { font-size: 11px; color: #64748b; border-top: 1px solid #f1f5f9; }
.sx-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 12px; }
.sx-tile { display: flex; flex-direction: column; gap: 4px; padding: 12px; border: 1px solid #e2e8f0; border-radius: 10px; }
.sx-tile .sx-ico { width: 28px; height: 28px; padding: 6px; border-radius: 8px; background: #f1f5f9; color: #0f172a; }
.sx-tile b { font-size: 12.5px; color: #0f172a; }
.sx-tile small { font-size: 11px; color: #2563eb; }
.sx-lang { margin-left: auto; padding: 3px 8px; border: 1px solid #e2e8f0; border-radius: 6px; font: 600 11px Inter, sans-serif; color: #334155; }
.sx-ava { display: grid; place-items: center; font: 600 11px Inter, sans-serif; font-style: normal; color: #fff; background: #2ebe4a; }

/* Replica: public exchange form */
.pk-book__host .sx-pub { max-width: 270px; margin: 0 auto; }
.sx-form { font-family: Inter, system-ui, sans-serif; }
.sx-form > strong { display: block; font-size: 16px; color: #0f172a; }
.sx-form > p:not(.bx-form__ok) { margin: 2px 0 14px; font-size: 12.5px; color: #64748b; }
.sx-form .bx-form label { display: grid; gap: 4px; }
.sx-form .bx-form label > span { font-size: 11.5px; font-weight: 500; color: #334155; }
.sx-form .bx-form b { display: block; min-height: 34px; padding: 8px 10px; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; font-weight: 400; font-size: 12.5px; color: #0f172a; }
.sx-form .bx-form label:last-child b { min-height: 52px; }
.sx-form__send { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 12px; padding: 10px; border-radius: 10px; background: #2ebe4a; color: #fff; font-size: 13px; font-weight: 600; transition: transform .15s ease; }
.sx-form__send.is-press { transform: scale(.97); filter: brightness(.92); }
.sx-form__send .sx-ico { width: 14px; height: 14px; }
.pk-book__host .sx-pub img { margin: 0; }
.pk-book__host .sx-pub .sx-pub__cover img { width: 100%; height: 100%; border-radius: 0; }
.pk-book__host .sx-pub .sx-pub__logo { width: 50px; height: 50px; }
.pk-book__host .sx-pub ul { display: grid; flex-wrap: nowrap; gap: 5px; margin: 2px 0 0; }
.pk-book__host .sx-pub li { padding: 1px 4px 1px 0; border-radius: 8px; background: none; font-size: 11px; color: #111827; }
.pk-book__host .sx-pub li.is-on { background: color-mix(in srgb, var(--sx-c) 12%, #fff); }
.pk-book__host .sx-pub p { max-width: none; margin: 0; font-size: 11px; color: #6b7280; }
.sx-form .bx-form label { text-transform: none; letter-spacing: 0; font-weight: 500; }
.sx-form .bx-form b.is-typing { border-color: #2ebe4a; box-shadow: 0 0 0 3px rgb(46 190 74 / 16%); }
.sx-form .bx-form b.is-typing::after { color: #2ebe4a; }
.sx-app .pk-desk__body { grid-template-columns: 190px 1fr; min-height: 400px; }
.sx-app .pk-desk__body { grid-template-columns: 172px minmax(0, 1fr); }
.sx-app .sx-screen { padding: 16px; }
.sx-app .sx-table { font-size: 11px; }
.sx-app .sx-table th, .sx-app .sx-table td { padding: 8px; }
.sx-app .sx-table td { white-space: normal; }
.sx-app .sx-person small { font-size: 10px; }
.sx-app .sx-btn--ghost { display: none; }
.sx-app .sx-side .ui-dash__item { font-size: 11.5px; padding: 6px 8px; }

/* Replica: email signatures */
.sx-sigs { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.sx-sigs .sx-search { max-width: 280px; margin: 0; }
.sx-btn--sig { background: #f43f5e; }
.sx-open { display: inline-block; padding: 3px 10px; border: 1px solid #fecdd3; border-radius: 8px; color: #e11d48; font-size: 12px; font-weight: 600; background: #fff; }
.sx-mail__body { padding: 16px 18px 18px; font-family: Inter, system-ui, sans-serif; }
.sx-mail__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sx-mail__head b { font-size: 15px; color: #0f172a; }
.sx-mail__modes { display: inline-flex; padding: 3px; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; }
.sx-mail__modes i { padding: 5px 10px; border-radius: 8px; font-size: 12px; font-style: normal; color: #64748b; }
.sx-mail__modes i.is-on { background: #0f172a; color: #fff; }
.sx-mail__body > p { margin: 6px 0 12px; font-size: 12.5px; color: #64748b; }
.sx-sig { display: grid; grid-template-columns: 150px 1fr; gap: 16px; align-items: center; padding: 16px; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; }
.sx-sig img { width: 132px; height: auto; display: block; }
.sx-sig strong { display: block; font-size: 16px; color: #0f172a; }
.sx-sig span { display: block; margin-top: 2px; font-size: 12.5px; color: #334155; }
.sx-sig em { display: inline-block; margin-top: 10px; padding: 8px 14px; border-radius: 8px; background: #2ebe4a; color: #fff; font-style: normal; font-weight: 700; font-size: 13px; }
.sx-mail__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.sx-mail__acts--stack { flex-direction: column; align-items: stretch; }
.sx-copied { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: #f0fdf4; color: #166534; font-size: 13px; font-weight: 600; }
.sx-tpls { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 16px; }
.sx-tpl { display: flex; flex-direction: column; gap: 5px; min-height: 92px; padding: 12px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; }
.sx-tpl b { font-size: 13px; color: #1d4ed8; }
.sx-tpl i { display: block; height: 4px; border-radius: 99px; background: #e2e8f0; }
.sx-tpl small { margin-top: auto; font-size: 11px; color: #64748b; }
.sx-tpl.is-on { border-color: #2563eb; box-shadow: 0 0 0 2px #2563eb; }
.sx-tpl.is-dark { background: #0f172a; }
.sx-tpl.is-dark b, .sx-tpl.is-dark small { color: #fff; }
.sx-tpl.is-dark i { background: #334155; }

/* Signature preview, matching the editor */
.sx-sig { align-items: start; padding: 18px 16px; }
.sx-sig strong { font-size: 18px; }
.sx-sig__role { color: #64748b; font-size: 12px; }
.sx-sig__row { display: flex; align-items: center; gap: 8px; margin-top: 4px; color: #334155; font-size: 12.5px; }
.sx-sig__row .sx-ico, .sx-sig__go .sx-ico, .sx-mail__modes .sx-ico, .sx-mail__acts .sx-ico, .sx-logorow .sx-ico { width: 14px; height: 14px; color: #2563eb; }
.sx-sig__go { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; padding: 8px 14px; border-radius: 8px; background: #2563eb; color: #fff; font-weight: 700; font-size: 13px; }
.sx-sig__go .sx-ico { color: #fff; }
.sx-sig__social { display: flex; gap: 8px; margin-top: 12px; }
.sx-sig__social .sx-ico { width: 16px; height: 16px; }
.sx-sig__social .sx-ico:nth-child(1) { color: #1877f2; }
.sx-sig__social .sx-ico:nth-child(2) { color: #e1306c; }
.sx-sig__social .sx-ico:nth-child(3) { color: #0a66c2; }
.sx-sig__social .sx-ico:nth-child(4) { color: #ff0000; }
.sx-mail__modes i { display: inline-flex; align-items: center; gap: 5px; }
.sx-mail__modes .sx-ico { color: inherit; }
.sx-mail__acts .sx-btn { color: #0f172a; }

/* Editor form + templates */
@media (min-width: 900px) {
  .o-proof .proof-stage.sig-pitch { grid-template-columns: minmax(260px, .85fr) minmax(0, 1.15fr); gap: 28px; align-items: center; }
}
.sig-pitch .ai-feats { margin: 0; }
.sig-pitch .ai-feat__ico { color: #6D4AFF; }
.sig-inbox { padding: 22px 22px 18px; background: #fff; border: 1px solid #e7edf5; border-radius: 18px; box-shadow: 0 18px 40px rgb(15 23 42 / 6%); font-family: Inter, system-ui, sans-serif; }
.sig-inbox header { display: grid; grid-template-columns: 40px 1fr; gap: 4px 12px; align-items: center; }
.sig-inbox header i { grid-row: span 2; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #1e3a8a; color: #fff; font-style: normal; font-weight: 700; }
.sig-inbox header b { font-size: 15px; color: #0f172a; }
.sig-inbox header small { display: block; font-size: 12px; color: #64748b; }
.sig-inbox header em { grid-column: 1 / -1; margin-top: 10px; font-style: normal; font-size: 18px; font-weight: 700; letter-spacing: -0.02em; color: #0f172a; }
.sig-inbox > p { margin: 8px 0 16px; font-size: 14.5px; line-height: 1.55; color: #334155; }
.sig-inbox .sx-sig { margin-top: 4px; padding: 18px 4px 4px; border: 0; border-top: 1px solid #e7edf5; border-radius: 0; box-shadow: none; }
.sx-formcard { padding: 16px; background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; font-family: Inter, system-ui, sans-serif; }
.sx-formcard > b { font-size: 16px; color: #0f172a; }
.sx-formcard > p, .sx-formcard > small { display: block; margin: 4px 0 10px; font-size: 12px; color: #64748b; }
.sx-label { display: block; margin: 10px 0 6px; font-size: 12px; font-weight: 600; color: #334155; }
.sx-cardpick { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid #e2e8f0; border-radius: 10px; font-size: 13px; color: #0f172a; }
.sx-cardpick i { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: #e2e8f0; font: 600 11px Inter, sans-serif; font-style: normal; }
.sx-logorow { display: flex; align-items: center; gap: 8px; }
.sx-logorow img { width: 92px; height: auto; }
.sx-btn--danger { background: #fff; color: #e11d48; border: 1px solid #fecdd3; }
.sx-langs { display: flex; gap: 6px; }
.sx-langs i { padding: 4px 8px; border: 1px solid #e2e8f0; border-radius: 8px; font: 600 11px Inter, sans-serif; font-style: normal; color: #334155; }
.sx-langs i.is-on { border-color: #2563eb; color: #1d4ed8; box-shadow: 0 0 0 1px #2563eb; }
.sx-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.sx-field { display: grid; gap: 4px; }
.sx-field span { font-size: 11px; font-weight: 600; color: #334155; }
.sx-field b { display: block; min-height: 32px; padding: 7px 8px; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; font-weight: 500; font-size: 12px; color: #0f172a; }
.sx-field--wide { margin-top: 8px; }
.sx-field small { float: right; color: #94a3b8; font-weight: 500; }
.sx-check { display: flex; align-items: center; gap: 8px; margin: 12px 0; font-size: 12.5px; color: #0f172a; }
.sx-check > i { width: 14px; height: 14px; border-radius: 3px; background: #2563eb; box-shadow: inset 0 0 0 2px #fff; }
.sx-formcard__acts { display: flex; gap: 8px; }
.sx-tpls--real { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 0; }
.sx-mini { position: relative; display: grid; grid-template-columns: 42px 1fr; gap: 8px; align-items: center; min-height: 78px; padding: 10px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; }
.sx-mini b { font-size: 13px; color: #1d4ed8; }
.sx-mini span { display: grid; gap: 4px; }
.sx-mini i { display: block; height: 4px; border-radius: 99px; background: #e2e8f0; }
.sx-mini i.is-bar, .sx-mini u { display: block; height: 8px; border-radius: 4px; background: #2563eb; }
.sx-mini.is-on { border-color: #2563eb; box-shadow: 0 0 0 2px #2563eb; }
.sx-mini.is-on em { position: absolute; top: 6px; right: 6px; width: 14px; height: 14px; border-radius: 50%; background: #2563eb; }
.sx-mini--round b { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #2563eb; color: #fff; font-size: 9px; }
.sx-mini--banner { grid-template-rows: 1fr auto; }
.sx-mini--banner u { grid-column: 1 / -1; }
.sx-mini--photo b { width: 36px; height: 36px; border-radius: 50%; background: #cbd5e1; }
.sx-mini--dark { background: #0f172a; }
.sx-mini--dark b { color: #fff; }
.sx-mini--dark i { background: #334155; }
.sx-mini--dark i.is-bar { background: #2563eb; }
/* Vista previa de la firma: mismo aire que el editor */
.sx-mail { background: #fff; font-family: Inter, system-ui, sans-serif; }
.sx-mail__modes > i { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; }
.sx-mail__modes .sx-ico { width: 15px; height: 15px; padding: 0; background: none; color: inherit; }
.sx-mail__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 18px 0; }
.sx-mail__top b { display: block; font-size: 18px; font-weight: 700; color: #0f172a; }
.sx-mail__top p { margin: 3px 0 0; font-size: 13px; color: #64748b; }
.sx-mail__stage { margin: 14px 16px 6px; padding: 8px 18px 22px; background: #f3f6fb; border-radius: 16px; }
.sx-mail__stage .pk-win__chrome { background: transparent; border: 0; padding: 8px 2px 12px; }
.sx-mail .sx-sig, .sig-inbox .sx-sig { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 0; align-items: center; margin: 0; padding: 26px 22px; background: #fff; border: 1px solid #e7edf5; border-radius: 14px; box-shadow: 0 1px 2px rgb(15 23 42 / 4%); }
.sx-mail .sx-sig__logo, .sig-inbox .sx-sig__logo { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 8px 0 0; color: #1e3a8a; }
.sx-mail .sx-sig__logo b, .sig-inbox .sx-sig__logo b { font-size: 40px; line-height: .85; font-weight: 800; letter-spacing: -0.04em; }
.sx-mail .sx-sig__logo small, .sig-inbox .sx-sig__logo small { margin-top: 6px; font-size: 9px; font-weight: 700; letter-spacing: .18em; }
.sx-mail .sx-sig__main, .sig-inbox .sx-sig__main { min-width: 0; padding-left: 22px; border-left: 1px solid #e6ebf2; }
.sx-mail .sx-sig strong, .sig-inbox .sx-sig strong { display: block; margin: 0; font-size: 22px; font-weight: 700; letter-spacing: -0.02em; color: #0f172a; }
.sx-mail .sx-sig__role, .sig-inbox .sx-sig__role { display: block; margin: 4px 0 14px; font-size: 13px; color: #64748b; }
.sx-mail .sx-sig__row, .sig-inbox .sx-sig__row { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 14px; line-height: 1.3; color: #1e293b; }
.sx-mail .sx-sig__row .sx-ico, .sig-inbox .sx-sig__row .sx-ico { width: 16px; height: 16px; flex: 0 0 16px; color: #2563eb; }
.sx-mail .sx-sig__foot, .sig-inbox .sx-sig__foot { display: flex; align-items: center; gap: 22px; margin-top: 16px; }
.sx-mail .sx-sig__go, .sig-inbox .sx-sig__go { display: inline-flex; align-items: center; gap: 8px; width: auto; margin: 0; padding: 9px 16px; border-radius: 8px; background: #2563eb; color: #fff; font-weight: 600; font-size: 14px; line-height: 1; }
.sx-mail .sx-sig__go .sx-ico, .sig-inbox .sx-sig__go .sx-ico { width: 16px; height: 16px; color: #fff; }
.sx-mail .sx-sig__social, .sig-inbox .sx-sig__social { display: flex; align-items: center; gap: 14px; width: auto; margin: 0; }
.sx-mail .sx-soc, .sig-inbox .sx-soc { display: inline-grid; place-items: center; width: 22px; height: 22px; }
.sx-mail .sx-soc svg, .sig-inbox .sx-soc svg { width: 20px; height: 20px; }
.sx-mail .sx-soc--fb, .sig-inbox .sx-soc--fb { color: #1877f2; }
.sx-mail .sx-soc--fb svg, .sig-inbox .sx-soc--fb svg { fill: currentColor; }
.sx-mail .sx-soc--ig, .sig-inbox .sx-soc--ig { color: #e1306c; }
.sx-mail .sx-soc--in, .sig-inbox .sx-soc--in { color: #0a66c2; }
.sx-mail .sx-soc--yt, .sig-inbox .sx-soc--yt { color: #ff0000; }
.sx-mail .sx-soc--yt svg, .sig-inbox .sx-soc--yt svg { fill: currentColor; }
.sx-mail .sx-mail__acts { gap: 8px; margin: 0; padding: 12px 16px 16px; }

.o-ai .s-head .a-title, .o-band .s-head .a-title, .o-ind .s-head .a-title { text-align: center; max-width: 18em; margin: 0 auto; }
.o-ai .s-head, .o-band .s-head, .o-ind .s-head { margin-bottom: 2.5rem; }
.sx-qr__url { display: block; color: #1d4ed8; text-decoration: none; }
.sx-qr__url:hover { text-decoration: underline; }
.sx-qr__open a { color: #1d4ed8; text-decoration: none; }
.sx-qr__open a:hover { text-decoration: underline; }

.who-mini, .who-note { margin: 0; font-size: 13px; line-height: 1.4; color: #5b5670; }
.who-note { color: #111; }
.o-who .who-ui--smb { grid-template-columns: 1fr; }
.o-who .who-ui--smb aside { display: none; }
.o-who .who-team__row { font-size: 13px; font-weight: 700; color: #111; }
.o-who .who-team__row i { background: #2ebe4a; }
.o-go__role { margin: -6px 0 0; font-size: 13px; color: #5b5670; }
.o-go__card .o-go__slots { grid-template-columns: 1fr; }
.o-go__card .o-go__slots i { text-align: left; padding: 8px 12px; font-size: 12px; font-weight: 600; }
.m-int__mark--hs { background: #ff7a59; }
.m-int__mark--wh { background: #0b1b3a; }
.m-int__mark--api { background: #6D4AFF; font-size: 10px; }
@media (min-width: 1020px) {
  .o-int .int-board { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.mk-kicker { margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #6d4aff; }
.mk-copy h2, .mk-whohead h2 {
  margin: 0; text-align: left; max-width: 16ch;
  font-size: clamp(32px, 3.2vw, 42px); line-height: 1.08; letter-spacing: -0.03em;
  font-weight: 800; color: #0b1b3a;
}
.mk-copy > p:last-of-type, .mk-whohead__lead { margin: 12px 0 0; max-width: 46ch; color: #5b5670; font-size: 16px; line-height: 1.5; }
.mk-pills { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 28px; }
.mk-pill {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  min-height: 210px; padding: 18px 16px 16px; border-radius: 22px;
  color: inherit; text-decoration: none;
}
.mk-pill--card { background: #e7eeff; }
.mk-pill--mail { background: #f3e9ff; }
.mk-pill--qr { background: #e5f8ec; }
.mk-pill i { width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; background: #fff; }
.mk-pill svg { width: 22px; height: 22px; }
.mk-pill--card i { color: #2563eb; }
.mk-pill--mail i { color: #7c3aed; }
.mk-pill--qr i { color: #16a34a; }
.mk-pill b { font-size: 16px; color: #0b1b3a; }
.mk-pill em { font-style: normal; font-size: 13.5px; line-height: 1.45; color: #5b5670; }
.mk-pill small {
  margin-top: auto; padding: 7px 12px; border-radius: 999px; background: #fff;
  font-size: 13px; font-weight: 700;
}
.mk-pill small::after { content: " →"; }
.mk-pill--card small { color: #2563eb; }
.mk-pill--mail small { color: #7c3aed; }
.mk-pill--qr small { color: #16a34a; }
.mk-hub { display: grid; gap: 28px; align-items: center; }
.mk-scene { position: relative; height: 540px; }
.mk-scene::before {
  content: ""; position: absolute; z-index: 0; inset: 8% 4% 6% 8%;
  background: radial-gradient(circle at 50% 40%, #e4ebff 0%, transparent 68%);
}
.mk-phone {
  position: absolute; z-index: 2; left: 0; bottom: 0; width: 228px; aspect-ratio: 390 / 844;
  padding: 9px; border-radius: 36px; background: #111827;
  box-shadow: 0 28px 50px rgb(11 27 58 / 28%);
}
.mk-phone__screen { height: 100%; border-radius: 28px; overflow: hidden; background: #fff; position: relative; }
.mk-phone__screen::before {
  content: ""; position: absolute; z-index: 2; top: 7px; left: 50%; width: 68px; height: 14px;
  border-radius: 10px; background: #111827; transform: translateX(-50%);
}
.mk-app { height: 100%; display: flex; flex-direction: column; gap: 6px; padding: 26px 12px 10px; }
.mk-app__id { display: flex; align-items: center; justify-content: space-between; }
.mk-logo {
  width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center;
  background: #1e3a8a; color: #fff; font-style: normal; font-weight: 800; font-size: 16px;
}
.mk-ava { width: 54px; height: 54px; border-radius: 50%; object-fit: cover; object-position: center 18%; display: block; }
.mk-app > strong { font-size: 16px; color: #0b1b3a; }
.mk-app > small { color: #64748b; font-size: 12px; }
.mk-app ul { margin: 4px 0; }
.mk-app li { margin: 0 0 5px; font-size: 11.5px; color: #0f172a; }
.mk-app li::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: #2563eb; }
.mk-book {
  display: flex; justify-content: center; margin-top: 4px; padding: 9px 10px; border-radius: 10px;
  background: #16a34a; color: #fff; font-size: 13px; font-weight: 700;
}
.mk-bar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin-top: auto; padding-top: 8px; border-top: 1px solid #eef2f6; }
.mk-bar span { text-align: center; font-size: 10px; font-weight: 700; color: #334155; }
.mk-socs { display: flex; gap: 6px; }
.mk-socs i { width: 16px; height: 16px; border-radius: 50%; display: block; background-repeat: no-repeat; background-position: center; background-size: 10px; }
.mk-socs .is-fb { background-color: #1877f2; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M15 8h2V5h-2a3 3 0 0 0-3 3v2H10v3h2v6h3v-6h2l.5-3H15V8z'/></svg>"); }
.mk-socs .is-ig { background-color: #e1306c; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><rect x='4' y='4' width='16' height='16' rx='5'/><circle cx='12' cy='12' r='3.5'/></svg>"); }
.mk-socs .is-in { background-color: #0a66c2; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><rect x='4' y='4' width='16' height='16' rx='2'/><path d='M8 11v6M8 8h.01M12 17v-4a2 2 0 0 1 4 0v4'/></svg>"); }
.mk-socs .is-yt { background-color: #ff0000; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M10 9.5v5l5-2.5-5-2.5z'/></svg>"); }
.mk-mail, .mk-qr {
  position: absolute; z-index: 1; background: #fff; border-radius: 18px;
  box-shadow: 0 18px 44px rgb(11 27 58 / 14%);
}
.mk-mail { top: 0; left: 232px; width: min(300px, calc(100% - 232px)); padding: 12px 14px 14px; }
.mk-mail p { margin: 0; font-size: 12px; color: #64748b; }
.mk-mail p span { display: inline-block; width: 58px; color: #94a3b8; }
.mk-sig { display: grid; grid-template-columns: 72px 1fr; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid #e7edf5; }
.mk-mark { text-align: center; color: #1e3a8a; border-right: 1px solid #e6ebf2; }
.mk-mark b { display: block; font-size: 16px; line-height: .9; letter-spacing: -0.04em; }
.mk-mark small { font-size: 7px; letter-spacing: .14em; font-weight: 700; }
.mk-sig strong { display: block; font-size: 14px; color: #0b1b3a; }
.mk-sig em { display: block; margin-top: 2px; font-style: normal; font-size: 11.5px; color: #475569; }
.mk-sig .mk-socs { margin-top: 8px; }
.mk-qr { left: 196px; bottom: 6px; z-index: 3; width: min(300px, calc(100% - 196px)); padding: 12px; }
.mk-qr > b { display: block; margin-bottom: 8px; font-size: 14px; color: #0b1b3a; }
.mk-qr > div { display: grid; grid-template-columns: 96px 18px 1fr; gap: 8px; align-items: center; }
.mk-qr img { width: 96px; height: 96px; }
.mk-qr > div > i { width: 18px; height: 18px; border-radius: 50%; background: #dcfce7; position: relative; }
.mk-qr > div > i::after { content: "→"; position: absolute; inset: 0; display: grid; place-items: center; color: #16a34a; font-size: 12px; font-weight: 800; }
.mk-qr li { margin: 0 0 6px; font-size: 12.5px; font-weight: 700; color: #0b1b3a; }
.mk-qr li:last-child { margin: 0; }
.mk-qr li::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: #16a34a; }
.mk-whohead { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.mk-whohead h2 { max-width: 18ch; }
.mk-whohead a { flex: none; color: #6d4aff; font-weight: 700; font-size: 15px; text-decoration: none; }
.mk-whohead a::after { content: " →"; }
.mk-whohead__lead { margin-bottom: 22px; }
.mk-for { display: grid; gap: 16px; }
.mk-for__card { display: flex; flex-direction: column; gap: 14px; padding: 18px 16px 16px; border-radius: 24px; }
.mk-for__card--one { background: #eef2ff; }
.mk-for__card--team { background: #f4eefe; }
.mk-for__card--co { background: #e7f6ee; }
.mk-for__card header { display: flex; gap: 10px; align-items: flex-start; }
.mk-for__card header > i { width: 36px; height: 36px; border-radius: 12px; display: grid; place-items: center; background: #fff; color: #6d4aff; flex: none; }
.mk-for__card header svg { width: 20px; height: 20px; }
.mk-for__card h3 { margin: 0; font-size: 20px; color: #0b1b3a; }
.mk-for__card header p { margin: 2px 0 0; font-size: 13.5px; line-height: 1.4; color: #5b5670; }
.mk-split { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 12px; align-items: center; }
.mk-preview, .mk-brand, .mk-people { background: #fff; border-radius: 16px; }
.mk-preview { padding: 12px; }
.mk-preview .mk-ava { width: 42px; height: 42px; }
.mk-preview strong { display: block; margin-top: 8px; font-size: 14px; color: #0b1b3a; }
.mk-preview small { display: block; color: #64748b; font-size: 12px; }
.mk-preview .mk-socs { margin: 8px 0; }
.mk-preview .mk-book { font-size: 12px; padding: 7px 8px; }
.mk-people { margin: 0; padding: 8px 10px; }
.mk-people li { display: flex; align-items: center; gap: 8px; padding: 6px 0; }
.mk-people .mk-ava { width: 36px; height: 36px; flex: none; }
.mk-people b { display: block; font-size: 13px; color: #0b1b3a; }
.mk-people small { color: #64748b; font-size: 12px; }
.mk-people li { position: relative; }
.mk-people li::after { content: ""; width: 8px; height: 8px; margin-left: auto; border-radius: 50%; background: #16a34a; flex: none; }
.mk-brand { padding: 16px 10px; text-align: center; color: #1e3a8a; }
.mk-brand b { display: block; font-size: 26px; line-height: .9; letter-spacing: -0.04em; }
.mk-brand small { letter-spacing: .16em; font-size: 9px; font-weight: 700; }
.mk-brand span { display: flex; justify-content: center; align-items: center; gap: 7px; margin-top: 12px; }
.mk-brand i { width: 12px; height: 12px; border-radius: 50%; }
.mk-brand i:nth-child(1) { background: #2563eb; }
.mk-brand i:nth-child(2) { background: #7c3aed; }
.mk-brand i:nth-child(3) { background: #16a34a; }
.mk-brand em { font-style: normal; font-weight: 700; color: #0b1b3a; }
.mk-checks { margin: 0; }
.mk-checks li { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 8px; font-size: 13.5px; color: #0b1b3a; }
.mk-checks li::before { content: "✓"; color: #16a34a; font-weight: 800; }
.mk-btn {
  margin-top: auto; display: flex; justify-content: center; padding: 12px 14px; border-radius: 12px;
  background: #fff; color: #0b1b3a; font-weight: 700; text-decoration: none; border: 1px solid #e6e8f2;
}
.mk-btn--fill { background: #6d4aff; color: #fff; border-color: #6d4aff; }
@media (min-width: 1100px) {
  .mk-hub { grid-template-columns: minmax(0, 1.15fr) minmax(480px, .85fr); }
  .mk-for { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; }
}
@media (max-width: 1099px) {
  .mk-pills { grid-template-columns: 1fr; }
  .mk-pill { min-height: 0; }
  .mk-scene { height: auto; display: grid; justify-items: center; gap: 16px; }
  .mk-phone, .mk-mail, .mk-qr { position: static; width: min(100%, 360px); }
  .mk-phone { width: 240px; }
  .mk-whohead { flex-direction: column; align-items: flex-start; }
  .mk-split { grid-template-columns: 1fr; }
}

/* QR Manager: código real AQS card y su analítica */
.o-band .ai-feat__ico, .o-ind .ai-feat__ico { color: #6D4AFF; }
.sx-qr, .sx-an { padding: 18px 18px 16px; font-family: Inter, system-ui, sans-serif; }
.sx-qr__head { display: flex; align-items: center; gap: 10px; }
.sx-qr__head b { font-size: 22px; color: #0f172a; letter-spacing: -0.03em; }
.sx-qr__head i { display: inline-flex; align-items: center; gap: 6px; color: #16a34a; font-style: normal; font-size: 13px; font-weight: 700; }
.sx-qr__head i::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px #dcfce7; }
.sx-qr .sx-label { margin: 14px 0 6px; font-size: 12px; font-weight: 600; color: #64748b; }
.sx-qr__field { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid #e6ebf2; border-radius: 10px; background: #fff; }
.sx-qr__field a { flex: 1; color: #64748b; font-size: 14px; text-decoration: none; }
.sx-qr__field span { width: 18px; height: 18px; color: #94a3b8; flex: none; }
.sx-qr__field svg, .sx-qr__tools svg, .sx-qr__stats svg { width: 16px; height: 16px; display: block; }
.sx-qr__stage {
  display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center;
  margin: 12px 0; padding: 18px 14px; border-radius: 18px;
  background:
    radial-gradient(circle at 16% 70%, #dbeafe 0%, transparent 46%),
    radial-gradient(circle at 84% 30%, #ede9fe 0%, transparent 48%),
    #f8fafc;
}
.sx-qr__code { position: relative; width: min(210px, 100%); margin: 0 auto; padding: 12px; border-radius: 16px; background: #fff; box-shadow: 0 10px 28px rgb(15 23 42 / 8%); }
.sx-qr__code img { display: block; width: 100%; height: auto; }
.sx-qr__logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); padding: 5px 7px 4px; border-radius: 8px; background: #fff; text-align: center; color: #1d4ed8; box-shadow: 0 0 0 4px #fff; }
.sx-qr__logo b { display: block; font-size: 15px; line-height: .9; letter-spacing: -0.04em; }
.sx-qr__logo small { display: block; margin-top: 1px; font-size: 5.5px; letter-spacing: .14em; font-weight: 800; }
.sx-qr__tools { display: flex; flex-direction: column; gap: 8px; }
.sx-qr__tools span { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: #64748b; box-shadow: 0 6px 16px rgb(15 23 42 / 8%); }
.sx-qr__open { margin: 0 0 12px; text-align: center; font-size: 13px; color: #334155; }
.sx-qr__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sx-qr__stats > div { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid #e7edf5; border-radius: 14px; background: #fff; }
.sx-qr__stats > div > i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: none; }
.sx-qr__stats .is-scans { background: #ede9fe; color: #7c3aed; }
.sx-qr__stats .is-dev { background: #dcfce7; color: #16a34a; }
.sx-qr__stats .is-geo { background: #dbeafe; color: #2563eb; }
.sx-qr__stats .is-when { background: #ffedd5; color: #f97316; }
.sx-qr__stats small { display: block; font-size: 11px; color: #64748b; }
.sx-qr__stats b { display: block; margin-top: 1px; font-size: 15px; line-height: 1.2; color: #0f172a; }
.sx-an__kpis, .sx-an__split { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sx-an__kpis div, .sx-an__split div { padding: 10px 12px; border: 1px solid #e7edf5; border-radius: 12px; background: #fff; }
.sx-an small { display: block; font-size: 11px; color: #64748b; }
.sx-an__kpis b { display: block; margin-top: 2px; font-size: 18px; color: #0f172a; }
.sx-an__kpis { grid-template-columns: repeat(4, 1fr); }
.sx-an__day { margin: 10px 0; padding: 12px; border: 1px solid #e7edf5; border-radius: 12px; }
.sx-an__day > b { font-size: 13px; color: #0f172a; }
.sx-an__day span { display: flex; align-items: center; gap: 10px; margin-top: 8px; }
.sx-an__day i { display: block; width: 36%; height: 10px; border-radius: 99px; background: #0f172a; }
.sx-an__day em { font-style: normal; font-size: 12px; color: #64748b; }
.sx-an__day strong { margin-left: auto; font-size: 14px; }
.sx-an__split { grid-template-columns: repeat(3, 1fr); }
.sx-an__split span { display: block; margin-top: 6px; font-size: 13px; color: #334155; }
.sx-an__split b { float: right; margin-top: -18px; font-size: 14px; color: #0f172a; }
.sx-an__code { display: grid; grid-template-columns: 1.2fr .8fr auto auto; gap: 8px; align-items: center; margin-top: 10px; padding: 12px; border: 1px solid #e7edf5; border-radius: 12px; font-size: 13px; color: #334155; }
.sx-an__code b { grid-column: 1 / -1; font-size: 13px; color: #0f172a; }

/* Hero: composición del archivo fiel */
.o-shell {
  background: #fff;
  color: #070d38;
  margin-top: 0;
  padding-top: 0;
}
.o-shell::before { content: none; }
.o-shell::after { display: none; }
.o-hero.hx {
  position: relative;
  z-index: 1;
  overflow: hidden;
  padding: 0;
  min-height: 0;
  color: #070d38;
  background: linear-gradient(135deg, #fff 0%, #fff 28%, #f0f7ff 54%, #e6eaff 76%, #e8f6ff 100%);
}
.o-hero.hx::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(141deg, transparent 42%, rgba(158,194,255,.22) 42%, rgba(178,192,255,.08) 62%, transparent 62%),
    linear-gradient(128deg, transparent 61%, rgba(239,175,245,.2) 61%, transparent 85%);
}
.hx-inner {
  position: relative;
  width: var(--wrap);
  max-width: var(--wrap);
  min-height: 0;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(280px, 0.92fr) minmax(0, 1.08fr);
  align-items: center;
  gap: clamp(16px, 2.4vw, 36px);
  padding: 98px 0 86px;
}
.hx-copy {
  position: relative;
  z-index: 2;
  width: auto;
  max-width: none;
  padding: 0;
}
.hx-kicker {
  display: inline-block;
  margin: 0 0 32px;
  padding: 7px 12px;
  border-radius: 30px;
  background: #e9efff;
  color: #0966fa;
  font-family: Inter, Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  white-space: nowrap;
}
.o-hero.hx h1 {
  max-width: none;
  margin: 0 0 22px;
  color: #070d38;
  font-family: Inter, Arial, Helvetica, sans-serif;
  font-size: clamp(32px, 3.1vw, 48px);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -1.6px;
}
.hx-lead {
  max-width: none;
  margin: 0 0 28px;
  color: #445477;
  font-family: Inter, Arial, Helvetica, sans-serif;
  font-size: clamp(15px, 1.05vw, 17px);
  line-height: 1.5;
}
.hx-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 32px; }
.hx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 16px 40px;
  border: 2px solid #121a50;
  border-radius: 40px;
  background: transparent;
  color: #0a123f;
  font-family: Inter, Arial, Helvetica, sans-serif;
  font-size: 19px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}
.hx-btn:hover { transform: translateY(-2px); }
.hx-btn--go { border-color: #ff2683; background: #ff2683; color: #fff; box-shadow: 0 12px 24px #f4268030; }
.hx-feats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  max-width: none;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hx-feats li { text-align: center; color: #15224d; font-family: Inter, Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.35; }
.hx-feats i {
  width: 69px;
  height: 69px;
  margin: 0 auto 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #e6efff;
  color: #116aff;
}
.hx-feats li:nth-child(2) i,
.hx-feats li:nth-child(4) i { background: #ece7ff; color: #5a22e9; }
.hx-feats svg { width: 32px; height: 32px; stroke: currentColor; fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.hx-art {
  position: relative;
  z-index: 1;
  top: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  max-width: 100%;
  transform: none;
  pointer-events: none;
  justify-self: stretch;
}
.hx-art img { display: block; width: 100%; height: auto; }
@media (max-width: 1100px) {
  .hx-inner { display: block; min-height: 0; padding: 86px 0 50px; }
  .hx-copy { width: 100%; max-width: none; padding: 0; }
  .o-hero.hx h1 { font-size: clamp(36px, 5.6vw, 56px); }
  .hx-lead { font-size: 16px; }
  .hx-kicker { font-size: 12px; letter-spacing: 1.2px; }
  .hx-btn { font-size: 16px; padding: 14px 26px; }
  .hx-feats li { font-size: 14px; }
  .hx-feats i { width: 56px; height: 56px; }
  .hx-art { position: relative; top: auto; right: auto; bottom: auto; transform: none; width: 100%; margin: 28px 0 32px; }
}
@media (max-width: 640px) {
  .hx-inner { padding: 78px 0 50px; }
  .o-hero.hx h1 { font-size: clamp(36px, 9vw, 52px); letter-spacing: -1.8px; }
  .hx-kicker { font-size: 11px; letter-spacing: 1px; }
  .hx-actions { gap: 10px; }
  .hx-btn { font-size: 14px; padding: 13px 18px; }
  .hx-feats { gap: 8px; }
  .hx-feats li { font-size: 11px; }
  .hx-feats i { width: 47px; height: 47px; }
  .hx-feats svg { width: 24px; height: 24px; }
  .hx-art { width: 100%; margin: 20px 0 28px; }
}

/* Ritmo vertical común de la home */
:root { --sec-y: clamp(64px, 6.6vw, 96px); --head-gap: 48px; }
main > #como, main > .o-grow, main > #agente, main > #historias, main > #qr,
main > #analitica-qr, main > #features, main > #para-quien, main > #webinars,
main > #faq, main > #prueba {
  padding-top: var(--sec-y);
  padding-bottom: var(--sec-y);
}
main > section .s-head { margin-bottom: var(--head-gap); }
main > section .s-head .a-lead { margin-top: 14px; }
main > #agente .how-flow { column-gap: 72px; }
main > .o-int > .u-wrap { width: var(--wrap); }
@media (max-width: 767px) {
  :root { --head-gap: 32px; }
  main > #agente .how-flow { column-gap: 0; }
}
@media (max-width: 520px) {
  :root { --sec-y: 56px; }
  .sx-mail .sx-sig, .sig-inbox .sx-sig { grid-template-columns: 84px minmax(0, 1fr); padding: 20px 14px; }
  .sx-mail .sx-sig__logo b, .sig-inbox .sx-sig__logo b { font-size: 30px; }
  .sx-mail .sx-sig__main, .sig-inbox .sx-sig__main { padding-left: 14px; }
  .sx-mail .sx-sig strong, .sig-inbox .sx-sig strong { font-size: 18px; }
  .sx-mail .sx-sig__foot, .sig-inbox .sx-sig__foot { flex-wrap: wrap; gap: 12px; }
}

/* Títulos de sección con el mismo estilo que los bloques .mk-* */
main > section .a-title.a-title {
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: #0b1b3a;
}
main > section .s-head .a-title { max-width: 22ch; }
main > section .s-head .a-lead { color: #5b5670; }