/**
 * «¿Qué necesitas?»: una página de la marca, con el vocabulario de las de empresa.
 *
 * Héroe claro con el cubo detrás, como Servicios; el asistente en el ancho de la página, con las
 * puertas del primer paso como las tarjetas de servicio (franja de color del cubo e icono); al lado,
 * la propuesta con el precio, fija mientras se baja. En el móvil la propuesta se resume en una barra
 * pegada abajo. Cierra la banda de lo que pasa después de enviar.
 *
 * Los valores son los del tema (`custom_cms.css`, `.bk-pg`): no hay paleta propia.
 */
.bkq {
  --q-ink: #16202b; --q-gris: #4a5866; --q-linea: #e1e8ed; --q-banda: #f3f7f9;
  --q-azul: #00769e; --q-azul-osc: #005d7e; --q-noche: #0d2733; --q-noche-2: #103a46; --q-cian: #7ed0da;
  --q-c1: #437ead; --q-c2: #52bec8; --q-c3: #eda32b; --q-c4: #ab468f; --q-c5: #59a744; --q-c6: #d43532;
  --q-titulo: Montserrat, "Montserrat respaldo", Arial, sans-serif;
  --q-texto: Inter, "Inter respaldo", -apple-system, "Segoe UI", Arial, sans-serif;
  --q-ease: cubic-bezier(.16, 1, .3, 1);
  font-family: var(--q-texto); color: var(--q-ink); position: relative;
}
.bkq ::selection { background: color-mix(in srgb, var(--q-azul) 22%, #fff); color: var(--q-ink); }
.bkq [hidden] { display: none !important; }
.bkq button { font-family: inherit; }
.bkq p { line-height: 1.6; }

/* ---------------------------------------------------------------- héroe */
.bkq-hero { position: relative; display: grid; gap: 28px; align-items: center; padding: 28px 0 40px; isolation: isolate; }
/* El fondo sale a todo el ancho y recorta el cubo en su propia caja: nada se mete en el asistente. */
.bkq-hero__bg { position: absolute; inset: 0 -50vw -120px; z-index: -1; overflow: hidden; pointer-events: none;
  background: radial-gradient(circle, rgba(0, 118, 158, .14) 1px, transparent 1.5px) 0 0 / 22px 22px, linear-gradient(172deg, #e6f0f6 0%, rgba(230, 240, 246, 0) 72%);
  -webkit-mask-image: linear-gradient(to bottom, #000 45%, transparent); mask-image: linear-gradient(to bottom, #000 45%, transparent); }
/* El cubo de la marca, entero y a la derecha del titular, solo en la primera pregunta y con sitio. */
.bkq-hero::after { content: ""; position: absolute; z-index: -1; right: -2%; top: 50%; width: 360px; aspect-ratio: 1; transform: translateY(-50%);
  background: url("/themes/bkmodules/assets/img/hero-marca.svg") no-repeat center / contain; opacity: .5; pointer-events: none; display: none; }
/* Pasada la primera pregunta, el héroe se recoge a un título: el espacio es para el asistente. */
.bkq.is-live:not([data-step="goal"]) .bkq-hero { padding: 16px 0 12px; }
.bkq.is-live:not([data-step="goal"]) .bkq-hero__lead, .bkq.is-live:not([data-step="goal"]) .bkq-promises { display: none; }
.bkq.is-live:not([data-step="goal"]) .bkq-title { font-size: 26px; margin: 0; }
.bkq-title { font: 800 34px/1.06 var(--q-titulo); letter-spacing: -.03em; color: var(--q-ink); margin: 0 0 14px; text-wrap: balance; }
.bkq-hero__lead { font-size: 17px; color: var(--q-gris); margin: 0; max-width: 56ch; }
.bkq-promises { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 26px; }
.bkq-promises li { display: flex; gap: 10px; align-items: center; font: 600 15px/1.35 var(--q-texto); color: var(--q-ink); }
.bkq-promises svg, .bkq-door__icon svg { width: 22px; height: 22px; }
.bkq-promises li > svg { box-sizing: content-box; padding: 7px; border-radius: 10px; background: #fff; color: var(--q-azul);
  box-shadow: 0 8px 20px -14px rgba(22, 32, 43, .6); }
.bkq-done__mark { width: 56px; height: 56px; margin: 0 0 16px; fill: none; stroke: var(--q-c5); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.bkq-done__mark path { stroke-dasharray: 60; stroke-dashoffset: 60; animation: bkq-tick .8s var(--q-ease) .2s forwards; }
@keyframes bkq-tick { to { stroke-dashoffset: 0; } }
/* Recibido: la confirmación con lo pedido a la izquierda; qué pasa ahora y qué hacer mientras, a la derecha. */
.bkq-done { display: grid; gap: 32px; align-items: start; }
.bkq-done .bkq-title { font-size: 34px; }
.bkq-done .bkq-summary { margin: 28px 0 0; }
.bkq-done .bkq-summary__head { display: grid; gap: 6px; }
.bkq-done .bkq-summary__head b { font-size: 19px; line-height: 1.3; letter-spacing: -.01em; }
.bkq-done__side { padding: 26px; border-radius: 18px; background: #fff; border: 1px solid var(--q-linea); box-shadow: 0 24px 50px -36px rgba(22, 32, 43, .55); }
.bkq-done__h { margin: 0 0 20px; font: 800 20px/1.2 var(--q-titulo); letter-spacing: -.02em; color: var(--q-ink); }
.bkq-done__next { margin: 24px 0 0; padding-top: 22px; border-top: 1px solid var(--q-linea); display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; }
.bkq-done__next p { flex-basis: 100%; margin: 0; font-size: 15px; color: var(--q-gris); }
.bkq-done__next strong { color: var(--q-ink); }
@media (min-width: 992px) {
  .bkq-done { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 56px; }
  .bkq-done .bkq-title { font-size: 44px; }
}
.bkq-actions { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; margin-top: 24px; }
.bkq-hero--done { display: block; padding-bottom: 72px; }
@media (min-width: 768px) { .bkq-title { font-size: 44px; } }
@media (min-width: 992px) {
  .bkq.is-live:not([data-step="goal"]) .bkq-title { font-size: 30px; }
  .bkq-hero { padding: 48px 0 44px; }
  .bkq-hero__text, .bkq-promises { max-width: calc(100% - 380px); }
  .bkq.is-live[data-step="goal"] .bkq-hero::after { display: block; }
  .bkq-title { font-size: 52px; }
}

/* ---------------------------------------------------------------- avance */
.bkq-progress { display: flex; align-items: center; gap: 16px; margin: 8px 0 28px; }
.bkq-track { flex: 1; display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; }
.bkq-track li { flex: 1; height: 4px; border-radius: 4px; background: var(--q-linea); transition: background .4s var(--q-ease); }
.bkq-track li.is-done { background: color-mix(in srgb, var(--q-azul) 45%, #fff); }
.bkq-track li.is-current { background: var(--q-azul); }
.bkq-count { font: 600 13.5px/1 var(--q-texto); color: var(--q-gris); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bkq[data-step="goal"] .bkq-progress { display: none; }

/* ---------------------------------------------------------------- armazón */
.bkq-form { padding-bottom: 56px; }
.bkq-layout { display: grid; gap: 40px; align-items: start; }
.bkq-main { min-width: 0; }
.bkq-quote { display: none; }
@media (min-width: 1100px) {
  .bkq-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 56px; }
  .bkq-quote { display: block; position: sticky; top: 104px; }
  .bkq[data-step="goal"] .bkq-layout, .bkq[data-step="sub"] .bkq-layout { grid-template-columns: minmax(0, 1fr); }
  .bkq[data-step="goal"] .bkq-quote, .bkq[data-step="sub"] .bkq-quote { display: none; }
}

/* ---------------------------------------------------------------- pasos */
.bkq-legend { float: none; width: auto; margin: 0; padding: 0; border: 0; }
.bkq-step { margin: 0; padding: 0; border: 0; min-width: 0; }
.bkq:not(.is-live) .bkq-step + .bkq-step { margin-top: 48px; }
.bkq-h { font: 800 26px/1.15 var(--q-titulo); letter-spacing: -.025em; color: var(--q-ink); margin: 0 0 10px; text-wrap: balance; outline: none; }
.bkq-lead { font-size: 16.5px; color: var(--q-gris); margin: 0 0 26px; max-width: 64ch; }
@media (min-width: 992px) { .bkq-h { font-size: 30px; } }
.bkq-step--goal .bkq-h { font-size: 22px; margin-bottom: 18px; }

/* Puertas: las tarjetas de servicio de la casa, con su franja y su icono del color del cubo. */
.bkq-doors { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.bkq-door { position: relative; display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 24px 22px 20px; cursor: pointer; font-weight: 400;
  border-radius: 16px; background: #fff; border: 1px solid var(--q-linea); box-shadow: 0 14px 30px -26px rgba(22, 32, 43, .55);
  transition: transform .2s var(--q-ease), box-shadow .2s var(--q-ease), border-color .2s; }
.bkq-door::before { content: ""; position: absolute; left: 22px; right: 22px; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: var(--c); }
.bkq-door input, .bkq-choice input, .bkq-opt input, .bkq-chip input, .bkq-seg input, .bkq-switch input { position: absolute; opacity: 0; pointer-events: none; }
.bkq-door__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-bottom: 6px; border-radius: 12px;
  background: color-mix(in srgb, var(--c) 13%, #fff); color: var(--c); }
.bkq-door__t { font: 700 17px/1.25 var(--q-titulo); letter-spacing: -.015em; color: var(--q-ink); }
.bkq-door__d { font-size: 14.5px; line-height: 1.5; color: var(--q-gris); flex: 1; }
.bkq-door__from { align-self: flex-start; margin-top: 4px; padding: 5px 10px; border-radius: 999px; background: color-mix(in srgb, var(--c) 11%, #fff);
  font: 700 13px/1.2 var(--q-texto); color: color-mix(in srgb, var(--c) 72%, #0d2733); font-variant-numeric: tabular-nums; }
/* Bajo las puertas, la prueba: lo que se compra aquí lo construyen ellos mismos. */
.bkq .bkq-own { margin: 26px 0 0; max-width: 72ch; font-size: 15px; color: var(--q-gris); }
.bkq-own a { color: var(--q-azul); font-weight: 700; text-decoration: none; white-space: nowrap; }
/* La llamada de cada puerta es un botón de verdad: dice lo que va a pasar y se llena al pasar. */
.bkq-door__cta, .bkq-choice__cta { display: inline-flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding: 12px 16px; white-space: nowrap;
  border-radius: 10px; background: color-mix(in srgb, var(--q-azul) 9%, #fff); color: var(--q-azul-osc); font: 700 15px/1.1 var(--q-texto);
  transition: background .2s, color .2s, box-shadow .2s; }
.bkq-door__cta svg, .bkq-choice__cta svg, .bkq-btn svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
  transition: transform .2s var(--q-ease); }
.bkq-door:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--c) 45%, var(--q-linea)); box-shadow: 0 22px 40px -26px rgba(22, 32, 43, .6); }
.bkq-door:hover .bkq-door__cta, .bkq-choice:hover .bkq-choice__cta { background: var(--q-azul); color: #fff; box-shadow: 0 10px 22px -12px rgba(0, 118, 158, .9); }
.bkq-door:hover .bkq-door__cta svg, .bkq-choice:hover .bkq-choice__cta svg, .bkq-btn:hover svg { transform: translateX(3px); }
.bkq-door:has(input:checked) { border-color: var(--q-azul); }
.bkq-door:has(input:focus-visible) { outline: 2px solid var(--q-azul); outline-offset: 3px; }
.bkq-door[data-unit="nueva"] { --c: var(--q-c1); }
.bkq-door[data-unit="tengo"] { --c: var(--q-c2); }
.bkq-door[data-unit="gestion"] { --c: var(--q-c4); }
.bkq-door[data-unit="medida"] { --c: var(--q-c6); }
.bkq-door[data-unit="ayuda"] { --c: var(--q-c5); }

/* Elección dentro de una puerta. */
.bkq-unit .bkq-lead { margin-bottom: 22px; }
.bkq-choices { display: grid; gap: 12px; }
@media (min-width: 768px) { .bkq-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bkq-choice { position: relative; display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 22px 22px 20px;
  cursor: pointer; font-weight: 400; border-radius: 14px; background: #fff; border: 1px solid var(--q-linea);
  transition: border-color .2s, box-shadow .2s var(--q-ease), transform .2s var(--q-ease); }
.bkq-choice__t { font: 700 17px/1.3 var(--q-titulo); letter-spacing: -.01em; color: var(--q-ink); }
.bkq-choice__d { font-size: 14.5px; line-height: 1.5; color: var(--q-gris); flex: 1; }
/* El gancho: lo que gana o desde cuánto, antes de pulsar. */
.bkq-choice__hook { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; margin-top: 4px; padding: 5px 11px; border-radius: 999px;
  background: color-mix(in srgb, var(--q-c5) 12%, #fff); font: 600 13.5px/1.2 var(--q-texto); color: #2f6b22; font-variant-numeric: tabular-nums; }
.bkq-choice__hook::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--q-c5); }
.bkq-choice:hover { border-color: color-mix(in srgb, var(--q-azul) 40%, var(--q-linea)); box-shadow: 0 16px 32px -26px rgba(22, 32, 43, .6); transform: translateY(-2px); }
.bkq-choice:has(input:checked) { border-color: var(--q-azul); }
.bkq-choice:has(input:focus-visible) { outline: 2px solid var(--q-azul); outline-offset: 3px; }

/* ---------------------------------------------------------------- bloques */
.bkq-block + .bkq-block { margin-top: 30px; }
.bkq-block__t { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; font: 700 15px/1.35 var(--q-texto); color: var(--q-ink); }
.bkq-block__t svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.bkq-block__aside { font-weight: 400; color: var(--q-gris); }
.bkq-note { margin: 12px 0 0; font-size: 14.5px; color: var(--q-gris); }
.bkq-note a, .bkq-note__link { color: var(--q-azul); font-weight: 700; text-underline-offset: 3px; }

/* Lo incluido, aparte y cerrado: se lee como lo que ya viene, no como una opción. */
.bkq-block--included { padding: 20px 22px; border-radius: 16px; background: var(--q-banda); }
.bkq-block__t--inc { color: var(--q-azul-osc); }
/* Lo incluido se lee como una lista ya marcada: todo eso viene hecho. */
.bkq-pages { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px 16px; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.bkq-pages li { display: flex; align-items: center; gap: 9px; font-size: 14.5px; font-weight: 600; color: var(--q-ink); }
.bkq-pages li::before { content: ""; flex: none; width: 18px; height: 18px; border-radius: 50%; background: color-mix(in srgb, var(--q-c5) 16%, #fff)
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.5 2.6 2.6L12 5.6' fill='none' stroke='%2359a744' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 12px; }

.bkq-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.bkq-chip { position: relative; margin: 0; cursor: pointer; font-weight: 400; }
.bkq-chip span { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: #fff; border: 1px solid var(--q-linea);
  font-size: 14.5px; font-weight: 600; color: var(--q-ink); transition: background .18s, border-color .18s, color .18s; }
.bkq-chip span::before { content: ""; width: 10px; height: 10px; flex: none; color: var(--q-azul);
  background: linear-gradient(currentColor, currentColor) center / 10px 2px no-repeat, linear-gradient(currentColor, currentColor) center / 2px 10px no-repeat;
  transition: transform .25s var(--q-ease); }
.bkq-chip:hover span { border-color: var(--q-azul); }
.bkq-chip input:checked + span { background: var(--q-azul); border-color: var(--q-azul); color: #fff; }
.bkq-chip input:checked + span::before { color: #fff; transform: rotate(45deg); }
.bkq-chip input:focus-visible + span { outline: 2px solid var(--q-azul); outline-offset: 2px; }
.bkq-chips--big .bkq-chip span { padding: 12px 18px; font-size: 15px; }

.bkq-opts { display: grid; gap: 12px; }
@media (min-width: 768px) { .bkq-opts:not(.bkq-opts--stack) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .bkq-opts--compact { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
.bkq-opts--compact .bkq-opt__box { grid-template-columns: 1fr; padding: 16px 18px; }
.bkq-opts--compact .bkq-opt__p { grid-column: 1; grid-row: auto; margin-top: 8px; font-size: 14.5px; }
.bkq-opt__box { position: relative; }
/* Casilla marcada: la tarjeta lleva su visto en la esquina, además del borde. */
.bkq-opt input[type="checkbox"] + .bkq-opt__box { padding-left: 52px; }
.bkq-mod input + .bkq-mod__box::after { right: 14px; top: 14px; }
.bkq-opt input[type="checkbox"] + .bkq-opt__box::after { left: 18px; top: 19px; }
.bkq-opt input[type="checkbox"] + .bkq-opt__box::after, .bkq-mod input + .bkq-mod__box::after { content: ""; position: absolute; width: 20px; height: 20px;
  border-radius: 6px; border: 1.5px solid #c3d0d9; background: #fff; transition: background .15s, border-color .15s; }
.bkq-opt input[type="checkbox"]:checked + .bkq-opt__box::after, .bkq-mod input:checked + .bkq-mod__box::after { border-color: var(--q-azul);
  background: var(--q-azul) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.5 2.6 2.6L12 5.6' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 14px; }

/* Módulos del catálogo con su miniatura y su ficha. */
.bkq-mods { display: grid; gap: 12px; }
@media (min-width: 768px) { .bkq-mods { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bkq-mod { position: relative; display: flex; flex-direction: column; }
.bkq-mod label { margin: 0; cursor: pointer; font-weight: 400; flex: 1; }
.bkq-mod input { position: absolute; opacity: 0; pointer-events: none; }
.bkq-mod__box { position: relative; display: grid; grid-template-columns: 64px 1fr; gap: 4px 14px; height: 100%; padding: 16px 48px 18px 16px; border-radius: 14px 14px 0 0;
  background: #fff; border: 1px solid var(--q-linea); border-bottom: 0; transition: border-color .18s, box-shadow .18s; }
.bkq-mod__box img { grid-row: 1 / span 2; width: 64px; height: 64px; border-radius: 12px; object-fit: cover; background: var(--q-banda); }
.bkq-mod__t { font: 700 15px/1.3 var(--q-titulo); color: var(--q-ink); }
.bkq-mod__d { font-size: 13.5px; line-height: 1.45; color: var(--q-gris); }
.bkq-mod input:checked + .bkq-mod__box { border-color: var(--q-azul); box-shadow: inset 0 0 0 1px var(--q-azul); }
.bkq-mod input:focus-visible + .bkq-mod__box { outline: 2px solid var(--q-azul); outline-offset: 2px; }
.bkq-mod__p { grid-column: 2; margin-top: 4px; font: 700 14px/1.2 var(--q-texto); color: var(--q-azul-osc); font-variant-numeric: tabular-nums; }
.bkq-more-btn { margin-top: 14px; padding: 12px 18px; border: 1px solid var(--q-linea); border-radius: 10px; background: #fff; font: 700 14.5px/1 var(--q-texto); color: var(--q-azul); cursor: pointer; }
.bkq-more-btn:hover { border-color: var(--q-azul); }
.bkq-field--free textarea { min-height: 90px; }
.bkq-field--free input { max-width: 460px; }
/* Comprar una hora de soporte: la salida inmediata para un fallo sin mantenimiento. */
.bkq-buy { padding: 22px 24px; border-radius: 16px; background: #fff; border: 1px solid color-mix(in srgb, var(--q-azul) 35%, var(--q-linea));
  box-shadow: 0 18px 40px -30px rgba(0, 118, 158, .8); }
.bkq .bkq-buy p { margin: 0; }
.bkq .bkq-buy .bkq-buy__t { font: 800 19px/1.25 var(--q-titulo); letter-spacing: -.015em; color: var(--q-ink); }
.bkq .bkq-buy .bkq-buy__p { margin: 6px 0 16px; font-size: 15px; color: var(--q-gris); }
.bkq .bkq-buy .bkq-buy__n { margin-top: 12px; font-size: 13.5px; color: var(--q-gris); }
.bkq-mod__link { display: block; padding: 10px 16px; border: 1px solid var(--q-linea); border-top: 1px dashed var(--q-linea); border-radius: 0 0 14px 14px; background: var(--q-banda);
  font: 700 13.5px/1.2 var(--q-texto); color: var(--q-azul); text-decoration: none; }
.bkq-mod__link:hover { color: var(--q-azul-osc); }
.bkq-opt { position: relative; }
.bkq-opt label { display: block; height: 100%; margin: 0; cursor: pointer; font-weight: 400; }
.bkq-opt__box { display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; height: 100%; padding: 18px 20px; border-radius: 14px; background: #fff;
  border: 1px solid var(--q-linea); transition: border-color .18s, box-shadow .18s; }
.bkq-opt--info .bkq-opt__box { padding-right: 54px; }
.bkq-opt__t { grid-column: 1; font: 700 16px/1.3 var(--q-titulo); letter-spacing: -.01em; color: var(--q-ink); }
.bkq-opt__d { grid-column: 1; font-size: 14.5px; line-height: 1.5; color: var(--q-gris); }
.bkq-opt__p { grid-column: 2; grid-row: 1 / span 2; align-self: center; font: 700 15.5px/1.2 var(--q-texto); color: var(--q-azul-osc); white-space: nowrap; font-variant-numeric: tabular-nums; }
.bkq-opt label:hover .bkq-opt__box { border-color: color-mix(in srgb, var(--q-azul) 40%, var(--q-linea)); }
.bkq-opt input:checked + .bkq-opt__box { border-color: var(--q-azul); box-shadow: inset 0 0 0 1px var(--q-azul); background: color-mix(in srgb, var(--q-azul) 4%, #fff); }
.bkq-opt input:focus-visible + .bkq-opt__box { outline: 2px solid var(--q-azul); outline-offset: 2px; }
/* Sin columna de propuesta (móvil y tableta) las tarjetas van estrechas: el precio baja bajo el texto. */
@media (max-width: 1099px) {
  .bkq-opt__box { grid-template-columns: 1fr; }
  .bkq-opt__p { grid-column: 1; grid-row: auto; margin-top: 6px; }
}

.bkq-info { position: absolute; top: 14px; right: 14px; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0;
  border: 0; border-radius: 50%; background: transparent; color: var(--q-azul); cursor: pointer; transition: background .18s, color .18s; }
.bkq-info svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.bkq-info:hover, .bkq-info:focus-visible { background: var(--q-azul); color: #fff; outline: none; }
.bkq-block__t .bkq-info { position: static; width: 26px; height: 26px; }

.bkq-seg { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 999px; background: var(--q-banda); width: fit-content; max-width: 100%; }
.bkq-seg label { position: relative; margin: 0; cursor: pointer; font-weight: 400; }
.bkq-seg span { display: block; padding: 10px 18px; border-radius: 999px; font-size: 14.5px; font-weight: 600; color: var(--q-gris); font-variant-numeric: tabular-nums;
  transition: background .18s, color .18s, box-shadow .18s; }
.bkq-seg label:hover span { color: var(--q-ink); }
.bkq-seg input:checked + span { background: #fff; color: var(--q-ink); box-shadow: 0 4px 12px -6px rgba(22, 32, 43, .45); }
.bkq-seg input:focus-visible + span { outline: 2px solid var(--q-azul); outline-offset: 1px; }

.bkq-switch { position: relative; display: grid; grid-template-columns: 46px 1fr; gap: 14px; align-items: start; margin: 20px 0 14px; cursor: pointer; font-weight: 400; }
.bkq-switch__ui { position: relative; width: 46px; height: 26px; margin-top: 1px; border-radius: 999px; background: #c6d2da; transition: background .2s; }
.bkq-switch__ui::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff;
  box-shadow: 0 2px 4px rgba(22, 32, 43, .3); transition: transform .25s var(--q-ease); }
.bkq-switch input:checked ~ .bkq-switch__ui { background: var(--q-azul); }
.bkq-switch input:checked ~ .bkq-switch__ui::after { transform: translateX(20px); }
.bkq-switch input:focus-visible ~ .bkq-switch__ui { outline: 2px solid var(--q-azul); outline-offset: 2px; }
.bkq-switch__t { font: 700 15.5px/1.35 var(--q-texto); color: var(--q-ink); }
.bkq-switch__t small { display: block; margin-top: 3px; font-size: 14px; font-weight: 400; color: var(--q-gris); }

/* ---------------------------------------------------------------- datos */
.bkq-summary { margin: 0 0 28px; padding: 20px 22px; border-radius: 16px; background: #fff; border: 1px solid color-mix(in srgb, var(--q-azul) 30%, var(--q-linea));
  box-shadow: 0 18px 40px -32px rgba(0, 118, 158, .8); }
.bkq-summary__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin: 0; }
.bkq-summary__head span { font: 700 17px/1.3 var(--q-titulo); color: var(--q-ink); }
.bkq-summary__head b { font: 800 26px/1.1 var(--q-titulo); letter-spacing: -.02em; color: var(--q-azul-osc); font-variant-numeric: tabular-nums; }
.bkq-summary__list { margin: 16px 0 0; padding: 0; border-top: 1px solid var(--q-linea); }
.bkq-summary__list div { display: grid; grid-template-columns: minmax(120px, 34%) 1fr; gap: 4px 18px; padding: 10px 0; border-bottom: 1px solid var(--q-linea); }
.bkq-summary__list dt { font-size: 13.5px; line-height: 1.45; color: var(--q-gris); }
.bkq-summary__list dd { margin: 0; font: 600 14.5px/1.45 var(--q-texto); color: var(--q-ink); overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 560px) { .bkq-summary__list div { grid-template-columns: 1fr; gap: 2px; } }
.bkq-summary__edit { margin-top: 14px; padding: 0; border: 0; background: none; font: 600 14px/1.3 var(--q-texto); color: var(--q-azul); cursor: pointer; }
.bkq-summary__edit:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Contador (− número +, la hora de soporte) y campo con sufijo */
.bkq-stepper { display: inline-flex; align-items: stretch; border: 1px solid #c9d5de; border-radius: 12px; background: #fff; overflow: hidden; }
.bkq-stepper button { width: 48px; border: 0; background: var(--q-banda); font: 600 22px/1 var(--q-texto); color: var(--q-azul); cursor: pointer; transition: background .15s; }
.bkq-stepper button:hover { background: color-mix(in srgb, var(--q-azul) 12%, #fff); }
.bkq-stepper input { width: 64px; padding: 12px 0; border: 0; text-align: center; font: 700 18px/1 var(--q-texto); color: var(--q-ink); -moz-appearance: textfield; }
.bkq-stepper input::-webkit-inner-spin-button, .bkq-stepper input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.bkq-stepper input:focus { outline: none; background: color-mix(in srgb, var(--q-azul) 6%, #fff); }
.bkq-hint { margin: 10px 0 0; font-size: 14px; line-height: 1.5; color: var(--q-gris); max-width: 60ch; }
.bkq-affix { display: flex; align-items: stretch; max-width: 460px; border: 1px solid #c9d5de; border-radius: 10px; background: #fff; overflow: hidden; }
.bkq-affix:focus-within { border-color: var(--q-azul); box-shadow: 0 0 0 4px rgba(0, 118, 158, .14); }
.bkq .bkq-affix input, .bkq .bkq-affix input:focus { flex: 1; min-width: 0; border: 0; border-radius: 0; box-shadow: none; }
.bkq-affix span { display: flex; align-items: center; padding: 0 14px; background: var(--q-banda); font: 600 15px/1 var(--q-texto); color: var(--q-gris); }
.bkq-fields { display: grid; gap: 16px; margin: 0 0 20px; }
@media (min-width: 640px) { .bkq-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bkq-field--wide { grid-column: 1 / -1; } }
.bkq-field label { display: block; margin: 0 0 7px; font: 600 14px/1.3 var(--q-texto); color: var(--q-ink); }
.bkq-field label small { font-weight: 400; color: var(--q-gris); }
.bkq-field input, .bkq-field textarea, .bkq-field select { display: block; width: 100%; padding: 13px 15px; border: 1px solid #c9d5de; border-radius: 10px; background: #fff;
  font: 400 16px/1.4 var(--q-texto); color: var(--q-ink); caret-color: var(--q-azul); transition: border-color .18s, box-shadow .18s; }
.bkq-field select { appearance: none; padding-right: 42px; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5 8 5 5 5-5' fill='none' stroke='%2300769e' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center / 18px; }
.bkq-field--select { max-width: 340px; }
.bkq-field input:focus, .bkq-field textarea:focus, .bkq-field select:focus { outline: none; border-color: var(--q-azul); box-shadow: 0 0 0 4px rgba(0, 118, 158, .14); }
.bkq-field textarea { resize: vertical; min-height: 120px; }
.bkq-field.is-error input, .bkq-field.is-error textarea { border-color: #b42a24; }
.bkq-err { margin: 6px 0 0; font-size: 14px; font-weight: 600; color: #b42a24; }
.bkq-consent { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: start; margin: 0 0 16px; font-size: 14.5px; line-height: 1.5; font-weight: 400; color: var(--q-gris); cursor: pointer; }
.bkq-consent input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--q-azul); }
.bkq-consent a, .bkq-alt a { color: var(--q-azul); font-weight: 600; text-underline-offset: 3px; }
.bkq-alt { margin: 16px 0 0; font-size: 14.5px; color: var(--q-gris); }

/* ---------------------------------------------------------------- botones */
.bkq-btn, a.bkq-btn:link, a.bkq-btn:visited { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 16px 28px; border: 0; border-radius: 10px;
  background: var(--q-azul); color: #fff; font: 700 16px/1 var(--q-texto); text-decoration: none; cursor: pointer;
  box-shadow: 0 10px 24px -12px rgba(0, 118, 158, .85); transition: background .18s, transform .18s var(--q-ease), box-shadow .18s; }
.bkq-btn:hover { background: var(--q-azul-osc); color: #fff; transform: translateY(-2px); box-shadow: 0 16px 30px -14px rgba(0, 118, 158, .95); }
.bkq-btn:focus-visible, .bkq-back:focus-visible { outline: 2px solid var(--q-azul); outline-offset: 3px; }
.bkq-btn--send { width: 100%; padding: 20px 28px; font-size: 17px; }
.bkq-btn--next { padding: 16px 26px; font-size: 16.5px; }
.bkq-trust { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 20px; margin: 14px 0 0; padding: 0; }
.bkq-trust li { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 600; color: var(--q-gris); }
.bkq-trust li::before { content: ""; width: 14px; height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3 8.5 3.2 3.2L13 4.8' fill='none' stroke='%2359a744' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 14px; }
/* Lo opcional, plegado: menos campos a la vista, más ganas de terminar. */
.bkq-more { margin: 0 0 20px; }
.bkq-more summary { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; font: 700 15px/1.3 var(--q-texto); color: var(--q-azul); }
.bkq-more summary::-webkit-details-marker { display: none; }
.bkq-more summary::before { content: "+"; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%;
  background: color-mix(in srgb, var(--q-azul) 10%, #fff); font-weight: 800; }
.bkq-more[open] summary::before { content: "–"; }
.bkq-more summary small { font-weight: 400; color: var(--q-gris); }
.bkq-more .bkq-fields { margin: 16px 0 0; }
.bkq-link { font: 700 16px/1 var(--q-texto); color: var(--q-azul); text-decoration: none; }
.bkq-link:hover { color: var(--q-azul-osc); }
.bkq-nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--q-linea); }
.bkq-nav [data-nav="next"] { margin-left: auto; }
.bkq-back { display: inline-flex; align-items: center; gap: 8px; padding: 14px 20px; border: 1.5px solid var(--q-linea); border-radius: 10px; background: #fff;
  font: 700 15.5px/1 var(--q-texto); color: var(--q-ink); cursor: pointer; transition: border-color .18s, color .18s; }
.bkq-back:hover { border-color: var(--q-azul); color: var(--q-azul); }
.bkq-back svg, .bkq-mbar__back svg, .bkq-mbar__see svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.bkq[data-step="goal"] .bkq-nav { display: none; }

/* ---------------------------------------------------------------- propuesta */
.bkq-quote { padding: 26px 26px 22px; border-radius: 18px; background: #fff; border: 1px solid var(--q-linea); box-shadow: 0 24px 50px -36px rgba(22, 32, 43, .55); }
.bkq-quote__t { margin: 0; font: 700 13px/1 var(--q-texto); letter-spacing: .02em; color: var(--q-azul); }
.bkq-quote__goal { margin: 8px 0 18px; font: 700 18px/1.3 var(--q-titulo); letter-spacing: -.015em; color: var(--q-ink); }
.bkq-figs { margin: 0; display: grid; gap: 0; }
.bkq-figs div { display: grid; gap: 4px; padding: 14px 0; border-top: 1px solid var(--q-linea); }
.bkq-figs dt { font: 600 13px/1.2 var(--q-texto); color: var(--q-gris); }
.bkq-figs dd { margin: 0; font: 700 16px/1.3 var(--q-texto); color: var(--q-ink); font-variant-numeric: tabular-nums; }
.bkq-figs [data-fig="once"] dd { font: 800 34px/1.05 var(--q-titulo); letter-spacing: -.03em; }
.bkq-quote__note { margin: 4px 0 0; padding: 12px 14px; border-radius: 10px; background: var(--q-banda); font-size: 13.5px; color: var(--q-gris); }
/* La puerta a BookflowR: la web de verdad en miniatura y un enlace; en la columna, tras una raya. */
.bkq-bf, .bkq-bf:hover { display: block; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--q-linea); color: inherit; text-decoration: none; }
.bkq-bf img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: top; border-radius: 10px; border: 1px solid var(--q-linea);
  transition: transform .25s var(--q-ease), box-shadow .25s var(--q-ease); }
.bkq-bf:hover img { transform: translateY(-2px); box-shadow: 0 14px 26px -18px rgba(22, 32, 43, .6); }
.bkq-bf__body { display: block; }
.bkq-bf__t { display: block; margin-top: 12px; font: 700 15.5px/1.3 var(--q-titulo); letter-spacing: -.01em; color: var(--q-ink); }
.bkq-bf__d { display: block; margin-top: 4px; font-size: 13.5px; line-height: 1.45; color: var(--q-gris); }
.bkq-bf__go { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font: 700 14px/1 var(--q-texto); color: var(--q-azul); }
.bkq-bf__go svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s var(--q-ease); }
.bkq-bf:hover .bkq-bf__go svg { transform: translateX(3px); }
.bkq-bf:focus-visible { outline: 2px solid var(--q-azul); outline-offset: 4px; border-radius: 4px; }
/* En el móvil no hay columna: la misma puerta va dentro del paso, en horizontal. */
.bkq-bf--inline { display: none; }
@media (max-width: 1099px) {
  .bkq.is-live .bkq-bf--inline { display: grid; grid-template-columns: 112px 1fr; gap: 14px; align-items: center; margin-top: 28px; padding: 12px; border: 1px solid var(--q-linea); border-radius: 14px; background: #fff; }
  .bkq-bf--inline img { aspect-ratio: 4 / 3; border-radius: 8px; }
  .bkq-bf--inline .bkq-bf__t { margin-top: 0; }
  .bkq-bf--inline .bkq-bf__go { margin-top: 8px; }
}
.bkq-quote__foot { margin: 14px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--q-gris); }

/* La lista de lo elegido solo va en la hoja del móvil: en escritorio la propuesta se queda en las cifras. */
.bkq-quote__list, .bkq-quote__grab { display: none; }

/* Móvil y tableta: la barra es el suelo de la página (fija; la página reserva su alto y nada queda
   debajo). Atrás, la propuesta —que se despliega como hoja con todo lo elegido— y continuar. */
.bkq-mbar { display: none; }
.bkq-scrim { position: fixed; inset: 0; z-index: 58; background: rgba(13, 39, 51, .45); }
@media (max-width: 1099px) {
  .bkq.is-live:not([data-step="goal"]) .bkq-mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: flex; align-items: center; gap: 10px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: var(--q-noche); color: #fff; box-shadow: 0 -14px 30px -20px rgba(13, 39, 51, .7); }
  body:has(.bkq.is-live:not([data-step="goal"])) { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  .bkq-nav { display: none; }
  .bkq-mbar__back { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1.5px solid rgba(255, 255, 255, .22);
    border-radius: 10px; background: none; color: #fff; cursor: pointer; }
  .bkq-mbar__sum { flex: 1; min-width: 0; display: grid; gap: 2px; padding: 4px 6px; border: 0; border-radius: 10px; background: none; color: #fff; text-align: left; cursor: pointer; }
  .bkq-mbar__sum:focus-visible, .bkq-mbar__back:focus-visible { outline: 2px solid var(--q-cian); outline-offset: 2px; }
  .bkq-figs--bar { display: flex; gap: 14px; min-width: 0; }
  .bkq-figs--bar div { padding: 0; border: 0; }
  .bkq-figs--bar dt { display: none; }
  /* La cifra cabe entera hasta 99.999,99 € en un móvil de 320 px: nunca se recorta. */
  .bkq-figs--bar dd, .bkq-figs--bar [data-fig="once"] dd { color: #fff; font: 800 clamp(16px, 5vw, 19px)/1.1 var(--q-titulo); letter-spacing: -.02em; white-space: nowrap; }
  .bkq-figs--bar [data-fig="recurring"] dd { font: 700 14px/1.25 var(--q-texto); letter-spacing: 0; white-space: normal; }
  .bkq-figs--bar [data-fig="once"]:not([hidden]) ~ [data-fig="recurring"] { display: none; }
  .bkq-mbar__see { display: inline-flex; align-items: center; gap: 4px; font: 600 12.5px/1 var(--q-texto); color: var(--q-cian); }
  .bkq-mbar__see svg { width: 14px; height: 14px; transition: transform .25s var(--q-ease); }
  .bkq[data-sheet="open"] .bkq-mbar__see svg { transform: rotate(180deg); }
  .bkq-mbar .bkq-btn { flex: none; padding: 14px 18px; font-size: 15.5px; background: #fff; color: var(--q-noche); box-shadow: none; }
  @media (max-width: 374px) {
    .bkq-mbar { gap: 8px; }
    .bkq-mbar .bkq-btn { padding: 13px 14px; }
    .bkq-mbar .bkq-btn svg { display: none; }
  }
  .bkq-mbar .bkq-btn:hover { background: #e5f4f8; color: var(--q-noche); }

  /* La hoja: la misma propuesta de escritorio, sube desde la barra con todo lo elegido. */
  .bkq.is-live .bkq-quote { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 59; max-height: calc(100vh - 96px); overflow: auto;
    padding: 24px 20px calc(88px + env(safe-area-inset-bottom)); border: 0; border-radius: 22px 22px 0 0; box-shadow: 0 -30px 60px -30px rgba(13, 39, 51, .6);
    transform: translateY(100%); visibility: hidden; transition: transform .35s var(--q-ease), visibility 0s linear .35s; }
  .bkq.is-live[data-sheet="open"] .bkq-quote { transform: none; visibility: visible; transition: transform .35s var(--q-ease); }
  .bkq.is-live .bkq-quote { overscroll-behavior: contain; padding-top: 30px; }
  .bkq.is-live .bkq-quote.is-dragging { transition: none; }
  .bkq-quote__grab { display: block; position: absolute; left: 50%; top: 10px; width: 44px; height: 5px; margin-left: -22px; border-radius: 99px; background: #c9d5de; }
  html.bkq-locked, html.bkq-locked body { overflow: hidden; }
  .bkq-scrim { touch-action: none; }
  .bkq-quote__next { display: none; }
  .bkq-quote__list { display: block; margin: 14px 0 0; padding: 0; border-top: 1px solid var(--q-linea); }
  .bkq-quote__list div { display: grid; gap: 2px; padding: 10px 0; border-bottom: 1px solid var(--q-linea); }
  .bkq-quote__list dt { font-size: 12.5px; color: var(--q-gris); }
  .bkq-quote__list dd { margin: 0; font: 600 14.5px/1.4 var(--q-texto); color: var(--q-ink); }
}

/* ---------------------------------------------------------------- después de enviar */
.bkq-after { position: relative; padding: 56px 0 64px; isolation: isolate; }
.bkq-after::before { content: ""; position: absolute; inset: 0 -50vw; z-index: -1; background: var(--q-banda); }
/* Los fondos a todo el ancho salen de la columna: la página no debe ganar desplazamiento lateral. */
body#module-bkmodules-lead #wrapper { overflow-x: clip; }
.bkq-after__h { font: 800 26px/1.15 var(--q-titulo); letter-spacing: -.025em; color: var(--q-ink); margin: 0 0 28px; }
.bkq-steps3 { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; counter-reset: paso; }
.bkq-steps3 li { counter-increment: paso; position: relative; padding-left: 56px; }
.bkq-steps3 li::before { content: counter(paso); position: absolute; left: 0; top: 0; width: 40px; height: 40px; border-radius: 50%; background: var(--q-azul);
  color: #fff; font: 800 16px/40px var(--q-titulo); text-align: center; }
.bkq-steps3 b { display: block; margin: 8px 0 6px; font: 700 17px/1.3 var(--q-titulo); color: var(--q-ink); }
.bkq-steps3 span { display: block; font-size: 15px; line-height: 1.55; color: var(--q-gris); }
.bkq-after__own { margin: 36px 0 0; font-size: 15.5px; color: var(--q-gris); max-width: 72ch; }
.bkq-after__own a { color: var(--q-azul); font-weight: 700; text-decoration: none; white-space: nowrap; }
@media (min-width: 992px) {
  .bkq-steps3 { grid-template-columns: repeat(3, 1fr); gap: 32px; }
  .bkq-steps3 li { padding: 56px 0 0; }
  .bkq-steps3 li::after { content: ""; position: absolute; top: 20px; left: 54px; right: -18px; height: 2px; background: var(--q-linea); }
  .bkq-steps3 li:last-child::after { display: none; }
  .bkq-after__h { font-size: 30px; }
}

/* ---------------------------------------------------------------- qué incluye */
.bkq-pop { width: min(480px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow: auto; margin: auto; padding: 26px 26px 20px; border: 0; border-radius: 18px;
  background: #fff; color: #16202b; font-family: Inter, "Inter respaldo", sans-serif; box-shadow: 0 40px 90px -30px rgba(13, 39, 51, .7); }
.bkq-pop::backdrop { background: rgba(13, 39, 51, .5); }
.bkq-pop__t { margin: 0 0 14px; font: 800 21px/1.2 Montserrat, "Montserrat respaldo", Arial, sans-serif; letter-spacing: -.02em; color: #16202b; }
.bkq-pop ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bkq-pop li { position: relative; padding-left: 26px; font-size: 14.5px; line-height: 1.55; color: #4a5866; }
.bkq-pop li::before { content: ""; position: absolute; left: 0; top: 4px; width: 16px; height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3 8.5 3.2 3.2L13 4.8' fill='none' stroke='%2300769e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 16px; }
.bkq-pop__x { display: block; width: 100%; margin-top: 20px; padding: 13px; border: 1px solid #e1e8ed; border-radius: 10px; background: #fff;
  font: 700 15px/1 Inter, sans-serif; color: #00769e; cursor: pointer; }
.bkq-pop__x:hover { border-color: #00769e; }

@media (max-width: 767px) {
  .bkq { padding: 0 7px; }
  .bkq-hero { padding: 22px 0 26px; gap: 0; }
  .bkq.is-live:not([data-step="goal"]) .bkq-hero { display: none; }
  .bkq-progress { margin: 18px 0 22px; }
  .bkq-h { font-size: 24px; }
  .bkq-lead { font-size: 15.5px; margin-bottom: 22px; }
  .bkq-hero__lead { font-size: 16px; }
  .bkq-promises { display: grid; gap: 10px; margin-top: 18px; }
  .bkq-promises li { font-size: 14.5px; }
  .bkq-doors { grid-template-columns: 1fr; gap: 10px; }
  .bkq-door { display: grid; grid-template-columns: 44px 1fr; gap: 2px 14px; padding: 18px 18px 16px; }
  .bkq-door__icon { grid-row: 1 / span 2; margin: 0; }
  .bkq-door__from { grid-column: 2; justify-self: start; margin-top: 8px; }
  .bkq-door__cta { grid-column: 2; justify-self: start; margin-top: 10px; padding: 9px 14px; font-size: 14px; }
  .bkq-seg { width: 100%; border-radius: 16px; }
  .bkq-seg label { flex: 1 1 auto; }
  .bkq-seg span { text-align: center; padding: 10px 12px; border-radius: 12px; }
  .bkq-block--included { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .bkq *, .bkq *::before, .bkq *::after { animation: none !important; transition: none !important; }
  .bkq-done__mark path { stroke-dashoffset: 0; }
}

/* Los botones que son enlaces ganan a los colores de enlace del tema. */
#bkq a.bkq-btn, #bkq a.bkq-btn:link, #bkq a.bkq-btn:visited, #bkq a.bkq-btn:hover { color: #fff; text-decoration: none; }
/* Los tres pasos en columna, también en escritorio (la columna del recibido). */
.bkq .bkq-steps3--v { grid-template-columns: 1fr; gap: 18px; }
.bkq .bkq-steps3--v li { padding: 0 0 0 56px; }
.bkq .bkq-steps3--v li::after { display: none; }
.bkq .bkq-steps3--v b { margin-top: 8px; }

/* Páginas para añadir: tarjeta con el boceto de la página encima; en el móvil, el boceto a la izquierda. */
.bkq-opts--gallery { grid-template-columns: 1fr !important; }
.bkq-opts--gallery .bkq-opt__box { grid-template-columns: 92px 1fr; grid-template-rows: auto auto auto; gap: 2px 14px; padding: 12px 44px 12px 12px !important; }
.bkq-opts--gallery .bkq-opt__pv { grid-column: 1; grid-row: 1 / span 3; align-self: start; }
.bkq-opts--gallery .bkq-opt__t, .bkq-opts--gallery .bkq-opt__d, .bkq-opts--gallery .bkq-opt__p { grid-column: 2; grid-row: auto; margin: 0; }
.bkq-opts--gallery .bkq-opt__p { font-size: 14.5px; }
.bkq-opt__pv { display: block; border-radius: 8px; overflow: hidden; border: 1px solid var(--q-linea); background: #f3f7f9; line-height: 0; }
.bkq-opt__pv svg { width: 100%; height: auto; }
.bkq .bkq-opts--gallery .bkq-opt input[type="checkbox"] + .bkq-opt__box::after { left: auto; right: 14px; top: 14px; }
@media (min-width: 640px) {
  .bkq-opts--gallery { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .bkq-opts--gallery .bkq-opt__box { grid-template-columns: 1fr; padding: 0 0 14px !important; overflow: hidden; }
  .bkq-opts--gallery .bkq-opt__pv { grid-column: 1; grid-row: auto; margin-bottom: 10px; border: 0; border-bottom: 1px solid var(--q-linea); border-radius: 0; padding: 10px 14px 0; }
  .bkq-opts--gallery .bkq-opt__t, .bkq-opts--gallery .bkq-opt__d, .bkq-opts--gallery .bkq-opt__p { grid-column: 1; padding: 0 16px; }
  .bkq-opts--gallery .bkq-opt__t { padding-right: 40px; }
  .bkq-opts--gallery .bkq-opt__p { margin-top: 6px; }
  .bkq .bkq-opts--gallery .bkq-opt input[type="checkbox"] + .bkq-opt__box::after { top: auto; bottom: 14px; }
}
@media (min-width: 1200px) { .bkq-opts--gallery { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
.bkq-opts--gallery .bkq-opt input:checked + .bkq-opt__box .bkq-opt__pv { border-color: color-mix(in srgb, var(--q-azul) 40%, var(--q-linea)); }

/* «Continuar» en la columna de la propuesta, que acompaña al scroll. */
.bkq-quote__next { width: 100%; margin-top: 18px; padding: 15px 20px; }
/* En la barra del móvil cabe una cifra: con pago único, lo anual se lee en el resumen. */
.bkq-figs--bar [data-fig="once"]:not([hidden]) ~ [data-fig="recurring"] { display: none; }
/* El «No» con su aspa, frente a los síes. */
.bkq-seg--x input[value="no"] + span::before { content: ""; display: inline-block; vertical-align: 0; width: 10px; height: 10px; margin-right: 8px; background: currentColor; opacity: .7;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='m1.5 1.5 7 7m0-7-7 7' stroke='%23000' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='m1.5 1.5 7 7m0-7-7 7' stroke='%23000' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Pie en foco: solo lo legal, en una línea, sin el pie del sitio. */
body#module-bkmodules-lead #footer { background: none; }
.bkq-foot { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 20px; padding: 28px 16px 32px; border-top: 1px solid #e1e8ed;
  font: 400 13.5px/1.4 Inter, "Inter respaldo", sans-serif; color: #4a5866; }
.bkq-foot a { color: #4a5866; text-decoration: none; }
.bkq-foot a:hover { color: #00769e; }