/* Inscripción · Gran Aniversario 80 años · IM Nº 11
   Identidad de la landing: verdes, dorados y crema; Cinzel, Playfair Display itálica y Cormorant Garamond.
   Pensado primero para el celular y para leer sin anteojos: letras grandes y botones grandes.
   Todo texto que informa algo va en 16 px o más; lo más chico queda solo para adornos. */

:root{
  color-scheme:only light; /* el modo oscuro forzado del navegador no oscurece la página */
  --n0:#050f0a;--v0:#071d14;--v1:#0b2a1c;--v2:#123d29;--v3:#1b5a3c;--v4:#0b2e1f;
  --o0:#fff3cf;--o1:#f3dd9b;--o2:#d4ad5a;--o3:#a67c2e;--o4:#6e5018;--oro:#c9a24e;
  --c0:#fbf6e9;--c1:#f2e7cb;--c2:#fffdf6;
  --tinta:#13301f;--tinta2:#3b5546;--mu:#cbbd96;--li:rgba(212,173,90,.28);
  --error:#9b1c1c;--error-bg:#fdf0ee;--ok:#1e5631;
  --borde:#a68a4c;
  --r:22px;--ease:cubic-bezier(.2,.7,.2,1);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
}
*,*:before,*:after{box-sizing:border-box}
*{margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-height:100vh;background:radial-gradient(120% 55% at 50% 0%,rgba(27,90,60,.55),rgba(7,29,20,0) 62%),var(--v0);background-color:var(--v0);color:#efe4c4;font-family:var(--serif);font-size:21px;font-weight:500;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;font-variant-numeric:lining-nums;-webkit-font-feature-settings:'lnum' 1;font-feature-settings:'lnum' 1}
img,svg{display:block;max-width:100%}
a{color:inherit}
ol,ul{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.i{width:22px;height:22px;flex:none}
.centro{text-align:center}
::selection{background:var(--o2);color:var(--v0)}
:focus{outline:3px solid var(--o1);outline-offset:3px}
:focus:not(:focus-visible){outline:none}
/* Sobre la tarjeta crema el dorado claro casi no se ve: ahí el foco va en verde. */
.tarjeta :focus{outline-color:var(--v3)}
.tarjeta .total-vivo :focus,.tarjeta .total-final :focus{outline-color:var(--o1)}
.oro{background:linear-gradient(100deg,#b88a35 0%,#f6e3a1 22%,#c99a43 40%,#fff1c4 55%,#b88a35 75%,#e9cf86 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.anim .oro{animation:brillo 7s ease-in-out infinite}
@keyframes brillo{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

.saltar{position:absolute;left:12px;top:-80px;z-index:20;padding:12px 18px;border-radius:12px;background:var(--o1);color:var(--v0);font-family:Cinzel,serif;font-weight:700;text-decoration:none}
.saltar:focus{top:12px}

/* ---------- encabezado (en el celular, compacto: la primera pregunta entra en la pantalla) ---------- */
.cab{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr) 40px;grid-template-areas:"e80 rls edo" "e80 tit edo" "e80 cuando edo";grid-column-gap:10px;column-gap:10px;align-items:center;padding:14px 14px 2px;text-align:center}
.cab-trio{display:contents}
.cab-e80{grid-area:e80;width:52px;height:52px;border-radius:50%;box-shadow:0 0 0 2px var(--o2),0 0 0 4px var(--v0),0 0 0 5px rgba(212,173,90,.5),0 8px 18px rgba(0,0,0,.5)}
.cab-n80{display:none;margin:0 16px;line-height:1}
.cab-n80 .oro{display:block;font-family:Cinzel,serif;font-weight:900;font-size:52px;line-height:.9;letter-spacing:-.02em}
.cab-n80 small{display:block;font-family:Cinzel,serif;font-weight:700;font-size:12px;letter-spacing:.5em;margin:6px 0 0 .5em;color:var(--o1)}
.cab-edo{grid-area:edo;width:40px;height:auto;filter:drop-shadow(0 8px 14px rgba(0,0,0,.55))}
.cab .orn{display:none}
.orn{width:200px;height:20px;margin:12px auto 0;color:var(--o2)}
.cab-rls{grid-area:rls;font-family:Cinzel,serif;font-weight:700;font-size:13.5px;letter-spacing:.1em;line-height:1.4;color:#e2d09c}
.cab-largo{display:none}
.cab-tit{grid-area:tit;font-family:'Playfair Display',Georgia,serif;font-style:italic;font-weight:700;font-size:34px;line-height:1.1;padding:0 .08em}
.cab-sub{display:none;font-family:Cinzel,serif;font-weight:600;font-size:15px;letter-spacing:.1em;line-height:1.5;color:#e6d6a9;margin-top:4px;padding:0 8px}
.cab-cuando{grid-area:cuando;font-size:17px;font-weight:600;line-height:1.35;color:#efe4c4}
.cab-fechas{display:none;grid-template-columns:repeat(3,1fr);max-width:440px;margin:16px auto 0;border-top:1px solid var(--li);border-bottom:1px solid var(--li)}
.cab-fechas li{padding:9px 2px 8px}
.cab-fechas li+li{border-left:1px solid var(--li)}
.cab-fechas small{display:block;font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.14em;color:var(--o2)}
.cab-fechas b{display:block;font-family:Cinzel,serif;font-weight:800;font-size:26px;line-height:1.1;color:var(--o1)}
.cab-fechas span{display:block;font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.04em;color:var(--o0)}

/* ---------- estructura ---------- */
.principal{max-width:680px;margin:0 auto;padding:6px 12px 36px}
.progreso{margin:14px 6px 10px}
.progreso-txt{font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.08em;color:var(--o1);text-transform:uppercase}
.progreso-txt b{color:var(--o0);font-weight:800}
.progreso-barra{height:7px;margin-top:8px;border-radius:99px;background:rgba(212,173,90,.18);overflow:hidden}
.progreso-barra i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#c39740,#f6e3a1);transition:width .5s var(--ease)}

.tarjeta{position:relative;margin-top:12px;padding:24px 20px 26px;border-radius:var(--r);color:var(--tinta);background:radial-gradient(120% 70% at 50% 0%,#fffcf3,rgba(255,252,243,0) 70%),var(--c0);box-shadow:0 0 0 1px rgba(212,173,90,.65),0 26px 70px rgba(0,0,0,.5)}
.tarjeta:before{content:"";position:absolute;top:9px;right:9px;bottom:9px;left:9px;border:1px solid rgba(166,124,46,.38);border-radius:15px;pointer-events:none}
.tarjeta:focus{outline:none}
/* Recién cambiado el paso, un segundo toque (doble toque) no tiene que caer en el paso nuevo. */
.tarjeta.pausa{pointer-events:none}
.esq{position:absolute;width:38px;height:38px;color:var(--o3);opacity:.85;pointer-events:none}
.esq-tl{top:5px;left:5px}.esq-tr{top:5px;right:5px;transform:scaleX(-1)}.esq-bl{bottom:5px;left:5px;transform:scaleY(-1)}.esq-br{bottom:5px;right:5px;transform:scale(-1,-1)}
.progreso[hidden]+.tarjeta{margin-top:18px}

.cargando{padding:40px 8px;text-align:center;color:var(--tinta2);font-weight:600}
.error-carga{padding:12px 4px;text-align:center}
.error-carga p{margin-top:10px}
.error-carga-tit{font-family:Cinzel,serif;font-weight:800;font-size:20px;color:var(--v2)}
.error-carga .btn{margin-top:18px}

.trampa{position:absolute!important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* ---------- pasos ---------- */
.paso{position:relative}
.anim .paso.entra{animation:entra .45s var(--ease) both}
.anim .paso.entra-atras{animation:entraAtras .45s var(--ease) both}
@keyframes entra{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
@keyframes entraAtras{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
.paso-kicker{font-family:Cinzel,serif;font-weight:700;font-size:15px;letter-spacing:.16em;color:var(--o4);text-transform:uppercase}
.paso-tit{font-family:Cinzel,serif;font-weight:800;font-size:27px;line-height:1.18;color:var(--v2);margin-top:6px}
.paso-tit:focus{outline:none}
.paso-intro{margin-top:6px;font-size:21px;font-weight:500;color:var(--tinta2);line-height:1.45}

/* ya se inscribió desde este celular */
.ya-inscripto{margin:2px 0 18px;padding:14px 14px 12px;border-radius:16px;background:#e8f3e9;box-shadow:inset 0 0 0 1px #9cc7a4}
.ya-tit{font-family:Cinzel,serif;font-weight:800;font-size:17px;color:var(--v2)}
.ya-item{margin-top:10px;padding-top:10px;border-top:1px solid rgba(30,86,49,.2)}
.ya-item:first-of-type{border-top:0;padding-top:0}
.ya-quien{font-size:20px;font-weight:700;line-height:1.3}
.ya-estado{font-family:var(--sans);font-size:16px;font-weight:600;color:var(--tinta2);margin-top:2px}
.ya-item .btn{width:100%;margin-top:8px}
.ya-otra{margin-top:12px;font-size:18px;font-weight:600;color:var(--tinta2)}

.pregunta{border:0;margin-top:20px;min-width:0}
.pregunta legend{display:block;width:100%;font-size:23px;font-weight:700;line-height:1.3;color:var(--tinta);margin-bottom:12px}
.opciones{display:grid;grid-template-columns:1fr;grid-gap:10px;gap:10px}
.opcion{position:relative;display:flex;align-items:center;min-height:66px;padding:12px 16px;border-radius:16px;background:var(--c2);box-shadow:inset 0 0 0 2px #c9b27b;cursor:pointer;transition:box-shadow .2s,background .2s,color .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.opcion input{position:absolute;opacity:0;width:1px;height:1px}
.opcion-marca{flex:none;width:28px;height:28px;margin-right:14px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 2px var(--borde);display:grid;place-items:center}
.opcion-marca:after{content:"";width:12px;height:12px;border-radius:50%;background:transparent;transition:background .2s}
.opcion-txt b{display:block;font-size:23px;font-weight:700;line-height:1.2}
.opcion-txt small{display:block;font-size:19px;font-weight:600;line-height:1.3;color:var(--tinta2);margin-top:2px}
@media(hover:hover){.opcion:hover{box-shadow:inset 0 0 0 2px var(--v3)}}
.opcion.elegida{background:var(--v2);color:var(--o0);box-shadow:inset 0 0 0 2px var(--v2),0 10px 24px rgba(18,61,41,.25)}
.opcion.elegida .opcion-txt small{color:#e9dcb5}
.opcion.elegida .opcion-marca{background:var(--o1);box-shadow:inset 0 0 0 2px var(--o1)}
.opcion.elegida .opcion-marca:after{background:var(--v2)}
.opcion:focus-within{outline:3px solid var(--v3);outline-offset:3px}
.pregunta.invalida .opcion{box-shadow:inset 0 0 0 2px var(--error)}
@media(min-width:560px){.opciones.dos{grid-template-columns:1fr 1fr}}

.bloque{margin-top:22px;padding:18px 16px 4px;border-radius:18px;background:var(--c1);box-shadow:inset 0 0 0 1px rgba(166,124,46,.4)}
.bloque-tit{font-family:Cinzel,serif;font-weight:800;font-size:16px;letter-spacing:.08em;color:var(--o4);text-transform:uppercase}
.bloque>.campo:first-of-type{margin-top:12px}
.bloque>.aviso-im{margin-bottom:14px}

/* campos */
.campo{margin-top:20px}
.campo label,.campo-label{display:block;font-size:22px;font-weight:700;line-height:1.3;color:var(--tinta);margin-bottom:7px}
.opc{font-weight:600;color:var(--tinta2);font-size:.86em}
.campo-ayuda{font-size:19px;font-weight:600;color:var(--tinta2);line-height:1.35;margin:-2px 0 8px}
input[type=text],input[type=tel],input[type=email],input[type=search],select,textarea{display:block;width:100%;min-height:60px;padding:13px 16px;border:0;border-radius:14px;background:#fff;color:var(--tinta);font-family:var(--sans);font-size:20px;font-weight:500;line-height:1.3;box-shadow:inset 0 0 0 2px var(--borde);-webkit-appearance:none;appearance:none;transition:box-shadow .2s}
textarea{min-height:110px;resize:vertical}
select{padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,var(--tinta) 50%),linear-gradient(135deg,var(--tinta) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
::placeholder{color:#6b766d;opacity:1}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:inset 0 0 0 2px var(--v3),0 0 0 4px rgba(212,173,90,.55)}
[aria-invalid=true]{box-shadow:inset 0 0 0 2px var(--error)!important;background:var(--error-bg)!important}
.campo-fila{display:grid;grid-template-columns:1fr;grid-gap:0 14px;gap:0 14px}
@media(min-width:460px){.campo-fila{grid-template-columns:7.5em 1fr}}
.tel{display:grid;grid-template-columns:6.4em minmax(0,1fr);grid-gap:10px;gap:10px}
.tel select{padding-left:12px;padding-right:28px;background-position:calc(100% - 16px) 50%,calc(100% - 10px) 50%}
.campo-error{display:flex;align-items:flex-start;margin-top:8px;font-family:var(--sans);font-size:17px;font-weight:600;line-height:1.4;color:var(--error)}
.campo-error:before{content:"!";flex:none;display:grid;place-items:center;width:22px;height:22px;margin:1px 8px 0 0;border-radius:50%;background:var(--error);color:#fff;font-size:14px;font-weight:800}
.error-envio{margin-top:16px;padding:12px 14px;border-radius:14px;background:var(--error-bg);box-shadow:inset 0 0 0 1px #e4b4ad;font-family:var(--sans);font-size:17px;font-weight:600;line-height:1.45;color:var(--error)}
.error-envio .btn{width:100%;margin-top:10px}
.aviso-im{margin-top:16px;padding:12px 14px;border-radius:14px;background:#fff6dc;box-shadow:inset 0 0 0 1px var(--o3)}
.aviso-im p{font-size:19px;font-weight:600}
.aviso-im .btn{margin-top:10px}

.nota{display:flex;align-items:flex-start;margin-top:18px;font-size:19px;font-weight:600;line-height:1.4;color:var(--tinta2)}
.nota .i{margin:2px 10px 0 0;color:var(--o3)}
.nota-oro{padding:12px 14px;border-radius:14px;background:#fff6dc;color:var(--o4);box-shadow:inset 0 0 0 1px rgba(166,124,46,.5)}
.nota:empty{display:none}

/* botones */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:60px;padding:14px 22px;border:0;border-radius:999px;font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.06em;line-height:1.15;text-align:center;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform .2s var(--ease),box-shadow .25s var(--ease),background .25s,color .25s}
.btn .i{width:20px;height:20px}
.btn .i:first-child{margin-right:10px}
.btn .i:last-child{margin-left:10px}
.btn:active{transform:scale(.97)}
.btn[disabled]{cursor:default;opacity:.55;transform:none}
.btn-oro{color:var(--v0);background:linear-gradient(180deg,#fbeab5,#d8b05c 60%,#c39740);box-shadow:0 0 0 1px rgba(110,80,24,.35) inset,0 10px 24px rgba(166,124,46,.3)}
.btn-oro:hover{box-shadow:0 0 0 1px rgba(110,80,24,.45) inset,0 14px 30px rgba(166,124,46,.42)}
.btn-sec{color:var(--v2);background:var(--c2);box-shadow:inset 0 0 0 2px var(--v3)}
.btn-sec:hover{background:#f3ecd6}
.btn-linea{color:var(--o1);background:rgba(7,29,20,.45);box-shadow:inset 0 0 0 1px rgba(212,173,90,.6)}
.btn-linea:hover{background:rgba(212,173,90,.13);color:var(--o0)}
.btn-chico{min-height:52px;padding:11px 16px;font-size:16px}
.btn:focus{outline:3px solid var(--v3);outline-offset:3px}
.btn:focus:not(:focus-visible){outline:none}
.btn-linea:focus{outline-color:var(--o1)}
.acciones{display:grid;grid-template-columns:1fr 1.6fr;grid-gap:12px;gap:12px;margin-top:28px}
.acciones.solo{grid-template-columns:1fr}
.acciones .btn{width:100%;padding-left:12px;padding-right:12px}
/* Editando desde el resumen: «Guardar y volver al resumen» arriba y «Cancelar» abajo, a lo ancho. */
.acciones.editando{grid-template-columns:1fr}
.acciones.editando .btn-sec{order:2}
.enlace{display:inline-flex;align-items:center;min-height:48px;padding:6px 4px;border:0;background:none;color:var(--v3);font-family:var(--sans);font-size:18px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer;touch-action:manipulation}

/* eventos */
.pregunta-eventos{margin-top:18px}
.eventos{display:grid;grid-template-columns:1fr;grid-gap:12px;gap:12px}
.evento{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr);grid-gap:12px;gap:12px;align-items:start;min-height:100px;padding:12px;border-radius:18px;background:var(--c2);box-shadow:inset 0 0 0 2px #c9b27b;cursor:pointer;transition:box-shadow .2s,background .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.evento input{position:absolute;opacity:0;width:1px;height:1px}
.evento-img{width:72px;height:72px;border-radius:12px;object-fit:cover;box-shadow:0 0 0 1px rgba(166,124,46,.5)}
.evento-cuerpo{display:block;min-width:0}
.evento-dia{display:block;font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.06em;line-height:1.3;color:var(--o4)}
.evento-nombre{display:block;font-family:Cinzel,serif;font-weight:800;font-size:18px;line-height:1.2;color:var(--v2);margin-top:2px;overflow-wrap:break-word;word-wrap:break-word}
.evento-lugar{display:block;font-size:18.5px;font-weight:600;line-height:1.3;color:var(--tinta2);margin-top:3px}
.evento-detalle{display:block;font-size:17.5px;font-weight:600;font-style:italic;line-height:1.3;color:var(--o4);margin-top:2px}
.evento-quien{display:inline-block;margin-top:6px;padding:3px 10px;border-radius:99px;font-family:var(--sans);font-size:16px;font-weight:700;line-height:1.3;color:var(--o4);background:#f6ead0}
.evento-motivo{display:flex;align-items:flex-start;margin-top:6px;font-family:var(--sans);font-size:17px;font-weight:600;line-height:1.35;color:var(--tinta2)}
.evento-motivo .i{width:18px;height:18px;margin:2px 6px 0 0}
.evento-caja{float:right;margin:0 0 6px 10px;width:34px;height:34px;border-radius:10px;background:#fff;box-shadow:inset 0 0 0 2px var(--borde);display:grid;place-items:center;color:transparent;transition:background .2s,color .2s}
.evento-caja .i{width:22px;height:22px}
@media(hover:hover){.evento:not(.bloqueado):hover{box-shadow:inset 0 0 0 2px var(--v3)}}
.evento.elegido{background:#f3ecd6;box-shadow:inset 0 0 0 2.5px var(--v3),0 10px 24px rgba(18,61,41,.16)}
.evento.elegido .evento-caja{background:var(--v2);color:var(--o1);box-shadow:none}
.evento:focus-within{outline:3px solid var(--v3);outline-offset:3px}
.evento.bloqueado{cursor:not-allowed;background:#f1ebdc;box-shadow:inset 0 0 0 2px #d9ccab}
.evento.bloqueado .evento-img{filter:grayscale(.8);opacity:.6}
.evento.bloqueado .evento-nombre,.evento.bloqueado .evento-dia{color:#5b6b60}
.evento.bloqueado .evento-caja{background:#ebe3d0;box-shadow:inset 0 0 0 2px #cfc2a1}
.pregunta.invalida .evento:not(.bloqueado){box-shadow:inset 0 0 0 2px var(--error)}

/* total en vivo (lo calcula el servidor) */
.total-vivo{margin-top:22px;padding:16px 18px;border-radius:18px;background:linear-gradient(135deg,var(--v4),var(--v2));color:var(--o0);box-shadow:0 0 0 1px rgba(212,173,90,.5),0 14px 30px rgba(7,29,20,.25)}
.total-vivo:empty{display:none}
.tv-fila{display:flex;align-items:baseline;justify-content:space-between}
.tv-et{font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.12em;color:var(--o2);text-transform:uppercase}
.tv-monto{font-family:Cinzel,serif;font-weight:800;font-size:34px;line-height:1.1;color:var(--o1);white-space:nowrap}
.tv-det{display:block;margin-top:4px;font-size:18px;font-weight:600;line-height:1.35;color:#e9dcb5}
.tv-carga{font-size:19px;color:#e9dcb5}

/* contador de acompañantes */
.contador{margin-top:22px;text-align:center}
.contador-et{font-size:22px;font-weight:700}
.contador-ctrl{display:flex;align-items:center;justify-content:center;margin-top:10px}
.contador-btn{width:64px;height:64px;border:0;border-radius:50%;background:var(--c2);color:var(--v2);font-family:var(--sans);font-size:34px;font-weight:600;line-height:1;box-shadow:inset 0 0 0 2px var(--v3);transition:background .2s,transform .15s;touch-action:manipulation}
.contador-btn:active{transform:scale(.94)}
.contador-btn[disabled]{opacity:.4;cursor:default}
.contador-btn:focus{outline:3px solid var(--v3);outline-offset:3px}
.contador-num{min-width:92px;font-family:Cinzel,serif;font-weight:800;font-size:46px;line-height:1;color:var(--v2)}
.contador-precio{margin-top:10px;font-size:19px;font-weight:600;color:var(--tinta2)}
.nombres .campo:first-child{margin-top:18px}

/* resumen */
.resumen{margin-top:16px;border-top:1px solid rgba(166,124,46,.4)}
.res-bloque{padding:14px 0 14px;border-bottom:1px solid rgba(166,124,46,.4)}
.res-cab{display:flex;align-items:center;justify-content:space-between}
.res-cab h3{font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.1em;color:var(--o4);text-transform:uppercase}
.res-cambiar{min-height:48px;padding:8px 4px 8px 14px;border:0;background:none;color:var(--v3);font-family:var(--sans);font-size:17px;font-weight:700;text-decoration:underline;text-underline-offset:3px;touch-action:manipulation}
.res-bloque p,.res-bloque li{font-size:20px;font-weight:600;line-height:1.4;margin-top:3px}
.res-bloque .sec{font-weight:500;color:var(--tinta2)}
.res-bloque li{padding-left:22px;position:relative}
.res-bloque li:before{content:"∴";position:absolute;left:2px;top:0;color:var(--o3);font-family:Georgia,serif}

.detalle-pago{margin-top:18px}
.total-final{margin-top:18px;padding:18px 18px 16px;border-radius:18px;background:linear-gradient(135deg,var(--v4),var(--v2));color:var(--o0);box-shadow:0 0 0 1px rgba(212,173,90,.5),0 14px 30px rgba(7,29,20,.25)}
.total-final:empty{display:none}
.tf-linea{display:flex;justify-content:space-between;align-items:baseline;padding:7px 0;border-bottom:1px solid rgba(212,173,90,.22);font-size:19px;font-weight:600;line-height:1.3}
.tf-linea span small{display:block;font-size:16px;font-weight:500;color:#d9cba2}
.tf-linea b{flex:none;margin-left:12px;font-family:Cinzel,serif;font-weight:700;font-size:18px;color:var(--o1);white-space:nowrap}
.tf-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:12px}
.tf-total span{font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.12em;color:var(--o2);text-transform:uppercase}
.tf-total b{font-family:Cinzel,serif;font-weight:900;font-size:38px;line-height:1;color:var(--o1);white-space:nowrap}
.tf-nota{margin-top:8px;font-size:17px;font-weight:600;color:#e9dcb5}

/* pago */
.qr{margin-top:20px;padding:18px 16px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px rgba(166,124,46,.45),0 12px 28px rgba(19,48,31,.12);text-align:center}
.qr-img{width:100%;max-width:300px;height:auto;margin:0 auto;border-radius:14px;box-shadow:0 0 0 1px #e5dcc4;cursor:zoom-in}
.qr-lupa{display:inline-flex;align-items:center;min-height:48px;margin-top:6px;padding:4px 8px;border:0;background:none;font-family:var(--sans);font-size:17px;font-weight:700;color:var(--v3);text-decoration:underline;text-underline-offset:3px;touch-action:manipulation}
.qr-lupa .i{width:20px;height:20px;margin-right:6px}
.qr-libre{max-width:420px;margin:12px auto 0;padding:10px 12px;border-radius:12px;background:#fff6dc;box-shadow:inset 0 0 0 1px rgba(166,124,46,.45);font-size:18px;font-weight:600;line-height:1.4;color:var(--o4)}
.qr-datos{display:grid;grid-template-columns:auto 1fr;grid-gap:4px 14px;gap:4px 14px;margin:16px auto 0;max-width:420px;text-align:left}
.qr-datos dt{font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.08em;color:var(--o4);padding-top:4px;text-transform:uppercase}
.qr-datos dd{font-size:20px;font-weight:700}
.qr .btn{margin-top:16px;width:100%;max-width:340px}
.qr-guardar-ayuda{max-width:420px;margin:10px auto 0;font-family:var(--sans);font-size:17px;font-weight:600;line-height:1.4;color:var(--v2)}
.pasos-pago{counter-reset:pp;margin:18px auto 0;max-width:460px;text-align:left}
.pasos-pago li{position:relative;padding:6px 0 6px 44px;font-size:19.5px;font-weight:600;line-height:1.4;counter-increment:pp}
.pasos-pago li:before{content:counter(pp);position:absolute;left:0;top:5px;width:32px;height:32px;border-radius:50%;background:var(--v2);color:var(--o1);font-family:Cinzel,serif;font-weight:800;font-size:16px;line-height:32px;text-align:center}

/* QR en grande */
.qr-visor{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px;background:rgba(5,15,10,.94);text-align:center}
.qr-visor img{width:auto;max-width:100%;max-height:74vh;border-radius:14px;background:#fff}
.qr-visor p{max-width:420px;margin-top:12px;font-size:19px;font-weight:600;color:var(--o0)}
.qr-visor .btn{margin-top:12px;min-width:200px}
.qr-visor .btn:focus{outline-color:var(--o1)}

/* subida del comprobante */
.subida{margin-top:22px;padding:18px 16px;border-radius:18px;background:var(--c1);box-shadow:inset 0 0 0 1px rgba(166,124,46,.45)}
.subida:empty{display:none}
.subida-tit{font-family:Cinzel,serif;font-weight:800;font-size:19px;color:var(--v2)}
.subida-ayuda{margin-top:4px;font-size:19px;font-weight:600;color:var(--tinta2)}
.subida-zona{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:128px;margin-top:14px;padding:18px;border-radius:16px;background:#fff;border:2px dashed var(--o3);text-align:center;cursor:pointer;transition:background .2s,border-color .2s;touch-action:manipulation}
.subida-zona .i{width:34px;height:34px;color:var(--o3)}
.subida-zona-txt{margin-top:8px;font-family:Cinzel,serif;font-weight:700;font-size:17px;letter-spacing:.04em;color:var(--v2)}
.subida-zona-sub{margin-top:2px;font-family:var(--sans);font-size:16px;font-weight:600;color:var(--tinta2)}
.subida-zona:hover{background:#fffaf0;border-color:var(--v3)}
.subida-zona:focus-within{outline:3px solid var(--v3);outline-offset:3px}
.subida-zona input{position:absolute;opacity:0;width:1px;height:1px}
.subida-vista{display:flex;align-items:center;margin-top:14px;padding:10px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px rgba(166,124,46,.4)}
.subida-vista img{width:72px;height:72px;object-fit:cover;border-radius:10px;flex:none}
.subida-pdf{display:grid;place-items:center;width:72px;height:72px;border-radius:10px;background:#f6ead0;color:var(--o4);flex:none}
.subida-pdf .i{width:34px;height:34px}
.subida-info{margin-left:12px;min-width:0}
.subida-nombre{display:block;font-family:var(--sans);font-size:16px;font-weight:700;color:var(--tinta);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.subida-tam{display:block;font-family:var(--sans);font-size:16px;font-weight:600;color:var(--tinta2)}
.subida-tam.enviado{color:var(--ok);font-weight:700}
.subida-barra{height:10px;margin-top:14px;border-radius:99px;background:#e8dcbf;overflow:hidden}
.subida-barra i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--v3),#3d8a5f);transition:width .2s}
.subida-estado{margin-top:10px;font-family:var(--sans);font-size:17px;font-weight:600;line-height:1.4}
.subida-estado:empty{display:none}
.subida-estado.mal{color:var(--error)}
.subida-estado.bien{color:var(--ok)}
.subida .btn{width:100%;margin-top:14px}

/* listo */
.paso-listo{text-align:center}
.sello{width:86px;height:86px;margin:2px auto 0;border-radius:50%;display:grid;place-items:center;color:var(--v0);background:linear-gradient(180deg,#fbeab5,#d8b05c 60%,#c39740);box-shadow:0 0 0 5px var(--c0),0 0 0 6px rgba(166,124,46,.6),0 14px 30px rgba(166,124,46,.35)}
.sello .i{width:44px;height:44px}
.anim .sello{animation:sello .7s var(--ease) both}
@keyframes sello{from{opacity:0;transform:scale(.6)}60%{transform:scale(1.06)}to{opacity:1;transform:none}}
.paso-listo .paso-tit{margin-top:16px;font-size:30px}
.codigo{display:inline-flex;flex-direction:column;align-items:center;margin-top:16px;padding:10px 22px;border-radius:16px;background:var(--c1);box-shadow:inset 0 0 0 1px rgba(166,124,46,.5);font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.12em;color:var(--o4);text-transform:uppercase}
.codigo b{font-size:26px;letter-spacing:.08em;color:var(--v2)}
.listo-eventos{margin-top:20px;text-align:left}
.listo-ev{display:grid;grid-template-columns:62px 1fr;grid-gap:14px;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid rgba(166,124,46,.35)}
.listo-ev:first-child{border-top:1px solid rgba(166,124,46,.35)}
.listo-fecha{width:62px;padding:6px 0;border-radius:12px;background:var(--v2);color:var(--o1);text-align:center;font-family:Cinzel,serif;line-height:1.05}
.listo-fecha small{display:block;font-weight:700;font-size:12px;letter-spacing:.14em;color:var(--o2)}
.listo-fecha b{display:block;font-weight:800;font-size:26px}
.listo-ev-txt b{display:block;font-family:Cinzel,serif;font-weight:800;font-size:18px;color:var(--v2)}
.listo-ev-txt span{display:block;font-size:18.5px;font-weight:600;color:var(--tinta2);line-height:1.35}
.listo-acomp{margin-top:12px;font-size:19px;font-weight:600;color:var(--tinta2);text-align:left}
.estado-pago{margin-top:20px;padding:16px;border-radius:18px;text-align:left}
.estado-pago.ok{background:#e8f3e9;box-shadow:inset 0 0 0 1px #9cc7a4}
.estado-pago.falta{background:#fff6dc;box-shadow:inset 0 0 0 1px var(--o3)}
.estado-pago-tit{display:flex;align-items:center;font-family:Cinzel,serif;font-weight:800;font-size:17px;color:var(--v2)}
.estado-pago-tit .i{margin-right:10px;color:var(--o3)}
.estado-pago.ok .estado-pago-tit .i{color:var(--ok)}
.estado-pago p{margin-top:8px;font-size:19px;font-weight:600;line-height:1.4}
.estado-pago .btn{width:100%;margin-top:12px}
.enlace-privado{margin-top:14px;padding-top:12px;border-top:1px solid rgba(166,124,46,.4)}
.enlace-privado p{font-size:18px}
.enlace-copia{display:grid;grid-template-columns:1fr auto;grid-gap:8px;gap:8px;margin-top:8px}
.enlace-copia input{min-height:52px;font-size:16px;padding:10px 12px}
.enlace-copia .btn{margin-top:0;width:auto;min-height:52px;padding:10px 14px}
.listo-acciones{display:grid;grid-template-columns:1fr;grid-gap:12px;gap:12px;margin-top:24px}
.gcal{display:grid;grid-template-columns:1fr;grid-gap:10px;gap:10px;padding:12px 0;border-top:1px solid rgba(166,124,46,.35);border-bottom:1px solid rgba(166,124,46,.35)}
.gcal:empty{display:none}
.gcal-tit{font-family:var(--sans);font-size:17px;font-weight:600;color:var(--tinta2)}
.gcal .btn{min-height:56px;width:100%}
.listo-links{display:flex;flex-wrap:wrap;justify-content:center;margin-top:20px}
.listo-links .enlace{margin:4px 14px}

/* ayuda y pie */
.ayuda{margin-top:28px;text-align:center}
.ayuda p{font-family:Cinzel,serif;font-weight:700;font-size:16px;letter-spacing:.12em;color:var(--mu);text-transform:uppercase}
.ayuda-btns{display:flex;flex-wrap:wrap;justify-content:center;margin-top:10px}
.ayuda-btns .btn{margin:5px}
.pie{padding:30px 16px 40px;text-align:center;border-top:1px solid var(--li);background:var(--n0)}
.pie-escudos{display:flex;justify-content:center;align-items:center}
.pie-escudos img:first-child{width:48px;height:48px;border-radius:50%;box-shadow:0 0 0 2px var(--o2);margin-right:16px}
.pie-escudos img:last-child{width:40px;height:auto}
.pie .orn{width:160px}
.pie p{margin-top:12px;font-family:Cinzel,serif;font-weight:600;font-size:12.5px;letter-spacing:.12em;line-height:1.8;color:#b9ab83}
.sin-js{max-width:560px;margin:20px auto;padding:16px;border-radius:14px;background:var(--c0);color:var(--tinta);text-align:center}

/* página de error */
.pagina-error .error-caja{max-width:520px;margin:12vh auto 0;padding:32px 22px;border-radius:var(--r);background:var(--c0);color:var(--tinta);text-align:center}
.error-num{font-family:Cinzel,serif;font-weight:900;font-size:56px;color:var(--o3)}
.pagina-error h1{font-family:Cinzel,serif;font-weight:800;font-size:22px;line-height:1.3;color:var(--v2);margin:8px 0 20px}

/* celulares chicos */
@media(max-width:360px){
  body{font-size:20px}
  .tarjeta{padding:22px 15px 22px}
  .cab{grid-template-columns:46px minmax(0,1fr) 36px;padding:12px 12px 2px}
  .cab-e80{width:46px;height:46px}
  .cab-edo{width:36px}
  .cab-tit{font-size:32px}
  .cab-rls{font-size:13px;letter-spacing:.08em}
  .paso-tit{font-size:25px}
  .pregunta legend{font-size:22px}
  .evento{grid-template-columns:60px minmax(0,1fr);gap:10px}
  .evento-img{width:60px;height:60px}
  .evento-nombre{font-size:16.5px}
  .acciones{grid-template-columns:1fr}
  .acciones .btn-sec{order:2}
  .tel{grid-template-columns:6.4em 1fr}
}
/* tablet y escritorio: el encabezado completo, con el 80 grande y el programa de los tres días */
@media(min-width:760px){
  .cab{display:block;padding:40px 16px 6px}
  .cab-trio{display:flex;align-items:center;justify-content:center}
  .cab-e80{width:92px;height:92px;box-shadow:0 0 0 2px var(--o2),0 0 0 5px var(--v0),0 0 0 6px rgba(212,173,90,.5),0 12px 26px rgba(0,0,0,.5)}
  .cab-n80{display:block}
  .cab-n80 .oro{font-size:72px}
  .cab-edo{width:66px;filter:drop-shadow(0 10px 18px rgba(0,0,0,.55))}
  .cab .orn{display:block}
  .cab-rls{font-size:14px;letter-spacing:.18em;line-height:1.6;margin-top:12px}
  .cab-largo{display:inline}
  .cab-tit{font-size:64px;line-height:1.08;margin-top:6px}
  .cab-sub{display:block}
  .cab-cuando{display:none}
  .cab-fechas{display:grid}
  .progreso{margin:20px 6px 12px}
  .tarjeta{margin-top:18px;padding:44px 48px 40px}
  .paso-tit{font-size:32px}
  .evento{grid-template-columns:96px minmax(0,1fr);gap:16px;padding:14px}
  .evento-img{width:96px;height:96px}
  .evento-nombre{font-size:20px}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{transition-duration:.01ms!important}
}
