/* Blog de agenteala.com — generado por scripts/marca_migrar.py a partir de los <style>
   que compartían los posts. Desde acá se edita a mano; los tokens vienen de
   /assets/marca/v1/agenteala-tokens.css, que cada post enlaza antes que este archivo. */
:root{
  /* tokens del home (home-alt/agenteala.css) */
  --bg:var(--papel);--surface:var(--papel);--surface2:var(--banda);--line:var(--linea);
  --ink:var(--tinta);--ink-soft:var(--tinta-2);--ink-faint:var(--tinta-3);
  --blue:var(--accion);--blue-d:var(--accion-hover);--blue-tint:var(--marca-clara);--sage:var(--ok);--wa:var(--accion);
  --f:var(--fuente-texto);
  --sh:none;
  /* alias legacy para estilos inline heredados */
  --f-sans:var(--f);--f-display:var(--f);
  --navy:var(--ink);--navy-soft:#5A4E40;--slate:var(--ink-soft);--mid:var(--ink-soft);--light:var(--ink-faint);
  --border:var(--line);--border-soft:#F1EADD;--white:#fff;--offwhite:var(--surface2);
  --az:var(--blue);--az-dark:var(--blue-d);--az-deep:var(--blue-d);--az-light:var(--blue-tint);--az-xlight:#F3F8FE;--green:var(--sage);
}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}
body{font-family:var(--f);background:radial-gradient(900px 560px at 12% -80px,rgba(242,227,196,.6),transparent 62%),radial-gradient(820px 520px at 92% -50px,rgba(245,231,216,.55),transparent 60%),#ffffff;background-repeat:no-repeat;color:var(--ink);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.7;overflow-x:hidden}
::selection{background:var(--blue);color:#fff}
a{color:inherit}

/* NAV — píldora blanca, igual al home */
.nav-wrap{position:sticky;top:0;z-index:50;background:transparent;padding:14px 20px}
.nav{max-width:1120px;margin:0 auto;padding:10px 12px 10px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#fff;border:1px solid var(--line);border-radius:40px;box-shadow:0 6px 22px rgba(0,0,0,.06)}
.nav-logo{font-family:var(--f);font-size:20px;font-weight:600;letter-spacing:-0.03em;color:var(--ink);text-decoration:none}
.nav-logo b{color:var(--blue);font-weight:600}
.nav-cta{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;font-size:14px;font-weight:600;padding:9px 18px;border-radius:var(--esquina-firma);text-decoration:none;box-shadow:none;transition:transform .15s,background .2s}
.nav-cta:hover{background:var(--blue-d);transform:translateY(-1px)}

/* BREADCRUMB */
.bc-wrap{padding:16px 20px 0}
.bc{max-width:800px;margin:0 auto;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-soft)}
.bc a{color:var(--ink-soft);text-decoration:none}.bc a:hover{color:var(--blue)}.bc-sep{color:var(--ink-faint)}

/* ARTÍCULO */
.wrap{max-width:800px;margin:0 auto;padding:40px 32px 80px}
.tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--blue-d);background:var(--blue-tint);padding:5px 13px;border-radius:var(--esquina-firma);margin-bottom:20px}
h1{font-family:var(--f);font-size:clamp(30px,4.4vw,46px);font-weight:600;line-height:1.12;letter-spacing:-0.02em;color:var(--ink);margin-bottom:18px}
.meta{display:flex;align-items:center;gap:20px;font-size:13px;color:var(--ink-soft);padding-bottom:28px;border-bottom:1px solid var(--line);margin-bottom:36px;flex-wrap:wrap}
.meta-author{font-weight:600;color:var(--ink)}

.body h2{font-family:var(--f);font-size:clamp(22px,2.8vw,30px);font-weight:600;letter-spacing:-0.02em;color:var(--ink);margin:48px 0 16px;line-height:1.15}
.body h3{font-family:var(--f);font-size:18px;font-weight:600;color:var(--ink);margin:30px 0 10px;line-height:1.3}
.body p{font-size:17px;line-height:1.75;color:var(--ink-soft);margin-bottom:18px}
.body strong{color:var(--ink);font-weight:600}
.body em{font-style:italic}
.body a{color:var(--blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;font-weight:500}
.body ul{margin:0 0 20px 20px}
.body ul li{color:var(--ink-soft);font-size:17px;line-height:1.9}
.lead{font-size:19px;line-height:1.65;color:var(--ink);margin-bottom:30px;font-weight:400}

.callout{background:var(--blue-tint);border-left:3px solid var(--blue);border-radius:0 12px 12px 0;padding:20px 24px;margin:28px 0}
.callout p{font-size:16px;color:var(--ink);margin:0}
.callout strong{color:var(--blue-d)}

/* CHAT COMPARATIVO — tokens del home */
.chat-compare{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0}
.chat-box{border-radius:18px;padding:22px;font-size:15px;line-height:1.6;border:1px solid var(--line);background:var(--surface);box-shadow:var(--sh)}
.chat-box.good{background:#F1F7FD;border-color:#D3E5F7}
.chat-label{font-size:11px;font-weight:700;letter-spacing:.08em;margin-bottom:14px;text-transform:uppercase}
.chat-box.bad .chat-label{color:var(--error)}
.chat-box.good .chat-label{color:var(--blue-d)}
.chat-msg{background:#fff;border:1px solid var(--line);border-radius:13px;padding:9px 13px;margin-bottom:8px;color:var(--ink);font-size:14px}
.chat-msg.agent{background:var(--blue);color:#fff;border-color:var(--blue)}
.chat-msg.agent-bad{background:#ECEAE6;color:var(--ink-soft);border-color:#E2DED6}
.chat-sender{font-size:11px;font-weight:600;margin-bottom:4px;opacity:.7}

/* FAQ — cards del home */
.faq-list{margin:0;display:flex;flex-direction:column;gap:12px}
.faq-item{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px 24px}
.faq-q{font-size:17px;font-weight:600;color:var(--ink);margin-bottom:8px;line-height:1.35}
.faq-a{font-size:15px;color:var(--ink-soft);line-height:1.6;margin:0}

/* CTA — card blanca con botón pill azul */
.cta-block{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:44px 40px;text-align:center;margin-top:60px;box-shadow:var(--sh)}
.cta-block h2{font-family:var(--f);font-size:clamp(24px,3vw,34px);font-weight:600;color:var(--ink);margin-bottom:12px;letter-spacing:-0.02em}
.cta-block p{font-size:17px;color:var(--ink-soft);margin-bottom:26px;max-width:480px;margin-left:auto;margin-right:auto}
.btn-cta{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;font-size:15px;font-weight:600;padding:13px 26px;border-radius:var(--esquina-firma);text-decoration:none;box-shadow:none;transition:transform .15s,background .2s}
.btn-cta:hover{background:var(--blue-d);transform:translateY(-1px)}
.body .btn-cta:not(.btn-ghost){color:#fff}

/* FOOTER del artículo */
.art-footer{border-top:1px solid var(--line);margin-top:56px;padding-top:28px;text-align:center;font-size:13px;color:var(--ink-faint)}
.art-footer a{color:var(--ink-soft);text-decoration:none}.art-footer a:hover{color:var(--blue)}

/* WhatsApp flotante (igual al home) */
.wa-fab{position:fixed;right:20px;bottom:20px;z-index:60;width:58px;height:58px;border-radius:50%;background:var(--accion);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(0,0,0,.22);transition:transform .15s}
.wa-fab:hover{transform:scale(1.07)}
.wa-fab svg{width:32px;height:32px}

@media(max-width:640px){.wrap{padding:32px 20px 60px}.nav-wrap{padding:12px 14px}.nav{padding:8px 10px 8px 18px}.cta-block{padding:34px 24px}.chat-compare{grid-template-columns:1fr}.wa-fab{width:54px;height:54px;right:16px;bottom:16px}}

/* componentes extra (steps / stat / tabla / lista→) — home skin */
.steps{counter-reset:step;list-style:none;margin:0 0 28px;padding:0}
.step-item{counter-increment:step;display:flex;gap:20px;margin-bottom:28px;align-items:flex-start}
.step-num{min-width:48px;height:48px;border-radius:50%;background:var(--blue);color:#fff;font-family:var(--f);font-size:22px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.step-content h3{font-size:19px;font-weight:600;color:var(--ink);margin-bottom:8px;line-height:1.3}
.step-content p{font-size:16px;color:var(--ink-soft);line-height:1.65;margin:0}
.no-list{list-style:none;margin:0 0 20px;padding:0}
.no-list li{font-size:17px;color:var(--ink-soft);padding:10px 0;display:flex;gap:12px;align-items:flex-start;border-bottom:1px solid var(--border-soft)}
.no-list li:last-child{border-bottom:none}
.no-list li::before{content:'\2192';color:var(--blue);font-weight:700;flex-shrink:0;margin-top:2px}
.comp-table{width:100%;border-collapse:collapse;margin:12px 0 28px;font-size:15px;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.comp-table th{background:var(--surface2);color:var(--ink);font-weight:700;text-align:left;padding:12px 16px;font-size:14px}
.comp-table td{padding:12px 16px;color:var(--ink-soft);border-bottom:1px solid var(--border-soft)}
.comp-table tr:nth-child(even) td{background:var(--surface2)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin:24px 0}
.stat-card{background:var(--surface2);border:1px solid var(--line);border-radius:12px;padding:20px 24px;text-align:center}
.stat-num{font-family:var(--f);font-size:36px;font-weight:700;color:var(--blue);line-height:1;margin-bottom:6px}
.stat-label{font-size:13px;color:var(--ink-soft);line-height:1.4}
.related{max-width:800px;margin:56px auto 0;padding:0 32px}
.related h3{font-family:var(--fuente-texto);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:18px}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:640px){.related-grid{grid-template-columns:1fr}.related{padding:0 20px}}
.related-card{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px;text-decoration:none;box-shadow:var(--sh);transition:transform .15s,border-color .2s}
.related-card:hover{transform:translateY(-3px);border-color:#D9E6F5}
.related-card .rt{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.related-card .rh{font-family:var(--fuente-texto);font-size:15px;font-weight:600;color:var(--ink);line-height:1.3}
.conv-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px}
.conv .btn-ghost{background:transparent;border:1.5px solid currentColor}
.conv-ig{display:inline-flex;align-items:center;gap:10px;margin-top:20px;font-size:.95rem;text-decoration:none;opacity:.92}
.conv-ig svg{width:26px;height:26px;flex:0 0 auto}
.conv-ig b{font-weight:700}

/* identidad carita · scripts/marca_migrar.py */
body{background:var(--papel);font-family:var(--fuente-texto)}
.nav-wrap{background:var(--papel);border-bottom:var(--borde);padding:0 20px}
.nav{height:64px;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.nav-logo{display:inline-flex;align-items:center}
.nav-logo img{height:26px;width:auto;display:block}
.nav-cta,.btn-cta{background:var(--accion);color:var(--sobre-accion);border-radius:var(--esquina-firma);font-weight:700;box-shadow:none}
.nav-cta:hover,.btn-cta:hover{background:var(--accion-hover);transform:none}
.conv .btn-ghost{background:transparent;color:var(--accion);border:1px solid var(--accion)}
.conv .btn-ghost:hover{background:var(--marca-clara)}
h1{font-family:var(--fuente-titulos);font-weight:700;letter-spacing:-.025em;line-height:1.08}
.body h2,.body h3,.cta-block h2,.step-content h3,.related-card .rh{font-family:var(--fuente-titulos);font-weight:700}
.tag{border-radius:var(--radio-chico) 12px var(--radio-chico) var(--radio-chico);color:var(--accion);background:var(--marca-clara)}
.body a{color:var(--link)}
.callout{border-left-color:var(--marca);border-radius:0 var(--radio-firma) var(--radio-chico) 0}
.callout strong{color:var(--accion)}
.chat-box,.faq-item,.cta-block,.related-card,.stat-card{border-radius:var(--esquina-firma);box-shadow:none}
.related-card:hover{transform:none;border-color:var(--marca)}
.chat-box.good{background:var(--marca-clara);border-color:var(--marca-clara)}
.chat-box.good .chat-label{color:var(--accion)}
.chat-box.bad .chat-label{color:var(--error)}
.chat-msg.agent{background:var(--accion);border-color:var(--accion)}
.step-num{border-radius:var(--radio-chico) 14px var(--radio-chico) var(--radio-chico);background:var(--marca);font-family:var(--fuente-titulos);font-weight:800}
.stat-num{font-family:var(--fuente-titulos);font-weight:800;color:var(--marca)}
.no-list li::before{color:var(--marca)}
.comp-table{border-radius:var(--esquina-firma)}
.comp-table th{background:var(--banda)}
.related h3,.related-card .rt{font-family:var(--fuente-texto);color:var(--tinta-2)}
.wa-fab{background:var(--accion);border-radius:var(--esquina-firma);box-shadow:none}
.wa-fab:hover{background:var(--accion-hover);transform:none}
@media(max-width:640px){.nav-wrap{padding:0 14px}.nav{height:56px}.nav-logo img{height:24px}}