:root { --p: 1px; }

/* Simulador «Ver cómo funciona» y lámina «Cobra por WhatsApp» (14-oct-2026). Generado por tools/simulador.py. */
.sim-tel { --wa: #1fa855; flex: none; width: calc(300 * var(--p)); height: calc(640 * var(--p)); padding: calc(9 * var(--p)); border-radius: calc(48 * var(--p)); background: #101318; box-shadow: 0 calc(30 * var(--p)) calc(60 * var(--p)) -20px rgba(15,26,46,.45), inset 0 0 0 1.5px #2a2f38; }
.sim-pant { position: relative; width: 100%; height: 100%; border-radius: calc(39 * var(--p)); overflow: hidden; background: #efe7dd; font-family: -apple-system, "SF Pro Text", Inter, system-ui, sans-serif; color: #111; text-align: left; }
.sim-pant::before { content: ""; position: absolute; z-index: 9; top: calc(9 * var(--p)); left: 50%; width: calc(92 * var(--p)); height: calc(26 * var(--p)); margin-left: -46px; border-radius: calc(20 * var(--p)); background: #000; }
.sim-s { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .35s ease, visibility .35s; }
.sim-s.on { opacity: 1; visibility: visible; }
.sim-sb { position: relative; z-index: 2; height: calc(44 * var(--p)); display: flex; align-items: center; justify-content: space-between; padding: calc(6 * var(--p)) calc(24 * var(--p)) 0 calc(34 * var(--p)); font-weight: 600; font-size: calc(15 * var(--p)); background: #f6f6f6; }
.sim-sb svg { width: calc(66 * var(--p)); height: calc(13 * var(--p)); }
.sim-sb.claro { background: transparent; color: #fff; }

.sim-wa { background: #efe7dd; }
.sim-wa-head { display: flex; align-items: center; gap: calc(8 * var(--p)); padding: calc(2 * var(--p)) calc(12 * var(--p)) calc(8 * var(--p)); background: #f6f6f6; border-bottom: 1px solid #e2e2e2; }
.sim-wa-back { display: inline-flex; align-items: center; gap: calc(4 * var(--p)); height: calc(34 * var(--p)); padding: 0 calc(10 * var(--p)) 0 calc(9 * var(--p)); border-radius: calc(17 * var(--p)); background: #fff; box-shadow: 0 1px calc(3 * var(--p)) rgba(0,0,0,.12); font-size: calc(16 * var(--p)); }
.sim-wa-back svg { width: calc(9 * var(--p)); height: calc(15 * var(--p)); }
.sim-wa-back b { font-weight: 500; }
.sim-wa-av { width: calc(36 * var(--p)); height: calc(36 * var(--p)); border-radius: 50%; }
.sim-wa-head div { display: flex; flex-direction: column; min-width: 0; }
.sim-wa-head div b { font-size: calc(16 * var(--p)); font-weight: 600; line-height: 1.2; }
.sim-wa-head small { font-size: calc(11 * var(--p)); color: #6d6d72; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sim-wa-body { position: absolute; top: calc(89 * var(--p)); left: 0; right: 0; bottom: calc(58 * var(--p)); padding: calc(10 * var(--p)) calc(12 * var(--p)); display: flex; flex-direction: column; align-items: flex-start; gap: calc(8 * var(--p));
  background-color: #efe7dd; background-image: radial-gradient(rgba(140,120,95,.10) 1.2px, transparent 1.4px), radial-gradient(rgba(140,120,95,.07) 1px, transparent 1.2px); background-size: 22px 22px, 15px 15px; background-position: 0 0, 7px 9px; }
.sim-wa-dia { align-self: center; padding: calc(3 * var(--p)) calc(10 * var(--p)); border-radius: calc(8 * var(--p)); background: #fff; font-size: calc(11.5 * var(--p)); color: #54656f; box-shadow: 0 1px .5px rgba(0,0,0,.1); }
.sim-wa-card { width: calc(238 * var(--p)); background: #fff; border-radius: calc(16 * var(--p)); overflow: hidden; box-shadow: 0 1px .5px rgba(0,0,0,.13); }
.sim-wa-card img { display: block; width: 100%; height: auto; }
.sim-wa-card .hd { font-weight: 700; font-size: calc(15.5 * var(--p)); padding-top: calc(11 * var(--p)); }
.sim-wa-out { align-self: flex-end; max-width: calc(210 * var(--p)); margin-bottom: calc(8 * var(--p)); padding: calc(7 * var(--p)) calc(10 * var(--p)) calc(6 * var(--p)) calc(11 * var(--p)); border-radius: calc(12 * var(--p)) calc(4 * var(--p)) calc(12 * var(--p)) calc(12 * var(--p)); background: #d9fdd3; font-size: calc(14.5 * var(--p)); line-height: 1.3; box-shadow: 0 1px .5px rgba(0,0,0,.13); }
.sim-wa-out time { display: block; text-align: right; font-size: calc(11 * var(--p)); color: #667781; margin-top: calc(2 * var(--p)); }
.sim-wa-card p { margin: 0; padding: calc(8 * var(--p)) calc(11 * var(--p)) 0; font-size: calc(14.5 * var(--p)); line-height: 1.3; }
.sim-wa-pie { display: flex; justify-content: space-between; align-items: flex-end; padding: calc(8 * var(--p)) calc(11 * var(--p)) calc(7 * var(--p)); font-size: calc(13 * var(--p)); color: #8a8a8e; }
.sim-wa-pie time { font-size: calc(11 * var(--p)); }
.sim-wa-btn { display: flex; align-items: center; justify-content: center; gap: calc(6 * var(--p)); padding: calc(10 * var(--p)); border-top: 1px solid #ececec; color: var(--wa); font-size: calc(16 * var(--p)); }
.sim-wa-btn svg { width: calc(19 * var(--p)); height: calc(19 * var(--p)); }
.sim-wa-input { position: absolute; left: 0; right: 0; bottom: 0; height: calc(58 * var(--p)); padding: calc(6 * var(--p)) calc(12 * var(--p)) calc(12 * var(--p)); display: flex; align-items: center; gap: calc(10 * var(--p)); background: #f6f6f6; color: #111; }
.sim-wa-input i { display: grid; place-items: center; }
.sim-wa-input i svg { width: calc(24 * var(--p)); height: calc(24 * var(--p)); }
.sim-wa-input span { flex: 1; height: calc(32 * var(--p)); border-radius: calc(16 * var(--p)); background: #fff; border: 1px solid #e0e0e0; display: flex; justify-content: flex-end; align-items: center; padding-right: calc(8 * var(--p)); }
.sim-wa-input span svg { width: calc(20 * var(--p)); height: calc(20 * var(--p)); }
.sim-wa-input em { width: calc(34 * var(--p)); height: calc(34 * var(--p)); border-radius: 50%; background: var(--wa); display: grid; place-items: center; }
.sim-wa-input em svg { width: calc(18 * var(--p)); height: calc(18 * var(--p)); }

/* El Flow: hoja sobre el chat oscurecido. */
.sim-wa-flow .sim-sb { background: transparent; }
.sim-wa-tras { position: absolute; inset: 0; padding-top: calc(44 * var(--p)); filter: brightness(.62) saturate(.6); }
.sim-wa-flow > .sim-sb { color: #111; }
.sim-fl { position: absolute; z-index: 3; top: calc(52 * var(--p)); left: 0; right: 0; bottom: 0; border-radius: calc(22 * var(--p)) calc(22 * var(--p)) 0 0; background: #f4f4f4; display: flex; flex-direction: column; }
.sim-fl-grab { align-self: center; width: calc(36 * var(--p)); height: calc(5 * var(--p)); margin-top: calc(7 * var(--p)); border-radius: calc(3 * var(--p)); background: #c7c7cc; }
.sim-fl-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: calc(8 * var(--p)) calc(14 * var(--p)) calc(10 * var(--p)); }
.sim-fl-top b { font-size: calc(17 * var(--p)); font-weight: 700; text-align: center; }
.sim-fl-cancel { color: var(--wa); font-size: calc(16 * var(--p)); }
.sim-fl-atras { color: #111; }
.sim-fl-atras svg { width: calc(11 * var(--p)); height: calc(19 * var(--p)); }
.sim-fl-mas { justify-self: end; width: calc(30 * var(--p)); height: calc(30 * var(--p)); border-radius: 50%; background: #e5e5ea; display: grid; place-items: center; color: var(--wa); }
.sim-fl-mas svg { width: calc(17 * var(--p)); height: calc(17 * var(--p)); }
.sim-fl-prog { height: calc(4 * var(--p)); margin: 0 calc(14 * var(--p)); border-radius: calc(2 * var(--p)); background: #e3e3e8; overflow: hidden; }
.sim-fl-prog i { display: block; height: 100%; border-radius: calc(2 * var(--p)); background: var(--wa); }
.sim-fl-cuerpo { flex: 1; overflow: hidden; padding: calc(16 * var(--p)) calc(16 * var(--p)) 0; }
.sim-fl-cuerpo p { margin: 0; }
.sim-fl-cuerpo .fh { font-size: calc(28 * var(--p)); font-weight: 700; line-height: 1.15; margin: calc(4 * var(--p)) 0 calc(16 * var(--p)); letter-spacing: -.01em; }
.sim-fl-cuerpo .fh2 { font-size: calc(24 * var(--p)); margin-bottom: calc(10 * var(--p)); }
.sim-fl-cuerpo .fs { font-size: calc(21 * var(--p)); font-weight: 700; line-height: 1.2; margin-bottom: calc(14 * var(--p)); }
.sim-fl-cuerpo .fb { font-size: calc(15.5 * var(--p)); line-height: 1.35; margin-bottom: calc(14 * var(--p)); }
.sim-fl-cuerpo .fc { font-size: calc(14 * var(--p)); line-height: 1.35; color: #6d6d72; margin-bottom: calc(4 * var(--p)); }
.sim-fl-cuerpo .fl { font-size: calc(17 * var(--p)); font-weight: 700; margin: calc(4 * var(--p)) 0 calc(8 * var(--p)); }
.sim-fl-cuerpo .fhelp { margin: calc(4 * var(--p)) 0 calc(10 * var(--p)) calc(4 * var(--p)); font-size: calc(12 * var(--p)); }
.sim-fl-cuerpo .fk { color: var(--wa); font-size: calc(15 * var(--p)); font-weight: 600; }
.sim-fl-lista { background: #fff; border-radius: calc(12 * var(--p)); }
.sim-fl-lista div { display: flex; align-items: center; justify-content: space-between; gap: calc(8 * var(--p)); min-height: calc(46 * var(--p)); padding: calc(8 * var(--p)) calc(14 * var(--p)); font-size: calc(14.5 * var(--p)); line-height: 1.3; border-bottom: 1px solid #e5e5ea; }
.sim-fl-lista div:last-child { border-bottom: 0; }
.sim-fl-lista i { flex: none; display: grid; color: var(--wa); }
.sim-fl-lista .sel i svg { width: calc(24 * var(--p)); height: calc(24 * var(--p)); }
.sim-fl-lista .nueva { justify-content: flex-start; }
.sim-fl-lista .nueva i { color: #111; }
.sim-fl-lista .nueva svg { width: calc(18 * var(--p)); height: calc(18 * var(--p)); }
.sim-fl-inp { background: #fff; border: 1px solid #c7c7cc; border-radius: calc(12 * var(--p)); padding: calc(6 * var(--p)) calc(12 * var(--p)) calc(8 * var(--p)); display: flex; flex-direction: column; }
.sim-fl-inp small { font-size: calc(12 * var(--p)); color: #6d6d72; }
.sim-fl-inp span { font-size: calc(17 * var(--p)); letter-spacing: .06em; }
.sim-fl-pie { padding: calc(10 * var(--p)) calc(16 * var(--p)) calc(16 * var(--p)); }
.sim-fl-btn { height: calc(46 * var(--p)); border-radius: calc(23 * var(--p)); background: var(--wa); color: #fff; font-size: calc(17 * var(--p)); font-weight: 700; display: grid; place-items: center; }
.sim-fl-pie p { margin: calc(10 * var(--p)) 0 0; display: flex; align-items: center; justify-content: center; gap: calc(4 * var(--p)); font-size: calc(11.5 * var(--p)); color: #6d6d72; white-space: nowrap; }
.sim-fl-pie p img { width: calc(15 * var(--p)); height: calc(15 * var(--p)); border-radius: calc(4 * var(--p)); }
.sim-fl-pie p b { color: var(--wa); }

/* La página de pago (web). */
.sim-wb { background: #eef1f7; }
.sim-wb::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: calc(210 * var(--p)); background: linear-gradient(135deg, #3b8bff 0%, #1975f1 45%, #0f3f8f 100%); }
.sim-wb .sim-sb { background: transparent; }
.sim-wb-band { position: relative; display: flex; align-items: center; justify-content: space-between; padding: calc(6 * var(--p)) calc(20 * var(--p)) calc(14 * var(--p)); color: #fff; }
.sim-wb-band .wm { font: 800 calc(24 * var(--p))/1 "Baloo 2", Poppins, sans-serif; letter-spacing: -.03em; }
.sim-wb-band .wm b { color: #bfdbfe; font-weight: 800; }
.sim-wb-band .seg { display: flex; align-items: center; gap: calc(5 * var(--p)); font-size: calc(12.5 * var(--p)); font-weight: 600; }
.sim-wb-band .seg svg { width: calc(13 * var(--p)); height: calc(13 * var(--p)); }
.sim-wb-card { position: relative; margin: 0 calc(12 * var(--p)); background: #fff; border-radius: calc(22 * var(--p)); box-shadow: 0 calc(20 * var(--p)) calc(40 * var(--p)) -24px rgba(20,47,87,.5); overflow: hidden; font-family: Inter, system-ui, sans-serif; color: #212426; }
.sim-wb-res { padding: calc(16 * var(--p)) calc(16 * var(--p)) calc(14 * var(--p)); text-align: center; border-bottom: 1px dashed #e3e7ee; display: flex; flex-direction: column; align-items: center; }
.sim-wb-res .av { width: calc(42 * var(--p)); height: calc(42 * var(--p)); border-radius: calc(13 * var(--p)); background: #eaf2fe; color: #1975f1; display: grid; place-items: center; font: 700 calc(15 * var(--p)) Poppins, sans-serif; margin-bottom: calc(6 * var(--p)); }
.sim-wb-res small { font-size: calc(11.5 * var(--p)); color: #868d96; }
.sim-wb-res b { font: 700 calc(15 * var(--p))/1.25 Poppins, sans-serif; }
.sim-wb-res .mt { margin: calc(8 * var(--p)) 0 0; font: 800 calc(30 * var(--p))/1 Poppins, sans-serif; letter-spacing: -.02em; }
.sim-wb-res .cp { margin-top: calc(8 * var(--p)); padding: calc(4 * var(--p)) calc(11 * var(--p)); border-radius: calc(99 * var(--p)); background: #f4f6fb; font-size: calc(12 * var(--p)); color: #3d4147; }
.sim-wb-cu { padding: calc(14 * var(--p)) calc(16 * var(--p)) calc(16 * var(--p)); }
.sim-wb-res.mini { padding: calc(10 * var(--p)) calc(16 * var(--p)); }
.sim-wb-res.mini .av { display: none; }
.sim-wb-res.mini .mt { margin-top: calc(4 * var(--p)); font-size: calc(24 * var(--p)); }
.sim-wb-res.mini .cp { margin-top: calc(6 * var(--p)); }
.sim-wb-cu h4 { margin: 0; font: 700 calc(17 * var(--p))/1.2 Poppins, sans-serif; letter-spacing: -.01em; color: #212426; }
.sim-wb-cu .sub { margin: calc(4 * var(--p)) 0 calc(12 * var(--p)); font-size: calc(12 * var(--p)); line-height: 1.4; color: #6b7280; }
.sim-wb-cu .at { margin: 0 0 calc(8 * var(--p)); font-size: calc(12 * var(--p)); font-weight: 600; color: #5b6270; }
.sim-wb-cu label { display: block; margin: 0 0 calc(5 * var(--p)); font-size: calc(11.5 * var(--p)); font-weight: 600; color: #3d4147; }
.sim-wb-pasos { display: flex; align-items: center; gap: calc(6 * var(--p)); margin-bottom: calc(12 * var(--p)); }
.sim-wb-pasos .wp { display: flex; align-items: center; gap: calc(5 * var(--p)); }
.sim-wb-pasos .wp span { width: calc(22 * var(--p)); height: calc(22 * var(--p)); border-radius: 50%; display: grid; place-items: center; background: #eceff4; color: #868d96; font-size: calc(11 * var(--p)); font-weight: 700; }
.sim-wb-pasos .wp span svg { width: calc(12 * var(--p)); height: calc(12 * var(--p)); }
.sim-wb-pasos .wp b { font-size: calc(11 * var(--p)); font-weight: 600; color: #868d96; }
.sim-wb-pasos .wp.on span { background: #1975f1; color: #fff; box-shadow: 0 0 0 calc(3 * var(--p)) rgba(25,117,241,.15); }
.sim-wb-pasos .wp.on b { color: #212426; }
.sim-wb-pasos .wp.ok span { background: #1ea761; color: #fff; }
.sim-wb-pasos .wp.ok b { color: #3d4147; }
.sim-wb-pasos i { flex: 1; height: calc(2 * var(--p)); border-radius: 1px; background: #eceff4; }
.sim-wb-bancos { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(6 * var(--p)); }
.sim-wb-bancos .bk { border: 1.5px solid #e3e7ee; border-radius: calc(12 * var(--p)); padding: calc(8 * var(--p)) calc(4 * var(--p)); display: flex; flex-direction: column; align-items: center; gap: calc(4 * var(--p)); font-size: calc(10.5 * var(--p)); font-weight: 600; color: #3d4147; }
.sim-wb-bancos .bk span { width: calc(26 * var(--p)); height: calc(26 * var(--p)); border-radius: calc(8 * var(--p)); display: grid; place-items: center; color: #fff; font: 700 calc(12 * var(--p)) Poppins, sans-serif; }
.sim-wb-bancos .bk.sel { border-color: #1975f1; box-shadow: 0 0 0 calc(3 * var(--p)) rgba(25,117,241,.15); color: #212426; }
.sim-wb-btn { margin-top: calc(14 * var(--p)); height: calc(44 * var(--p)); border-radius: calc(13 * var(--p)); background: #1975f1; color: #fff; font-size: calc(14 * var(--p)); font-weight: 700; display: grid; place-items: center; box-shadow: 0 calc(10 * var(--p)) calc(22 * var(--p)) -10px rgba(25,117,241,.75); }
.sim-wb-cu .fila { display: grid; grid-template-columns: calc(74 * var(--p)) 1fr; gap: calc(6 * var(--p)); margin-bottom: calc(10 * var(--p)); }
.sim-wb-cu .fila span { height: calc(38 * var(--p)); border: 1.5px solid #e3e7ee; border-radius: calc(10 * var(--p)); display: flex; align-items: center; padding: 0 calc(10 * var(--p)); font-size: calc(14 * var(--p)); }
.sim-wb-cu .fila .sl { justify-content: space-between; }
.sim-wb-cu .fila svg { width: calc(13 * var(--p)); height: calc(13 * var(--p)); color: #6b7280; }
.sim-wb-otp { display: grid; grid-template-columns: repeat(8, 1fr); gap: calc(4 * var(--p)); margin-bottom: calc(10 * var(--p)); }
.sim-wb-otp span { height: calc(38 * var(--p)); border: 1.5px solid #e3e7ee; border-radius: calc(9 * var(--p)); display: grid; place-items: center; font: 700 calc(16 * var(--p)) Inter, sans-serif; }
.sim-wb-det { display: flex; justify-content: space-between; align-items: center; height: calc(40 * var(--p)); padding: 0 calc(12 * var(--p)); border: 1.5px solid #e3e7ee; border-radius: calc(12 * var(--p)); font-size: calc(12.5 * var(--p)); font-weight: 600; }
.sim-wb-det svg { width: calc(14 * var(--p)); height: calc(14 * var(--p)); }
.sim-wb-ok { margin: -14px -16px calc(12 * var(--p)); padding: calc(18 * var(--p)) calc(16 * var(--p)) calc(12 * var(--p)); text-align: center; background: linear-gradient(#e4f7ee, #fff); }
.sim-wb-ok .ck { width: calc(50 * var(--p)); height: calc(50 * var(--p)); margin: 0 auto calc(8 * var(--p)); border-radius: calc(15 * var(--p)); background: #1ea761; color: #fff; display: grid; place-items: center; }
.sim-wb-ok .ck svg { width: calc(26 * var(--p)); height: calc(26 * var(--p)); }
.sim-wb-ok h4 { font-size: calc(21 * var(--p)); }
.sim-wb-ok p { margin: calc(4 * var(--p)) 0 0; font-size: calc(12 * var(--p)); color: #5b6270; }
.sim-wb-mbox { display: flex; justify-content: space-between; align-items: center; padding: calc(12 * var(--p)); border-radius: calc(12 * var(--p)); background: #f4f6fb; margin-bottom: calc(4 * var(--p)); }
.sim-wb-mbox span { font-size: calc(11.5 * var(--p)); font-weight: 600; color: #5b6270; }
.sim-wb-mbox b { font: 800 calc(22 * var(--p))/1 Poppins, sans-serif; }
.sim-wb .kv { display: flex; justify-content: space-between; gap: calc(8 * var(--p)); padding: calc(8 * var(--p)) calc(2 * var(--p)); border-bottom: 1px solid #eef0f4; font-size: calc(12 * var(--p)); }
.sim-wb .kv span { color: #868d96; }
.sim-wb .kv b { font-weight: 600; text-align: right; }
.sim-wb-2b { display: grid; grid-template-columns: 1fr 1fr; gap: calc(6 * var(--p)); margin-top: calc(12 * var(--p)); }
.sim-wb-2b span { white-space: nowrap; font-size: calc(10.5 * var(--p)) !important; height: calc(36 * var(--p)); border: 1.5px solid #e3e7ee; border-radius: calc(11 * var(--p)); display: grid; place-items: center; font-size: calc(11.5 * var(--p)); font-weight: 600; }

/* Toque simulado: el botón que avanza late antes de cambiar de pantalla. */
.sim-pant [data-sim-next] { cursor: pointer; }
.sim-pant .tocando { animation: sim-toque .55s ease; }
@keyframes sim-toque { 0% { transform: scale(1); } 40% { transform: scale(.95); filter: brightness(.9); } 100% { transform: scale(1); } }
/* Modal del simulador. */
.sim-modal .sim-card { max-width: 820px; max-height: 94vh; padding: 22px 26px 20px; background: var(--surface-card); border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); }
.sim-cab h3 { font: 800 22px/1.15 var(--font-display); letter-spacing: -.02em; margin: 0 40px 4px 0; }
.sim-cab p { margin: 0; color: var(--text-tertiary); font-size: 13.5px; }
.sim-tabs { display: inline-flex; gap: 4px; margin: 14px 0 14px; padding: 4px; border-radius: var(--radius-pill); background: var(--surface-page); }
.sim-tabs button { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 16px; border: 0; border-radius: var(--radius-pill); background: transparent; font: 600 15px var(--font-body); color: var(--text-secondary); cursor: pointer; }
.sim-tabs button svg { width: 17px; height: 17px; }
.sim-tabs button[aria-selected="true"] { background: #fff; color: var(--text-primary); box-shadow: var(--shadow-sm); }
.sim-tabs button[data-tab="wa"][aria-selected="true"] svg { color: var(--qp-whatsapp-dark); }
.sim-tabs button[data-tab="web"][aria-selected="true"] svg { color: var(--qp-blue-primary); }
/* El teléfono se escala con la altura de la ventana para que quepa entero en una laptop (founder, 14-oct). */
.sim-panel { --p: clamp(.6px, calc((100vh - 220px) / 640), .92px); display: flex; gap: 32px; align-items: center; }
.sim-panel[hidden] { display: none; }
.sim-lado { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.sim-pasos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.sim-pasos button { width: 100%; display: flex; gap: 14px; align-items: flex-start; text-align: left; padding: 9px 12px; border: 1px solid transparent; border-radius: var(--radius-md); background: transparent; cursor: pointer; font-family: var(--font-body); color: var(--text-secondary); transition: background var(--dur-base), border-color var(--dur-base); }
.sim-pasos button:hover { background: var(--surface-page); }
.sim-pasos b { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--surface-page); font: 700 13px var(--font-body); color: var(--text-tertiary); }
.sim-pasos span { display: flex; flex-direction: column; gap: 2px; }
.sim-pasos strong { font-size: 14.5px; color: var(--text-primary); }
.sim-pasos small { font-size: 13px; line-height: 1.4; color: var(--text-tertiary); }
.sim-pasos button[aria-current="step"] { background: #f2f7ff; border-color: #d6e6ff; }
.sim-pasos button[aria-current="step"] b { background: var(--qp-blue-primary); color: #fff; }
.sim-panel[data-tab="wa"] .sim-pasos button[aria-current="step"] { background: #eefaf3; border-color: #c9efd9; }
.sim-panel[data-tab="wa"] .sim-pasos button[aria-current="step"] b { background: var(--qp-whatsapp-dark); }
.sim-ctl { display: flex; align-items: center; gap: 12px; }
.sim-n { flex: 1; text-align: center; font-size: 13px; color: var(--text-tertiary); }
@media (max-width: 760px) {
  .sim-modal { padding: 0; }
  .sim-modal .sim-card { max-height: 100dvh; height: 100dvh; border-radius: 0; padding: 20px 16px 16px; display: flex; flex-direction: column; }
  .sim-cab h3 { font-size: 21px; }
  .sim-cab p { font-size: 13px; }
  .sim-tabs { margin: 12px 0; align-self: flex-start; }
  .sim-panel { --p: .74px; flex-direction: column; gap: 12px; flex: 1; justify-content: space-between; }
  .sim-lado { width: 100%; flex: none; gap: 10px; }
  .sim-pasos li { display: none; }
  .sim-pasos li:has(button[aria-current="step"]) { display: block; }
  .sim-pasos button { padding: 10px 12px; }
}
@media (max-width: 760px) and (max-height: 700px) { .sim-panel { --p: .62px; } }
@media (prefers-reduced-motion: reduce) { .sim-s { transition: none; } .sim-pant .tocando { animation: none; } }

/* Lámina «Cobra por WhatsApp» del folleto. */
.lam-wa { background: linear-gradient(160deg, #f1fbf5 0%, #fff 55%); gap: calc(70 * var(--u)); }
.lam-wa .copy { width: calc(520 * var(--u)); }
.lam-wa .ceja { color: var(--qp-whatsapp-dark); }
.lam-wa .nota { font-size: calc(24 * var(--u)); color: var(--qp-ink-400); }
.lam-wa .sims { --p: calc(1.02 * var(--u)); flex: 1; display: flex; justify-content: space-between; gap: calc(36 * var(--u)); }
.lam-wa figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: calc(26 * var(--u)); }
.lam-wa figcaption { display: flex; gap: calc(14 * var(--u)); align-items: flex-start; width: calc(300 * var(--p)); font-size: calc(24 * var(--u)); line-height: 1.35; color: #3d4147; }
.lam-wa figcaption b { flex: none; width: calc(40 * var(--u)); height: calc(40 * var(--u)); border-radius: 50%; display: grid; place-items: center; background: var(--qp-whatsapp-dark); color: #fff; font: 800 calc(22 * var(--u))/1 var(--font-display); }
@media (max-width: 860px) {
  .lam-wa .copy { width: auto; }
  .lam-wa .sims { --p: .62px; overflow-x: auto; justify-content: flex-start; gap: 16px; padding-bottom: 8px; }
  .lam-wa figcaption { width: 190px; max-width: none; font-size: 14px; gap: 8px; }
  .lam-wa figcaption b { width: 24px; height: 24px; font-size: 13px; }
}
@media print {
  .lam-wa .sim-tel { box-shadow: 0 2px 0 1px rgba(0,0,0,.08), 0 6px 0 2px rgba(0,0,0,.05); }
  .lam-wa .sim-wa-tras { filter: none; }
  .lam-wa .sim-wa-tras::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.38); }
  .sim-s { transition: none; }
  /* Sin sombras con desenfoque dentro del teléfono: Chromium las vuelve imágenes grises en el PDF. */
  .lam-wa .sim-pant * { box-shadow: none !important; }
  .lam-wa .sim-wa-card, .lam-wa .sim-wa-dia, .lam-wa .sim-wa-back { outline: 1px solid rgba(0,0,0,.07); }
}
