/* ============================================================
   antesdefirma · web v3 — base compartida
   Paleta: tinta #0E1D28 · crema #F6F2EA · oliva #5C6B47 · hueso #EDEDE6
   Tipos: Newsreader (display, variable con eje óptico) · Outfit · Manrope · Space Grotesk
   ============================================================ */

:root {
  --serif: 'Newsreader';
  --peso-h1: 540;
  --peso-h2: 500;
  --tinta: #0E1D28;
  --crema: #F6F2EA;
  --oliva: #5C6B47;
  --hueso: #EDEDE6;
}

html { scroll-behavior: smooth; }
body { margin: 0; background: var(--crema); color: var(--tinta); font-optical-sizing: auto; -webkit-font-smoothing: antialiased; }
a { color: var(--oliva); }
a:hover { color: var(--tinta); }
img { max-width: 100%; }
.hidden { display: none !important; }

/* hover de las tarjetas de doble puerta */
[data-hv="sand"]:hover { background: #ECE5D8 !important; }

/* ---------- nav móvil ---------- */
.nav-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 42px;
  height: 42px;
  padding: 0 9px;
  border: 1px solid rgba(14, 29, 40, 0.35);
  background: transparent;
  cursor: pointer;
  box-sizing: border-box;
}
.nav-burger span { display: block; height: 2px; background: var(--tinta); }

.mobile-nav {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #ECE5D8;
  background: #FBF9F4;
}
.mobile-nav a {
  font-family: 'Manrope', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: var(--tinta);
  text-decoration: none;
  padding: 16px 24px;
  border-top: 1px solid #ECE5D8;
}

/* ---------- chips del modal de llamada ---------- */
.chip-dia,
.js-franja {
  font-family: 'Manrope', sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  padding: 9px 14px;
  cursor: pointer;
  border: 1px solid rgba(14, 29, 40, 0.35);
  background: #FBF9F4;
  color: var(--tinta);
}
.js-franja { padding: 10px 0; text-align: center; }
.chip-dia.sel,
.js-franja.sel { background: var(--tinta); color: var(--hueso); border-color: var(--tinta); }

/* ---------- chat guiado ---------- */
.chat-chip {
  display: block;
  font-family: 'Manrope', sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--hueso);
  background: #1A2C38;
  border: 1px solid rgba(237, 237, 230, 0.22);
  padding: 11px 14px;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
  width: 100%;
}
.chat-chip:hover { border-color: var(--oliva); color: var(--hueso); }

/* ---------- responsive de esqueleto (afinar en el cableado) ---------- */
@media (max-width: 960px) {
  .main-nav { display: none !important; }
  .nav-burger { display: flex; }
  /* el CTA oliva del header se oculta; "Acceso al portal" queda SIEMPRE visible */
  .header-actions a:not(.portal-link) { display: none; }

  h1 { font-size: clamp(42px, 11vw, 64px) !important; }
  h2 { font-size: clamp(30px, 7.5vw, 44px) !important; }

  div[style*="white-space: nowrap"] { white-space: normal !important; }

  div[style*="grid-template-columns: 1fr 1fr"],
  div[style*="grid-template-columns: 1fr 1.15fr"],
  div[style*="grid-template-columns: 1fr 300px"],
  div[style*="grid-template-columns: 1fr 480px"],
  div[style*="grid-template-columns: 1fr 500px"],
  div[style*="grid-template-columns: 1fr 520px"],
  div[style*="grid-template-columns: 1fr 560px"],
  div[style*="grid-template-columns: 380px 1fr"],
  div[style*="grid-template-columns: 420px 1fr"],
  div[style*="grid-template-columns: 1.55fr 1fr"],
  div[style*="grid-template-columns: 1.4fr 1fr"],
  div[style*="grid-template-columns: repeat(4, 1fr)"],
  div[style*="grid-template-columns: repeat(auto-fit"] { grid-template-columns: 1fr !important; }

  div[style*="grid-template-columns: 72px 1fr 240px"] { grid-template-columns: 48px 1fr !important; }
  div[style*="grid-template-columns: 72px 1fr 240px"] > span:last-child { grid-column: 2; text-align: left !important; }

  div[style*="padding: 0 56px"] { padding: 0 20px !important; }
  div[style*="padding: 56px 56px 0"] { padding: 40px 24px 0 !important; }
  div[style*="padding: 96px 56px 0"] { padding: 64px 24px 0 !important; }
  div[style*="padding: 72px 56px 0"] { padding: 48px 24px 0 !important; }
  div[style*="padding: 44px 56px 40px"] { padding: 32px 24px 28px !important; }
  div[style*="padding: 52px 56px 56px"] { padding: 40px 24px !important; }
  div[style*="padding: 72px 56px 76px"] { padding: 48px 24px 52px !important; }
  div[style*="padding: 80px 56px 84px"] { padding: 56px 24px 60px !important; }
  div[style*="padding: 16px 56px"] { padding: 12px 20px !important; }
}

/* ============================================================
   CABLEADO v3 — estilos de las features reales (freemium, chat,
   checkout auxiliar). Paleta del handoff: tinta #0E1D28, oliva
   #5C6B47, hueso #EDEDE6, panel oscuro #13242F / #1A2C38.
   ============================================================ */

/* ---------- freemium: resultado de la consulta (fondo oscuro) ---------- */
#fmResult { font-family: 'Manrope', sans-serif; color: #EDEDE6; }
.fm-kv { display: flex; flex-wrap: wrap; gap: 8px; }
.fm-chip {
  display: inline-block; border: 1px solid rgba(237,237,230,0.22); background: #1A2C38;
  padding: 4px 12px; font-size: 12.5px; color: #EDEDE6; font-variant-numeric: tabular-nums;
}
.fm-chip b { color: #EDEDE6; }
.fm-valor { display: block; margin-top: 8px; border-color: rgba(140,168,118,0.5); }
.fm-nota { color: rgba(237,237,230,0.55); }
.fm-pts-h {
  font-family: 'Space Grotesk', monospace; font-size: 11px; letter-spacing: 1.5px;
  text-transform: uppercase; color: #8FA876; margin: 14px 0 6px;
}
.fm-pts { margin: 0; padding-left: 18px; font-size: 13.5px; line-height: 1.6; color: rgba(237,237,230,0.85); columns: 2; column-gap: 28px; }
.fm-pts li { break-inside: avoid; margin-bottom: 3px; }
.fm-disc { font-size: 11.5px; color: rgba(237,237,230,0.5); margin-top: 10px; }
.fm-err { font-size: 13.5px; color: #E4B4B4; border: 1px solid rgba(228,180,180,0.35); background: rgba(154,68,68,0.15); padding: 10px 14px; }
.fm-loading { font-size: 13.5px; color: rgba(237,237,230,0.7); }
.fm-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.fm-btn {
  font-family: 'Manrope', sans-serif; font-size: 14px; font-weight: 700; color: #EDEDE6;
  background: #5C6B47; padding: 12px 20px; text-decoration: none; display: inline-block;
}
.fm-btn.ghost { background: transparent; border: 1px solid rgba(237,237,230,0.35); }
@media (max-width: 640px) { .fm-pts { columns: 1; } }

/* ---------- chat: hilo real ---------- */
#chatBody .msg {
  font-family: 'Manrope', sans-serif; font-size: 13.5px; line-height: 1.55;
  padding: 10px 13px; max-width: 88%; overflow-wrap: break-word;
}
#chatBody .msg.bot { color: #EDEDE6; background: #13242F; border: 1px solid rgba(237,237,230,0.12); align-self: flex-start; }
#chatBody .msg.user { color: #EDEDE6; background: #5C6B47; align-self: flex-end; }
#chatBody .typing { display: inline-flex; gap: 4px; padding: 2px 0; }
#chatBody .typing span {
  width: 6px; height: 6px; border-radius: 50%; background: rgba(237,237,230,0.55);
  animation: adfTyping 1.2s infinite;
}
#chatBody .typing span:nth-child(2) { animation-delay: 0.15s; }
#chatBody .typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes adfTyping { 0%, 60%, 100% { opacity: 0.35; } 30% { opacity: 1; } }

/* ---------- checkout: auxiliares del cableado ---------- */
.dir-ok { display: block; font-family: 'Manrope', sans-serif; font-size: 12.5px; color: #43512F; margin-top: 6px; }
#promoRow { display: none; }