/* previa.css */
/*
 * Lo que la vista previa cambia fuera de las paginas nuevas: el carrito lateral
 * y el checkout. Se carga solo para quien ve la web nueva (body.eph-previa).
 *
 * El checkout toma la cara de /checkout-alt/ con `plantillas/checkout-form.php`;
 * aca se visten las piezas que dibuja WooCommerce adentro. Los campos, el pago y
 * lo que se guarda en el pedido son los de siempre.
 *
 * El carrito lateral usa tokens propios (--pv-*) porque no vive adentro de .epa
 * ni de .eph-home. Los valores son los mismos.
 */
body.eph-previa{
  --pv-fondo:#F8FAFC; --pv-blanco:#FFFFFF; --pv-tinta:#0F172A; --pv-texto:#475569;
  --pv-borde:#E2E8F0; --pv-azul:#0064FF; --pv-azul-osc:#0052D4; --pv-azul-texto:#0052D4;
  --pv-verde-tinta:#05602C; --pv-sombra:0 1px 2px rgba(16,24,40,.05); --pv-radio:16px;
  --pv-verde:#0B7038; --pv-verde-osc:#095C2E;
}
[data-theme="dark"] body.eph-previa{
  --pv-fondo:#0B1222; --pv-blanco:#151D35; --pv-tinta:#E9EEF6; --pv-texto:#A2B0C6;
  --pv-borde:#253149; --pv-azul:#3B82F6; --pv-azul-osc:#2563EB; --pv-azul-texto:#7FB0FF;
  --pv-verde-tinta:#5FD98D; --pv-sombra:0 1px 2px rgba(0,0,0,.3);
  --pv-verde:#15954A; --pv-verde-osc:#0E7A3C;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) body.eph-previa{
    --pv-fondo:#0B1222; --pv-blanco:#151D35; --pv-tinta:#E9EEF6; --pv-texto:#A2B0C6;
    --pv-borde:#253149; --pv-azul:#3B82F6; --pv-azul-osc:#2563EB; --pv-azul-texto:#7FB0FF;
    --pv-verde-tinta:#5FD98D; --pv-sombra:0 1px 2px rgba(0,0,0,.3);
    --pv-verde:#15954A; --pv-verde-osc:#0E7A3C;
  }
}

/* ─────────────────────────── El carrito lateral ─────────────────────────── */

body.eph-previa .header-cart-drawer__panel{background:var(--pv-fondo);color:var(--pv-tinta);
  font-family:'Inter',system-ui,-apple-system,sans-serif}
body.eph-previa .header-cart-drawer__panel .header-cart-drawer__title{color:var(--pv-tinta);font-weight:700}
body.eph-previa .header-cart-drawer__panel .header-cart-drawer__close{color:var(--pv-texto)}
body.eph-previa .header-cart-drawer__panel .header-cart-item{background:var(--pv-blanco);
  border:1px solid var(--pv-borde);border-radius:var(--pv-radio);box-shadow:var(--pv-sombra)}
body.eph-previa .header-cart-drawer__panel .header-cart-item__thumb img{background:#fff;border-radius:12px}
body.eph-previa .header-cart-drawer__panel .header-cart-item__name,
body.eph-previa .header-cart-drawer__panel .header-cart-item__name a{color:var(--pv-tinta);font-weight:600}
body.eph-previa .header-cart-drawer__panel .header-cart-item__qty{color:var(--pv-texto)}
/* − N +: los arma `EPH_Previa::cajon_cantidades()` sobre el "Cant: N" del tema. */
body.eph-previa .header-cart-drawer__panel .eph-cant{display:inline-flex;align-items:center;
  border:1px solid var(--pv-borde);border-radius:12px;overflow:hidden;background:var(--pv-fondo)}
body.eph-previa .header-cart-drawer__panel .eph-cant-btn{width:2rem;height:2rem;display:grid;place-items:center;
  padding:0;border:0;background:transparent;color:var(--pv-tinta);font:inherit;font-size:1.125rem;font-weight:600;
  line-height:1;cursor:pointer;transition:background .15s var(--ep-suave,ease)}
body.eph-previa .header-cart-drawer__panel .eph-cant-btn:hover:not(:disabled){background:var(--pv-borde)}
body.eph-previa .header-cart-drawer__panel .eph-cant-btn:focus-visible{outline:2px solid var(--pv-azul);outline-offset:-2px}
body.eph-previa .header-cart-drawer__panel .eph-cant-btn:disabled{opacity:.35;cursor:default}
body.eph-previa .header-cart-drawer__panel .eph-cant-n{min-width:1.9rem;text-align:center;font-weight:600;
  color:var(--pv-tinta);font-variant-numeric:tabular-nums}
body.eph-previa .header-cart-drawer__panel .header-cart-item.eph-cargando,
body.eph-previa .header-cart-drawer.eph-cargando .header-cart-drawer__content{opacity:.55;pointer-events:none}
body.eph-previa .header-cart-drawer__panel .header-cart-item__price{color:var(--pv-tinta);font-weight:600}
body.eph-previa .header-cart-drawer__panel .header-cart-item__remove{color:var(--pv-texto)}
body.eph-previa .header-cart-drawer__panel .header-cart-drawer__footer{background:var(--pv-fondo);
  border-top:1px solid var(--pv-borde)}
body.eph-previa .header-cart-drawer__panel .header-cart-summary__row{color:var(--pv-texto)}
body.eph-previa .header-cart-drawer__panel .header-cart-summary__row strong{color:var(--pv-tinta)}
body.eph-previa .header-cart-drawer__panel .header-cart-summary__row .is-success{color:var(--pv-verde-tinta)}
body.eph-previa .header-cart-drawer__panel .btn{border-radius:999px;font-weight:600;box-shadow:none}
body.eph-previa .header-cart-drawer__panel .btn--primary{background:var(--pv-azul);color:#fff;border-color:transparent}
body.eph-previa .header-cart-drawer__panel .btn--primary:hover{background:var(--pv-azul-osc)}
body.eph-previa .header-cart-drawer__panel .btn--secondary{background:transparent;color:var(--pv-tinta);
  border:1px solid var(--pv-borde)}
body.eph-previa .header-cart-drawer__panel .header-cart-drawer__empty-btn{color:var(--pv-texto)}

/* ─────────────────────────────── El checkout ─────────────────────────────── */

/* El tema le pone overflow-x:hidden al body, y eso convierte al body en el que
   scrollea: el resumen, que es sticky, dejaba de acompañar al bajar. `clip`
   recorta lo mismo sin ese efecto, y el boton de confirmar queda a la vista. */
body.eph-previa.woocommerce-checkout{overflow-x:clip}
/* El encabezado del tema es fijo y mide 117px con el menu (medido el 22/9); con
   la barra de administracion, 32 mas. El resumen se queda justo debajo. */
@media (min-width:960px){
  body.eph-previa .epa .epa-co-resumen{top:calc(117px + 1rem)}
  body.eph-previa.admin-bar .epa .epa-co-resumen{top:calc(149px + 1rem)}
}

/* El tema centra su envoltorio con left:50% y translate; aca lo centra .epa-wrap.
   Sumarle un margin auto encima fue lo que lo corria a la derecha. */
body.eph-previa .electropc-checkout-shortcode{position:static;left:auto;transform:none;
  width:auto;max-width:none;margin:0;padding:0}

body.eph-previa .electropc-checkout-shortcode .woocommerce-message,
body.eph-previa .electropc-checkout-shortcode .woocommerce-info,
body.eph-previa .electropc-checkout-shortcode .woocommerce-error{width:min(1152px,calc(100% - 32px));margin:1rem auto 0;
  background:var(--pv-blanco);color:var(--pv-tinta);border:1px solid var(--pv-borde);
  border-left:3px solid var(--pv-azul);border-radius:12px;box-shadow:none}
body.eph-previa .electropc-checkout-shortcode .woocommerce-error{border-left-color:#E5484D}
body.eph-previa .electropc-checkout-shortcode .woocommerce-message a,
body.eph-previa .electropc-checkout-shortcode .woocommerce-info a{color:var(--pv-azul-texto);font-weight:600;
  background:none;border:0}

/* ── Los campos ── */
body.eph-previa .epa-co .woocommerce-billing-fields > h3{display:none}
body.eph-previa .epa-co .woocommerce-billing-fields__field-wrapper,
body.eph-previa .epa-co .woocommerce-additional-fields__field-wrapper{margin-top:.9rem;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));column-gap:.8rem}
body.eph-previa .epa-co .form-row{grid-column:1 / -1;float:none;width:auto;margin:0 0 .8rem;padding:0}
body.eph-previa .epa-co .form-row-first{grid-column:1}
body.eph-previa .epa-co .form-row-last{grid-column:2}
@media (max-width:620px){
  body.eph-previa .epa-co .form-row-first,
  body.eph-previa .epa-co .form-row-last{grid-column:1 / -1}
}
body.eph-previa .epa-co .form-row label{display:block;margin:0 0 .3rem;font-size:.875rem;font-weight:600;
  color:var(--epa-texto)}
body.eph-previa .epa-co .form-row .required{color:var(--epa-azul-texto);text-decoration:none}
body.eph-previa .epa-co .form-row .optional{font-weight:400}
body.eph-previa .epa-co .input-text,
body.eph-previa .epa-co select,
body.eph-previa .epa-co textarea,
body.eph-previa .epa-co .select2-container .select2-selection{width:100%;font:inherit;font-size:1rem;
  padding:.7rem .8rem;min-height:2.9rem;border-radius:12px;border:1px solid var(--epa-borde);
  background:var(--epa-blanco);color:var(--epa-tinta);box-shadow:none}
body.eph-previa .epa-co .select2-container .select2-selection__rendered{color:var(--epa-tinta);padding:0;line-height:1.5}
body.eph-previa .epa-co .select2-container .select2-selection__arrow{top:50%;transform:translateY(-50%)}
body.eph-previa .epa-co .input-text:focus,
body.eph-previa .epa-co select:focus,
body.eph-previa .epa-co textarea:focus{outline:2px solid var(--epa-azul);outline-offset:1px;border-color:transparent}
body.eph-previa .epa-co .input-text::placeholder{color:var(--epa-texto);opacity:.6}
body.eph-previa .epa-co .form-row .description{font-size:.75rem;color:var(--epa-texto);margin-top:.3rem}
body.eph-previa .epa-co .woocommerce-account-fields label{display:flex;gap:.5rem;align-items:center}
body.eph-previa .select2-dropdown{background:var(--pv-blanco);color:var(--pv-tinta);border-color:var(--pv-borde)}
body.eph-previa .select2-results__option--highlighted[aria-selected]{background:var(--pv-azul);color:#fff}

/* ── El resumen: productos, envio y total ── */
body.eph-previa .epa-co .shop_table{width:100%;margin:.9rem 0 0;border:0;border-collapse:collapse;
  font-size:.875rem;color:var(--epa-texto)}
body.eph-previa .epa-co .shop_table thead{display:none}
body.eph-previa .epa-co .shop_table th,
body.eph-previa .epa-co .shop_table td{padding:.55rem 0;border:0;border-top:1px solid var(--epa-borde);
  background:none;text-align:left;vertical-align:top}
body.eph-previa .epa-co .shop_table tbody tr:first-child td{border-top:0}
body.eph-previa .epa-co .shop_table td:last-child{text-align:right;white-space:nowrap;padding-left:.8rem}
body.eph-previa .epa-co .shop_table .product-name{color:var(--epa-tinta);font-weight:600;font-size:.875rem;line-height:1.35}
body.eph-previa .epa-co .shop_table .product-name .product-quantity{color:var(--epa-texto);font-weight:600}
body.eph-previa .epa-co .shop_table .product-total{color:var(--epa-tinta);font-weight:600}
body.eph-previa .epa-co .shop_table tfoot th{color:var(--epa-texto);font-weight:400}
body.eph-previa .epa-co .shop_table tfoot td{color:var(--epa-tinta);font-weight:600}
body.eph-previa .epa-co .shop_table .order-total th,
body.eph-previa .epa-co .shop_table .order-total td{font-size:1.125rem;font-weight:700;color:var(--epa-tinta)}

/* El envio en el resumen es una fila mas: lo elegido y su precio. Las opciones
   se tildan a la izquierda, en "Como la recibis". */
body.eph-previa .epa-co .eph-co-envio-fila td .amount{color:var(--epa-tinta)}

/* ── Como la recibis ── */
/* El tema posiciona en absoluto los radios del envio; aca van en su tarjeta. */
body.eph-previa .epa-co .eph-co-envio input{position:static}
body.eph-previa .epa-co .eph-co-envio .epa-co-op-num .amount{color:inherit}
body.eph-previa .epa-co .eph-co-direccion{margin-top:.2rem}
/* Se vende solo en Argentina: el pais va igual en el pedido, sin preguntarlo. */
body.eph-previa .epa-co #billing_country_field{display:none}
/* La direccion se ve solo con envio, y ahi es obligatoria (lo valida
   EPH_Previa::validar_envio): el "(opcional)" de WooCommerce mentiria. */
body.eph-previa .epa-co .eph-co-direccion .optional{display:none}


/* ── La aclaracion del pedido, plegada: casi nadie la usa y alargaba la pantalla ── */
body.eph-previa .epa-co .eph-co-notas{margin-top:1.6rem}
body.eph-previa .epa-co .eph-co-notas summary{cursor:pointer;font-size:.875rem;font-weight:600;color:var(--epa-azul-texto)}
body.eph-previa .epa-co .eph-co-notas textarea{min-height:5rem}

/* ── El pago: cada medio es una tarjeta, igual que en la maqueta ── */
body.eph-previa .epa-co #payment{margin-top:1.1rem;background:none;border:0;border-radius:0}
body.eph-previa .epa-co #payment ul.payment_methods{margin:0;padding:0;border:0;list-style:none;display:grid;gap:.5rem}
body.eph-previa .epa-co #payment .wc_payment_method{margin:0;padding:.75rem .9rem;list-style:none;
  background:var(--epa-blanco);border:1px solid var(--epa-borde);border-radius:var(--epa-radio)}
body.eph-previa .epa-co #payment .wc_payment_method:has(> input:checked){border-color:var(--epa-azul);
  box-shadow:0 0 0 1px var(--epa-azul)}
body.eph-previa .epa-co #payment .wc_payment_method > input{accent-color:var(--epa-azul);margin:0 .5rem 0 0}
body.eph-previa .epa-co #payment .wc_payment_method > label{display:inline;color:var(--epa-tinta);font-weight:600;
  font-size:1rem;cursor:pointer}
body.eph-previa .epa-co #payment .wc_payment_method > label img{max-height:1.4rem;vertical-align:middle;margin-left:.3rem}
body.eph-previa .epa-co #payment .eph-co-pago-nota{display:block;margin:.15rem 0 0 1.55rem;font-size:.875rem;
  font-weight:400;color:var(--epa-texto)}
body.eph-previa .epa-co #payment div.payment_box{margin:.6rem 0 0;padding:.7rem .8rem;background:var(--epa-fondo);
  color:var(--epa-texto);border-radius:12px;font-size:.875rem}
body.eph-previa .epa-co #payment div.payment_box::before{display:none}
body.eph-previa .epa-co #payment .place-order{margin:1rem 0 0;padding:0}
body.eph-previa .epa-co .woocommerce-terms-and-conditions-wrapper,
body.eph-previa .epa-co .woocommerce-privacy-policy-text{font-size:.75rem;color:var(--epa-texto)}
body.eph-previa .epa-co .woocommerce-terms-and-conditions-wrapper a,
body.eph-previa .epa-co .woocommerce-privacy-policy-text a{color:var(--epa-azul-texto)}
body.eph-previa .epa-co #place_order{width:100%;margin-top:.8rem;padding:.95rem 1.2rem;border:0;border-radius:999px;
  background:var(--epa-azul);background-image:none;color:#fff;font:inherit;font-weight:600;font-size:1rem;
  box-shadow:none;cursor:pointer;transition:background .2s var(--epa-ease)}
body.eph-previa .epa-co #place_order:hover{background:var(--epa-azul-osc)}

/* ── Abajo del total: confirmar, y la seña como alternativa ── */
/* La casilla de los terminos y el boton, que el script trae de "Como abonas". */
body.eph-previa .epa-co .eph-co-pagar .place-order{margin:1rem 0 0;padding:0}
/* La seña va con borde y no rellena: es la alternativa, no lo elegido. */
body.eph-previa .eph-co-sena{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--pv-borde)}
body.eph-previa .eph-co-sena p{margin:0 0 .7rem;color:var(--pv-texto);font-size:.875rem;line-height:1.5}
body.eph-previa .eph-co-sena-btn{display:flex;align-items:center;justify-content:center;text-align:center;
  padding:.7rem 1rem;border-radius:999px;background:transparent;border:1px solid var(--pv-verde);
  color:var(--pv-verde-tinta);font-weight:600;text-decoration:none;font-size:.875rem;line-height:1.3}
body.eph-previa .eph-co-sena-btn:hover{background:var(--pv-verde);color:#fff}

/* ─────────────────────── Gracias por tu compra ─────────────────────── */
/* Misma grilla que el checkout (.epa-co): a la izquierda lo que sigue, a la
   derecha el pedido. */
body.eph-previa .eph-gr-tilde{display:inline-grid;place-items:center;width:2.6rem;height:2.6rem;margin:0 0 .8rem;
  border-radius:50%;background:var(--epa-badge-bg);color:var(--epa-badge-texto)}
body.eph-previa .eph-gr-numero{margin-top:.6rem;font-size:1rem;color:var(--epa-texto)}
body.eph-previa .eph-gr-numero b{color:var(--epa-tinta)}
body.eph-previa .eph-gr-caja{padding:1.1rem 1.2rem;background:var(--epa-blanco);border:1px solid var(--epa-borde);
  border-radius:var(--epa-radio)}
body.eph-previa .eph-gr-caja h2{margin:0 0 .6rem}
body.eph-previa .eph-gr-pago{font-size:1rem;color:var(--epa-texto);line-height:1.6}
body.eph-previa .eph-gr-pago h2,
body.eph-previa .eph-gr-pago h3{font-size:1rem;font-weight:600;color:var(--epa-tinta);margin:.6rem 0 .3rem}
body.eph-previa .eph-gr-pago ul{margin:.3rem 0;padding:0;list-style:none}
body.eph-previa .eph-gr-pago strong{color:var(--epa-tinta)}
body.eph-previa .eph-gr-pago a.button,
body.eph-previa .eph-gr-pago .button{display:inline-flex;margin-top:.6rem;padding:.8rem 1.1rem;border-radius:999px;
  background:var(--epa-azul);background-image:none;color:#fff;font-weight:600;text-transform:none;letter-spacing:0;box-shadow:none}
body.eph-previa .eph-gr-lista{margin:0;padding:0;list-style:none;display:grid;gap:.3rem;color:var(--epa-tinta);font-size:1rem}
body.eph-previa .eph-gr-destino{margin:0;color:var(--epa-tinta);font-size:1rem}
body.eph-previa .eph-gr-nota{margin:.5rem 0 0;font-size:.875rem;color:var(--epa-texto)}
body.eph-previa .eph-gr-acciones{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.7rem}
body.eph-previa .eph-gr-items{margin-top:.9rem;display:grid;gap:.6rem}
body.eph-previa .eph-gr-item{display:flex;justify-content:space-between;gap:1rem;font-size:.875rem;color:var(--epa-tinta)}
body.eph-previa .eph-gr-item span{font-weight:600;line-height:1.35}
body.eph-previa .eph-gr-item small{color:var(--epa-texto);font-weight:600}
body.eph-previa .eph-gr-item small.eph-gr-mejora{display:block;font-weight:400}
/* La mejora elegida en el carrito lateral: "Con 32GB RAM · 1TB" */
.header-cart-item__mejora{margin:.1rem 0 .2rem;font-size:.75rem;font-weight:600;line-height:1.35;color:var(--epa-azul-texto,#0052D4)}
body.eph-previa .eph-gr-item b{white-space:nowrap}
body.eph-previa .eph-gr-sub{margin-top:1.3rem}
body.eph-previa .eph-gr-datos{margin:.7rem 0 0;display:grid;gap:.45rem}
body.eph-previa .eph-gr-datos > div{display:flex;justify-content:space-between;gap:1rem;font-size:.875rem}
body.eph-previa .eph-gr-datos dt{color:var(--epa-texto)}
body.eph-previa .eph-gr-datos dd{margin:0;color:var(--epa-tinta);font-weight:600;text-align:right;word-break:break-word}
/* Lo que otros plugins cuelgan de woocommerce_thankyou. Los avisos de venta
   (Facebook, Google) son scripts y corren igual aunque no se vea; lo visible
   era el bloque "Pedido extra" del plugin de campos, que repetia DNI y tipo de
   factura, ya mostrados en "Tus datos". */
body.eph-previa .eph-gr-hooks{display:none}

/* La cuenta para transferir, con botones de copiar. */
body.eph-previa .eph-gr-intro{margin:0 0 .8rem;font-size:1rem;color:var(--epa-texto)}
body.eph-previa .eph-gr-intro b{color:var(--epa-tinta);font-size:1.125rem}
body.eph-previa .eph-gr-cuenta{margin:0;display:grid;border:1px solid var(--epa-borde);border-radius:var(--epa-radio);overflow:hidden}
body.eph-previa .eph-gr-cuenta > div{display:grid;grid-template-columns:5.5rem 1fr;gap:.8rem;align-items:center;
  padding:.65rem .9rem;border-top:1px solid var(--epa-borde);font-size:1rem}
body.eph-previa .eph-gr-cuenta > div:first-child{border-top:0}
body.eph-previa .eph-gr-cuenta dt{color:var(--epa-texto);font-size:.875rem}
body.eph-previa .eph-gr-cuenta dd{margin:0;display:flex;justify-content:space-between;align-items:center;gap:.6rem;
  color:var(--epa-tinta);font-weight:600;min-width:0}
body.eph-previa .eph-gr-cuenta dd span{overflow-wrap:anywhere}
body.eph-previa .eph-copiar{flex:none;padding:.35rem .7rem;border-radius:999px;border:1px solid var(--epa-azul);
  background:transparent;color:var(--epa-azul-texto);font:inherit;font-size:.875rem;font-weight:600;cursor:pointer}
body.eph-previa .eph-copiar:hover{background:var(--epa-azul);color:#fff}
body.eph-previa .eph-gr-informar{display:flex;width:100%;margin-top:1rem;font-size:1rem;padding:1rem 1.2rem}

/* recorrido-linea.css */
/* ElectroPC · PC Gamer del lienzo "Recorrido simple" (26/9).
 *
 * Carga solo con el diseño nuevo prendido (`EPH_Vista::recorrido`) y en la
 * página de la línea, en lugar de home.css y linea-alt.css. El marcado lo arma
 * `EPH_LineaRecorrido` dentro de `.rl`.
 *
 * Solo claro, como el lienzo. Cada regla lleva `body.eph-recorrido` tres veces,
 * como las del checkout, la ficha y la home. */

body.eph-recorrido.eph-recorrido.eph-recorrido.eph-linea-alt{background:#F8FAFC!important;padding-bottom:76px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-linea-alt .entry-content{padding-top:0;padding-bottom:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-linea-alt .whatsapp-float{display:none!important}

body.eph-recorrido.eph-recorrido.eph-recorrido .rl{
  --rl-fondo:#F8FAFC;
  --rl-gris:#F1F5F9;
  --rl-blanco:#FFFFFF;
  --rl-borde:#E2E8F0;
  --rl-campo:#CBD5E1;
  --rl-tinta:#0F172A;
  --rl-cuerpo:#334155;
  --rl-texto:#475569;
  --rl-suave:#64748B;
  --rl-azul:#0064FF;
  --rl-azul-texto:#0052D4;
  --rl-azul-claro:#DBEAFE;
  --rl-verde:#0B7038;
  --rl-verde-tinta:#05602C;
  --rl-verde-fondo:#DCFCE7;
  --color-text:var(--rl-tinta);--color-text-secondary:var(--rl-texto);--color-text-tertiary:var(--rl-suave);
  --color-text-link:var(--rl-azul-texto);--color-text-link-hover:var(--rl-azul-texto);
  font-family:Inter,system-ui,sans-serif;color:var(--rl-tinta);line-height:1.4;background:var(--rl-fondo)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl *,
body.eph-recorrido.eph-recorrido.eph-recorrido .rl *::before,
body.eph-recorrido.eph-recorrido.eph-recorrido .rl *::after{box-sizing:border-box}
/* :where() no suma peso: el margen y el color de cada clase le ganan. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl :where(h1,h2,p){margin:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl :is(h1,h2){color:var(--rl-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl a{color:var(--rl-azul-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl :is(a,button):focus-visible{outline:3px solid color-mix(in srgb,var(--rl-azul) 45%,transparent);outline-offset:2px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-wrap{max-width:1148px;margin:0 auto;padding:0 16px}

/* Lo que va solo en pantalla chica o grande. Con !important: los links y
   botones traen su propio display y le ganaban. */
@media (max-width:759px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-solo-grande{display:none!important}
}
@media (min-width:760px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-solo-chica{display:none!important}
}

/* ── Botones ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 22px;
  border:0;border-radius:999px;font-family:inherit;font-size:1rem;font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-btn-azul{background:var(--rl-azul);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-btn-azul:hover{background:var(--rl-azul-texto);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-btn-verde{background:var(--rl-verde);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-btn-verde:hover{background:var(--rl-verde-tinta);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-btn-borde{background:var(--rl-blanco);color:var(--rl-tinta);border:1px solid var(--rl-campo)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-btn-borde:hover{border-color:var(--rl-tinta);color:var(--rl-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-btn-gris{background:var(--rl-gris);color:var(--rl-tinta)}

/* ── Arriba ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cabeza{background:var(--rl-blanco);border-bottom:1px solid var(--rl-borde);padding:20px 0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-titulo{display:flex;flex-direction:column;gap:16px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-titulo > div{display:flex;flex-direction:column;gap:6px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-kicker{font-size:.875rem;font-weight:600;color:var(--rl-azul-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cabeza h1{font-size:clamp(1.75rem,3.6vw,2.5rem);font-weight:700;line-height:1.12;letter-spacing:-.02em}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-baja{font-size:.875rem;color:var(--rl-texto);line-height:1.45}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-duda .rl-btn,
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-duda-chica{border:1.5px solid var(--rl-azul);color:var(--rl-azul-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-duda-chica{display:flex;width:100%;margin-top:14px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chips{display:flex;gap:8px;margin:16px -16px 0;padding:0 16px 4px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chips::-webkit-scrollbar{display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chips a{flex:0 0 auto;min-width:150px;scroll-snap-align:start;display:flex;flex-direction:column;gap:2px;padding:10px 12px;
  background:var(--rl-blanco);border:1px solid var(--rl-borde);border-radius:12px;color:var(--rl-tinta)!important;text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chips a:hover{border-color:var(--rl-azul)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chip-cabeza{display:flex;justify-content:space-between;align-items:center;font-size:.75rem;font-weight:600;color:var(--rl-azul-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chip-cabeza .rl-barras{display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chips a > b{font-size:.875rem;font-weight:700;line-height:1.3}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chip-desde{font-size:.75rem;color:var(--rl-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chip-desde b{font-weight:600;color:var(--rl-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-barras{display:flex;align-items:flex-end;gap:3px;height:20px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-barras span{width:6px;border-radius:999px;background:var(--rl-borde)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-barras .rl-barra-si{background:var(--rl-azul)}

/* ── Los niveles ── */
/* Al llegar por el ancla (#rl-nivel-2, desde la home o la ficha) el título no
   queda abajo del encabezado fijo: mide 57px en el celular y 117px en la
   computadora. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel{padding:28px 0 8px;scroll-margin-top:72px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-grilla{display:flex;flex-direction:column;gap:14px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-info{display:flex;flex-direction:column;gap:12px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-cabeza{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-n{font-size:.75rem;font-weight:600;color:var(--rl-azul-texto);margin-bottom:4px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel h2{font-size:clamp(1.5rem,3vw,2rem);font-weight:700;letter-spacing:-.01em;line-height:1.15}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-desde{display:flex;flex-direction:column;align-items:flex-end;flex:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-desde small{font-size:.75rem;color:var(--rl-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-desde b{font-size:1.25rem;font-weight:700;color:var(--rl-tinta);font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-texto{font-size:.875rem;color:var(--rl-texto);line-height:1.5}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-juega{display:flex;flex-direction:column;gap:2px;padding:12px 14px;background:var(--rl-blanco);border:1px solid var(--rl-borde);border-radius:12px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-juega b{font-size:.75rem;font-weight:600;color:var(--rl-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-juega span{font-size:.875rem;color:var(--rl-tinta);line-height:1.45}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-pcs{display:flex;flex-direction:column;gap:12px;min-width:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pcs.rl-plegado .rl-pc-celda:nth-child(n+3){display:none}
/* La celda lleva la tarjeta y, con JavaScript, el botón "Vista previa" sobre
   la foto (recorrido-vista.css). */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-celda{position:relative;display:flex;min-width:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-celda > .rl-pc{flex:1;min-width:0}

/* Una PC */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc{display:flex;flex-direction:column;overflow:hidden;background:var(--rl-blanco);border:1px solid var(--rl-borde);border-radius:16px;
  color:var(--rl-tinta)!important;text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc:hover{border-color:var(--rl-campo);box-shadow:0 8px 24px rgba(15,23,42,.06)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-foto{position:relative;height:130px;border-bottom:1px solid var(--rl-borde);display:flex;align-items:center;justify-content:center}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-foto img{width:86%;height:88%;object-fit:contain;margin:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-sello{position:absolute;left:8px;top:8px;z-index:1;padding:3px 8px;border-radius:999px;background:var(--rl-azul-claro);color:var(--rl-azul-texto);
  font-size:.75rem;font-weight:600}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-etiqueta{background:#EEF4FF;color:#0052D4;box-shadow:0 1px 2px rgba(15,23,42,.08)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rl-etiqueta{background:var(--rl-azul-claro)}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rl-etiqueta{background:var(--rl-azul-claro)}}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-cuerpo{flex:1;display:flex;flex-direction:column;gap:6px;padding:12px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-nombre{font-size:.875rem;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-specs{font-size:.75rem;color:var(--rl-texto);line-height:1.4}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-fps{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;background:var(--rl-gris);font-size:.75rem;color:var(--rl-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-fps svg{flex:none;color:var(--rl-azul)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-fps b{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-placa{padding:6px 10px;border-radius:8px;background:var(--rl-gris);font-size:.75rem;color:var(--rl-texto);line-height:1.35}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-precio{margin-top:auto;padding-top:6px;font-size:1.125rem;font-weight:700;font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-cuota{font-size:.75rem;color:var(--rl-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-pie{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:4px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-envio{padding:3px 8px;border-radius:999px;background:var(--rl-verde-fondo);color:var(--rl-verde-tinta);font-size:.75rem;font-weight:600}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-ver{display:inline-flex;align-items:center;gap:4px;font-size:.875rem;font-weight:600;color:var(--rl-azul-texto)}

body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-mas{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:50px;margin:0;padding:0 16px;
  border:1px solid var(--rl-campo);border-radius:999px;background:var(--rl-blanco);color:var(--rl-tinta);font-family:inherit;font-size:1rem;cursor:pointer}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-mas[hidden]{display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-mas svg{color:var(--rl-azul)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-mas b{font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-mas span{color:var(--rl-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-ver{align-self:center;display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:1rem;font-weight:600;text-decoration:none}

/* ── Abajo ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre{margin-top:32px;padding:20px;background:var(--rl-tinta);border-radius:16px;display:flex;flex-direction:column;gap:16px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre > div:first-child{display:flex;flex-direction:column;gap:8px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre h2{font-size:1.25rem;font-weight:700;color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre p{font-size:.875rem;color:#CBD5E1;line-height:1.5}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre-botones{display:flex;flex-direction:column;gap:10px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nota{margin:20px 0 32px;font-size:.875rem;color:var(--rl-texto);line-height:1.5}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nota b{font-weight:600;color:var(--rl-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-barra{position:fixed;left:0;right:0;bottom:0;z-index:90;display:flex;gap:8px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--rl-blanco);border-top:1px solid var(--rl-borde);box-shadow:0 -6px 18px rgba(15,23,42,.08)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-barra .rl-btn{flex:1}

/* ── Tablet ── */
@media (min-width:760px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-wrap{padding:0 24px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cabeza{padding:40px 0 28px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-titulo{flex-direction:row;justify-content:space-between;align-items:flex-end;gap:32px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-baja{font-size:1rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-duda{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:8px;font-size:.875rem;color:var(--rl-texto)}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chips{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:16px;margin:28px 0 0;padding:0;overflow:visible}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chips a{min-width:0;padding:16px 18px;border-radius:16px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chip-cabeza .rl-barras{display:flex}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chips a > b{font-size:1.125rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-chip-desde{font-size:.875rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pcs{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  /* Tres por fila: la tercera se ve aunque el celular la haya plegado, y la cuarta no. */
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pcs.rl-plegado .rl-pc-celda:nth-child(3){display:flex}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pcs .rl-pc-celda:nth-child(n+4){display:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl .rl-mas{display:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre{flex-direction:row;align-items:center;justify-content:space-between;gap:32px;padding:28px 36px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre h2{font-size:1.5rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre p{font-size:1rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre-botones{flex-direction:row;flex:none}
}

/* ── Computadora ── */
@media (min-width:1024px){
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-linea-alt{padding-bottom:0}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-barra{display:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cabeza{padding:48px 0 32px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel{padding:48px 0 0;scroll-margin-top:92px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-grilla{display:grid;grid-template-columns:300px minmax(0,1fr);gap:32px;align-items:start}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-info{gap:14px;padding-top:4px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-texto{font-size:1rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-desde-grande{align-items:flex-start;margin-top:6px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-desde-grande small{font-size:.875rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-desde-grande b{font-size:1.75rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nivel-info .rl-btn{align-self:flex-start}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pcs{gap:18px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-foto{height:180px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-cuerpo{padding:14px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-nombre{font-size:1rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-fps{font-size:.875rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-precio{font-size:1.25rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre{margin-top:56px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-nota{margin:24px 0 56px}
}

/* Las 3 cuotas sin interés con Visa o Mastercard (Payway, lienzo "Gamer" 30/9) */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-tres{font-size:.75rem;font-weight:700;line-height:1.3;color:#05602C}

/* ── Modo oscuro (generado por herramientas/gen_recorrido_oscuro.py: no editar a mano) ── */
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-linea-alt{background:#0B1222!important}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rl{--rl-fondo:#0B1222;--rl-gris:#1B2440;--rl-blanco:#151D35;--rl-borde:#253149;--rl-campo:#3A4A66;--rl-tinta:#E9EEF6;--rl-cuerpo:#C9D3E1;--rl-texto:#A2B0C6;--rl-suave:#8B9AB3;--rl-azul:#3B82F6;--rl-azul-texto:#7FB0FF;--rl-azul-claro:#17305C;--rl-verde:#15954A;--rl-verde-tinta:#5FD98D;--rl-verde-fondo:#0F2E1E}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rl-etiqueta{color:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre{background:#22304F}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-tres{color:#5FD98D}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-linea-alt{background:#0B1222!important}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rl{--rl-fondo:#0B1222;--rl-gris:#1B2440;--rl-blanco:#151D35;--rl-borde:#253149;--rl-campo:#3A4A66;--rl-tinta:#E9EEF6;--rl-cuerpo:#C9D3E1;--rl-texto:#A2B0C6;--rl-suave:#8B9AB3;--rl-azul:#3B82F6;--rl-azul-texto:#7FB0FF;--rl-azul-claro:#17305C;--rl-verde:#15954A;--rl-verde-tinta:#5FD98D;--rl-verde-fondo:#0F2E1E}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rl-etiqueta{color:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rl-cierre{background:#22304F}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-tres{color:#5FD98D}}

/* recorrido-vista.css */
/* ElectroPC · "Vista previa" de una PC (lienzo del 29/9 a la tarde: tableros
 * GamerVista y GamerVistaEscritorio).
 *
 * El botón que va sobre la foto de cada tarjeta de PC (en la página de cada
 * línea y en el catálogo de PC) y el panel que abre: a la derecha, de 400px,
 * en la computadora; una hoja que sube desde abajo, al 88% del alto, en el
 * celular. El marcado lo arma `recorrido-vista.js`; los datos, `EPH_VistaPc`.
 * Sin JavaScript no hay botón ni panel.
 *
 * Cada regla lleva `body.eph-recorrido` tres veces, como las demás hojas del
 * diseño nuevo. */

body.eph-recorrido.eph-recorrido.eph-recorrido .vp,
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton{
  --vp-fondo:#F8FAFC;
  --vp-gris:#F1F5F9;
  --vp-blanco:#FFFFFF;
  --vp-borde:#E2E8F0;
  --vp-campo:#CBD5E1;
  --vp-tinta:#0F172A;
  --vp-cuerpo:#334155;
  --vp-texto:#475569;
  --vp-suave:#64748B;
  --vp-azul:#0064FF;
  --vp-azul-texto:#0052D4;
  --vp-azul-claro:#DBEAFE;
  --vp-verde:#0B7038;
  --vp-suave-curva:cubic-bezier(.16,1,.3,1);
  font-family:Inter,system-ui,sans-serif}

/* ── La celda de la tarjeta del catálogo (la de la línea está en recorrido-linea.css) ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-celda{position:relative;display:flex;min-width:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-celda > .rp-pc{flex:1;min-width:0}

/* ── El botón sobre la foto ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:5px;height:32px;margin:0;padding:0 10px;
  border:1px solid var(--vp-campo);border-radius:999px;background:rgba(255,255,255,.94);color:var(--vp-tinta);
  font-family:inherit;font-size:.75rem;font-weight:600;line-height:1;letter-spacing:0;text-transform:none;white-space:nowrap;cursor:pointer;box-shadow:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton:hover{border-color:var(--vp-tinta);background:var(--vp-blanco);color:var(--vp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton:focus-visible{outline:3px solid color-mix(in srgb,var(--vp-azul) 45%,transparent);outline-offset:2px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton svg{flex:none}
/* Abajo a la derecha de la foto, a 8px del borde. El alto de la foto es el de
   su hoja: 130/180px en la línea (recorrido-linea.css), 200/190px en el
   catálogo (recorrido-categoria.css). El botón mide 32px, y 34px desde 760px. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-celda > .vp-boton{right:8px;top:90px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-celda > .vp-boton{right:8px;top:160px}

/* En el celular las tarjetas van de a 2: el botón es solo el ojo, un círculo
   de 32px (el nombre lo dice su aria-label). La foto del catálogo mide 118px. */
@media (max-width:599px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton{justify-content:center;width:32px;padding:0}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton > span{display:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-celda > .vp-boton{top:78px}
}

/* ── El velo y el panel ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .vp{position:fixed;inset:0;z-index:99990;color:var(--vp-tinta);line-height:1.4}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp[hidden]{display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp *,
body.eph-recorrido.eph-recorrido.eph-recorrido .vp *::before,
body.eph-recorrido.eph-recorrido.eph-recorrido .vp *::after{box-sizing:border-box}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp :where(h2,h3,p,dl,dd,ul){margin:0;padding:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp :where(a,button):focus-visible{outline:3px solid color-mix(in srgb,var(--vp-azul) 45%,transparent);outline-offset:2px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-velo{position:absolute;inset:0;background:rgba(2,6,23,.4);animation:vp-velo .3s ease both}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-panel{position:absolute;left:0;right:0;bottom:0;height:88vh;height:88dvh;display:flex;flex-direction:column;
  background:var(--vp-blanco);border-top-left-radius:16px;border-top-right-radius:16px;box-shadow:0 -12px 32px rgba(15,23,42,.16);outline:0;
  animation:vp-hoja .42s var(--vp-suave-curva) both}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-manija{position:absolute;left:50%;top:7px;width:38px;height:4px;margin-left:-19px;border-radius:999px;background:var(--vp-campo)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp.vp-sale .vp-velo{animation:vp-velo-sale .22s ease-in both}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp.vp-sale .vp-panel{animation:vp-hoja-sale .22s ease-in both}

/* Arriba: "4 de 12", las flechas y la cruz. */
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-cabeza{flex:none;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 12px 10px 16px;border-bottom:1px solid var(--vp-borde)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-pos{font-size:.875rem;color:var(--vp-texto);font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-flechas{display:flex;gap:6px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-flechas button{display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin:0;padding:0;
  border:1px solid var(--vp-campo);border-radius:50%;background:var(--vp-blanco);color:var(--vp-tinta);font:inherit;line-height:1;cursor:pointer;box-shadow:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-flechas button:hover{border-color:var(--vp-tinta);background:var(--vp-blanco);color:var(--vp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-flechas button:disabled{opacity:.35;cursor:default;pointer-events:none}

/* El medio, que se desplaza. Al cambiar de PC hace un fundido corto. */
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-cuerpo{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-contenido{display:flex;flex-direction:column;gap:14px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-contenido.vp-fundido{animation:vp-fundido .28s var(--vp-suave-curva) both}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-foto{position:relative;flex:none;height:190px;display:flex;align-items:center;justify-content:center;
  background:#FFFFFF;border:1px solid var(--vp-borde);border-radius:12px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-foto img{width:86%;height:88%;margin:0;object-fit:contain}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-sello{position:absolute;left:10px;top:10px;padding:4px 10px;border-radius:999px;background:var(--vp-azul-claro);color:var(--vp-azul-texto);
  font-size:.75rem;font-weight:600}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-titulo{display:flex;flex-direction:column;gap:5px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-titulo h2{font-size:1.125rem;font-weight:700;line-height:1.25;letter-spacing:-.01em;color:var(--vp-tinta);outline:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-uso{font-size:.875rem;color:var(--vp-texto);line-height:1.45}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-trae,
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-fps{display:flex;flex-direction:column}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-contenido h3{margin-bottom:4px;font-size:.875rem;font-weight:600;line-height:1.3;color:var(--vp-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-trae dl > div{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--vp-gris);font-size:.875rem}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-trae dt{flex:none;color:var(--vp-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-trae dd{min-width:0;font-weight:600;text-align:right;overflow-wrap:anywhere}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-fps h3{margin-bottom:6px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-fps ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;list-style:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-fps li{margin:0;padding:8px 6px;border-radius:12px;background:var(--vp-gris);text-align:center;font-size:.75rem;color:var(--vp-texto);line-height:1.3}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-fps li b{display:block;font-size:1.125rem;font-weight:700;color:var(--vp-tinta);font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-plata{display:flex;flex-direction:column;gap:3px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-precio{font-size:1.75rem;font-weight:700;letter-spacing:-.01em;line-height:1.2;font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-tres{font-size:1rem;font-weight:700;line-height:1.3;color:var(--vp-verde)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-cuota{font-size:1rem;color:var(--vp-verde)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-cuota b{font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-recargo{font-size:.75rem;color:var(--vp-suave)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-forma{font-size:.875rem;color:var(--vp-texto)}
/* "Ver todas las cuotas": los planes de la ficha, la de 18 en verde claro. */
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes{margin-top:4px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-ver{padding:0;border:0;background:none;font:inherit;font-size:.875rem;font-weight:600;color:var(--vp-azul-texto);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-lista{margin-top:8px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-lista ul{list-style:none;margin:0 0 6px;padding:0;border:1px solid var(--vp-borde);border-radius:12px;overflow:hidden}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-lista li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0;padding:8px 12px;font-size:.875rem;font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-lista li + li{border-top:1px solid var(--vp-borde)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-lista li small{font-size:.75rem;color:var(--vp-suave)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-lista li.vp-plan-largo{background:#EAF8F0;color:var(--vp-verde);font-weight:600}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-envio{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--vp-fondo);border:1px solid var(--vp-borde);border-radius:12px;
  font-size:.875rem;color:var(--vp-cuerpo);line-height:1.35}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-envio svg{flex:none;color:var(--vp-azul)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-aviso{font-size:.875rem;color:var(--vp-texto);line-height:1.45}
/* Mientras llegan los datos: la foto y el nombre de la tarjeta, y el resto en gris. */
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-hueso{height:14px;border-radius:8px;background:var(--vp-gris)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-huesos{display:flex;flex-direction:column;gap:10px}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-huesos .vp-hueso:nth-child(2n){width:70%}

/* Abajo, fijos: agregar, la ficha y WhatsApp. */
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-pie{flex:none;display:flex;flex-direction:column;gap:8px;padding:12px 16px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--vp-borde)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-pie form{margin:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-pie form[hidden]{display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-azul,
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-borde{display:flex;align-items:center;justify-content:center;width:100%;margin:0;padding:0 16px;border-radius:999px;
  font-family:inherit;font-size:1rem;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;box-shadow:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-azul{height:48px;border:0;background:var(--vp-azul);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-azul:hover{background:var(--vp-azul-texto);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-azul[aria-busy="true"]{opacity:.7;cursor:progress}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-borde{height:46px;border:1.5px solid var(--vp-azul);background:var(--vp-blanco);color:var(--vp-azul-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-borde:hover{background:var(--vp-fondo);color:var(--vp-azul-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-wa{display:flex;align-items:center;justify-content:center;gap:7px;height:36px;color:var(--vp-verde);font-size:.875rem;font-weight:600;text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-wa:hover{color:var(--vp-verde);text-decoration:underline}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp .vp-wa[hidden]{display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-error{font-size:.875rem;color:#B91C1C;text-align:center;line-height:1.4}
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-error[hidden]{display:none}

/* Solo para lectores de pantalla. */
body.eph-recorrido.eph-recorrido.eph-recorrido .vp-oculto{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ── Tablet y computadora: el panel a la derecha, de 400px ── */
@media (min-width:760px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton{height:34px;padding:0 12px;font-size:.875rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-celda > .vp-boton{top:88px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-celda > .vp-boton{top:158px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-panel{left:auto;top:0;width:400px;max-width:100%;height:100%;border-left:1px solid var(--vp-borde);border-top-left-radius:0;border-top-right-radius:0;
    box-shadow:-12px 0 32px rgba(15,23,42,.12);animation-name:vp-lado}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp.vp-sale .vp-panel{animation-name:vp-lado-sale}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-manija{display:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-cabeza{padding:12px 12px 12px 18px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-cuerpo{padding:16px 18px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-foto{height:220px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-titulo h2{font-size:1.25rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-pie{padding:12px 18px 14px}
}

@media (min-width:1024px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rl-pc-celda > .vp-boton{top:138px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-celda > .vp-boton{top:148px}
}

@keyframes vp-velo{from{opacity:0}to{opacity:1}}
@keyframes vp-velo-sale{from{opacity:1}to{opacity:0}}
@keyframes vp-hoja{from{transform:translateY(104%)}to{transform:none}}
@keyframes vp-hoja-sale{from{transform:none}to{transform:translateY(104%)}}
@keyframes vp-lado{from{transform:translateX(104%)}to{transform:none}}
@keyframes vp-lado-sale{from{transform:none}to{transform:translateX(104%)}}
@keyframes vp-fundido{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}

/* Con "reducir movimiento" nada se mueve: aparece y se va. */
@media (prefers-reduced-motion:reduce){
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-velo,
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-panel,
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp-contenido.vp-fundido,
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp.vp-sale .vp-velo,
  body.eph-recorrido.eph-recorrido.eph-recorrido .vp.vp-sale .vp-panel{animation:none}
}

/* ── Modo oscuro (generado por herramientas/gen_recorrido_oscuro.py: no editar a mano) ── */
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .vp,
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton{--vp-fondo:#0B1222;--vp-gris:#1B2440;--vp-blanco:#151D35;--vp-borde:#253149;--vp-campo:#3A4A66;--vp-tinta:#E9EEF6;--vp-cuerpo:#C9D3E1;--vp-texto:#A2B0C6;--vp-suave:#8B9AB3;--vp-azul:#3B82F6;--vp-azul-texto:#7FB0FF;--vp-azul-claro:#17305C;--vp-verde:#15954A}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton{background:rgba(21,29,53,.94)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-lista li.vp-plan-largo{background:#0F2E1E}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .vp-error{color:#F87171}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .vp,
html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton{--vp-fondo:#0B1222;--vp-gris:#1B2440;--vp-blanco:#151D35;--vp-borde:#253149;--vp-campo:#3A4A66;--vp-tinta:#E9EEF6;--vp-cuerpo:#C9D3E1;--vp-texto:#A2B0C6;--vp-suave:#8B9AB3;--vp-azul:#3B82F6;--vp-azul-texto:#7FB0FF;--vp-azul-claro:#17305C;--vp-verde:#15954A}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .vp-boton{background:rgba(21,29,53,.94)}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .vp-planes-lista li.vp-plan-largo{background:#0F2E1E}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .vp-error{color:#F87171}}

/* recorrido-categoria.css */
/* ElectroPC · La categoría y el catálogo del lienzo "Recorrido simple" (26/9).
 *
 * Carga solo con el diseño nuevo prendido (`EPH_Vista::recorrido`), en las
 * páginas de categoría y en /catalogo-alt/, en lugar de home.css, catalogo.css
 * y piezas.css. El marcado lo arman `EPH_CategoriaRecorrido` (componentes) y
 * `EPH_CatalogoRecorrido` (PC, `.rp-de-pc`) dentro de `.rp`.
 *
 * En el celular la cabeza va arriba con los filtros; desde 1024px la cabeza
 * se deshace (`display: contents`) y sus piezas se acomodan en dos columnas:
 * los filtros al costado y la lista al lado.
 *
 * Solo claro, como el lienzo. Cada regla lleva `body.eph-recorrido` tres veces,
 * como las de la home, la línea y la ficha. */

body.eph-recorrido.eph-recorrido.eph-recorrido.eph-rp{background:#F8FAFC!important}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-rp .entry-content{padding-top:0;padding-bottom:0}

body.eph-recorrido.eph-recorrido.eph-recorrido .rp{
  --rp-fondo:#F8FAFC;
  --rp-gris:#F1F5F9;
  --rp-blanco:#FFFFFF;
  --rp-borde:#E2E8F0;
  --rp-campo:#CBD5E1;
  --rp-tinta:#0F172A;
  --rp-cuerpo:#334155;
  --rp-texto:#475569;
  --rp-suave:#64748B;
  --rp-apagado:#94A3B8;
  --rp-azul:#0064FF;
  --rp-azul-texto:#0052D4;
  --rp-azul-claro:#DBEAFE;
  --rp-azul-fondo:#EFF6FF;
  --rp-azul-tinta:#1E3A8A;
  --rp-verde:#0B7038;
  --rp-verde-tinta:#05602C;
  --rp-verde-fondo:#EAF8F0;
  --color-text:var(--rp-tinta);--color-text-secondary:var(--rp-texto);--color-text-tertiary:var(--rp-suave);
  --color-text-link:var(--rp-azul-texto);--color-text-link-hover:var(--rp-azul-texto);
  max-width:1148px;margin:0 auto;padding:0 0 56px;
  font-family:Inter,system-ui,sans-serif;color:var(--rp-tinta);line-height:1.4}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp *,
body.eph-recorrido.eph-recorrido.eph-recorrido .rp *::before,
body.eph-recorrido.eph-recorrido.eph-recorrido .rp *::after{box-sizing:border-box}
/* :where() no suma peso: el margen y el color de cada clase le ganan. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp :where(h1,p,fieldset,legend,form){margin:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp h1{color:var(--rp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp a{color:var(--rp-azul-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp :is(a,button,input,select):focus-visible{outline:3px solid color-mix(in srgb,var(--rp-azul) 45%,transparent);outline-offset:2px}
@media (max-width:759px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-solo-grande{display:none!important}
}

/* ── La cabeza: dónde estás, cuántos hay y los filtros ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-cabeza{display:flex;flex-direction:column;gap:12px;padding:14px 16px 16px;
  background:var(--rp-blanco);border-bottom:1px solid var(--rp-borde)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-migas{display:flex;flex-wrap:wrap;gap:6px;font-size:.875rem;color:var(--rp-suave)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-migas a{text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-migas a:hover{text-decoration:underline}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-titulo{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-titulo h1{font-size:clamp(1.75rem,3.6vw,2.5rem);font-weight:700;line-height:1.12;letter-spacing:-.02em}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-cuenta{font-size:.875rem;color:var(--rp-texto);white-space:nowrap}

body.eph-recorrido.eph-recorrido.eph-recorrido .rp-lado{display:flex;flex-direction:column;gap:12px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-grupo{display:flex;flex-direction:column;gap:8px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-grupo-t{font-size:.875rem;font-weight:600;color:var(--rp-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-chips{display:flex;flex-wrap:wrap;gap:8px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-chip{padding:8px 13px;border-radius:999px;border:1px solid var(--rp-campo);background:var(--rp-blanco);
  color:var(--rp-tinta);font-size:.875rem;font-weight:600;line-height:1.2;white-space:nowrap;text-decoration:none;transition:border-color .15s,background-color .15s}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-chip:hover{border-color:var(--rp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-chip[aria-current]{background:var(--rp-tinta);border-color:var(--rp-tinta);color:#FFFFFF}

/* El botón que abre marca y precio, y el orden */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-botones{display:flex;gap:8px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-abrir{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;height:40px;margin:0;padding:0 14px;
  border:1px solid var(--rp-campo);border-radius:999px;background:var(--rp-blanco);color:var(--rp-tinta);font:inherit;font-size:.875rem;font-weight:600;white-space:nowrap;cursor:pointer}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-abrir:hover,
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-abrir[aria-expanded="true"]{border-color:var(--rp-tinta);background:var(--rp-blanco);color:var(--rp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-puestos{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;
  border-radius:999px;background:var(--rp-azul);color:#FFFFFF;font-size:.75rem;font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-orden{display:flex;align-items:center;gap:6px;height:40px;margin:0;padding:0 14px;border:1px solid var(--rp-campo);
  border-radius:999px;background:var(--rp-blanco);font-size:.875rem;white-space:nowrap;cursor:pointer}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-orden > span{color:var(--rp-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-orden select{appearance:none;-webkit-appearance:none;height:100%;min-height:0;width:auto;margin:0;padding:0 18px 0 0;border:0;border-radius:0;box-shadow:none;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right center;
  color:var(--rp-tinta);font:inherit;font-size:.875rem;font-weight:600;cursor:pointer}

/* El panel de marca y precio. Sin JavaScript queda abierto. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-panel{display:flex;flex-direction:column;gap:16px;padding:14px;border:1px solid var(--rp-borde);border-radius:16px;background:var(--rp-blanco)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-panel[hidden]{display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp :is(.rp-marcas,.rp-precio){min-width:0;padding:0;border:0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp :is(.rp-marcas,.rp-precio) legend{float:left;width:100%;margin:0 0 8px;padding:0;font-size:.875rem;font-weight:700;color:var(--rp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-marcas-lista{clear:both;display:flex;flex-direction:column;max-height:264px;overflow-y:auto}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-marcas-lista label{display:flex;align-items:center;gap:10px;margin:0;padding:5px 0;font-size:.875rem;font-weight:400;color:var(--rp-tinta);cursor:pointer}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-marcas-lista input{flex:none;width:18px;height:18px;margin:0;accent-color:var(--rp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-marcas-lista small{margin-left:auto;padding-right:4px;font-size:.75rem;color:var(--rp-suave)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-precio > div{clear:both;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-precio input{width:100%;height:40px;margin:0;padding:0 12px;border:1px solid var(--rp-campo);border-radius:12px;
  background:var(--rp-blanco);color:var(--rp-tinta);font:inherit;font-size:1rem;box-shadow:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-precio input::placeholder{color:var(--rp-suave);opacity:1}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-aplicar{height:44px;margin:0;border:0;border-radius:999px;background:var(--rp-azul);color:#FFFFFF;
  font:inherit;font-size:1rem;font-weight:600;cursor:pointer}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-aplicar:hover{background:var(--rp-azul-texto);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-limpiar{align-self:flex-start;font-size:.875rem;font-weight:600;text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-limpiar:hover{text-decoration:underline}

/* ── La ayuda de cada tipo ("¿SATA o M.2?") ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-ayuda{display:flex;flex-direction:column;gap:10px;margin:14px 16px 0;padding:14px;
  border:1px solid var(--rp-azul-claro);border-radius:16px;background:var(--rp-azul-fondo)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-ayuda-uno{display:flex;flex-direction:column;gap:3px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-ayuda-uno b{font-size:1rem;font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-ayuda :is(.rp-ayuda-uno span,.rp-ayuda-dos){font-size:.875rem;line-height:1.45;color:var(--rp-cuerpo)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-ayuda-wa{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;font-size:.875rem;font-weight:600;
  color:var(--rp-verde);text-decoration:none;white-space:nowrap}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-ayuda-wa:hover{color:var(--rp-verde-tinta);text-decoration:underline}

/* ── La lista ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-lista{padding:14px 16px 0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-grilla{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:10px}
/* Filtrar sin recargar (recorrido-categoria.js): mientras llega la lista nueva
   se aclara un poco, y solo si tarda. Las tarjetas que no van quedan un momento
   encima, donde estaban, mientras se desvanecen. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp[aria-busy="true"] .rp-grilla{opacity:.6;transition:opacity .2s ease .15s}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-grilla > *{position:relative;z-index:1}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-grilla > .rp-sale{position:absolute;z-index:0;margin:0;pointer-events:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-aviso{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp[aria-busy="true"] .rp-grilla{transition:none}
}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--rp-borde);border-radius:16px;background:var(--rp-blanco);
  transition:border-color .15s,box-shadow .15s}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-card:hover{border-color:var(--rp-campo);box-shadow:0 8px 24px rgba(15,23,42,.06)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-foto{display:flex;align-items:center;justify-content:center;height:130px;border-bottom:1px solid var(--rp-borde);background:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-foto img{width:84%;height:86%;margin:0;object-fit:contain}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-cuerpo{flex:1;display:flex;flex-direction:column;gap:6px;padding:10px 11px 12px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-nombre{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em;
  font-size:.875rem;font-weight:600;line-height:1.3;color:var(--rp-tinta);text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-nombre:hover{color:var(--rp-azul-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-datos{display:flex;flex-wrap:wrap;gap:5px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-datos span{padding:3px 8px;border-radius:999px;background:var(--rp-gris);color:var(--rp-cuerpo);font-size:.75rem;font-weight:600}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-empuje{flex:1}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-monto{font-size:1.125rem;font-weight:700;font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-cuota{font-size:.75rem;color:var(--rp-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-agregar{margin:4px 0 0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-agregar button,
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-ver-pieza{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:38px;margin:0;padding:0 10px;
  border:1.5px solid var(--rp-azul);border-radius:999px;background:var(--rp-blanco);color:var(--rp-azul-texto);font:inherit;font-size:.875rem;font-weight:600;
  text-decoration:none;cursor:pointer;transition:background-color .15s,color .15s}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-agregar button:hover,
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-ver-pieza:hover{background:var(--rp-azul);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-agregar button[aria-busy="true"]{opacity:.7;cursor:progress}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-agregar.rp-agregado button{border-color:var(--rp-verde);background:var(--rp-verde);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-error{font-size:.75rem;color:#B91C1C;line-height:1.35}

body.eph-recorrido.eph-recorrido.eph-recorrido .rp-vacio{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:28px;
  border:1px solid var(--rp-borde);border-radius:16px;background:var(--rp-blanco);text-align:center}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-vacio b{font-size:1rem;font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-vacio a{font-size:.875rem;font-weight:600;text-decoration:none}

body.eph-recorrido.eph-recorrido.eph-recorrido .rp-mas{display:flex;flex-direction:column;align-items:center;gap:8px;padding-top:22px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-mas > span{font-size:.875rem;color:var(--rp-suave)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-mas-boton{display:inline-flex;align-items:center;height:48px;padding:0 28px;border:1px solid var(--rp-campo);border-radius:999px;
  background:var(--rp-blanco);color:var(--rp-tinta);font-size:1rem;font-weight:600;text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-mas-boton:hover{border-color:var(--rp-tinta);color:var(--rp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-mas-boton[aria-busy="true"]{opacity:.6;pointer-events:none}

/* ── El catálogo de PC (`.rp-de-pc`): la cabeza va sobre el gris, sin migas ── */
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-cabeza{gap:14px;padding:20px 16px 0;border:0;background:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-titulo{flex-direction:column;align-items:flex-start;gap:4px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-cuenta{white-space:normal}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-elegir{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:12px;background:var(--rp-azul-claro)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-elegir > b{font-size:1rem;font-weight:700;color:var(--rp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-elegir > p{font-size:.875rem;line-height:1.45;color:var(--rp-azul-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-elegir-botones{display:flex;gap:8px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-elegir-botones a{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 12px;
  border-radius:8px;font-size:.875rem;font-weight:700;text-decoration:none;white-space:nowrap}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-elegir-azul{background:var(--rp-azul);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-elegir-azul:hover{background:var(--rp-azul-texto);color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-elegir-wa{background:var(--rp-blanco);color:var(--rp-verde-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-elegir-wa:hover{background:var(--rp-verde-fondo);color:var(--rp-verde-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc :is(.rp-abrir,.rp-orden){flex:1;height:44px;border-radius:8px;justify-content:center}
/* El lienzo dice solo "Menor precio": el botón de al lado ya dice que son filtros. */
@media (max-width:1023px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-orden > span{display:none}
}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-lista{padding-top:16px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-grilla{grid-template-columns:minmax(0,1fr);gap:14px}

body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-pc{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--rp-borde);border-radius:12px;background:var(--rp-blanco);
  color:var(--rp-tinta);text-decoration:none;transition:border-color .15s,box-shadow .15s}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-pc:hover{border-color:var(--rp-campo);box-shadow:0 8px 24px rgba(15,23,42,.06);color:var(--rp-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-foto{position:relative;display:flex;align-items:center;justify-content:center;height:200px;background:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-foto img{width:80%;height:88%;margin:0;object-fit:contain}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-sello{position:absolute;left:10px;top:10px;z-index:1;padding:4px 9px;border-radius:999px;background:var(--rp-azul-claro);
  color:var(--rp-azul-texto);font-size:.75rem;font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-cuerpo{flex:1;display:flex;flex-direction:column;gap:8px;padding:14px}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-nombre{font-size:1rem;font-weight:700;line-height:1.25}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-specs{font-size:.875rem;color:var(--rp-texto);line-height:1.4}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-precio{margin-top:auto;font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-cuota{font-size:.875rem;color:var(--rp-texto)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-tres{font-size:.875rem;font-weight:700;line-height:1.3;color:#05602C}
body.eph-recorrido.eph-recorrido.eph-recorrido .rp-envio{align-self:flex-start;padding:4px 9px;border-radius:999px;background:var(--rp-verde-fondo);color:var(--rp-verde-tinta);
  font-size:.75rem;font-weight:700}

/* ── Celular: las PC de a 2, como los componentes (lienzo, tablero Catalogo; Martín, 2/10) ── */
@media (max-width:599px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-grilla{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-pc{border-radius:16px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-foto{height:118px;border-bottom:1px solid var(--rp-borde)}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-foto img{width:88%;height:88%}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-sello{left:6px;top:6px;padding:3px 7px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-cuerpo{gap:5px;padding:10px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-nombre{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:.875rem;font-weight:600;line-height:1.3}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-specs{font-size:.75rem;line-height:1.35}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-precio{font-size:1.125rem}
  /* "Hasta 18 cuotas fijas con tarjeta" no entra en una línea a 360px: baja a
     dos antes que cortarse con puntos. */
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-cuota{font-size:.75rem;line-height:1.3}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-tres{font-size:.75rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-envio{padding:3px 8px}
}

/* ── Tableta: más columnas ── */
@media (min-width:600px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-grilla{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-grilla{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ── Computadora: los filtros al costado ── */
@media (min-width:1024px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp{--rp-orden-arriba:62px;position:relative;display:grid;grid-template-columns:240px minmax(0,1fr);
    grid-template-rows:auto auto auto 1fr;column-gap:28px;align-items:start;padding:24px 16px 64px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc{--rp-orden-arriba:28px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-cabeza{display:contents}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-migas{grid-column:1 / -1;grid-row:1}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-titulo{grid-column:1 / -1;grid-row:2;flex-direction:row;align-items:baseline;justify-content:flex-start;gap:14px;
    margin-top:8px;padding-right:250px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-cuenta{font-size:1rem}

  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-lado{grid-column:1;grid-row:3 / span 2;align-self:start;gap:16px;margin-top:20px;padding:18px;
    border:1px solid var(--rp-borde);border-radius:16px;background:var(--rp-blanco)}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-botones{display:contents}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-abrir{display:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-orden{position:absolute;top:var(--rp-orden-arriba);right:16px;flex:none;height:40px;border-radius:999px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-panel,
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-panel[hidden]{display:flex;gap:16px;padding:0;border:0;border-radius:0;background:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-grupo-t,
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp :is(.rp-marcas,.rp-precio) legend{font-size:.875rem;font-weight:700;color:var(--rp-tinta)}
  /* Una línea entre grupo y grupo, como el lienzo */
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-lado > .rp-grupo ~ :is(.rp-grupo,.rp-panel),
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-panel > .rp-grupo ~ :is(.rp-grupo,fieldset),
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-panel > fieldset ~ fieldset{padding-top:16px;border-top:1px solid var(--rp-borde)}
  /* Al costado el botón no compite con la lista: queda en borde. */
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-aplicar{height:40px;border:1.5px solid var(--rp-azul);background:var(--rp-blanco);color:var(--rp-azul-texto);font-size:.875rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-aplicar:hover{background:var(--rp-azul);color:#FFFFFF}

  body.eph-recorrido.eph-recorrido.eph-recorrido .rp :is(.rp-ayuda,.rp-elegir){grid-column:2;grid-row:3;margin:20px 0 0}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-ayuda{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:center;gap:24px;padding:18px 22px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-elegir{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t botones" "p botones";
    align-items:center;column-gap:24px;row-gap:3px;padding:18px 22px;border-radius:16px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-elegir > b{grid-area:t}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-elegir > p{grid-area:p}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-elegir-botones{grid-area:botones}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-elegir-botones a{flex:none;padding:0 20px;border-radius:999px}

  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-lista{grid-column:2;grid-row:4;padding:18px 0 0}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-grilla,
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-de-pc .rp-grilla{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-foto{height:170px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-cuerpo{padding:14px 16px 16px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-nombre{min-height:0;font-size:1rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-monto{font-size:1.25rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-agregar button,
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-ver-pieza{height:42px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-foto{height:190px}
}
@media (min-width:1200px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rp-grilla{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* ── Modo oscuro (generado por herramientas/gen_recorrido_oscuro.py: no editar a mano) ── */
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-rp{background:#0B1222!important}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rp{--rp-fondo:#0B1222;--rp-gris:#1B2440;--rp-blanco:#151D35;--rp-borde:#253149;--rp-campo:#3A4A66;--rp-tinta:#E9EEF6;--rp-cuerpo:#C9D3E1;--rp-texto:#A2B0C6;--rp-suave:#8B9AB3;--rp-apagado:#6B7A94;--rp-azul:#3B82F6;--rp-azul-texto:#7FB0FF;--rp-azul-claro:#17305C;--rp-azul-fondo:#13213F;--rp-azul-tinta:#BFD7FF;--rp-verde:#15954A;--rp-verde-tinta:#5FD98D;--rp-verde-fondo:#0F2E1E}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-chip[aria-current]{background:#E9EEF6;color:#0B1222}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rp-error{color:#F87171}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-tres{color:#5FD98D}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-rp{background:#0B1222!important}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rp{--rp-fondo:#0B1222;--rp-gris:#1B2440;--rp-blanco:#151D35;--rp-borde:#253149;--rp-campo:#3A4A66;--rp-tinta:#E9EEF6;--rp-cuerpo:#C9D3E1;--rp-texto:#A2B0C6;--rp-suave:#8B9AB3;--rp-apagado:#6B7A94;--rp-azul:#3B82F6;--rp-azul-texto:#7FB0FF;--rp-azul-claro:#17305C;--rp-azul-fondo:#13213F;--rp-azul-tinta:#BFD7FF;--rp-verde:#15954A;--rp-verde-tinta:#5FD98D;--rp-verde-fondo:#0F2E1E}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rp .rp-chip[aria-current]{background:#E9EEF6;color:#0B1222}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rp-error{color:#F87171}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rp-pc-tres{color:#5FD98D}}

/* recorrido-menu.css */
/* ElectroPC · El encabezado y el menú del lienzo "Recorrido simple" (26/9).
 *
 * Carga con el diseño nuevo prendido (`EPH_Vista::recorrido`), en todas las
 * pantallas, después de menu-alt.css. El encabezado es del tema: acá se lo
 * viste claro, como el lienzo, aunque el tema esté en oscuro (el diseño nuevo
 * es solo claro). El menú del celular lo arma `EPH_MenuRecorrido` (`.rm`).
 *
 * Cada regla lleva `body.eph-recorrido` dos veces: le gana a menu-alt.css
 * (`body.eph-alt`) y a las reglas del tema para `[data-theme="dark"]`. */

/* ── Los colores: los del modo claro de menu-alt.css ── */
body.eph-recorrido.eph-recorrido{
  --mn-fondo:rgba(255,255,255,.96);
  --mn-borde:#E2E8F0;
  --mn-tinta:#0F172A;
  --mn-texto:#475569;
  --mn-azul:#0064FF;
  --mn-campo:#F1F5F9;
  --mn-panel:#FFFFFF;
  --mn-hover:rgba(15,23,42,.05);
}
body.eph-recorrido.eph-recorrido .site-header{background:var(--mn-fondo)!important;border-bottom:1px solid var(--mn-borde);color:var(--mn-tinta)}
body.eph-recorrido.eph-recorrido .site-header .header-actions__btn,
body.eph-recorrido.eph-recorrido .site-header .header-actions > a,
body.eph-recorrido.eph-recorrido .site-header .mobile-menu-toggle{color:var(--mn-tinta)!important}
/* Las rayas, del color del botón: así siguen al modo oscuro como el carrito. */
body.eph-recorrido.eph-recorrido .site-header .mobile-menu-toggle span{background:currentColor!important}
body.eph-recorrido.eph-recorrido .header-search input[type="search"]{background:var(--mn-campo)!important;color:var(--mn-tinta)!important;border-color:var(--mn-borde)!important}
/* El tema en oscuro deja el texto de ayuda en blanco: sobre el campo claro no se leía. */
body.eph-recorrido.eph-recorrido .header-search input[type="search"]::placeholder{color:var(--mn-texto)!important;opacity:1!important}
body.eph-recorrido.eph-recorrido .header-search input[type="search"]::-webkit-input-placeholder{color:var(--mn-texto)!important;opacity:1!important}
body.eph-recorrido.eph-recorrido .header-search .dgwt-wcas-ico-magnifier,
body.eph-recorrido.eph-recorrido .header-search .dgwt-wcas-search-icon svg{fill:var(--mn-texto)!important}

/* El logo oscuro sobre el fondo claro, aunque el tema esté en oscuro. */
body.eph-recorrido.eph-recorrido :is(.site-header,.mobile-nav) img.logo-light{display:block!important}
body.eph-recorrido.eph-recorrido :is(.site-header,.mobile-nav) img.logo-dark{display:none!important}

/* ── La fila de la computadora: texto, sin íconos, y el de la página marcado ── */
body.eph-recorrido.eph-recorrido .header-nav{background:var(--rm-blanco,#FFFFFF);border-top:1px solid var(--mn-borde)}
body.eph-recorrido.eph-recorrido .nav-pill:not(.nav-pill--dropdown) > svg,
body.eph-recorrido.eph-recorrido .nav-pill--dropdown > svg:first-child{display:none}
body.eph-recorrido.eph-recorrido .nav-pill{color:var(--mn-tinta);border-color:transparent;background:none;border-radius:0;box-shadow:none}
body.eph-recorrido.eph-recorrido .nav-pill:hover{color:var(--mn-azul);background:none;border-color:transparent}
body.eph-recorrido.eph-recorrido .nav-pill[aria-current="page"]{color:var(--mn-azul);box-shadow:inset 0 -2px 0 var(--mn-azul)}
body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill,
body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill:hover{background:var(--mn-azul);color:#FFFFFF;border-radius:999px;box-shadow:none}
body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill:hover{background:#0052D4}
body.eph-recorrido.eph-recorrido .nav-pill--dropdown[aria-expanded="true"]{color:var(--mn-azul);background:none;border-color:transparent}
body.eph-recorrido.eph-recorrido .mega-dropdown{box-shadow:0 18px 40px rgba(15,23,42,.14)}
/* El título del desplegable quedaba en blanco sobre blanco, y los íconos en el
   violeta del tema, que no es del diseño nuevo. */
body.eph-recorrido.eph-recorrido .mega-dropdown__title{color:var(--mn-texto)!important}
body.eph-recorrido.eph-recorrido .mega-dropdown svg{color:var(--mn-azul)!important;stroke:currentColor}
body.eph-recorrido.eph-recorrido .mega-dropdown__viewall{color:var(--mn-azul)!important}

/* ── En el celular: la lupa, el carrito y el menú, como el lienzo ──
   El sol y la luna no van (el diseño nuevo es solo claro), y "Mi cuenta" pasa
   al menú. */
@media (max-width:1023px){
  body.eph-recorrido.eph-recorrido .site-header .theme-toggle,
  body.eph-recorrido.eph-recorrido .site-header .header-actions__account{display:none!important}
}
/* La lupa de FiboSearch, que en el celular queda solo como ícono, va con el
   carrito y el menú: a la derecha, del mismo color y tamaño, cada uno con
   44px para el dedo y sin espacio extra entre ellos (lienzo, tablero Main;
   Martín, 2/10: "la lupa se pierde"). */
@media (max-width:1023px){
  body.eph-recorrido.eph-recorrido .site-header .header-search{display:flex!important;justify-content:flex-end!important;flex:1 1 auto!important;min-width:0;margin-left:0!important;padding:0!important}
  /* La caja de FiboSearch ocupaba todo el hueco con la lupa a la izquierda: se achica a la lupa y va contra el carrito. */
  body.eph-recorrido.eph-recorrido .site-header .header-search .dgwt-wcas-search-wrapp.dgwt-wcas-layout-icon{flex:none!important;width:44px!important;min-width:0!important;max-width:44px!important;margin:0 0 0 auto!important}
  body.eph-recorrido.eph-recorrido .site-header .header-actions{gap:0!important;margin-left:0!important}
  /* La fila del tema separa sus partes 8px: la lupa va pegada al carrito, como entre carrito y menú. */
  body.eph-recorrido.eph-recorrido .site-header .header-search{margin-right:-8px!important}
  /* La barra abierta: el texto desde el borde (no hay ícono a la izquierda) y la cruz de borrar visible. */
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon-open .dgwt-wcas-search-input{padding-left:16px!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon-open .dgwt-wcas-close{color:var(--mn-texto)!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon-open .dgwt-wcas-close :is(svg,svg *){fill:currentColor!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon .dgwt-wcas-search-icon{display:inline-flex!important;align-items:center;justify-content:center;
    width:44px!important;height:44px!important;margin:0!important;padding:0!important;color:var(--mn-tinta)!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon .dgwt-wcas-search-icon svg{width:24px!important;height:24px!important;stroke:currentColor!important}
  body.eph-recorrido.eph-recorrido .site-header .dgwt-wcas-layout-icon .dgwt-wcas-search-icon :is(svg,svg *){fill:none!important;stroke:currentColor!important}
  body.eph-recorrido.eph-recorrido .site-header .header-actions__cart{display:inline-flex!important;align-items:center;justify-content:center;width:44px!important;height:44px!important;margin:0!important;padding:0!important}
  body.eph-recorrido.eph-recorrido .site-header .header-actions__cart svg{width:24px!important;height:24px!important}
  /* El menú solo crece la caja: las tres rayas y su cruz las mueve el tema. */
  body.eph-recorrido.eph-recorrido .site-header .mobile-menu-toggle{width:44px!important;height:44px!important;margin:0!important}
}

/* ── El menú del celular ── */
body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja{background:#FFFFFF!important;color:#0F172A}
body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__header{background:#FFFFFF;border-bottom:1px solid #E2E8F0}
body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__close{color:#0F172A}
body.eph-recorrido.eph-recorrido .rm{font-family:Inter,system-ui,sans-serif;padding:16px;display:flex;flex-direction:column;gap:18px}
body.eph-recorrido.eph-recorrido .rm *{box-sizing:border-box}
body.eph-recorrido.eph-recorrido .rm .rm-encontra{display:flex;align-items:center;gap:12px;padding:16px;border-radius:12px;background:#0064FF;color:#FFFFFF;text-decoration:none}
body.eph-recorrido.eph-recorrido .rm .rm-encontra:hover{background:#0052D4;color:#FFFFFF}
body.eph-recorrido.eph-recorrido .rm-encontra > span{flex:1;display:flex;flex-direction:column;gap:2px}
body.eph-recorrido.eph-recorrido .rm-encontra b{font-size:1.125rem;font-weight:700;color:#FFFFFF}
body.eph-recorrido.eph-recorrido .rm-encontra small{font-size:.875rem;color:#DBEAFE}
body.eph-recorrido.eph-recorrido .rm-encontra svg{flex:none}
body.eph-recorrido.eph-recorrido .rm-grupo{display:flex;flex-direction:column}
body.eph-recorrido.eph-recorrido .rm-titulo{margin:0;padding:0 4px 6px;font-size:.75rem;font-weight:700;color:#475569}
body.eph-recorrido.eph-recorrido .rm .rm-fila{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 4px;min-height:48px;
  border-bottom:1px solid #E2E8F0;color:#0F172A;text-decoration:none;font-size:1rem;font-weight:600}
body.eph-recorrido.eph-recorrido .rm .rm-fila:last-child{border-bottom:0}
body.eph-recorrido.eph-recorrido .rm .rm-fila:hover{color:#0052D4}
body.eph-recorrido.eph-recorrido .rm-fila small{display:block;margin-top:2px;font-size:.75rem;font-weight:400;color:#475569}
body.eph-recorrido.eph-recorrido .rm-fila svg{flex:none;color:#94A3B8}
body.eph-recorrido.eph-recorrido .rm-local{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:12px;background:#F8FAFC}
body.eph-recorrido.eph-recorrido .rm-local p{margin:0;font-size:.875rem;line-height:1.5;color:#475569}
body.eph-recorrido.eph-recorrido .rm .rm-wa{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;border-radius:999px;background:#0B7038;
  color:#FFFFFF;font-size:1rem;font-weight:600;text-decoration:none}
body.eph-recorrido.eph-recorrido .rm .rm-wa:hover{background:#05602C;color:#FFFFFF}
body.eph-recorrido.eph-recorrido .rm :is(a):focus-visible{outline:3px solid color-mix(in srgb,#0064FF 45%,transparent);outline-offset:2px}

/* ── La franja de confianza, arriba de todo (lienzo v76 y v79, 1/10) ──
   La imprime `EPH_MenuRecorrido::tira`. De a un texto, cada 4 segundos, en
   la computadora y en el celular (Martín, 1/10: "información que iba pasando
   sola"); con "reducir movimiento", el primero quieto. Cada texto con su
   ícono y lo clave en blanco y negrita; "3 cuotas sin interés" en verde.
   Con temporada, del color de la temporada y su texto primero. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira{position:relative;display:block;box-sizing:border-box;height:40px;overflow:hidden;padding:0;border-bottom:1px solid rgb(30 41 59);
  background:#0F172A;color:#E2E8F0;font-family:Inter,system-ui,sans-serif;font-size:.875rem;font-weight:400;line-height:1.35;text-align:center}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-fija{position:fixed;left:0;right:0;z-index:1001}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira b{font-weight:700;color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira svg{display:inline-block;flex:none;vertical-align:-3px;margin-right:8px;color:#93C5FD}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-google svg{color:#FBBC05}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-cuotas svg,body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-cuotas b{color:#6EE7A0}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .ept-franja-item{display:inline-flex;align-items:center;gap:8px;vertical-align:middle;line-height:1.35}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .ept-franja-item svg{margin-right:0;color:inherit}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira a{color:inherit;font-weight:700;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-temporada{background:var(--ept-color,#FF7A1A);border-bottom-color:transparent;color:rgb(15 23 42)}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-temporada b,body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-temporada svg,body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-temporada .rt-cuotas b{color:rgb(15 23 42)}
/* Alto de línea entero, sin centrar con flex y el ícono bajado 3px justos:
   centrado, el texto caía en medio píxel y se veía borroso (Martín, 1/10). */
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item{position:absolute;inset:0;display:block;line-height:39px;padding:0 16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;
  animation-duration:calc(var(--rt-n) * 4s);animation-iteration-count:infinite;animation-timing-function:ease;animation-delay:calc(var(--rt-i) * 4s);animation-fill-mode:both}
/* Cada mensaje con el fondo de la franja: la animación lo pone en una capa
   aparte, y sobre una capa transparente Chrome en Windows dibuja la letra sin
   su suavizado fino y se ve borrosa (Martín, 7/10). Con fondo, queda nítida. */
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item{background:inherit}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n1 .rt-item{opacity:1;animation:none}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n2{--rt-n:2}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n2 .rt-item{animation-name:rt-gira-2}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n3{--rt-n:3}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n3 .rt-item{animation-name:rt-gira-3}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n4{--rt-n:4}
body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira.rt-n4 .rt-item{animation-name:rt-gira-4}
@keyframes rt-gira-2{0%{opacity:0;transform:translateY(8px)}6%{opacity:1;transform:none}44%{opacity:1;transform:none}50%{opacity:0;transform:translateY(-8px)}100%{opacity:0}}
@keyframes rt-gira-3{0%{opacity:0;transform:translateY(8px)}4%{opacity:1;transform:none}29%{opacity:1;transform:none}33%{opacity:0;transform:translateY(-8px)}100%{opacity:0}}
@keyframes rt-gira-4{0%{opacity:0;transform:translateY(8px)}3%{opacity:1;transform:none}22%{opacity:1;transform:none}25%{opacity:0;transform:translateY(-8px)}100%{opacity:0}}
@media (max-width:759px){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira{height:38px}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item{line-height:37px;padding:0 12px}
}
@media (prefers-reduced-motion:reduce){
  body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item{animation:none;opacity:0}
  body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira .rt-item:first-child{opacity:1}
}

/* ── Modo oscuro (generado por herramientas/gen_recorrido_oscuro.py: no editar a mano) ── */
html[data-theme="dark"] body.eph-recorrido.eph-recorrido{--mn-fondo:rgba(21,29,53,.96);--mn-borde:#253149;--mn-tinta:#E9EEF6;--mn-texto:#A2B0C6;--mn-azul:#3B82F6;--mn-campo:#1B2440;--mn-panel:#151D35;--mn-hover:rgba(233,238,246,.05)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .header-nav{background:var(--rm-blanco,#151D35)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill:hover{background:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja{background:#151D35!important;color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__header{background:#151D35;border-bottom:1px solid #253149}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__close{color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-encontra{background:#3B82F6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-encontra:hover{background:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-encontra small{color:#17305C}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-titulo{color:#A2B0C6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-fila{border-bottom:1px solid #253149;color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-fila:hover{color:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-fila small{color:#A2B0C6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-local{background:#0B1222}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm-local p{color:#A2B0C6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-wa{background:#15954A}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm .rm-wa:hover{background:#5FD98D}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido .rm :is(a):focus-visible{outline:3px solid color-mix(in srgb,#3B82F6 45%,transparent)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira{background:#22304F}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido :is(.site-header,
html[data-theme="dark"] .mobile-nav) img.logo-light{display:none!important}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido :is(.site-header,
html[data-theme="dark"] .mobile-nav) img.logo-dark{display:block!important}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido{--mn-fondo:rgba(21,29,53,.96);--mn-borde:#253149;--mn-tinta:#E9EEF6;--mn-texto:#A2B0C6;--mn-azul:#3B82F6;--mn-campo:#1B2440;--mn-panel:#151D35;--mn-hover:rgba(233,238,246,.05)}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .header-nav{background:var(--rm-blanco,#151D35)}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .nav-pill.rm-encontra-pill:hover{background:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja{background:#151D35!important;color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__header{background:#151D35;border-bottom:1px solid #253149}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .mobile-nav.rm-caja .mobile-nav__close{color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-encontra{background:#3B82F6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-encontra:hover{background:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-encontra small{color:#17305C}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-titulo{color:#A2B0C6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-fila{border-bottom:1px solid #253149;color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-fila:hover{color:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-fila small{color:#A2B0C6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-local{background:#0B1222}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm-local p{color:#A2B0C6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-wa{background:#15954A}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm .rm-wa:hover{background:#5FD98D}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido .rm :is(a):focus-visible{outline:3px solid color-mix(in srgb,#3B82F6 45%,transparent)}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido .rt-tira{background:#22304F}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido :is(.site-header,
html:not([data-theme="light"]) .mobile-nav) img.logo-light{display:none!important}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido :is(.site-header,
html:not([data-theme="light"]) .mobile-nav) img.logo-dark{display:block!important}}

/* recorrido-temporada.css */
/* ElectroPC · La temporada (Halloween, Black Friday…) del diseño nuevo (30/9).
 *
 * Carga solo con la temporada activa (`EPH_Temporada::activa`): apagada, esta
 * hoja no está y la web queda como siempre. El color de la temporada llega en
 * `--ept-color` (lo pone `EPH_Temporada::encolar` desde el panel) y va solo en
 * la franja, la ceja y los sellos: precios, botones azules y WhatsApp verde no
 * cambian.
 *
 * Cada regla lleva `body.eph-recorrido` tres veces y `.eph-temporada`: la
 * portada con banner le tiene que ganar al fondo de `.rh-heroe` también en el
 * oscuro generado.
 *
 * La letra sobre el color de la temporada va en `rgb()`: el generador del modo
 * oscuro no la toca, y sobre el naranja tiene que seguir oscura. */

body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada{--ept-tinta:rgb(15 23 42)}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-calabaza{flex:none}

/* ── La franja de arriba ── */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-franja{display:flex;align-items:center;justify-content:center;gap:10px;padding:9px 16px;
  background:var(--ept-color);color:var(--ept-tinta);font-family:Inter,system-ui,sans-serif;font-size:.875rem;line-height:1.35;text-align:center}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-franja b{font-weight:700;color:var(--ept-tinta)}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-franja a{color:var(--ept-tinta);font-weight:700;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-franja a:hover{color:var(--ept-tinta);text-decoration-thickness:2px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-franja a:focus-visible{outline:3px solid var(--ept-tinta);outline-offset:2px}

/* ── La portada: la ceja y el banner ── */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe .ept-ceja{display:flex;align-items:center;gap:7px;max-width:none;margin:0;color:var(--ept-color);font-size:.875rem;font-weight:600;line-height:1.3}
/* Celular: el texto, abajo la imagen en el flujo y 54px de fondo liso, que es lo que tapa "¿Cómo te ayudamos?" al subir. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner]{background:#0C182C}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="chica"] .rh-heroe-texto{padding-bottom:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe .ept-banner-chico{display:block;width:100%;height:auto;margin:10px 0 0;border-radius:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe .ept-banner-pie{display:block;height:54px}

/* ── El bloque de la home ── */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque{padding-top:40px;scroll-margin-top:72px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque-caja{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:12px;padding:20px 14px 16px;
  border-radius:16px;background:#0F172A;color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-telarana{position:absolute;right:0;top:0;width:120px;height:120px;color:rgba(255,255,255,.16);pointer-events:none}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque-texto{position:relative;display:flex;flex-direction:column;gap:12px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-kicker{display:flex;align-items:center;gap:6px;margin:0;color:var(--ept-color);font-size:.875rem;font-weight:600}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-bloque h2{margin:0;color:#FFFFFF;font-size:clamp(1.5rem,3vw,2rem);font-weight:700;line-height:1.15;letter-spacing:-.02em}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque-baja{margin:0;color:#CBD5E1;font-size:.875rem;line-height:1.45}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 22px;border-radius:999px;
  background:#0064FF;color:#FFFFFF;font-size:1rem;font-weight:600;text-decoration:none;white-space:nowrap}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-btn:hover{background:#0052D4;color:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-btn:focus-visible{outline:3px solid #93C5FD;outline-offset:2px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-fechas{margin:0;color:#94A3B8;font-size:.75rem;text-align:center}

/* Las PC elegidas: dos en el celular; "Ver las 3 elegidas" muestra el resto (`:target`). */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pcs{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pcs:not(:target) .ept-pc:nth-child(n+3){display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pcs:target ~ .ept-btn{display:none}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-pc{display:flex;flex-direction:column;overflow:hidden;border-radius:12px;background:#FFFFFF;color:#0F172A;text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-pc:hover .ept-pc-nombre{color:#0052D4}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-foto{position:relative;display:flex;align-items:center;justify-content:center;height:128px;border-bottom:1px solid #E2E8F0;background:#FFFFFF}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-foto img{width:86%;height:86%;object-fit:contain;margin:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-cuerpo{display:flex;flex-direction:column;gap:5px;flex-grow:1;padding:10px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-nombre{min-height:51px;font-size:.875rem;font-weight:600;line-height:1.3;color:#0F172A;overflow-wrap:anywhere}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-specs{flex-grow:1;font-size:.75rem;line-height:1.35;color:#475569}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-precio{margin-top:4px;font-size:1.125rem;font-weight:700;color:#0F172A}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-cuota{font-size:.75rem;color:#475569}

/* ── Los sellos: "Elegida" en las tarjetas y "Elegida para Halloween" en la ficha ── */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-sello{display:inline-flex;align-items:center;gap:4px;padding:3px 9px 3px 7px;border-radius:999px;
  background:color-mix(in srgb,var(--ept-color) 12%,rgb(255 255 255));color:color-mix(in srgb,var(--ept-color) 68%,rgb(0 0 0));
  font-family:Inter,system-ui,sans-serif;font-size:.75rem;font-weight:600;line-height:1.3;white-space:nowrap}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada :is(.ept-pc-foto,.rl-pc-foto,.rp-pc-foto) > .ept-sello{position:absolute;left:8px;top:8px;z-index:1}
/* Si la tarjeta ya tiene su sello ("Con monitor"), va debajo del de la temporada. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rp-pc-foto > .ept-sello{left:10px;top:10px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-sello ~ .rl-sello{top:36px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-sello ~ .rp-sello{top:40px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-sello-ficha{align-self:flex-start;gap:5px;padding:4px 11px 4px 8px;font-size:.875rem}

@media (max-width:1023px){
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-solo-grande{display:none!important}
}
@media (min-width:1024px){
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-solo-chica{display:none!important}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-franja{gap:14px;padding:10px 40px}

  /* Computadora: la portada pasa a 510px con la imagen arriba a la derecha, a 440 de alto;
     "¿Cómo te ayudamos?" sube 70 y tapa solo el fondo liso. Arriba de 1538px la
     imagen deja de seguir el borde de la pantalla y queda a la misma distancia
     del texto que en una de 1538: en un monitor ancho se iba lejos (Martín,
     27/10). Va en vw: un % en background-position es sobre lo que sobra de la
     imagen, no sobre el ancho, y con % no se movía. */
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe .ept-ceja{font-size:1rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="grande"]{min-height:calc(var(--ept-alto, 440px) + 70px);background:#0C182C var(--ept-banner) right max(0px, calc(50vw - 769px)) top/auto var(--ept-alto, 440px) no-repeat}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="grande"] .rh-heroe-texto{padding-bottom:110px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe .ept-banner-chico,
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="grande"] .ept-banner-pie{display:none}

  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque{padding-top:64px;scroll-margin-top:132px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque-caja{display:grid;grid-template-columns:300px minmax(0,1fr);gap:32px;align-items:center;padding:32px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-telarana{width:220px;height:220px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque-texto{gap:14px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque-baja{font-size:1rem;line-height:1.5}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-bloque-texto .ept-btn{align-self:flex-start}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-fechas{font-size:.875rem;text-align:left}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pcs{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pcs:not(:target) .ept-pc:nth-child(n+3){display:flex}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-foto{height:170px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-cuerpo{padding:14px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-nombre{min-height:38px}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-specs{font-size:.875rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-precio{font-size:1.25rem}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-cuota{font-size:.75rem}
}

/* ── Modo oscuro (generado por herramientas/gen_recorrido_oscuro.py: no editar a mano) ── */
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque-caja{background:#22304F}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-telarana{color:rgba(21,29,53,.16)}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-btn{background:#3B82F6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-btn:hover{background:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-pc{background:#151D35;color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-pc:hover .ept-pc-nombre{color:#7FB0FF}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-foto{border-bottom:1px solid #253149}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-nombre{color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-specs{color:#A2B0C6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-precio{color:#E9EEF6}
html[data-theme="dark"] body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-cuota{color:#A2B0C6}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-bloque-caja{background:#22304F}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-telarana{color:rgba(21,29,53,.16)}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-btn{background:#3B82F6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-btn:hover{background:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-pc{background:#151D35;color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh .ept-pc:hover .ept-pc-nombre{color:#7FB0FF}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-foto{border-bottom:1px solid #253149}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-nombre{color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-specs{color:#A2B0C6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-precio{color:#E9EEF6}}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pc-cuota{color:#A2B0C6}}

/* ── El banner animado (Cyber Monday, Martín 29/10): `EPH_TemporadaVivo` ──
   El lienzo tiene el tamaño exacto de la foto que se ve y adentro todo va en % de ella.
   No lleva z-index ni container-type: haría de capa propia y el brillo, que se suma con
   screen sobre la foto, pintaría un recuadro negro. Las medidas relativas van en la pantalla. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="vivo"],
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="vivo-arte"]{position:relative}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="vivo"] > .rh-heroe-texto,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="vivo-arte"] > .rh-heroe-texto{position:relative;z-index:1}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-lienzo{display:none;position:absolute;pointer-events:none}
/* Sin capa de luces encima de la foto: la foto desenfocada sumada con screen la dejaba borrosa, como
   con el degradé adelante (Martín 29/10). Lo que late es el cartel (.ept-zumbido). */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-palabra,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-letra,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-zumbido,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pantalla{position:absolute;left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);width:calc(var(--w) * 1%);height:calc(var(--h) * 1%)}
/* El cartel apagado, recortado a la caja: se corre la capa para que su parte (x, y) quede adentro. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-palabra,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-letra{background:var(--ept-cartel) calc(var(--bx) * 1%) calc(var(--by) * 1%)/calc(10000% / var(--w)) calc(10000% / var(--h)) no-repeat}
/* Con bordes difuminados: la caja recorta también la sombra de la pared, y con bordes rectos la "E"
   que falla se veía como un rectángulo (Martín 29/10). */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-palabra,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-letra,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-zumbido{-webkit-mask:linear-gradient(to right,transparent,#000 18%,#000 82%,transparent),linear-gradient(transparent,#000 18%,#000 82%,transparent);-webkit-mask-composite:source-in;mask:linear-gradient(to right,transparent,#000 18%,#000 82%,transparent),linear-gradient(transparent,#000 18%,#000 82%,transparent);mask-composite:intersect}
/* Al cargar, cada palabra se prende con su parpadeo; después falla una sola letra, cada tanto. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-palabra{animation:ept-prender 1.5s linear calc(.5s + var(--i) * .75s) 1 both}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-letra{opacity:0;animation:ept-falla 12s linear -3s infinite;-webkit-mask:radial-gradient(closest-side,#000 45%,transparent 100%);mask:radial-gradient(closest-side,#000 45%,transparent 100%)}
/* El zumbido: el cartel encendido (la foto misma), desenfocado y sumado con screen, late todo el tiempo,
   como un neón de verdad; arranca cuando terminó de prenderse. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-zumbido{opacity:0;background:var(--ept-foto) calc(var(--bx) * 1%) calc(var(--by) * 1%)/calc(10000% / var(--w)) calc(10000% / var(--h)) no-repeat;filter:blur(3px) brightness(1.4) contrast(1.6);mix-blend-mode:screen;animation:ept-zumbido-entra .8s linear 2.6s both,ept-zumbido 2.6s ease-in-out 3.4s infinite}

/* ── La compra en la pantalla del monitor (16s por vuelta, después de que se prende el cartel) ──
   Como el video "Comprar tu PC es así de fácil": cuatro pasos que se tildan, la cámara que se
   acerca a lo que se toca y un solo dedo que viaja de un toque al siguiente. Todo en cqw/cqh de
   la pantalla, con lugares fijos: el dedo sabe dónde cae cada toque. */
@property --ept-act{syntax:"<number>";inherits:true;initial-value:0}
@property --ept-hecho{syntax:"<number>";inherits:true;initial-value:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pantalla{container-type:size;overflow:hidden;background:#F1F5F9;box-shadow:0 0 3cqw rgba(56,189,248,.45)}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-pantalla::after{content:"";position:absolute;inset:0;z-index:3;background:linear-gradient(118deg,rgba(255,255,255,.13) 0 34%,rgba(255,255,255,0) 34%),linear-gradient(rgba(15,23,42,0),rgba(15,23,42,.1))}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-web{position:absolute;inset:0;color:#0F172A;font-family:inherit;line-height:1.15;text-align:left;--ept-curva:cubic-bezier(.2,.75,.25,1)}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-web *{animation-duration:16s;animation-delay:2.5s;animation-iteration-count:infinite;animation-fill-mode:both;animation-timing-function:var(--ept-curva)}
/* Los pasos: el actual se abre en una pastilla azul con su nombre; los hechos, un tilde. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-pasos{position:absolute;left:0;right:0;top:3cqh;height:10cqh;display:flex;justify-content:center;gap:1.6cqw}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso{position:relative;display:flex;align-items:center;height:10cqh;padding-right:calc(var(--ept-act) * 2.4cqw);border-radius:99px;background:color-mix(in srgb,#2563EB calc(var(--ept-act) * 100%),color-mix(in srgb,#BFDBFE calc(var(--ept-hecho) * 100%),#E2E8F0));color:#fff;white-space:nowrap}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso i,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso s{display:grid;place-items:center;width:10cqh;height:10cqh;font-size:5.5cqh;font-style:normal;font-weight:800;text-decoration:none}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso i{color:color-mix(in srgb,#fff calc(var(--ept-act) * 100%),#64748B);opacity:calc(1 - var(--ept-hecho))}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso s{position:absolute;left:0;top:0;color:#2563EB;opacity:var(--ept-hecho)}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso s svg{width:55%;height:55%}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso b{display:block;overflow:hidden;max-width:calc(var(--ept-act) * 40cqw);opacity:var(--ept-act);font-size:5.4cqh;font-weight:800}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso1{animation-name:ept-w-paso1}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso2{animation-name:ept-w-paso2}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso3{animation-name:ept-w-paso3}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-paso4{animation-name:ept-w-paso4}
/* Las cuatro pantallas, en el mismo cuadro. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-cuadro{position:absolute;inset:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-esc{position:absolute;inset:0;opacity:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-esc1{transform-origin:19cqw 62cqh;animation-name:ept-w-esc1}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-esc2{transform-origin:69.5cqw 59cqh;animation-name:ept-w-esc2}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-esc3{transform-origin:62cqw 62cqh;animation-name:ept-w-esc3}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-esc4{transform-origin:50cqw 55cqh;animation-name:ept-w-esc4}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-titulo{position:absolute;font-size:6.5cqh;font-weight:800}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-rotulo{position:absolute;color:#475569;font-size:4.6cqh;font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-foto{display:block;object-fit:contain;background:#fff}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-nombre{display:-webkit-box;overflow:hidden;font-weight:700;-webkit-line-clamp:2;-webkit-box-orient:vertical}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-chip,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-opcion{position:absolute;box-sizing:border-box;border:.6cqh solid #CBD5E1;border-radius:2cqh;background:#fff;font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-chip{display:grid;place-content:center;text-align:center;font-size:4.6cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-chip small{display:block;color:#64748B;font-size:3.4cqh;font-weight:600}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-boton{position:absolute;display:grid;place-items:center;border-radius:2cqh;background:#2563EB;color:#fff;font-size:5cqh;font-weight:800}
/* 1. El catálogo: tres tarjetas; la primera, tocada, crece y se vuelve la ficha. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-esc1 .ept-w-titulo{left:5cqw;top:17cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-fila{position:absolute;left:5cqw;right:5cqw;top:28cqh;bottom:5cqh;display:flex;gap:3cqw}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-tarjeta{display:flex;flex-direction:column;gap:1.5cqh;box-sizing:border-box;width:28cqw;padding:2cqh 1.5cqw;border:.6cqh solid #E2E8F0;border-radius:2.5cqh;background:#fff}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-tarjeta:first-child{animation-name:ept-w-tocada}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-tarjeta .ept-w-foto{width:100%;height:34cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-tarjeta .ept-w-nombre{font-size:4cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-precio{margin-top:auto;font-size:5.4cqh;font-weight:800}
/* 2. La ficha: 32GB y "Comprar ahora". */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-foto-grande{position:absolute;left:5cqw;top:19cqh;width:35cqw;height:76cqh;border-radius:2.5cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ficha .ept-w-nombre{position:absolute;left:45cqw;right:5cqw;top:20cqh;font-size:5.6cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ficha .ept-w-rotulo{left:45cqw;top:41cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ficha .ept-w-chip{top:49cqh;width:15cqw;height:20cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ficha .ept-w-chip16{left:45cqw;animation-name:ept-w-sel16}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ficha .ept-w-chip32{left:62cqw;animation-name:ept-w-sel32}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ficha .ept-w-chip:last-child{left:79cqw}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ficha .ept-w-boton{left:45cqw;right:5cqw;top:74cqh;height:14cqh;animation-name:ept-w-boton2}
/* 3. Cómo abonar: tarjeta, 18 cuotas y confirmar. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-esc3 .ept-w-titulo{left:5cqw;top:18cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-opcion{left:5cqw;width:43cqw;height:18cqh;padding:2.4cqh 2cqw 0 7cqw;font-size:4.8cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-opcion small{display:block;margin-top:.6cqh;color:#64748B;font-size:3.6cqh;font-weight:600}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-esc3 .ept-w-col > .ept-w-opcion:nth-child(2){top:33cqh;animation-name:ept-w-transfer}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-tarjeta-op{top:56cqh;animation-name:ept-w-tarjeta}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-radio{position:absolute;left:2cqw;top:5.4cqh;box-sizing:border-box;width:7cqh;height:7cqh;border:.7cqh solid currentColor;border-radius:50%;color:#94A3B8}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-cuotas{position:absolute;inset:0;animation-name:ept-w-cuotas}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-cuotas .ept-w-rotulo{left:52cqw;top:21cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-grilla .ept-w-chip{width:13.5cqw;height:13cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-grilla .ept-w-chip:nth-child(1){left:52cqw;top:31cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-grilla .ept-w-chip:nth-child(2){left:67cqw;top:31cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-grilla .ept-w-chip:nth-child(3){left:82cqw;top:31cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-grilla .ept-w-chip:nth-child(4){left:52cqw;top:47cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-grilla .ept-w-c18{left:67cqw;top:47cqh;animation-name:ept-w-sel18}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-cuotas .ept-w-boton{left:52cqw;width:43.5cqw;top:70cqh;height:14cqh;animation-name:ept-w-boton3}
/* 4. ¡Listo!: lo que sigue se va tildando. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ok{position:absolute;left:16cqw;top:24cqh;display:grid;place-items:center;width:24cqh;height:24cqh;border-radius:50%;background:#16A34A;color:#fff;animation-name:ept-w-ok}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-ok svg{width:60%;height:60%}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-listo .ept-w-titulo{left:5cqw;width:40cqw;top:56cqh;font-size:6.6cqh;line-height:1.1}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item{position:absolute;left:52cqw;display:flex;align-items:center;gap:2cqw;font-size:4.8cqh;font-weight:700}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item1{top:22cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item2{top:39cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item3{top:56cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item4{top:73cqh}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-punto{display:grid;place-items:center;box-sizing:border-box;width:9cqh;height:9cqh;border:.7cqh solid #CBD5E1;border-radius:50%;color:transparent}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-punto svg{width:62%;height:62%}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item1 .ept-w-punto{animation-name:ept-w-check1}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item2 .ept-w-punto{animation-name:ept-w-check2}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item3 .ept-w-punto{animation-name:ept-w-check3}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-item4 .ept-w-punto{animation-name:ept-w-check4}
/* El dedo y su onda. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-dedo{position:absolute;left:0;top:0;z-index:2;width:7cqh;height:7cqh;margin:-3.5cqh 0 0 -3.5cqh;border:.6cqh solid #fff;border-radius:50%;background:rgba(37,99,235,.55);box-shadow:0 .6cqh 2cqh rgba(15,23,42,.35);animation-name:ept-w-dedo}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-w-dedo::after{content:"";position:absolute;inset:-.6cqh;border-radius:50%;background:rgba(37,99,235,.45);animation:ept-w-onda 16s linear 2.5s infinite both}

/* ── El fondo animado (`assets/temporada-fondo.js`, Grainient de React Bits) ──
   Un degradé con grano en toda la portada, sumado con screen: con colores oscuros solo tiñe,
   no tapa. La máscara deja limpia la escena del banner: en la computadora sigue al lienzo
   (1280x440 contra la derecha), en el celular con la foto de fondo, la parte de abajo. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="fondo"]{position:relative}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="fondo"] > .rh-heroe-texto{position:relative;z-index:1}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-fondo{position:absolute;inset:0;overflow:hidden;pointer-events:none;mix-blend-mode:screen}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-fondo canvas{position:absolute;inset:0;display:block;width:100%;height:100%}
@media (max-width:1023px){
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="arte"] > .ept-fondo{-webkit-mask:radial-gradient(70% 28% at 50% calc(100% - 220px),transparent 50%,#000 100%);mask:radial-gradient(70% 28% at 50% calc(100% - 220px),transparent 50%,#000 100%)}
}
@media (min-width:1024px){
  /* La foto mide alto x (alto * ar) contra la derecha. El fondo tiñe solo afuera del setup (--ept-m*,
     "nitida" de la escena), y entra en degradé sobre la pared de los bordes de la foto: así la escena
     queda sin neblina y la foto no se ve encerrada en un rectángulo (Martín 29/10). */
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="grande"]:not([data-ept-banner~="vivo"]) > .ept-fondo{--ept-izq:calc(100% - max(0px, 50vw - 769px) - var(--ept-alto, 440px) * var(--ept-ar, 2.909) * (1 - var(--ept-mx, .66) + var(--ept-mw, .3) / 2));--ept-der:calc(100% - max(0px, 50vw - 769px) - var(--ept-alto, 440px) * var(--ept-ar, 2.909) * (1 - var(--ept-mx, .66) - var(--ept-mw, .3) / 2));--ept-m:linear-gradient(to right,#000 calc(var(--ept-izq) - 180px),transparent var(--ept-izq),transparent calc(var(--ept-der) - 120px),#000 calc(var(--ept-der) + 100px));--ept-m2:linear-gradient(#000 calc(var(--ept-alto, 440px) * (var(--ept-my, .5) - var(--ept-mh, 1) / 2) - 20px),transparent calc(var(--ept-alto, 440px) * (var(--ept-my, .5) - var(--ept-mh, 1) / 2) + 70px));-webkit-mask:var(--ept-m),var(--ept-m2);-webkit-mask-composite:source-over;mask:var(--ept-m),var(--ept-m2);mask-composite:add}
}

/* Dónde va cada lienzo: sobre la foto que se ve, con su misma posición y tamaño. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-banner-caja{display:block;position:relative;margin-top:10px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-banner-caja .ept-banner-chico{margin-top:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-banner-caja > .ept-lienzo-chica{display:block;inset:0}
@media (max-width:1023px){
  /* La foto de fondo del celular (terminación nueva): la misma regla que `--ept-arte` en muestra.css. */
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="vivo-arte"] > .ept-lienzo-arte{display:block;left:0;right:0;bottom:40px;aspect-ratio:var(--ept-ar)}
}
@media (min-width:1024px){
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-banner-caja{display:none}
  /* Con la portada agrandada por la escena ("alto"), el texto va centrado en el alto de la foto: arriba
     quedaba un hueco grande abajo de las garantías (Martín 29/10). 270px es lo que mide el texto. */
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="alto"] > .rh-heroe-texto{padding-top:max(60px, calc((var(--ept-alto, 440px) - 270px) / 2))}
  /* Con lienzo, la foto va en él y no de fondo de la portada: así queda por encima del fondo animado,
     que se ve alrededor y por sus bordes transparentes, y nunca encima de la PC (Martín 29/10). */
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="vivo"]{background-image:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="vivo"] > .ept-lienzo-grande{display:block;top:0;right:max(0px, calc(50vw - 769px));width:calc(var(--ept-alto, 440px) * var(--ept-ar));height:var(--ept-alto, 440px);background:var(--ept-foto) 0 0/100% 100% no-repeat}
}

@keyframes ept-late{0%,100%{opacity:.14}50%{opacity:.38}}
/* Un neón que se prende: dos amagues y queda. La capa es el cartel apagado: 1 = apagado. */
@keyframes ept-prender{0%{opacity:1}18%{opacity:.3}22%{opacity:1}40%{opacity:.1}45%{opacity:.85}53%{opacity:0}60%{opacity:.45}64%,100%{opacity:0}}
/* Un tubo gastado: una décima de segundo, dos veces seguidas, cada 12s (la primera, a los 8s). */
@keyframes ept-zumbido-entra{0%{opacity:0}100%{opacity:.25}}
@keyframes ept-zumbido{0%,100%{opacity:.25}45%{opacity:.62}52%{opacity:.5}60%{opacity:.6}}
@keyframes ept-falla{0%,90%,100%{opacity:0}90.6%{opacity:.85}91.2%{opacity:.1}91.8%{opacity:.7}92.5%{opacity:0}}
/* La compra, en % de 16s. Los toques: tarjeta 16.25, 32GB 32.5, comprar 42.5, tarjeta 53.75,
   18 cuotas 60 y confirmar 67.5. Las pantallas: 1 (0-25), 2 (25-48), 3 (48-72) y 4 (72-97). */
@keyframes ept-w-paso1{0%,24%{--ept-act:1;--ept-hecho:0}26.5%,97%{--ept-act:0;--ept-hecho:1}99.5%,100%{--ept-act:1;--ept-hecho:0}}
@keyframes ept-w-paso2{0%,24%{--ept-act:0;--ept-hecho:0}26.5%,46%{--ept-act:1;--ept-hecho:0}48.5%,97%{--ept-act:0;--ept-hecho:1}99.5%,100%{--ept-act:0;--ept-hecho:0}}
@keyframes ept-w-paso3{0%,47%{--ept-act:0;--ept-hecho:0}49.5%,71%{--ept-act:1;--ept-hecho:0}73.5%,97%{--ept-act:0;--ept-hecho:1}99.5%,100%{--ept-act:0;--ept-hecho:0}}
@keyframes ept-w-paso4{0%,71%{--ept-act:0;--ept-hecho:0}73.5%,97%{--ept-act:1;--ept-hecho:0}99.5%,100%{--ept-act:0;--ept-hecho:0}}
/* Cada pantalla llega frenando, se acerca despacio mientras se lee y se va rápido. La 1 se va
   creciendo hacia la tarjeta tocada: la selección se vuelve la ficha. */
@keyframes ept-w-esc1{0%{opacity:1;transform:scale(1)}20%{opacity:1;transform:scale(1.05)}25%{opacity:0;transform:scale(1.45)}97%{opacity:0;transform:scale(.96)}100%{opacity:1;transform:scale(1)}}
@keyframes ept-w-esc2{0%,23%{opacity:0;transform:scale(.9)}27.5%{opacity:1;transform:scale(1)}45%{opacity:1;transform:scale(1.05)}48.5%,100%{opacity:0;transform:scale(1.12)}}
@keyframes ept-w-esc3{0%,46.5%{opacity:0;transform:scale(.92)}50.5%{opacity:1;transform:scale(1)}69.5%{opacity:1;transform:scale(1.04)}72.5%,100%{opacity:0;transform:scale(1.1)}}
@keyframes ept-w-esc4{0%,71%{opacity:0;transform:scale(.92)}75%{opacity:1;transform:scale(1)}95%{opacity:1;transform:scale(1.04)}98%,100%{opacity:0;transform:scale(1.04)}}
@keyframes ept-w-tocada{0%,16%{border-color:#E2E8F0;box-shadow:none}17.5%,25%{border-color:#2563EB;box-shadow:0 0 0 .8cqh rgba(37,99,235,.18)}26%,100%{border-color:#E2E8F0;box-shadow:none}}
@keyframes ept-w-sel16{0%,32.6%{border-color:#2563EB;background:#EFF6FF}33.6%,48%{border-color:#CBD5E1;background:#fff}49%,100%{border-color:#2563EB;background:#EFF6FF}}
@keyframes ept-w-sel32{0%,32.6%{border-color:#CBD5E1;background:#fff;transform:none}33.2%{transform:scale(.92)}34%,48%{border-color:#2563EB;background:#EFF6FF;transform:none}49%,100%{border-color:#CBD5E1;background:#fff}}
@keyframes ept-w-boton2{0%,42.3%{transform:none;filter:none}42.8%,43.6%{transform:scale(.95);filter:brightness(.82)}44.6%,100%{transform:none;filter:none}}
@keyframes ept-w-transfer{0%,53.6%{border-color:#2563EB;background:#EFF6FF}54.4%,100%{border-color:#CBD5E1;background:#fff}}
@keyframes ept-w-tarjeta{0%,53.6%{border-color:#CBD5E1;background:#fff;transform:none}54%{transform:scale(.96)}54.6%,72%{border-color:#2563EB;background:#EFF6FF;transform:none}73%,100%{border-color:#CBD5E1;background:#fff}}
@keyframes ept-w-cuotas{0%,54.4%{opacity:0;transform:translateX(4cqw)}56.5%,100%{opacity:1;transform:none}}
@keyframes ept-w-sel18{0%,59.8%{border-color:#CBD5E1;background:#fff;color:#0F172A;transform:none}60.3%{transform:scale(.92)}61%,72%{border-color:#2563EB;background:#2563EB;color:#fff;transform:none}73%,100%{border-color:#CBD5E1;background:#fff;color:#0F172A}}
@keyframes ept-w-boton3{0%,67.3%{transform:none;filter:none}67.8%,68.6%{transform:scale(.96);filter:brightness(.82)}69.6%,100%{transform:none;filter:none}}
@keyframes ept-w-ok{0%,74%{transform:scale(.3)}77%{transform:scale(1.12)}79%,100%{transform:none}}
@keyframes ept-w-check1{0%,77%{border-color:#CBD5E1;background:#fff;color:transparent}78%,100%{border-color:#2563EB;background:#2563EB;color:#fff}}
@keyframes ept-w-check2{0%,81.3%{border-color:#CBD5E1;background:#fff;color:transparent}82.3%,100%{border-color:#2563EB;background:#2563EB;color:#fff}}
@keyframes ept-w-check3{0%,85.6%{border-color:#CBD5E1;background:#fff;color:transparent}86.6%,100%{border-color:#2563EB;background:#2563EB;color:#fff}}
@keyframes ept-w-check4{0%,90%{border-color:#CBD5E1;background:#fff;color:transparent}91%,100%{border-color:#2563EB;background:#2563EB;color:#fff}}
/* El dedo: llega frenando a cada toque y espera ahí; desaparece con "¡Listo!". */
@keyframes ept-w-dedo{0%,7%{opacity:0;transform:translate(62cqw,90cqh)}9%{opacity:1;transform:translate(56cqw,84cqh)}14%,19%{opacity:1;transform:translate(19cqw,62cqh)}29.5%,35%{transform:translate(69.5cqw,59cqh)}40%,45%{transform:translate(70cqw,81cqh)}51%,55.5%{transform:translate(26.5cqw,65cqh)}58.5%,62%{transform:translate(74cqw,53.5cqh)}65.5%,69.5%{opacity:1;transform:translate(74cqw,77cqh)}72.5%,100%{opacity:0;transform:translate(74cqw,77cqh)}}
@keyframes ept-w-onda{0%,16%{opacity:0;transform:scale(.5)}16.4%{opacity:.8;transform:scale(.8)}18.6%,32.2%{opacity:0;transform:scale(3)}32.6%{opacity:.8;transform:scale(.8)}34.8%,42.2%{opacity:0;transform:scale(3)}42.6%{opacity:.8;transform:scale(.8)}44.8%,53.4%{opacity:0;transform:scale(3)}53.8%{opacity:.8;transform:scale(.8)}56%,59.7%{opacity:0;transform:scale(3)}60.1%{opacity:.8;transform:scale(.8)}62.3%,67.2%{opacity:0;transform:scale(3)}67.6%{opacity:.8;transform:scale(.8)}69.8%,100%{opacity:0;transform:scale(3)}}
@media (prefers-reduced-motion:reduce){
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-lienzo .ept-palabra,
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-lienzo .ept-letra,
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-lienzo .ept-w-dedo{display:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-lienzo .ept-zumbido,
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-lienzo .ept-web *{animation:none}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-lienzo .ept-w-esc1{opacity:1}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-lienzo .ept-w-paso1{--ept-act:1}
}

/* ── La escena 3D (`assets/escena3d.js`, Cyber Monday, Martín 29/10) ──
   Computadora: a la derecha del texto (que termina en 50% + 95px), del alto de la portada.
   Celular: debajo del texto. Hasta que dibuja el primer cuadro se ve la imagen fija del panel. */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="tresd"]{position:relative;background:#0C182C}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="tresd"] > .rh-heroe-texto{position:relative;z-index:1}
/* Celular: la escena justo debajo del texto, con la proporción de la escena armada (la de la imagen fija). */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="tresd"] > .rh-heroe-texto{padding-bottom:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d{position:relative;display:block;width:100%;aspect-ratio:1600/1360;margin:4px 0 54px}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-poster,
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-lienzo{position:absolute;inset:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-poster img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;transition:opacity .6s ease}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-lista .ept-3d-poster img{opacity:0}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-rgb{position:absolute;right:12px;bottom:10px;z-index:2;display:flex;gap:6px;padding:5px 7px;border-radius:99px;background:rgba(12,24,44,.55);opacity:0;pointer-events:none;transition:opacity .4s ease .8s}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-lista .ept-3d-rgb{opacity:1;pointer-events:auto}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-rgb-c{width:18px;height:18px;padding:0;border:2px solid rgba(255,255,255,.35);border-radius:50%;background:var(--c);cursor:pointer}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-rgb-c[data-color="auto"]{background:conic-gradient(#22E1FF,#8B5CF6,#FF3EC8,#F97316,#22C55E,#22E1FF)}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-rgb-c[aria-pressed="true"]{border-color:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.25)}
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-rgb-c:focus-visible{outline:2px solid #fff;outline-offset:2px}
/* El crédito del modelo queda en el HTML pero no se ve: el autor lo autorizó (Martín 29/10). */
body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-credito{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
@media (min-width:1024px){
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="tresd"]{min-height:calc(var(--ept-alto, 440px) + 70px)}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .rh-heroe[data-ept-banner~="tresd"] > .rh-heroe-texto{padding-bottom:110px}
  /* La habitación entera: la escena ocupa toda la portada, detrás del texto, y el setup queda a su
     derecha (lo calcula escena3d.js). La imagen fija sigue a la derecha del texto, y un velo oscuro
     detrás del texto lo deja leer sobre la pared (Martín 29/10). */
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d{position:absolute;top:0;left:0;right:0;width:auto;height:var(--ept-alto, 440px);aspect-ratio:auto;margin:0}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-poster{left:calc(50% + 115px)}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d-poster img{object-position:left bottom}
  body.eph-recorrido.eph-recorrido.eph-recorrido.eph-temporada .ept-3d::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 760px 420px at calc(50% - 250px) 50%,rgba(8,10,28,.62),rgba(8,10,28,0) 72%)}
}