/**
 * Limpieza de una tienda hackeada: lo propio de su página sobre maintenance.css. El héroe con los síntomas y el recuadro de
 * pago compacto con sus dos salidas (pagar o WhatsApp, con el mismo peso), la franja de PHP2Shell, cómo trabajamos desde
 * que nos das acceso junto al informe, PHP2Shell por versión de PrestaShop, la salida al mantenimiento y la banda de
 * noche que cierra la página con las dos salidas otra vez. La barra de abajo lleva también las dos salidas.
 *
 *  @author    BK Modules 🔥
 *  @copyright 2026 BK Modules
 */

/* ---------------------------------------------------------------- héroe: el problema, lo que entregamos y el pago */

.bkc .bkc-hero { gap: 32px; padding: 36px 0 56px; }
.bkc .bkmp-title { margin-bottom: 16px; font-size: 34px; }
/* Los síntomas: lo primero que reconoce quien llega, más fuerte que el párrafo de la urgencia */
.bkq .bkc-hero__sym { max-width: 46ch; margin: 0 0 12px; font: 700 19px/1.4 var(--q-titulo); letter-spacing: -.01em; color: var(--q-ink); text-wrap: pretty; }
.bkq .bkc-hero__urge { max-width: 50ch; margin: 0; font-size: 17px; line-height: 1.55; color: var(--q-gris); }
.bkc-hero__get { list-style: none; display: grid; gap: 12px; margin: 26px 0 0; padding: 0; }
.bkc-hero__get li { display: flex; align-items: center; gap: 12px; font: 600 15.5px/1.35 var(--q-texto); color: var(--q-ink); }
.bkc-hero__get svg { flex: none; box-sizing: content-box; width: 20px; height: 20px; padding: 7px; border-radius: 10px; background: #fff; fill: none;
  stroke: var(--q-azul); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; box-shadow: 0 8px 20px -14px rgba(22, 32, 43, .6); }

/* El recuadro de pago: precio, plazo, la tienda y las dos salidas, una debajo de otra y del mismo tamaño */
.bkc-buy { position: relative; scroll-margin-top: 110px; padding: 24px; border: 1px solid var(--q-linea); border-radius: 20px; background: #fff;
  box-shadow: 0 30px 70px -40px rgba(13, 39, 51, .55), 0 2px 6px rgba(13, 39, 51, .04); }
.bkq .bkc-buy__h { margin: 0; font: 700 15.5px/1.3 var(--q-titulo); color: var(--q-gris); }
.bkq .bkc-buy__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 6px 0 0; }
.bkc-buy__price b { font: 800 44px/1 var(--q-titulo); letter-spacing: -.035em; color: var(--q-ink); font-variant-numeric: tabular-nums; }
.bkc-buy__price span { font: 600 14.5px/1.3 var(--q-texto); color: var(--q-gris); }
.bkq .bkc-buy__time { display: flex; align-items: flex-start; gap: 8px; margin: 12px 0 0; font: 600 14.5px/1.4 var(--q-texto); color: var(--q-ink); }
.bkc-buy__time svg { flex: none; width: 18px; height: 18px; margin-top: 1px; fill: none; stroke: var(--q-c5); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* La tienda: sin el recuadro de banda del mantenimiento; el error se marca en el campo */
.bkc-buy .bkmp-shop, .bkc-buy .bkmp-shop:has(.is-error), .bkc-buy .bkmp-shop:has([data-bkmp-err]:not([hidden])) { display: block; margin: 20px 0 0; padding: 18px 0 0;
  border: 0; border-top: 1px solid var(--q-linea); border-radius: 0; background: none; }
.bkq .bkc-buy__label { display: block; margin: 0 0 8px; font: 700 15px/1.3 var(--q-texto); color: var(--q-ink); }
.bkc-buy__go { display: grid; gap: 10px; margin: 14px 0 0; }
.bkq .bkc-buy .bkc-go { width: 100%; padding: 17px 20px; font-size: 16.5px; }
/* La limpieza ya en marcha de una web del cliente: tranquiliza y lleva a seguirla, antes de elegir otra tienda */
.bkc-buy__busy { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 14px; padding: 12px 14px; border-radius: 12px; background: #e9f7ef; }
.bkq .bkc-buy__busy span { font: 600 13.5px/1.5 var(--q-texto); color: var(--q-ink); }
.bkc-buy__busy svg { flex: none; width: 18px; height: 18px; margin-top: 1px; fill: none; stroke: #0e7a40; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#wrapper .bkq .bkc-buy__busy a { color: #0e7a40; text-decoration: underline; text-underline-offset: 3px; }
.bkq .bkc-buy__hint { margin: 12px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--q-gris); }
/* El root, lo único que puede frenar la compra: qué se pide y, debajo, la duda resuelta por WhatsApp antes de pagar */
.bkc-buy__root { display: flex; align-items: flex-start; gap: 10px; margin: 14px 0 0; padding: 12px 14px; border-radius: 12px; background: var(--q-banda); }
.bkq .bkc-buy__root p { margin: 0; font: 600 13.5px/1.5 var(--q-texto); color: var(--q-ink); }
.bkc-buy__root svg { flex: none; width: 18px; height: 18px; margin-top: 1px; fill: none; stroke: var(--q-azul); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#wrapper .bkq a.bkc-buy__ask, #wrapper .bkq a.bkc-buy__ask:visited { display: block; margin-top: 6px; color: #0e7a40; font-weight: 700;
  text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
#wrapper .bkq a.bkc-buy__ask:hover { color: #0a5f31; }
.bkc-buy .bkmp-terms { margin-top: 12px; font-size: 14px; }

/* WhatsApp: el color del canal de contact.tpl (#128c4a) a todo el botón, con el mismo tamaño que el de pagar */
#wrapper .bkq a.bkc-wa, #wrapper .bkq a.bkc-wa:visited, .bkq a.bkc-wa { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 16px 20px; border-radius: 10px;
  background: #128c4a; color: #fff; font: 700 16.5px/1.2 var(--q-texto); text-align: center; text-decoration: none; box-shadow: 0 10px 24px -12px rgba(18, 140, 74, .8);
  transition: background .18s, transform .18s var(--q-ease), box-shadow .18s; }
#wrapper .bkq a.bkc-wa:hover { background: #0e7a40; color: #fff; transform: translateY(-2px); box-shadow: 0 16px 30px -14px rgba(18, 140, 74, .9); }
#wrapper .bkq a.bkc-wa:focus-visible { outline: 2px solid #128c4a; outline-offset: 3px; }
.bkc-wa svg { flex: none; width: 20px; height: 20px; fill: currentColor; }

@media (min-width: 768px) { .bkc .bkmp-title { font-size: 44px; } }
@media (min-width: 992px) {
  .bkc .bkc-hero { grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr); align-items: start; gap: 56px; padding: 44px 0 72px; }
  .bkc .bkmp-title { font-size: 50px; }
  .bkc-hero__text { padding-top: 12px; }
  .bkc-buy { padding: 28px; }
}
@media (max-width: 767px) {
  .bkc .bkmp-title { font-size: 30px; line-height: 1.06; }
  /* El título del recuadro repite el H1: en el móvil se queda para los lectores de pantalla y el precio sube */
  .bkc-buy__h { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .bkq .bkc-buy__price { margin-top: 0; }
  .bkc .bkc-hero { gap: 16px; padding: 12px 0 44px; }
  .bkq .bkc-hero__urge { font-size: 15.5px; line-height: 1.5; }
  .bkc-hero__get { margin-top: 18px; gap: 10px; }
  .bkc-buy { padding: 16px 16px 18px; border-radius: 18px; }
  .bkq .bkc-buy__price { gap: 4px 10px; }
  .bkc-buy__price b { font-size: 36px; }
  .bkc-buy__price span { font-size: 14px; }
  .bkq .bkc-buy__time { margin-top: 8px; }
  .bkc-buy .bkmp-shop, .bkc-buy .bkmp-shop:has(.is-error), .bkc-buy .bkmp-shop:has([data-bkmp-err]:not([hidden])) { margin-top: 14px; padding-top: 12px; }
  .bkq .bkc-buy__label { margin-bottom: 6px; }
  .bkc-buy__go { gap: 8px; margin-top: 10px; }
  .bkq .bkc-buy .bkc-go, #wrapper .bkq .bkc-buy a.bkc-wa { padding: 15px 16px; }
}
/* En el móvil el pago sube justo detrás de los síntomas, con sus dos botones a la vista sin bajar (360 × 720): lo que
   cuesta cada hora y lo que entregamos van después del recuadro */
@media (max-width: 991px) {
  .bkc .bkc-hero { display: flex; flex-direction: column; }
  .bkc-hero__text { display: contents; }
  .bkc-hero .bkmp-title { order: 1; margin-bottom: 0; }
  .bkc-hero__sym { order: 2; }
  .bkc-buy { order: 3; }
  .bkc-hero__urge { order: 4; }
  .bkc-hero__get { order: 5; margin-top: 0; }
  .bkq .bkc-hero__sym { margin: -4px 0 -8px; font-size: 17px; }
}

/* ---------------------------------------------------------------- PHP2Shell, la urgencia del momento */

/* Una franja bajo el héroe con la cara roja del cubo como clave de alerta: lo que es, sus fuentes y que va incluido; el
   enlace baja a la sección con la tabla por versión */
.bkc-alert { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 14px; align-items: start; margin: 0; padding: 18px 20px;
  border: 1px solid color-mix(in srgb, var(--q-c6) 28%, var(--q-linea)); border-radius: 16px; background: color-mix(in srgb, var(--q-c6) 5%, #fff);
  box-shadow: 0 18px 40px -34px rgba(120, 20, 18, .6); }
.bkc-alert__i { width: 26px; height: 26px; margin-top: 1px; fill: none; stroke: var(--q-c6); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.bkq .bkc-alert__t { margin: 0; font-size: 15px; line-height: 1.55; color: var(--q-gris); }
.bkc-alert__t b { display: block; margin-bottom: 2px; font: 800 16.5px/1.35 var(--q-titulo); letter-spacing: -.01em; color: #8f1f1c; }
#wrapper .bkq a.bkc-alert__go, #wrapper .bkq a.bkc-alert__go:visited { grid-column: 2; justify-self: start; display: inline-flex; align-items: center; gap: 6px; margin-top: 6px;
  color: var(--q-azul-osc); font: 700 15px/1.3 var(--q-texto); text-decoration: none; }
.bkc-alert__go svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s var(--q-ease); }
#wrapper .bkq a.bkc-alert__go:hover { color: var(--q-azul); }
.bkc-alert__go:hover svg { transform: translateX(3px); }
@media (min-width: 992px) {
  .bkc-alert { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0 18px; padding: 18px 24px; }
  #wrapper .bkq a.bkc-alert__go { grid-column: 3; margin: 0; white-space: nowrap; }
}

/* ---------------------------------------------------------------- cómo trabajamos desde que nos das acceso */

/* El plazo y los cuatro pasos a la izquierda, el informe tal como se entrega a la derecha. Los pasos van unidos por tramos
   que se llenan uno tras otro, de azul a verde, hasta la tienda devuelta: el único movimiento de la página. Cada tramo va
   del punto de su paso al del siguiente, así la línea termina en el último. */
.bkc-day { display: grid; gap: 40px 64px; align-items: center; padding: 72px 0 0; }
.bkc-day .bkmp-h { margin-bottom: 12px; }
.bkq .bkc-day__time { max-width: 60ch; margin: 0 0 28px; font-size: 16.5px; line-height: 1.6; color: var(--q-gris); }
.bkc-day__time b { color: var(--q-ink); }
.bkc-day__list { list-style: none; display: grid; gap: 0; margin: 0; padding: 0; }
.bkc-day__list li { position: relative; padding: 10px 0 22px 44px; }
.bkc-day__list li:last-child { padding-bottom: 0; }
.bkc-day__list li:nth-child(1) { --bkc-from: var(--q-azul); --bkc-to: #2a96b5; }
.bkc-day__list li:nth-child(2) { --bkc-from: #2a96b5; --bkc-to: var(--q-c2); --bkc-delay: .45s; }
.bkc-day__list li:nth-child(3) { --bkc-from: var(--q-c2); --bkc-to: var(--q-c5); --bkc-delay: .9s; }
.bkc-day__list li:not(.is-end)::after { content: ""; position: absolute; left: 12px; top: 22px; width: 2px; height: 100%;
  background: linear-gradient(to bottom, var(--bkc-from), var(--bkc-to)); transform-origin: top; animation: bkc-day-y .6s var(--q-ease) var(--bkc-delay, 0s) both; }
@keyframes bkc-day-y { from { transform: scaleY(0); } }
.bkc-day__list li::before { content: ""; position: absolute; z-index: 1; left: 6px; top: 15px; width: 14px; height: 14px; box-sizing: border-box; border-radius: 50%;
  background: #fff; border: 2px solid var(--q-azul); }
.bkc-day__list li.is-end::before { left: 0; top: 9px; width: 26px; height: 26px; border: 0; background: var(--q-c5)
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4.3 8.3 2.4 2.4 5-5.2' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px no-repeat;
  box-shadow: 0 8px 18px -8px rgba(89, 167, 68, .9); }
.bkc-day__list b { display: block; margin-bottom: 4px; font: 700 17px/1.3 var(--q-titulo); color: var(--q-ink); }
.bkc-day__list span { display: block; max-width: 52ch; font-size: 15px; line-height: 1.5; color: var(--q-gris); }

/* ---------------------------------------------------------------- lo que necesitamos (noche), en tres columnas */

@media (min-width: 992px) { .bkc .bkc-need .bkmp-steps { grid-template-columns: repeat(3, 1fr); gap: 40px; } }

/* El informe: una hoja con sus apartados, ligeramente girada sobre una cara verde del cubo */
.bkc-report { position: relative; margin: 0; max-width: 420px; width: 100%; justify-self: center; isolation: isolate; }
.bkc-report::before { content: ""; position: absolute; z-index: -1; width: 150px; aspect-ratio: 1; top: -30px; right: -22px; border-radius: 16px;
  background: var(--q-c5); opacity: .2; transform: rotate(45deg) skew(-8deg, -8deg); }
.bkc-report__sheet { padding: 26px 26px 18px; border: 1px solid var(--q-linea); border-radius: 18px; background: #fff; transform: rotate(-1.2deg);
  box-shadow: 0 30px 70px -40px rgba(13, 39, 51, .55), 0 2px 6px rgba(13, 39, 51, .04); }
.bkq .bkc-report__h { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; padding-bottom: 14px; border-bottom: 1px solid var(--q-linea);
  font: 800 18px/1.25 var(--q-titulo); letter-spacing: -.015em; color: var(--q-ink); }
.bkc-report svg { flex: none; width: 22px; height: 22px; fill: none; stroke: var(--q-azul); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.bkc-report__list { list-style: none; counter-reset: bkcr; margin: 0; padding: 0; }
.bkc-report__list li { counter-increment: bkcr; display: flex; align-items: center; gap: 14px; padding: 12px 0; font: 600 15.5px/1.35 var(--q-texto); color: var(--q-ink); }
.bkc-report__list li + li { border-top: 1px dashed var(--q-linea); }
.bkc-report__list li::before { content: counter(bkcr); display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 8px;
  background: color-mix(in srgb, var(--q-azul) 10%, #fff); color: var(--q-azul-osc); font: 800 14px/1 var(--q-titulo); font-variant-numeric: tabular-nums; }
.bkq .bkc-report__foot { display: flex; align-items: center; gap: 8px; margin: 10px 0 0; padding: 10px 12px; border-radius: 10px;
  background: color-mix(in srgb, var(--q-c5) 13%, #fff); font: 700 14px/1.3 var(--q-texto); color: #2f6624; }
.bkc-report__foot svg { width: 18px; height: 18px; stroke: #3d7a2e; }
@media (min-width: 992px) {
  .bkc-day { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  .bkc-report { justify-self: end; }
}

/* ---------------------------------------------------------------- qué hacer ahora (la búsqueda «web hackeada, qué hacer») */

.bkc-now { padding: 76px 0 0; }
.bkc-now .bkmp-h { margin-bottom: 12px; }
.bkq .bkc-now__p { max-width: 62ch; margin: 0 0 26px; font-size: 16.5px; line-height: 1.6; color: var(--q-ink); }
.bkc-now__list { list-style: none; counter-reset: bkcn; display: grid; gap: 22px 40px; margin: 0; padding: 0; }
.bkc-now__list li { counter-increment: bkcn; position: relative; padding-left: 46px; }
.bkc-now__list li::before { content: counter(bkcn); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px;
  background: color-mix(in srgb, var(--q-azul) 10%, #fff); color: var(--q-azul-osc); font: 800 15px/1 var(--q-titulo); font-variant-numeric: tabular-nums; }
.bkc-now__list b { display: block; margin: 4px 0; font: 700 17px/1.3 var(--q-titulo); letter-spacing: -.01em; color: var(--q-ink); }
.bkc-now__list span { display: block; max-width: 52ch; font-size: 15px; line-height: 1.55; color: var(--q-gris); }
@media (min-width: 768px) { .bkc-now__list { grid-template-columns: repeat(2, 1fr); } }

/* ---------------------------------------------------------------- PHP2Shell */

/* Para quien busca: sin banda ni botones, con la cara roja del cubo en cada entrada conocida */
.bkc-php { display: grid; gap: 24px 56px; padding: 76px 0 0; }
.bkq .bkc-php__intro p { max-width: 58ch; margin: 0 0 14px; font-size: 16px; line-height: 1.6; color: var(--q-gris); }
.bkq .bkc-php__intro p:first-of-type { color: var(--q-ink); }
.bkq .bkc-php__check { display: flex; align-items: flex-start; gap: 12px; margin: 22px 0 0; padding: 14px 18px; border-radius: 14px; border: 1px solid var(--q-linea);
  background: #fff; font: 600 15px/1.5 var(--q-texto); color: var(--q-ink); }
.bkc-php__check svg { flex: none; width: 22px; height: 22px; fill: none; stroke: var(--q-c5); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.bkc-php__h { margin: 0 0 14px; font: 800 18px/1.3 var(--q-titulo); letter-spacing: -.015em; color: var(--q-ink); text-wrap: balance; }

.bkc-ver { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--q-linea); border-radius: 16px; background: #fff; overflow: hidden; }
.bkc-ver thead th { padding: 12px 18px; background: #eaf0f4; font: 600 13px/1.3 var(--q-texto); color: var(--q-gris); text-align: left; }
.bkc-ver tbody th, .bkc-ver td { padding: 16px 18px; border-top: 1px solid var(--q-linea); vertical-align: top; text-align: left; }
.bkc-ver tbody th { white-space: nowrap; font: 800 22px/1.05 var(--q-titulo); letter-spacing: -.02em; color: var(--q-ink); font-variant-numeric: tabular-nums; }
.bkc-ver tbody th span { display: block; margin-bottom: 4px; font: 600 12.5px/1 var(--q-texto); letter-spacing: 0; color: var(--q-gris); }
.bkc-ver td { font-size: 14.5px; line-height: 1.5; color: var(--q-ink); }
.bkc-ver .bkc-ver__php { white-space: nowrap; font-weight: 700; color: var(--q-azul-osc); font-variant-numeric: tabular-nums; }
.bkq .bkc-php__note { margin: 14px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--q-gris); }

.bkc-php__more ul { list-style: none; display: grid; gap: 12px 32px; margin: 0; padding: 0; }
.bkc-php__more li { position: relative; padding: 14px 0 0 22px; border-top: 1px solid #dbe4ea; font-size: 14.5px; line-height: 1.55; color: var(--q-ink); }
.bkc-php__more li::before { content: ""; position: absolute; left: 2px; top: 22px; width: 8px; height: 8px; border-radius: 2px; background: var(--q-c6); opacity: .8; transform: rotate(45deg); }

@media (min-width: 992px) {
  .bkc-php { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .bkc-php__intro { padding-top: 6px; }
  .bkc-php__more { grid-column: 1 / -1; }
  .bkc-php__more ul { grid-template-columns: repeat(3, 1fr); }
}
/* En el móvil cada versión es una ficha: versión y PHP en una fila, lo que hacemos debajo */
@media (max-width: 639px) {
  .bkc-ver, .bkc-ver tbody, .bkc-ver tr { display: block; }
  .bkc-ver thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .bkc-ver tr { display: grid; grid-template-columns: auto 1fr; align-items: end; padding: 16px 16px 14px; }
  .bkc-ver tr + tr { border-top: 1px solid var(--q-linea); }
  .bkc-ver tbody th, .bkc-ver td { padding: 0; border: 0; }
  .bkc-ver .bkc-ver__php { justify-self: end; }
  .bkc-ver .bkc-ver__php::before { content: "PHP "; }
  .bkc-ver td:last-child { grid-column: 1 / -1; margin-top: 10px; }
}

/* ---------------------------------------------------------------- después: el mantenimiento, destacado */

.bkq .bkc-next__p { max-width: 62ch; margin: -8px 0 24px; font-size: 16.5px; line-height: 1.6; color: var(--q-gris); }
.bkc-next .bkc-next__main { border-color: color-mix(in srgb, var(--q-azul) 40%, var(--q-linea)); box-shadow: 0 24px 50px -36px rgba(0, 118, 158, .65); }

/* Los módulos que recomendamos en el informe: banda discreta, sin botón de acción que compita con el de pagar */
.bkc-mods { padding: 76px 0 0; }
.bkc-mods .bkmp-h { margin-bottom: 10px; }
.bkq .bkc-mods__p { max-width: 680px; margin: 0 0 20px; font-size: 16px; line-height: 1.55; color: var(--q-gris); }

@media (max-width: 767px) {
  .bkc-php, .bkc-day, .bkc-mods, .bkc-now { padding-top: 60px; }
  .bkc-report__sheet { transform: none; }
}
/* ---------------------------------------------------------------- el cierre: las dos salidas otra vez, de noche */

/* Sustituye en esta página a la banda genérica del pie: noche de lado a lado, el texto a la izquierda y los dos botones,
   del mismo tamaño, a la derecha; en el móvil, apilados. Pagar va en blanco sobre la noche (el botón de la marca en noche)
   y WhatsApp en su verde. */
.bkc-close { position: relative; display: grid; gap: 26px 48px; align-items: center; margin: 88px 0 0; padding: 60px 0 64px; color: #fff; isolation: isolate; }
.bkc-close::before { content: ""; position: absolute; z-index: -1; inset: 0 -50vw;
  background: radial-gradient(circle, rgba(126, 208, 218, .16) 1px, transparent 1.5px) 0 0 / 22px 22px, linear-gradient(160deg, var(--q-noche-2), var(--q-noche) 70%); }
.bkq .bkc-close__h { margin: 0; font: 800 30px/1.12 var(--q-titulo); letter-spacing: -.025em; color: #fff; text-wrap: balance; }
.bkq .bkc-close__text p { max-width: 54ch; margin: 12px 0 0; font-size: 17px; line-height: 1.6; color: #c4dbe3; font-variant-numeric: tabular-nums; }
.bkc-close__go { display: grid; gap: 10px; }
#wrapper .bkq .bkc-close a.bkc-close__pay, #wrapper .bkq .bkc-close a.bkc-close__pay:visited { justify-content: center; padding: 16px 20px; background: #fff; color: var(--q-noche); font-size: 16.5px;
  box-shadow: 0 12px 28px -14px rgba(0, 0, 0, .6); }
#wrapper .bkq .bkc-close a.bkc-close__pay:hover { background: #e5f4f8; color: var(--q-noche); }
.bkc-close a.bkc-close__pay:focus-visible, .bkc-close a.bkc-wa:focus-visible { outline-color: var(--q-cian); }
.bkc-close__pay svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wrapper .bkq .bkc-close a.bkc-wa { box-shadow: 0 12px 28px -14px rgba(0, 0, 0, .6); }
@media (min-width: 992px) {
  .bkc-close { grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); }
  .bkq .bkc-close__h { font-size: 36px; }
}
@media (max-width: 767px) { .bkc-close { margin-top: 64px; padding: 48px 0 52px; } .bkq .bkc-close__h { font-size: 27px; } }

/* El botón «¿Qué necesitas?» de la cabecera no va en esta página: quien llega tiene un problema concreto y ya tiene sus
   dos salidas; el menú del móvil lo sigue llevando entre sus apartados. */
#module-bkmodules-cleanup #cbp-hrmenu > .cbp-pulled-right { display: none; }

/* La barra de abajo con las dos salidas; en el móvil, solo los dos botones a partes iguales */
.bkc-dock { width: min(720px, calc(100% - 32px)); }
#wrapper .bkq .bkc-dock a.bkc-wa { flex: none; padding: 13px 18px; font-size: 16px; box-shadow: none; }
#wrapper .bkq .bkc-dock a.bkq-btn, #wrapper .bkq .bkc-dock a.bkq-btn:visited, #wrapper .bkq .bkc-dock a.bkq-btn:hover { color: var(--q-noche); }
@media (max-width: 639px) {
  .bkc-dock { gap: 6px; padding: 6px; bottom: 10px; width: calc(100% - 20px); }
  .bkc-dock .bkmp-dock__t { display: none; }
  /* Mitad y mitad, con el relleno justo para que «Empezar la limpieza» quepa en una línea a 360 px; un texto más largo
     (según el idioma) pasa a dos líneas antes que cortarse */
  .bkc-dock { align-items: stretch; }
  .bkq .bkc-dock .bkq-btn, #wrapper .bkq .bkc-dock a.bkc-wa { flex: 1 1 0; min-width: 0; justify-content: center; gap: 8px; padding: 13px 4px; font-size: 14px; line-height: 1.2;
    text-align: center; white-space: normal; text-wrap: balance; }
  .bkq .bkc-dock .bkq-btn svg { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .bkc-day__list li::after { animation: none; }
  .bkq a.bkc-wa { transition: none; }
}
