/* ============================================================
   SECCIONES NUEVAS (no clonadas): precios con cuotas + wizard/checkout.
   El mapa vive en site.css junto a los tokens de identidad.
   ============================================================ */

/* ---------- Precios con desplegable de cuotas ---------- */
/* auto-fit y no un breakpoint de viewport: en la página de un curso la grilla
   vive en la columna angosta del cuerpo, así que a 1024 px se daban de frente
   el cuerpo a dos columnas (≥1000) y los precios a tres (≥900), y el panel de
   inscripción se salía 41 px de la pantalla. Con auto-fit la cantidad de
   columnas la decide el ancho real del contenedor. */
.tiers{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.tier{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--linea);
  border-radius:16px;padding:1.7rem 1.5rem 1.4rem;transition:border-color .2s,box-shadow .2s,transform .2s}
.tier:hover{border-color:#e0cdd2;box-shadow:var(--sh-md);transform:translateY(-2px)}
.tier.hot{border-color:var(--bordo);box-shadow:0 0 0 1px var(--bordo)}
.tier .flag-hot{position:absolute;top:-.72rem;left:1.5rem;background:var(--bordo);color:#fff;font-size:.66rem;
  font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:.25rem .65rem;border-radius:999px}
.tier h3{font-size:1.05rem}
.tier .sub{font-size:.81rem;color:var(--tinta-3);margin-top:.2rem}

.price-box{margin:1.3rem 0 .1rem}
.price-main{position:relative;display:inline-block;font-size:2.4rem;font-weight:700;letter-spacing:-.035em;
  transition:font-size .3s cubic-bezier(.2,.8,.3,1),color .3s,opacity .3s}
/* tachado DIBUJADO (una línea que crece), no text-decoration */
.price-main .strike{position:absolute;left:-3%;top:53%;height:3px;width:106%;border-radius:2px;
  background:var(--bordo);transform:scaleX(0);transform-origin:left center;
  transition:transform .36s cubic-bezier(.65,0,.35,1)}
/* El tachado se diseñó para el modelo viejo, cuando las cuotas eran "sin
   interés" y total/n era la misma plata repartida. Con recargo, tachar el
   pago total —que es la opción MÁS BARATA— hacía ver la financiación como una
   oferta. Ahora el precio de contado queda a la vista, sin tachar, como
   referencia de comparación. */
.tier.split .price-main{font-size:1.25rem;color:var(--tinta-3);font-weight:600}
.tier.split .price-main .strike{transform:scaleX(0)}
.price-ref{display:none;font-size:.74rem;color:var(--tinta-3);letter-spacing:.04em;
  text-transform:uppercase;font-weight:700;margin-bottom:.15rem}
.tier.split .price-ref{display:block}
.price-recargo{display:block;font-size:.78rem;color:var(--tinta-3);margin-top:.25rem}
.price-cuota{display:block;overflow:hidden;max-height:0;opacity:0;transform:translateY(-10px);
  transition:max-height .36s ease,opacity .26s ease .07s,transform .32s cubic-bezier(.2,.8,.3,1) .07s}
.tier.split .price-cuota{max-height:130px;opacity:1;transform:none}
.price-cuota b{display:block;font-size:2.4rem;font-weight:700;letter-spacing:-.035em;color:var(--bordo)}
.price-cuota span{font-size:.85rem;color:var(--tinta-2)}
.tier .per{font-size:.81rem;color:var(--tinta-3);margin-top:.15rem}
.tier.split .per{display:none}   /* redundante con "x N cuotas sin interés" */

.acc{margin-top:1.2rem;border-top:1px solid var(--linea);padding-top:1rem}
.acc-btn{display:flex;width:100%;align-items:center;gap:.5rem;font-size:.87rem;color:var(--tinta-2);font-weight:600}
.acc-btn:hover{color:var(--bordo)}
.acc-btn .ar{margin-left:auto;transition:transform .25s;color:var(--tinta-3)}
.acc-btn[aria-expanded=true] .ar{transform:rotate(180deg)}
.acc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
.acc-btn[aria-expanded=true]+.acc-body{grid-template-rows:1fr}
.acc-body>div{overflow:hidden}
.opts{display:flex;flex-wrap:wrap;gap:.4rem;padding-top:.9rem}
.opt{padding:.45rem .85rem;border:1px solid var(--linea);border-radius:999px;font-size:.83rem;
  color:var(--tinta-2);transition:.16s}
.opt:hover{border-color:var(--bordo);color:var(--bordo)}
.opt.act{background:var(--bordo);border-color:var(--bordo);color:#fff;font-weight:600}
.tier .btn{margin-top:1.4rem;width:100%}

/* ---------- Wizard de inscripción + checkout ---------- */
.ov{position:fixed;inset:0;z-index:80;background:rgba(20,16,17,.55);backdrop-filter:blur(5px);
  display:flex;align-items:center;justify-content:center;padding:1rem;opacity:0;pointer-events:none;
  transition:opacity .22s}
.ov.show{opacity:1;pointer-events:auto}
.wz{width:min(580px,100%);max-height:min(92vh,780px);display:flex;flex-direction:column;background:#fff;
  border-radius:18px;box-shadow:0 30px 80px -20px rgba(20,16,17,.5);overflow:hidden;
  transform:translateY(16px) scale(.985);transition:transform .26s cubic-bezier(.2,.8,.3,1)}
.ov.show .wz{transform:none}
@media(max-width:640px){
  .ov{padding:0}
  .wz{width:100%;height:100%;max-height:100%;border-radius:0}
}
.wz-top{padding:1.05rem 1.2rem .9rem;border-bottom:1px solid var(--linea)}
.wz-top .row{display:flex;align-items:center;gap:.75rem}
.wz-top .step{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3);font-weight:700}
.wz-top .x{margin-left:auto;width:32px;height:32px;border-radius:9px;color:var(--tinta-2);font-size:1.05rem;
  display:grid;place-items:center}
.wz-top .x:hover{background:var(--bordo-050);color:var(--bordo)}
.bar{height:4px;border-radius:99px;background:var(--linea);margin-top:.8rem;overflow:hidden}
.bar i{display:block;height:100%;background:var(--bordo);transition:width .35s cubic-bezier(.2,.8,.3,1)}

.wz-body{flex:1;overflow-y:auto;padding:1.5rem 1.2rem 1.3rem}
.pane{animation:pIn .26s cubic-bezier(.2,.8,.3,1)}
.pane.atras{animation-name:pBack}
@keyframes pIn{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes pBack{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.pane h3{font-size:1.35rem;margin-bottom:.3rem}
.pane .hint{font-size:.86rem;color:var(--tinta-3);margin-bottom:1.2rem}

.grid{display:grid;gap:.55rem;grid-template-columns:repeat(auto-fill,minmax(158px,1fr))}
.pick{display:flex;align-items:center;gap:.65rem;text-align:left;padding:.85rem .9rem;border-radius:11px;
  border:1px solid var(--linea);background:#fff;font-weight:600;font-size:.93rem;transition:.15s}
.pick:hover{border-color:var(--bordo);background:var(--bordo-050);transform:translateY(-1px)}
.pick.act{border-color:var(--bordo);background:var(--bordo-050);box-shadow:inset 0 0 0 1px var(--bordo)}
.pick img{width:24px;height:18px;object-fit:cover;border-radius:2px;flex:none;
  box-shadow:0 0 0 1px rgba(20,16,17,.1)}
.pick .mini{display:block;font-size:.74rem;color:var(--tinta-3);font-weight:400;margin-top:.1rem}

.fields{display:grid;gap:.85rem;grid-template-columns:1fr 1fr}
.fields .full{grid-column:1/-1}
.resume{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.2rem}
.tag{font-size:.75rem;padding:.3rem .65rem;border-radius:999px;background:var(--bordo-050);
  border:1px solid #f0dde1;color:var(--bordo);font-weight:600}
.wz .legal{display:flex;gap:.6rem;align-items:flex-start;margin-top:1.1rem;font-size:.82rem;color:var(--tinta-2)}
.wz .legal input{width:18px;height:18px;flex:none;margin-top:.15rem;accent-color:var(--bordo)}
.wz .legal a{color:var(--bordo);text-decoration:underline}
.wz-foot{display:flex;align-items:center;gap:.7rem;padding:.95rem 1.2rem;border-top:1px solid var(--linea);
  background:#fcfafa;box-shadow:0 -14px 18px -14px rgba(20,16,17,.22)}
.wz-foot .back{font-size:.9rem;color:var(--tinta-2);padding:.55rem .2rem}
.wz-foot .back:hover{color:var(--bordo)}
.wz-foot .btn{margin-left:auto}
.btn[disabled]{opacity:.42;pointer-events:none}

/* ---------- Paso de pago ---------- */
.chk-sim{display:flex;align-items:center;gap:.55rem;background:#FFF8E6;border:1px solid #F2DFAE;
  color:#7a5a12;border-radius:10px;padding:.65rem .8rem;font-size:.8rem;margin-bottom:1.2rem;line-height:1.4}
.chk-tot{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;
  border:1px solid var(--linea);border-radius:12px;background:var(--bordo-050);margin-bottom:1.2rem}
.chk-tot .lbl{font-size:.8rem;color:var(--tinta-2)}
.chk-tot .val{font-size:1.5rem;font-weight:700;letter-spacing:-.03em;color:var(--bordo);text-align:right}
.chk-tot .val small{display:block;font-size:.72rem;font-weight:400;color:var(--tinta-3);letter-spacing:0}

/* Detalle de lo que se está comprando, debajo del total del checkout. */
.chk-detalle{list-style:none;margin:-.7rem 0 1.2rem;padding:0;display:grid;gap:.55rem}
.chk-detalle li{display:flex;gap:.6rem;align-items:flex-start;
  font-size:.82rem;line-height:1.45;color:var(--tinta-2)}
.chk-detalle b{color:var(--tinta);font-weight:600}
.chk-ico{flex:none;width:20px;height:20px;margin-top:.1rem;border-radius:6px;
  background:var(--bordo-050);background-repeat:no-repeat;background-position:center;
  background-size:13px 13px}
.chk-ico-calendario{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23A31235' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='2.5' y='4' width='15' height='13.5' rx='2.5'/%3E%3Cpath d='M2.5 8h15M6.5 2.5v3M13.5 2.5v3'/%3E%3C/svg%3E")}
.chk-ico-reloj{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23A31235' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='10' cy='10' r='7.5'/%3E%3Cpath d='M10 5.5V10l3 2'/%3E%3C/svg%3E")}
.chk-ico-sello{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23A31235' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='7.5' r='5'/%3E%3Cpath d='M6.5 11.5 5 18l5-2.2L15 18l-1.5-6.5'/%3E%3C/svg%3E")}

.card-in{position:relative}
.card-in .marca{position:absolute;right:.75rem;top:2.1rem;font-size:.68rem;font-weight:700;
  letter-spacing:.06em;color:var(--tinta-3);text-transform:uppercase}
input.bad{border-color:#c0392b;box-shadow:0 0 0 3px rgba(192,57,43,.1)}
.err{display:none;font-size:.74rem;color:#c0392b;margin-top:.3rem}
input.bad~.err{display:block}

.done{text-align:center;padding:1.5rem 0}
.done .ok{width:62px;height:62px;margin:0 auto 1.1rem;border-radius:50%;display:grid;place-items:center;
  background:var(--bordo-050);color:var(--bordo);font-size:1.8rem;
  animation:okPop .45s cubic-bezier(.2,1.5,.4,1) backwards}
@keyframes okPop{from{transform:scale(.4);opacity:0}}
.done pre{margin-top:1.2rem;text-align:left;background:#fbf9f9;border:1px solid var(--linea);border-radius:10px;
  padding:.9rem;font-size:.72rem;color:var(--tinta-2);overflow-x:auto;max-height:180px;line-height:1.5}

/* ---------- pago por transferencia (assets/pago.js) ----------
   Lo usan el último paso del wizard y el bloque "Cómo se paga" de aranceles. */
.pg-monto { font-size: .88rem; color: var(--tinta-2); margin: 1.1rem 0 .6rem }
.pg-monto b { color: var(--tinta); font-weight: 700 }

.pg-cuenta { border: 1px solid var(--linea); border-radius: 12px; overflow: hidden; background: #fff }
.pg-fila {
  display: grid; grid-template-columns: 104px 1fr auto; align-items: center;
  gap: .5rem .8rem; padding: .62rem .8rem;
}
.pg-fila + .pg-fila { border-top: 1px solid var(--linea) }
/* CBU y alias son los dos que la gente realmente copia */
.pg-fila.fuerte { background: var(--bordo-050) }
.pg-lb { font-size: .7rem; letter-spacing: .09em; text-transform: uppercase; color: var(--tinta-3); font-weight: 700 }
.pg-val { font-size: .88rem; font-weight: 600; letter-spacing: -.01em; overflow-wrap: anywhere }
.pg-fila.fuerte .pg-val { font-variant-numeric: tabular-nums }

.pg-copiar {
  font-size: .72rem; font-weight: 700; color: var(--bordo); cursor: pointer;
  border: 1px solid var(--linea); background: #fff; border-radius: 8px;
  padding: .34rem .6rem; white-space: nowrap; transition: .16s;
}
.pg-copiar:hover { border-color: var(--bordo); background: var(--bordo); color: #fff }
.pg-copiar.ok { border-color: #1a7f4b; background: #1a7f4b; color: #fff }

/* ---------- adjunto del comprobante ---------- */
.pg-adjunto { margin-top: 1.1rem }
/* va con `label.` porque site.css declara `.wz label{display:block}` y con
   sólo `.pg-drop` ganaba esa: el título y la bajada quedaban en un renglón */
label.pg-drop {
  display: grid; justify-items: center; text-align: center; gap: .2rem;
  padding: 1.25rem 1rem; margin-bottom: 0; cursor: pointer;
  border: 1.5px dashed #d9cbcf; border-radius: 12px; background: #fdfbfb;
  transition: border-color .18s, background .18s;
}
label.pg-drop:hover, label.pg-drop.sobre { border-color: var(--bordo); background: var(--bordo-050) }
label.pg-drop:focus-within { outline: 2px solid var(--bordo); outline-offset: 2px }
.pg-ico {
  width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center;
  background: var(--bordo-050); color: var(--bordo); margin-bottom: .35rem;
}
.pg-ico svg { width: 19px; height: 19px }
.pg-drop-t { font-size: .89rem; font-weight: 700; letter-spacing: -.01em }
.pg-drop-s { font-size: .75rem; color: var(--tinta-3); line-height: 1.4 }

/* el `display:flex` de la clase le gana al [hidden] del navegador, así que
   sin esta línea la fila se veía vacía antes de elegir el archivo */
.pg-archivo[hidden] { display: none }
.pg-archivo {
  display: flex; align-items: center; gap: .55rem; margin-top: .6rem;
  padding: .6rem .75rem; border-radius: 10px; background: #F1F8F3; border: 1px solid #CFE5D8;
  font-size: .82rem;
}
.pg-ok {
  width: 20px; height: 20px; flex: none; border-radius: 50%; display: grid; place-items: center;
  background: #1a7f4b; color: #fff; font-size: .7rem; font-weight: 700;
}
.pg-nom { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.pg-peso { color: var(--tinta-3); flex: none }
.pg-quitar {
  margin-left: auto; flex: none; font-size: .75rem; font-weight: 700; color: var(--bordo);
  cursor: pointer; text-decoration: underline; padding: .2rem;
}
.pg-err { font-size: .76rem; color: #c0392b; margin-top: .45rem }
.pg-err:empty { display: none }

/* ---------- bloque "Cómo se paga", en aranceles ---------- */
.pg-pasos ol { margin: 0 0 1.1rem; padding-left: 1.15rem; display: grid; gap: .4rem }
.pg-pasos li { font-size: .89rem; color: var(--tinta-2); line-height: 1.5 }
.pg-pasos li::marker { color: var(--bordo); font-weight: 700 }
.pg-nota { margin-top: .7rem; font-size: .78rem; color: var(--tinta-3) }

@media (max-width: 700px) {
  /* a 360 px la etiqueta y el valor no entran en la misma línea */
  .pg-fila { grid-template-columns: 1fr auto; gap: .15rem .6rem }
  .pg-lb { grid-column: 1 / -1 }
  label.pg-drop { padding: 1.1rem .85rem }
  /* copiar el CBU es la acción principal de esta pantalla en el celular */
  .pg-copiar { min-height: 36px; padding: .4rem .8rem }
}

/* ---------- paso de pago: medio único y salidas alternativas ---------- */
.pg-medio {
  margin-top: 1.1rem; padding: .7rem .85rem; border-radius: 10px;
  background: var(--bordo-050); border: 1px solid #F0DCE1;
  font-size: .84rem; color: var(--tinta-2); line-height: 1.45;
}
.pg-medio b { color: var(--tinta) }
.pg-monto { margin: .9rem 0 .6rem }

/* La salida de quien no puede pagar ahora: escribirnos. Reemplaza al botón de
   "reservar sin comprobante", que registraba inscripciones que nadie podía
   conciliar. Se ve, pero no compite con el botón principal. */
.pg-consulta {
  display: block; width: 100%; margin-top: .6rem; padding: .3rem;
  background: none; font-size: .8rem; color: var(--bordo);
  text-decoration: underline; cursor: pointer; text-align: center;
}
.pg-consulta:hover { color: var(--bordo-800) }
.pg-consulta:disabled { opacity: .45; cursor: default; text-decoration: none }

/* El adjunto de Mercado Pago aparece recién después de abrir el link de pago. */
.pg-mp-adjunto { margin-top: 1rem; animation: pg-aparece .28s ease both }
@keyframes pg-aparece { from { opacity: 0; transform: translateY(-6px) } to { opacity: 1; transform: none } }

/* ---------- formulario de prueba de nivel (assets/consulta.js) ----------
   No reusa `.form` de site.css a propósito: esa regla es `max-width:720px;
   margin:0 auto`, así que el formulario se centraba solo dentro del wrap
   mientras el título quedaba pegado al borde. Acá el ancho lo fija la caja y
   encabezado y campos comparten el mismo borde izquierdo. */
.cs-caja {
  max-width: 720px; margin-inline: auto;
  background: #fff; border: 1px solid var(--linea); border-radius: 18px;
  padding: 2rem 2.1rem 2.2rem; box-shadow: var(--sh-md);
}
.cs-head { margin-bottom: 1.6rem }
.cs-head h2 { font-size: clamp(1.35rem, 2.4vw, 1.75rem); letter-spacing: -.02em; margin-bottom: .5rem }
.cs-head p { color: var(--tinta-2); font-size: .95rem; line-height: 1.6 }

.cs-form { display: grid; gap: 1rem; grid-template-columns: 1fr 1fr }
.cs-form > .full { grid-column: 1 / -1 }
@media (max-width: 620px) { .cs-form { grid-template-columns: 1fr } }

.cs-campo label {
  display: block; font-size: .78rem; color: var(--tinta-2);
  margin-bottom: .35rem; font-weight: 600;
}
.cs-campo input, .cs-campo select, .cs-campo textarea {
  width: 100%; font: inherit; font-size: .92rem; color: var(--tinta);
  background: #fff; border: 1px solid var(--linea); border-radius: 10px;
  padding: .68rem .8rem; transition: border-color .16s, box-shadow .16s;
}
.cs-campo textarea { resize: vertical; min-height: 84px }
.cs-campo input:focus, .cs-campo select:focus, .cs-campo textarea:focus {
  outline: none; border-color: var(--bordo); box-shadow: 0 0 0 3px rgba(163, 18, 53, .12);
}

.cs-ayuda { font-size: .74rem; color: var(--tinta-3); margin-top: .3rem; line-height: 1.35 }
.cs-opt { color: var(--tinta-3); font-weight: 400 }
.cs-err { font-size: .76rem; color: #c0392b; margin-top: .3rem; line-height: 1.35 }
.cs-err:empty { display: none }
.cs-form input.bad, .cs-form textarea.bad { border-color: #c0392b }

/* fuera de pantalla y no `display:none`: algunos bots ignoran lo oculto */
.cs-trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden }

.cs-legal { display: flex; gap: .6rem; align-items: flex-start; font-size: .85rem; color: var(--tinta-2) }
.cs-legal input { width: 18px; height: 18px; flex: none; margin-top: .1rem; accent-color: var(--bordo) }
.cs-legal a { color: var(--bordo); text-decoration: underline }

.cs-envio { display: grid; gap: .8rem; justify-items: start; margin-top: .4rem }
.cs-plazo { font-size: .78rem; color: var(--tinta-3); line-height: 1.5 }

/* ---------- confirmación, en lugar del alert() ---------- */
.cs-ok { text-align: center }
.cs-ok-tic {
  width: 52px; height: 52px; margin: 0 auto 1.1rem; border-radius: 50%;
  display: grid; place-items: center; font-size: 1.5rem; font-weight: 700;
  background: #E8F5ED; color: #1a7f4b;
}
.cs-ok h2 { margin-bottom: .6rem }
.cs-ok > p { color: var(--tinta-2); max-width: 52ch; margin: 0 auto .5rem; line-height: 1.6 }
.cs-ok-sub { font-size: .88rem; color: var(--tinta-3) }
.cs-ok-cta { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; margin-top: 1.5rem }

@media (max-width: 700px) {
  .cs-caja { padding: 1.5rem 1.25rem 1.6rem; border-radius: 14px }
  .cs-envio { justify-items: stretch }
  .cs-envio .btn { width: 100% }
  .cs-ok-cta { flex-direction: column }
  .cs-ok-cta .btn { width: 100% }
}

/* ---------- elegir medio de pago (transferencia / Mercado Pago) ----------
   Sólo aparece cuando hay links de Mercado Pago cargados; con un solo medio
   se muestra directo la transferencia y no se hace elegir al pedo. */
.pg-medios { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin: 1.1rem 0 .3rem }
.pg-medio-op {
  display: grid; justify-items: start; gap: .12rem; text-align: left; cursor: pointer;
  padding: .8rem .9rem; border-radius: 12px; background: #fff;
  border: 1.5px solid var(--linea); transition: border-color .16s, box-shadow .16s;
}
.pg-medio-op:hover { border-color: #e0c8ce }
.pg-medio-op.act { border-color: var(--bordo); box-shadow: 0 0 0 3px rgba(163, 18, 53, .1) }
.pg-medio-n { font-size: .9rem; font-weight: 700; letter-spacing: -.01em }
.pg-medio-d { font-size: .74rem; color: var(--tinta-3); line-height: 1.35 }
.pg-ico-banco {
  width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center;
  background: var(--bordo-050); color: var(--bordo); margin-bottom: .3rem;
}
.pg-ico-banco svg { width: 17px; height: 17px }
img.mp-logo { width: 46px; height: auto; display: block; margin-bottom: .3rem }

/* ---------- panel de Mercado Pago ---------- */
.pg-mp-caja {
  border: 1px solid var(--linea); border-radius: 12px; background: #F5FBFE;
  padding: 1rem 1.1rem; margin-top: .3rem;
}
.pg-mp-caja img.mp-logo { width: 62px; height: auto; margin-bottom: .5rem }
.pg-mp-caja p { font-size: .87rem; color: var(--tinta-2); line-height: 1.55 }
.pg-mp-caja .pg-nota { margin-top: .5rem }
/* hasta aceptar los términos, el botón de ir a pagar se ve apagado */
.pg-ir-off { opacity: .45; pointer-events: none }

/* ---------- medios en la sección de aranceles ---------- */
.pg-intro { font-size: .9rem; color: var(--tinta-2); line-height: 1.6; margin-bottom: 1.1rem }
.pg-medio + .pg-medio { margin-top: 1.4rem }
.pg-medio-t { display: flex; align-items: center; gap: .6rem; margin-bottom: .8rem }
.pg-medio-t b { font-size: 1rem; letter-spacing: -.015em }
.pg-medio-t .pg-ico-banco, .pg-medio-t img.mp-logo { margin-bottom: 0 }
.pg-medio-mp p { font-size: .89rem; color: var(--tinta-2); line-height: 1.6 }

@media (max-width: 560px) {
  .pg-medios { grid-template-columns: 1fr }
}

/* acceso directo al formulario oficial de prueba de nivel */
.cs-directo {
  font-size: .86rem; color: var(--tinta-2); line-height: 1.55;
  background: var(--bordo-050); border-radius: 10px; padding: .8rem .9rem;
}
.cs-directo a { color: var(--bordo); font-weight: 600; text-decoration: underline }

/* aviso cuando el envío del formulario falla */
.cs-falla {
  font-size: .85rem; line-height: 1.55; color: #8a2331;
  background: #FDF2F3; border: 1px solid #F0D4D8; border-radius: 10px;
  padding: .8rem .9rem; margin-bottom: .2rem;
}
.cs-falla a { color: var(--bordo); font-weight: 600; text-decoration: underline }

/* aviso de fallo dentro del wizard */
.wz-falla {
  margin-top: 1rem; font-size: .85rem; line-height: 1.55; color: #8a2331;
  background: #FDF2F3; border: 1px solid #F0D4D8; border-radius: 10px; padding: .8rem .9rem;
}
.wz-falla a { color: var(--bordo); font-weight: 600; text-decoration: underline }

/* Nada puede taparle los controles al modal de inscripción mientras está
   abierto. El aviso de cookies tiene z-index 90 contra el 80 del modal, así
   que en mobile le comía 71 px del pie: justo donde está el botón de enviar.
   Los dos vuelven al cerrar, y hasta que no se acepte no se mide nada. */
body.wz-abierto .wa,
body.wz-abierto .ck { display: none }