/* Callsy X — lo propio de las páginas públicas (precios, nosotros, contacto y privacidad), sobre base.css,
   sitio.css y panel.css. Se carga después de panel.css. Celular primero; nada se mueve aquí. */

/* ==================================================================== Comunes */
/* Índice de la política y enlaces sueltos: área táctil de 44 px */
.indice a{min-height:44px}

/* Datos de contacto (WhatsApp y correo) con su icono; los mismos nombres y valores que la portada (secciones.css) */
.contacto-datos{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 20px}
.contacto-dato{display:inline-flex;align-items:center;gap:9px;min-height:44px;color:var(--ink);text-decoration:none;font-size:.95rem;font-variant-numeric:tabular-nums;
  transition:color var(--t-hover) var(--ease);overflow-wrap:anywhere}
.contacto-dato svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--brand);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.contacto-dato:hover{color:var(--brand)}
.contacto-datos--pie .contacto-dato{font-size:.86rem;color:var(--muted)}
.contacto-datos--pie .contacto-dato:hover{color:var(--brand)}

.chip--chico{padding:3px 9px;font-size:.72rem;gap:4px;white-space:nowrap}

/* ==================================================================== Precios */
/* Sellos de la cabecera: lo esencial en tres frases */
.sellos{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 10px}
.sellos li{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 14px;border-radius:var(--r-pill);
  border:1px solid var(--line-strong);background:rgba(255,255,255,.03);color:var(--ink);font-size:.88rem;line-height:1.3}
.sellos img{height:11px;width:auto;flex:none}

/* De dónde salen los precios (TRM y fecha) */
.precios-fuente{list-style:none;margin:18px 0 16px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.precios-fuente li{display:inline-flex;align-items:flex-start;gap:8px;padding:8px 14px;border-radius:var(--r-md);
  border:1px solid rgba(94,227,207,.28);background:rgba(94,227,207,.06);color:var(--ink);font-size:.86rem;line-height:1.45}
.precios-fuente li::before{content:"";flex:none;width:7px;height:7px;margin-top:.45em;border-radius:50%;background:var(--brand);box-shadow:0 0 8px rgba(94,227,207,.8)}

.tabla-espera{min-height:96px;margin-top:18px}
.precios-fuente:not([hidden]) + .tabla-espera{margin-top:0}
.no-js .tabla-espera{display:none}   /* sin JS no hay carga: queda el aviso del <noscript> */
noscript .alerta{margin-top:18px}
.precios-sin-tabla{gap:10px;padding:16px 18px}
.precios-sin-tabla p{margin:0}
.precios-sin-tabla__acciones{display:flex;flex-wrap:wrap;gap:10px}

/* Tabla por modelo: dos grupos (pesos y dólares) con entrada y salida */
.tabla--precios table{min-width:0}
@media (min-width:700px){.tabla--precios table{min-width:720px}}
.tabla--precios th.grupo{text-align:center;border-left:1px solid var(--line);color:var(--ink)}
.tabla--precios thead tr:last-child th:nth-child(odd){border-left:1px solid var(--line)}
.tabla--precios th .chico{text-transform:none;letter-spacing:0;color:var(--muted);font-size:.74rem}
.tabla--precios thead th[rowspan]{vertical-align:bottom}
.tabla--precios td:nth-child(2),.tabla--precios td:nth-child(4){border-left:1px solid var(--line)}
.tabla--precios td.num{font-size:.95rem;color:var(--ink)}
.tabla--precios td:nth-child(n+4){color:var(--muted)}
.celda-modelo{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.celda-modelo .mono{color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.tabla--precios tr.fila--defecto td{background:rgba(94,227,207,.04)}
@media (max-width:699px){
  .tabla--precios td:nth-child(2),.tabla--precios td:nth-child(4){border-left:0}
  /* En tarjeta, el modelo es el título: sin etiqueta y alineado a la izquierda */
  .tabla--tarjetas td.celda-modelo{justify-content:flex-start;text-align:left;padding:6px 0 10px}
  .tabla--tarjetas td.celda-modelo::before{display:none}
  .tabla--tarjetas td.celda-modelo .mono{font-size:1rem}
  .tabla--precios tr.fila--defecto{border-color:rgba(94,227,207,.35);background:rgba(94,227,207,.05)}
  .tabla--precios tr.fila--defecto td{background:transparent}
}

/* Qué es entrada y qué es salida */
.precios-leyenda{margin:14px 0 0;display:grid;gap:6px;font-size:.86rem;color:var(--muted)}
.precios-leyenda dt{display:inline;color:var(--ink);font-weight:600}
.precios-leyenda dt::after{content:":\00a0"}
.precios-leyenda dd{display:inline;margin:0}

/* Ejemplo + "se actualizan solos": si falta el ejemplo, la otra tarjeta ocupa todo el ancho */
.precios-duo{display:grid;gap:16px;margin-top:28px;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));align-items:stretch}
.precios-duo > *{min-width:0}
.precios-ejemplo{align-content:start}
.precios-ejemplo .p b{color:var(--ink);font-weight:600}
.precios-ejemplo__cifra{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 4px;font-variant-numeric:tabular-nums}
.precios-ejemplo__unidad{font:500 .95rem/1.3 var(--font-body);letter-spacing:0;color:var(--muted)}
.precios-solos .lista-x{gap:14px}
.precios-solos .lista-x li{font-size:.94rem;line-height:1.5}
.precios-solos .lista-x b{color:var(--ink);font-weight:600}

/* Cómo recargas */
.recarga{padding:24px 20px;display:grid;gap:22px}
.recarga > *{position:relative;min-width:0}
.recarga__cab .h2{margin-bottom:8px}
.recarga__pasos{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.recarga__pasos li{display:grid;gap:4px;align-content:start;padding:16px;border-radius:var(--r-md);border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted);font-size:.92rem;line-height:1.5}
.recarga__pasos b{color:var(--ink);font-weight:600;font-size:1rem}
.recarga__accion{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.recarga__accion .btn{white-space:normal;text-align:center}
@media (min-width:640px){.recarga__pasos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.recarga{padding:40px}.recarga__pasos{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ==================================================================== Contacto */
.canal{display:grid;gap:6px}
.canal .contacto-dato{font-size:1.02rem;font-weight:600}
.canal .btn{justify-self:start;white-space:normal;text-align:center}
/* En celular el formulario va primero: WhatsApp y correo quedan a la mano bajo el título (en escritorio están al lado) */
.contacto-rapido{margin-top:16px}
@media (min-width:900px){.contacto-rapido{display:none}}

/* ==================================================================== Nosotros */
.cierre__datos{margin-top:14px}

/* ==================================================================== Privacidad */
.prosa .alerta{color:var(--ink);font-size:.95rem}
.prosa .alerta--aviso{color:#FDE68A}
.prosa .alerta--aviso b{color:#FEF3C7}