/* ============================================================
   590.ª · /precios — cabecera en dos columnas + tablero real del rubro, conmutador en
   segmentos, tarjetas de plan como la referencia, garantías y canvas «sinapsis».
   Regla «sobrio ERP premium»: sin glow ni brillos, radios ≤ 8, sombras casi nulas,
   degradados solo muy suaves de fondo. Todo con prefijo p590 o dentro de .p590.
   ============================================================ */
:root{
  --p590-azul:#1747a6;         /* azul corporativo del plan destacado (referencia) */
  --p590-azul-2:#123a8a;
  --p590-tinta:#0f1f3d;
  --p590-gris:#55657f;
  --p590-tenue:#7b8aa3;
  --p590-fondo:#f5f7fb;
  --p590-panel:#ffffff;
  --p590-linea:#dfe5ef;
  --p590-linea-2:#c9d3e3;
  --p590-ok:#1f8a5b;
  --p590-suave:#eef3fb;
  --p590-sinapsis:23,71,166;
}
/* El portal cambia de tema con data-theme (lo pone app.js también según el sistema). */
:root[data-theme="dark"]{
  --p590-azul:#2b5cc0;
  --p590-azul-2:#21499c;
  --p590-tinta:#e6ecf5;
  --p590-gris:#a3b1c6;
  --p590-tenue:#7d8ca3;
  --p590-fondo:#0d141f;
  --p590-panel:#131c29;
  --p590-linea:#243246;
  --p590-linea-2:#30415a;
  --p590-ok:#4cc38a;
  --p590-suave:#16223a;
  --p590-sinapsis:120,160,225;
}

/* ---------- armado poco a poco (solo con JS; sin JS todo visible) ---------- */
.p590-js .p590-a{opacity:0;translate:0 10px;transition:opacity .42s ease,translate .42s ease;transition-delay:calc(var(--i,0) * 90ms)}
.p590-js .p590-a.p590-in{opacity:1;translate:0 0}
@media (prefers-reduced-motion:reduce){
  .p590-js .p590-a{opacity:1;translate:none;transition:none}
}

/* ---------- cabecera ---------- */
/* El héroe del portal trae foto por país/hora del día (style.css, con !important): aquí se aplana.
   :not(#p590x) sube la especificidad sin tocar style.css. */
:root .page-hero.p590-hero:not(#p590x){display:block;background:var(--p590-fondo)!important;background-image:linear-gradient(180deg,rgba(23,71,166,.05),rgba(23,71,166,0) 75%)!important;
  color:var(--p590-tinta);padding:40px 0 34px;border-bottom:1px solid var(--p590-linea);min-height:0}
:root[data-theme="dark"] .page-hero.p590-hero:not(#p590x){background-image:linear-gradient(180deg,rgba(80,120,200,.08),transparent 75%)!important}
:root .page-hero.p590-hero:not(#p590x)::before,:root .page-hero.p590-hero:not(#p590x)::after{display:none!important}
:root .page-hero.p590-hero:not(#p590x) .crumb{color:var(--p590-tenue)}
:root .page-hero.p590-hero:not(#p590x) h1{color:var(--p590-tinta);font-size:clamp(1.65rem,3.1vw,2.5rem);line-height:1.12;letter-spacing:-.025em;margin-bottom:10px;text-shadow:none;max-width:none}
:root .page-hero.p590-hero:not(#p590x) p{color:var(--p590-gris);max-width:560px;text-shadow:none;font-size:.98rem;line-height:1.6;display:block;-webkit-line-clamp:unset;overflow:visible}
:root .page-hero.p590-hero:not(#p590x) .btn{text-shadow:none}
.p590-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:36px;align-items:center;position:relative}
.p590-etq{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;
  color:var(--p590-azul);background:var(--p590-suave);border:1px solid var(--p590-linea);border-radius:6px;padding:5px 10px;margin-bottom:14px}
:root[data-theme="dark"] .p590-etq{color:#9dbcf5}
.p590-etq svg{flex:none}
.p590-hero .fe-alcance{opacity:1!important;color:var(--p590-gris)}
.p590-hero .precio-rubro{margin-top:18px}
.p590-hero .precio-rubro label{color:var(--p590-tinta)}
.p590-hero .precio-rubro select{background:var(--p590-panel);color:var(--p590-tinta);border:1px solid var(--p590-linea-2);border-radius:6px;padding:9px 12px;max-width:100%}
.p590-hero .precio-rubro-link,.p590-hero a{color:var(--p590-azul)}
:root[data-theme="dark"] .p590-hero .precio-rubro-link,:root[data-theme="dark"] .p590-hero a{color:#8fb1f2}

/* ---------- tablero real con puntos y lupa ---------- */
.p590-tab{margin:0;background:var(--p590-panel);border:1px solid var(--p590-linea);border-radius:8px;padding:10px 10px 8px;box-shadow:0 1px 2px rgba(15,31,61,.05);min-width:0}
.p590-tab-cab{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.8rem;color:var(--p590-tinta);padding:2px 4px 8px}
.p590-tab-pt{width:7px;height:7px;border-radius:50%;background:var(--p590-ok)}
.p590-tab-rub{color:var(--p590-gris)}
.p590-tab-ayuda{margin-inline-start:auto;font-size:.72rem;color:var(--p590-tenue)}
.p590-tab-vis{position:relative;border-radius:6px;overflow:hidden;border:1px solid var(--p590-linea);background:#f1f4f9;cursor:zoom-in;touch-action:manipulation}
.p590-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.p590-img-os{display:none}
:root[data-theme="dark"] .p590-img-os{display:block}
:root[data-theme="dark"] .p590-img-cl:has(+ .p590-img-os){visibility:hidden}
.p590-pt{position:absolute;left:calc(var(--x) + var(--w) - 4px);top:calc(var(--y) + 6px);translate:-100% 0;width:22px;height:22px;border-radius:50%;
  border:2px solid #fff;background:var(--p590-azul);color:#fff;font:700 .68rem/1 var(--body);display:grid;place-items:center;cursor:pointer;padding:0;z-index:2;
  box-shadow:0 1px 3px rgba(15,31,61,.35)}
.p590-pt::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid var(--p590-azul);opacity:0;animation:p590-late 2.8s ease-out infinite;animation-delay:calc(var(--i) * .35s)}
.p590-pt:focus-visible{outline:2px solid var(--p590-tinta);outline-offset:2px}
.p590-pt.on{background:var(--p590-tinta);border-color:#fff}
:root[data-theme="dark"] .p590-pt.on{background:#fff;color:var(--p590-azul)}
@keyframes p590-late{0%{opacity:.55;scale:.8}70%{opacity:0;scale:1.35}100%{opacity:0}}
/* marco de la zona activa */
.p590-tab-vis .p590-marco{position:absolute;border:2px solid var(--p590-azul);border-radius:6px;pointer-events:none;z-index:1;transition:all .25s ease}
/* lupa: muestra la captura a su tamaño real (≈2×) */
.p590-lupa{position:absolute;width:44%;aspect-ratio:16/10;max-width:280px;border:1px solid var(--p590-linea-2);border-radius:8px;overflow:hidden;background:#fff;
  pointer-events:none;opacity:0;transition:opacity .18s ease;z-index:3;box-shadow:0 6px 18px rgba(15,31,61,.18)}
.p590-lupa.on{opacity:1}
.p590-lupa.p590-lupa-zona{width:58%;max-width:360px}
.p590-lupa-img{position:absolute;inset:0;background-repeat:no-repeat}
.p590-tip{position:absolute;z-index:4;max-width:min(300px,80%);background:var(--p590-tinta);color:#fff;border-radius:6px;padding:8px 10px;font-size:.78rem;line-height:1.4;pointer-events:none}
:root[data-theme="dark"] .p590-tip{background:#e9eef6;color:#0f1f3d}
.p590-tip b{display:block;font-size:.8rem;margin-bottom:2px}
.p590-sello{position:absolute;right:8px;bottom:8px;z-index:2;display:inline-flex;align-items:center;gap:6px;background:var(--p590-panel);color:var(--p590-tinta);
  border:1px solid var(--p590-linea);border-radius:6px;padding:5px 9px;font-size:.72rem;box-shadow:0 1px 3px rgba(15,31,61,.12)}
.p590-sello svg{color:var(--p590-ok)}
.p590-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.p590-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--p590-linea);background:var(--p590-panel);color:var(--p590-tinta);border-radius:6px;
  padding:4px 9px 4px 5px;font:600 .74rem/1.2 var(--body);cursor:pointer;max-width:100%;text-align:start}
.p590-chip span{width:17px;height:17px;border-radius:50%;background:var(--p590-suave);color:var(--p590-azul);display:grid;place-items:center;font-size:.64rem;flex:none}
:root[data-theme="dark"] .p590-chip span{color:#9dbcf5}
.p590-chip:hover,.p590-chip.on{border-color:var(--p590-azul)}
.p590-chip.on span{background:var(--p590-azul);color:#fff}
.p590-tab-pie{font-size:.7rem!important;color:var(--p590-tenue)!important;margin:7px 2px 0!important;max-width:none!important}

/* ---------- conmutador Mensual / Anual en segmentos ---------- */
.toggle-wrap.p590-ciclo{display:flex;justify-content:center;align-items:center;gap:10px;margin:0 auto 30px;flex-wrap:wrap}
.p590-seg{display:inline-flex;background:var(--p590-panel);border:1px solid var(--p590-linea-2);border-radius:8px;padding:3px;gap:2px}
.p590-seg button{border:0;background:transparent;color:var(--p590-gris);font:600 .88rem/1 var(--body);padding:9px 18px;border-radius:6px;cursor:pointer}
.p590-seg button.on{background:var(--p590-azul);color:#fff}
.p590-seg button:focus-visible{outline:2px solid var(--p590-azul);outline-offset:2px}
.p590-ciclo .switch{display:none}
.p590-ahorro{font:700 .72rem/1 var(--body);color:var(--p590-ok);background:rgba(31,138,91,.1);border:1px solid rgba(31,138,91,.25);border-radius:6px;padding:6px 9px}
.p590-ciclo .save-pill{display:none}

/* ---------- zona de planes + canvas sinapsis ---------- */
.p590-zona{position:relative;isolation:isolate}
.p590-sinapsis{position:absolute;inset:-30px -20px;width:calc(100% + 40px);height:calc(100% + 60px);z-index:-1;pointer-events:none;display:block}
.p590 .plans.plans-4{gap:16px}
.p590 .plan{position:relative;background:var(--p590-panel);border:1px solid var(--p590-linea);border-radius:8px;padding:22px 20px 20px;box-shadow:0 1px 2px rgba(15,31,61,.04);transform:none}
.p590 .plan:hover{transform:none;border-color:var(--p590-linea-2);box-shadow:0 2px 8px rgba(15,31,61,.06)}
.p590 .plan::before,.p590 .plan::after{display:none}
.p590 .p590-ico{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;background:var(--p590-suave);color:var(--p590-azul);margin-bottom:12px}
:root[data-theme="dark"] .p590 .p590-ico{color:#9dbcf5}
.p590 .plan-free .p590-ico{color:#0d6e8a;background:#e6f3f6}
.p590 .plan[data-plan="Corporativo"] .p590-ico{color:#b25a12;background:#fbefe4}
:root[data-theme="dark"] .p590 .plan-free .p590-ico{background:#123040;color:#7cc9dc}
:root[data-theme="dark"] .p590 .plan[data-plan="Corporativo"] .p590-ico{background:#3a2a1a;color:#f0b27a}
.p590 .plan-badge{position:absolute;z-index:2;top:18px;right:16px;left:auto;transform:none;border-radius:6px!important;font-size:.62rem;padding:5px 9px;
  background:var(--p590-suave)!important;color:var(--p590-azul)!important;border:1px solid var(--p590-linea)!important;letter-spacing:.06em}
:root[data-theme="dark"] .p590 .plan-badge{color:#9dbcf5!important}
.p590 .plan-badge.plan-badge-soon{background:#fff6dc!important;color:#7a5a00!important}
.p590 .plan .p-name{color:var(--p590-tinta);font-size:1.22rem}
.p590 .plan .p-desc{color:var(--p590-gris);min-height:40px;margin-bottom:14px}
.p590 .plan .p-price .sym{color:var(--p590-tinta);-webkit-text-fill-color:currentColor;background:none;font-size:1.05rem}
.p590 .plan .p-price .now{color:var(--p590-tinta);-webkit-text-fill-color:currentColor;background:none;font-size:2.3rem}
.p590 .plan-free .p-price .now{color:var(--p590-tinta)}
.p590 .plan .p-price .per{color:var(--p590-gris)}
.p590 .plan .p-cycle{color:var(--p590-gris);margin:4px 0 14px}
.p590 .plan .p-features{gap:9px;margin-bottom:18px;font-size:.86rem}
.p590 .plan .p-features li .ck{border-radius:50%;background:var(--p590-suave);color:var(--p590-azul);font-size:.66rem;display:grid;place-items:center}
:root[data-theme="dark"] .p590 .plan .p-features li .ck{color:#9dbcf5}
.p590 .plan .p-features li.off .ck{background:var(--p590-fondo);color:var(--p590-tenue)}
.p590 .plan .btn{border-radius:6px;box-shadow:none}
.p590 .plan .btn-ghost{border:1px solid var(--p590-linea-2);color:var(--p590-tinta);background:var(--p590-panel)}
.p590 .plan .btn-ghost:hover{border-color:var(--p590-azul);color:var(--p590-azul)}
:root .p590 .plan .btn-acc{background:var(--p590-panel)!important;color:var(--p590-azul)!important;border:1px solid var(--p590-azul)!important;text-shadow:none}
:root[data-theme="dark"] .p590 .plan .btn-acc{color:#9dbcf5!important;border-color:#5f86d6!important}
.p590 .plan-free{border-color:var(--p590-linea)}
.p590 .plan .p-rubro-tag{border-radius:6px}
/* destacado: cabecera en azul corporativo, cuerpo claro (como la referencia) */
.p590 .plan.featured{padding:0;border:1px solid var(--p590-azul)!important;overflow:hidden;box-shadow:0 4px 14px rgba(23,71,166,.14)}
.p590 .plan.featured .p590-cab{background:linear-gradient(180deg,var(--p590-azul),var(--p590-azul-2));color:#fff;padding:22px 20px 16px;position:relative}
.p590 .plan.featured .p590-cuerpo{padding:16px 20px 20px;display:flex;flex-direction:column;flex:1}
.p590 .plan.featured .p590-ico{background:rgba(255,255,255,.14);color:#fff}
.p590 .plan.featured .plan-badge{background:#fff!important;color:var(--p590-azul)!important;border-color:#fff!important}
.p590 .plan.featured .p-name{color:#fff}
:root .p590 .plan.featured .p-price :is(.sym,.now){color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important}
.p590 .plan.featured .p-desc,.p590 .plan.featured .p-cycle,.p590 .plan.featured .p-price .per,.p590 .plan.featured .p-ref{color:rgba(255,255,255,.82)}
.p590 .plan.featured .p-cycle{margin-bottom:0}
.p590 .plan.featured .p-actual,.p590 .plan.featured .p-actual a{color:#dfe9ff}
.p590 .plan.featured .p-rubro-tag{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.25);margin-top:12px}
:root .p590 .plan.featured .btn-primary{background:var(--p590-azul)!important;border-color:var(--p590-azul)!important;color:#fff!important}
:root .p590 .plan.featured .btn-primary:hover{background:var(--p590-azul-2)!important}
.p590 .plan:not(.featured) .p590-cuerpo,.p590 .plan:not(.featured) .p590-cab{display:contents}

/* ---------- franja de garantías ---------- */
.p590-gar{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:26px 0 8px;padding:14px 6px;border:1px solid var(--p590-linea);border-radius:8px;background:var(--p590-panel)}
.p590-gar li{display:flex;align-items:center;gap:11px;padding:6px 16px;min-width:0}
.p590-gar li + li{border-inline-start:1px solid var(--p590-linea)}
.p590-gar-ico{color:var(--p590-azul);flex:none}
:root[data-theme="dark"] .p590-gar-ico{color:#9dbcf5}
.p590-gar b{display:block;font-size:.86rem;color:var(--p590-tinta)}
.p590-gar small{display:block;font-size:.76rem;color:var(--p590-gris)}

/* ---------- celular / tableta ---------- */
@media (max-width:1100px){
  .p590 .plans.plans-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p590-gar{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p590-gar li:nth-child(3){border-inline-start:0}
}
@media (max-width:900px){
  .p590-hero-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .p590-tab{order:-1}
  :root .page-hero.p590-hero:not(#p590x){padding:20px 0 26px}
}
@media (max-width:760px){
  .p590 .plans,.p590 .plans.plans-4,.p590 .plans.plans-2{grid-template-columns:minmax(0,1fr)}
  .p590 .plan.featured{order:-1}
  .p590-tab-ayuda{display:none}
  .p590-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;-webkit-overflow-scrolling:touch}
  .p590-chips::-webkit-scrollbar{display:none}
  .p590-chip{flex:none;white-space:nowrap}
  .p590-lupa{width:62%}
  .p590-sello{font-size:.64rem;padding:3px 6px;right:5px;bottom:5px}
  .p590-pt{width:18px;height:18px;font-size:.6rem;border-width:1.5px}
  .p590-gar{grid-template-columns:minmax(0,1fr);padding:6px}
  .p590-gar li{padding:9px 10px}
  .p590-gar li + li{border-inline-start:0;border-top:1px solid var(--p590-linea)}
  .p590 .plan .p-name{font-size:1.12rem}
}
@media (max-width:360px){
  .p590-seg button{padding:8px 12px}
  .p590-chip{font-size:.7rem}
}
@media (prefers-reduced-motion:reduce){
  .p590-pt::after{animation:none}
  .p590-lupa,.p590-tab-vis .p590-marco{transition:none}
}

/* ============================================================
   PRE0710 (07/10) · pedido del dueño
   1) Tablero de EJEMPLO (SVG) en lugar de la captura de la demo: solo crecimiento, poco texto.
   2) Fuera el fondo negro (t591-fondo, #050b18) que aparecía detrás de los planes al pasar el ratón
      y la sombra negra del plan: el plan sigue subiendo, con sombra neutra suave.
   ============================================================ */
.p590-ej{padding:14px 14px 10px}
.p590-ej .p590-tab-cab{padding:0 2px 10px}
.p590-ej-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.p590-ej-k{border:1px solid var(--p590-linea);border-radius:6px;padding:9px 10px;background:var(--p590-panel);min-width:0}
.p590-ej-k small{display:block;font:600 .68rem/1.2 var(--body);color:var(--p590-gris);text-transform:uppercase;letter-spacing:.03em}
.p590-ej-k b{display:flex;align-items:center;gap:4px;font:700 1.25rem/1.25 var(--body);color:var(--p590-tinta);margin-top:4px}
.p590-ej-k b.sube{color:var(--p590-ok)}
.p590-ej-k span{display:block;font-size:.7rem;color:var(--p590-tenue);margin-top:2px}
.p590-ej-graf{margin-top:8px;border:1px solid var(--p590-linea);border-radius:6px;padding:9px 10px 4px;background:var(--p590-panel)}
.p590-ej-gt{font:600 .7rem/1.2 var(--body);color:var(--p590-gris);text-transform:uppercase;letter-spacing:.03em;margin-bottom:4px}
.p590-ej-graf svg{display:block;width:100%;height:auto;aspect-ratio:560/210;overflow:visible}
.p590-ej-rej line{stroke:var(--p590-linea);stroke-width:1}
.p590-ej-bar rect{fill:var(--p590-azul);opacity:.13}
.p590-ej-area{fill:var(--p590-azul);opacity:.08}
.p590-ej-lin{fill:none;stroke:var(--p590-azul);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.p590-ej-pt{fill:var(--p590-panel);stroke:var(--p590-ok);stroke-width:2.5;vector-effect:non-scaling-stroke}
.p590-ej-mes text{fill:var(--p590-tenue);font:500 11px/1 var(--body);text-anchor:middle}
.p590-js .p590-ej.p590-in .p590-ej-lin{stroke-dasharray:1400;stroke-dashoffset:1400;animation:p590-ej-dib 1.6s ease-out .35s forwards}
@keyframes p590-ej-dib{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.p590-js .p590-ej .p590-ej-lin{animation:none;stroke-dashoffset:0}}
html.lite .p590-ej .p590-ej-lin{animation:none!important;stroke-dashoffset:0!important}
@media (max-width:520px){.p590-ej-k b{font-size:1.05rem}.p590-ej-k{padding:8px}.p590-ej-k span{display:none}}

.p590-zona > .t591-fondo{display:none!important}
@media (hover:hover) and (pointer:fine){
  :root .p590 .plan:is(:hover,.t591-on){box-shadow:0 10px 26px rgba(15,31,61,.13),0 2px 6px rgba(15,31,61,.06)!important}
  .p590-zona:has(.plan:is(:hover,.t591-on)) .plan:not(:hover):not(.t591-on){border-color:var(--p590-linea)}
}
/* filas de la comparativa y textos de los planes que abren la guía (597D) */
.p590 .compare tr.m597d-fila{cursor:pointer}
.p590 .compare tr.m597d-fila td.feat{text-decoration:underline dotted color-mix(in srgb,var(--p590-azul) 45%,transparent);text-underline-offset:3px}
.p590 .compare tr.m597d-fila:hover td{background:var(--p590-suave);color:var(--p590-tinta)}
.p590 .plan .p-features li.m597d-li{cursor:pointer}
/* PRE0710 · garantías: 3 fuera de Perú (sin SUNAT); línea breve de SUNAT en la cabecera solo en Perú */
[data-p590-pe][hidden],.p590-gar li[hidden]{display:none!important}
@media (min-width:1101px){.p590-gar:is(:has(> li:nth-child(3):last-child),:has(> li:nth-child(4)[hidden])){grid-template-columns:repeat(3,minmax(0,1fr))}}
:root .page-hero.p590-hero:not(#p590x) p.p590-fe-pe{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:.88rem;color:var(--p590-ok);font-weight:600}
@media (max-width:900px){.p590-tab.p590-ej{order:0}}
@media (max-width:620px){.p590-ej-mes text{font-size:19px}.p590-ej-gt{margin-bottom:2px}}
.p590 #comparativa .cc-row{cursor:pointer}
.p590 #comparativa .cc-row .cc-tx{text-decoration:underline dotted color-mix(in srgb,var(--p590-azul) 40%,transparent);text-underline-offset:3px}