/* Ajustes para montar el diseño dentro de la app (2026-10-29): Tailwind preflight
   fija line-height:1.5 y margin:0 en todo, y el prototipo se diseñó sobre los
   valores del navegador. Solo actúa en la portada (html.verify-landing). */
html.verify-landing,html.verify-landing body,html.verify-landing #root{line-height:normal}
html.verify-landing dialog#access{margin:auto}
html.verify-landing dialog#access .submit{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
html.verify-landing .closing-alt{margin-top:18px}
html.verify-landing .closing-alt a{color:inherit;opacity:.75;font-size:15px;text-decoration:underline;text-underline-offset:3px}
html.verify-landing .next-services a{color:inherit;font-weight:600;white-space:nowrap}
html.verify-landing #email-form a{color:inherit;text-decoration:underline}

/* ── Ventana de acceso v3 (2026-10-29): tranquila, un solo mensaje. ─────── */
html.verify-landing dialog#access{padding:0;border:0;border-radius:22px;overflow:hidden;max-width:460px;box-shadow:0 30px 90px #06122b99}
html.verify-landing dialog#access::backdrop{background:#071431a6;backdrop-filter:blur(6px)}
html.verify-landing dialog#access .close{color:#c9d6f0;z-index:3;top:14px;right:14px}
html.verify-landing dialog#access .close:hover{color:#fff}
.jd-dlg-head{padding:34px 36px 26px;color:#fff;background:radial-gradient(380px 200px at 100% 0,#72ded526,transparent 65%),linear-gradient(165deg,#112a63,#0f2452)}
.jd-dlg-head h2{color:#fff!important;font-size:27px!important;line-height:1.15!important;letter-spacing:-.6px!important;margin:0 0 10px!important;font-weight:650}
.jd-dlg-head p{color:#c3d1ec!important;margin:0!important;font-size:14px!important;line-height:1.5}
.jd-dlg-head strong{color:#fff}
.jd-dlg-body{padding:30px 36px 32px;background:#fff}
.jd-msg{font-size:13px!important;line-height:1.45;color:#6b778c!important;margin:10px 2px 18px!important;min-height:19px;transition:color .2s}
.jd-msg[data-tone="warn"]{color:#9a5b1f!important}
.jd-check{display:flex;align-items:center;gap:10px;font-size:13.5px;color:#3a4863;cursor:pointer;margin:0 0 6px;width:max-content;max-width:100%}
.jd-check input{position:absolute;opacity:0;width:1px;height:1px}
.jd-check .box{flex:0 0 auto;width:19px;height:19px;border-radius:6px;border:1.6px solid #9aa9c2;display:grid;place-items:center;transition:all .15s}
.jd-check input:checked+.box{background:#295c60;border-color:#295c60}
.jd-check input:checked+.box::after{content:"";width:8px;height:4px;border:2px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.jd-check input:focus-visible+.box{box-shadow:0 0 0 4px #72ded566}
.jd-check a{color:#254be8!important;text-decoration:none;border-bottom:1px solid #254be855}
.jd-ts:empty{display:none}.jd-ts{margin:10px 0 0}
.jd-go{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;margin-top:22px;border:0;border-radius:999px;font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;color:#fff;background:linear-gradient(135deg,#295c60,#227a73);box-shadow:0 10px 24px #1f7f7838;transition:transform .15s,box-shadow .2s,filter .2s}
.jd-go:hover{transform:translateY(-1px);box-shadow:0 14px 30px #1f7f784d}
.jd-go:disabled{filter:saturate(.6) brightness(1.05);cursor:progress;transform:none}
.jd-status{font-size:15px!important;font-weight:600;color:#14213d!important;margin:0 0 14px!important}
.jd-bar{height:6px;border-radius:999px;background:#e7edf5;overflow:hidden}
.jd-bar i{display:block;height:100%;width:8%;border-radius:999px;background:linear-gradient(90deg,#295c60,#2a9d8f,#72ded5);transition:width .6s ease}

/* ── Campo con etiqueta flotante: base común ─────────────────────────────── */
.lbi .lbi-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:1}
.lbi .lbi-ring path{fill:none;stroke:var(--line);stroke-width:1.5;transition:stroke .2s}
.lbi[data-focus="true"] .lbi-ring path{stroke:var(--ink)}
.lbi .lbi-gap{stroke-dasharray:1 1;stroke-dashoffset:0;transition:stroke-dashoffset .3s cubic-bezier(.2,.7,.2,1),stroke .2s}
.lbi[data-up="true"] .lbi-gap{stroke-dashoffset:-1}
.lbi .lbi-label{position:absolute;left:var(--lbi-x);top:50%;transform:translateY(-50%);transform-origin:0 50%;line-height:1;color:var(--lab);pointer-events:none;white-space:nowrap;transition:transform .3s cubic-bezier(.2,.7,.2,1),color .2s;margin:0;z-index:2}
.lbi .lbi-label span{display:inline-block;white-space:pre}
.lbi .lbi-label.hop span{animation:lbiHop .34s cubic-bezier(.3,.7,.3,1) both;animation-delay:calc(var(--i) * 22ms)}
@keyframes lbiHop{40%{transform:translateY(-3px)}}
.lbi[data-focus="true"] .lbi-label{color:var(--ink)}
@keyframes lbiAutofill{from{}to{}}

/* correo, en la ventana */
.jd-lbi{--line:#b3bfd3;--ink:#295c60;--lab:#6b778c;--txt:#14213d}
.jd-lbi.ok{--ink:#1f7f78}
.jd-lbi .lbi-box{position:relative;height:56px;border-radius:14px;background:#fff}
html.verify-landing .jd-lbi .lbi-field{position:absolute;inset:0;width:100%;height:100%;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;margin:0!important;font:inherit;font-size:16px!important;color:var(--txt);padding:0 18px!important;border-radius:inherit}
.jd-lbi .lbi-label{font-size:16px}
.jd-lbi[data-up="true"] .lbi-label{transform:translateY(calc(-50% - 28px)) scale(.78)}
.jd-lbi .lbi-field::placeholder{color:#a3adbf;opacity:0;transition:opacity .2s}
.jd-lbi[data-focus="true"] .lbi-field::placeholder{opacity:1}
.jd-lbi .lbi-field:-webkit-autofill{animation-name:lbiAutofill;animation-duration:1ms;-webkit-text-fill-color:#14213d;box-shadow:0 0 0 60px #fff inset!important}

/* dominio, en la píldora del hero */
.lbi-hero{--line:#a2c4c3;--ink:#295c60;--lab:#5d7273}
html.verify-landing .lbi-hero .url-box{position:relative;border-color:transparent!important}
.lbi-hero .lbi-label{font-size:13px}
.lbi-hero[data-up="true"] .lbi-label{transform:translateY(calc(-50% - 27px)) scale(.82);background:#eef5f3;padding:3px 9px;margin-left:-9px;border-radius:999px;color:#1f5257}
.lbi-hero #dominio::placeholder{opacity:0;transition:opacity .2s}
.lbi-hero[data-focus="true"] #dominio::placeholder{opacity:1}
.lbi-hero #dominio:-webkit-autofill,.lbi-hero #dominio:-webkit-autofill:focus{animation-name:lbiAutofill;animation-duration:1ms;-webkit-text-fill-color:#14213d;box-shadow:0 0 0 60px #eef5f3 inset!important;transition:background-color 9999s}
.lbi-hero .evaluate-button{position:relative;z-index:2}

@media (max-width:520px){.jd-dlg-head{padding:30px 24px 22px}.jd-dlg-body{padding:26px 24px 28px}.jd-dlg-head h2{font-size:24px!important}}
@media (prefers-reduced-motion:reduce){.lbi .lbi-label,.lbi .lbi-ring path,.lbi .lbi-gap{transition:none}.lbi .lbi-label.hop span{animation:none}}
.jd-lbi.ok .lbi-ring path{stroke:#2a9d8f}
.jd-lbi.ok .lbi-label{color:#1f7f78}
html.verify-landing .lbi-hero > label{display:block;margin-bottom:12px}

/* ── v4 (2026-10-29): un solo fondo azul con efecto; el campo blanco del correo
   es lo único destacado. ────────────────────────────────────────────────── */
html.verify-landing dialog#access{background:radial-gradient(520px 320px at 110% -10%,#72ded533,transparent 60%),radial-gradient(460px 300px at -20% 110%,#254be840,transparent 60%),linear-gradient(165deg,#132f6d,#0e2350 60%,#0b1c42);color:#fff;box-shadow:0 30px 90px #020a1fcc,inset 0 0 0 1px #ffffff1a}
.jd-dlg-head{background:none;padding:38px 36px 6px}
.jd-dlg-body{background:transparent;padding:22px 36px 34px}
.jd-dlg-head p{color:#b9c8e6!important}
.jd-msg{color:#9fb2d6!important}
.jd-msg[data-tone="warn"]{color:#f3c98f!important}
.jd-check{color:#d3def2}
.jd-check .box{border-color:#7f95bd;background:#ffffff0d}
.jd-check input:checked+.box{background:#72ded5;border-color:#72ded5}
.jd-check input:checked+.box::after{border-color:#0d2150}
.jd-check a{color:#bfe9ff!important;border-bottom-color:#bfe9ff66}
/* el campo blanco, con un halo suave */
.jd-lbi{--line:#ffffff;--ink:#ffffff;--lab:#7b879c;--txt:#14213d}
.jd-lbi .lbi-box{background:#fff;box-shadow:0 10px 30px #020a1f59,0 0 0 1px #ffffff;transition:box-shadow .25s}
.jd-lbi[data-focus="true"] .lbi-box{box-shadow:0 10px 30px #020a1f59,0 0 0 4px #72ded566}
.jd-lbi.ok .lbi-box{box-shadow:0 10px 30px #020a1f59,0 0 0 4px #2a9d8f80}
.jd-lbi .lbi-ring path,.jd-lbi.ok .lbi-ring path,.jd-lbi[data-focus="true"] .lbi-ring path{stroke:#fff}
/* etiqueta arriba: píldora blanca sobre el borde, legible sobre el azul */
.jd-lbi[data-up="true"] .lbi-label{transform:translateY(calc(-50% - 28px)) scale(.8);background:#fff;padding:3px 9px;margin-left:-9px;border-radius:999px;color:#295c60;font-weight:650;box-shadow:0 4px 12px #020a1f40}
.jd-lbi.ok .lbi-label{color:#1f7f78}
.jd-go{background:linear-gradient(135deg,#72ded5,#4cc3b8);color:#0b1c42;font-weight:700;box-shadow:0 12px 28px #72ded540}
.jd-go:hover{box-shadow:0 16px 34px #72ded559}
.jd-status{color:#fff!important}
.jd-bar{background:#ffffff1f}
@media (max-width:520px){.jd-dlg-head{padding:32px 24px 4px}.jd-dlg-body{padding:20px 24px 28px}}

/* ── v6 (2026-10-30): ventana centrada sobre la portada (se ve que es parte de la
   solicitud), con más aire que la v4; explica el correo de empresa y los pasos. ── */
html.verify-landing dialog#access{width:min(600px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);overflow-y:auto;border-radius:24px}
html.verify-landing dialog#access::backdrop{background:#071431a6;backdrop-filter:blur(6px)}
html.verify-landing #dialog-content{padding:30px 40px 32px}
.jd-paso{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 44px 18px 0!important;font-size:12px!important;letter-spacing:.4px;color:#9fb2d6!important}
.jd-paso b{font-weight:600;color:#0b1c42;background:#72ded5;border-radius:999px;padding:3px 10px;font-size:11.5px}
.jd-dlg-head{padding:0!important}
.jd-dlg-head h2{font-size:28px!important;letter-spacing:-.7px!important;margin-bottom:8px!important}
.jd-dlg-head p{font-size:14.5px!important}
.jd-dlg-body{padding:28px 0 0!important}
.jd-why{margin:20px 0 2px;padding:16px 18px;border-radius:14px;background:#ffffff0d;border:1px solid #ffffff1f}
.jd-why-t{margin:0 0 4px!important;font-size:14.5px!important;font-weight:650;color:#fff!important}
.jd-why-t strong{color:#72ded5}
.jd-why-p{margin:0 0 12px!important;font-size:13.5px!important;line-height:1.5;color:#b9c8e6!important}
.jd-why-ex{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px}
.jd-why-ex li{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#d3def2}
.jd-why-ex li::before{flex:0 0 20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700}
.jd-why-ex li.si::before{content:"✓";background:#72ded5;color:#0b1c42}
.jd-why-ex li.no::before{content:"✕";background:#ffffff1f;color:#f3c98f}
.jd-why-ex li.no{color:#9fb2d6}
.jd-next{list-style:none;counter-reset:jd;margin:24px 0 0;padding:20px 0 0;border-top:1px solid #ffffff1f;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.jd-next li{counter-increment:jd;display:grid;gap:3px;align-content:start}
.jd-next li::before{content:counter(jd);width:26px;height:26px;margin-bottom:6px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:#72ded5;border:1.5px solid #72ded566}
.jd-next li.hecho::before{content:"✓";background:#72ded5;color:#0b1c42;border-color:#72ded5}
.jd-next b{font-size:13.5px;color:#fff;font-weight:600}
.jd-next span{font-size:12.5px;line-height:1.45;color:#9fb2d6}
.jd-alt{display:block;margin-top:16px;text-align:center;font-size:13px;color:#bfe9ff!important;text-decoration:none}
.jd-alt:hover{text-decoration:underline}
@media (max-width:520px){html.verify-landing #dialog-content{padding:24px 22px 26px}.jd-next{grid-template-columns:1fr;gap:12px}.jd-next li{grid-template-columns:26px 1fr;column-gap:10px}.jd-next li::before{grid-row:span 2;margin:0}.jd-dlg-head h2{font-size:24px!important}}

/* ── D (2026-10-30): formulario que crece en el hero. El dominio queda confirmado
   arriba y debajo aparece el correo, en la misma tarjeta blanca. Sin ventana. ── */
#domain-form.is-step2 > label,#domain-form.is-step2 .url-box,#domain-form.is-step2 .form-meta{display:none}
.jd-flow{display:none}
.jd-flow.open{display:block;max-width:440px;margin-top:4px;padding:16px 18px 18px;border-radius:22px;background:#fff;color:#14213d;box-shadow:0 18px 50px #020a1f59;animation:jdFlowIn .35s cubic-bezier(.2,.7,.2,1) both}
@keyframes jdFlowIn{from{opacity:0;transform:translateY(8px)}}
.jd-flow-bar{display:flex;gap:5px;margin-bottom:14px}
.jd-flow-bar i{flex:1;height:3px;border-radius:3px;background:#e4e8ef;transition:background .3s}
.jd-flow-bar i.done{background:#1f7f78}
.jd-flow-bar i.now{background:#72ded5}
.jd-flow-dom{display:flex;align-items:center;gap:10px;padding:0 0 14px;border-bottom:1px solid #eef1f5}
.jd-flow-dom .ok{flex:0 0 24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;background:#e3f6f3;color:#1f7f78}
.jd-flow-dom .t{flex:1;display:grid;line-height:1.2}
.jd-flow-dom small{font-size:11px;color:#7a8499}
.jd-flow-dom b{font-size:15px;font-weight:600;color:#14213d}
.jd-flow-edit{border:0;background:none;font:inherit;font-size:12.5px;color:#254be8;cursor:pointer;padding:6px 4px}
.jd-flow-edit:hover{text-decoration:underline}
.jd-flow-q{margin:16px 0 14px!important;font-size:15px!important;font-weight:600;color:#14213d!important}
.jd-flow-sub{margin:-6px 0 6px!important;font-size:13px!important;line-height:1.5;color:#5d6a80!important}
#flow .jd-dlg-body{padding:0!important;background:none}
#flow .jd-msg{color:#6b778c!important;margin:8px 2px 12px!important;font-size:12.5px!important}
#flow .jd-msg[data-tone="warn"]{color:#9a5b1f!important}
#flow .jd-check{color:#3a4863;font-size:13px}
#flow .jd-check .box{border-color:#9aa9c2;background:#fff}
#flow .jd-check input:checked+.box{background:#1f7f78;border-color:#1f7f78}
#flow .jd-check input:checked+.box::after{border-color:#fff}
#flow .jd-check a{color:#254be8!important;border-bottom-color:#254be855}
#flow .jd-lbi{--line:#cdd5e2;--ink:#1f7f78;--lab:#7b879c;--txt:#14213d}
#flow .jd-lbi .lbi-box{box-shadow:none;height:50px}
#flow .jd-lbi[data-focus="true"] .lbi-box{box-shadow:0 0 0 4px #72ded540}
#flow .jd-lbi.ok .lbi-box{box-shadow:0 0 0 4px #2a9d8f33}
#flow .jd-lbi .lbi-ring path{stroke:var(--line)}
#flow .jd-lbi[data-focus="true"] .lbi-ring path,#flow .jd-lbi.ok .lbi-ring path{stroke:var(--ink)}
#flow .jd-lbi[data-up="true"] .lbi-label{background:#fff;color:#1f7f78;box-shadow:none;font-weight:600}
#flow .jd-go{min-height:46px;margin-top:14px;background:#1f5c60;color:#fff;box-shadow:none;font-weight:600}
#flow .jd-go:hover{background:#1a4f53;transform:none}
#flow .jd-status{color:#14213d!important;font-size:14px!important;font-weight:500}
#flow .jd-bar{background:#eef1f5}
#flow .jd-next{border-top:1px solid #eef1f5;margin-top:14px;padding-top:14px;grid-template-columns:1fr;gap:10px}
#flow .jd-next li{grid-template-columns:24px 1fr;column-gap:10px}
#flow .jd-next li::before{grid-row:span 2;margin:0;width:24px;height:24px;color:#1f7f78;border-color:#1f7f7855}
#flow .jd-next li.hecho::before{background:#1f7f78;color:#fff;border-color:#1f7f78}
#flow .jd-next b{color:#14213d;font-size:13.5px;line-height:24px}
#flow .jd-next span{color:#5d6a80}
#flow .jd-alt{color:#254be8!important;font-size:12.5px;margin-top:12px}
@media (prefers-reduced-motion:reduce){.jd-flow.open{animation:none}}

/* ── D2 (2026-10-30): el formulario crece debajo de la píldora del dominio, con la
   misma forma. El hero sube: el bloque no queda pegado al suelo. ──────────── */
#domain-form.is-step2 > label{display:block}#domain-form.is-step2 .url-box{display:flex}
#domain-form.is-step2 .form-meta{display:none}
#domain-form.is-step2 .evaluate-button{display:none}
#domain-form.is-step2 #dominio{color:#14213d;font-weight:600}
#domain-form.is-step2 .url-box::after{content:"✓";position:absolute;right:104px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;background:#1f7f78;color:#fff}
.jd-edit{flex:0 0 auto;margin:0 6px 0 auto;height:40px;padding:0 18px;border:1px solid #1f5c6033;border-radius:999px;background:#fff;color:#1f5c60;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.jd-edit:hover{background:#eef5f3}
.jd-flow.open{max-width:none;margin-top:14px;padding:0;border-radius:0;background:none;box-shadow:none;color:inherit}
.jd-mail-q{display:block;margin:0 0 12px;font-size:14px;color:#dbe6f7}
html.verify-landing .jd-mail-box{position:relative}
html.verify-landing .jd-mail-box input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:16px;color:#14213d}
#flow .jd-msg{color:#9fb2d6!important;margin:10px 4px 10px!important;font-size:12.5px!important}
#flow .jd-msg[data-tone="warn"]{color:#f3c98f!important}
#flow .jd-check{color:#d3def2;font-size:13px;margin-left:4px}
#flow .jd-check .box{border-color:#7f95bd;background:#ffffff0d}
#flow .jd-check input:checked+.box{background:#72ded5;border-color:#72ded5}
#flow .jd-check input:checked+.box::after{border-color:#0d2150}
#flow .jd-check a{color:#bfe9ff!important;border-bottom-color:#bfe9ff66}
#flow .jd-flow-q{color:#fff!important;margin:4px 4px 10px!important}
#flow .jd-flow-sub{color:#b9c8e6!important;margin:0 4px 6px!important}
#flow .jd-status{color:#fff!important}
#flow .jd-bar{background:#ffffff1f}
#flow .jd-next{border-top-color:#ffffff1f}
#flow .jd-next b{color:#fff}
#flow .jd-next span{color:#9fb2d6}
#flow .jd-next li::before{color:#72ded5;border-color:#72ded566}
#flow .jd-next li.hecho::before{background:#72ded5;color:#0b1c42;border-color:#72ded5}
#flow .jd-alt{color:#bfe9ff!important}
@media (min-width:900px){html.verify-landing .hero{align-items:start;padding-top:clamp(36px,7vh,80px)}}
@media (max-width:520px){#domain-form.is-step2 .url-box::after{right:96px}.jd-edit{padding:0 14px}}
#domain-form.is-step2 .lbi-label{display:none}
html.verify-landing #domain-form .url-box .jd-edit{flex:0 0 auto;margin-left:auto;height:42px;padding:0 18px;border:1px solid #1f5c6040;border-radius:23px;background:#fff;color:#1f5c60;font-size:12.5px;font-weight:600;box-shadow:none}
html.verify-landing #domain-form .url-box .jd-edit:hover{background:#e3f0ed}
#domain-form.is-step2 .url-box::after{right:118px}
html.verify-landing .jd-mail-box{display:flex;align-items:center;height:60px;padding:5px 5px 5px 18px;border-radius:28px;background:#eef5f3;border:1px solid transparent;box-shadow:0 7px 20px #06141712}
html.verify-landing .jd-mail-box > span{color:#5d7273;margin-right:8px;font-size:15px}
.jd-mail-box.ok{box-shadow:0 0 0 3px #72ded566}
#domain-form.is-step2 #dominio{flex:1 1 auto;min-width:0;width:auto}
html.verify-landing #domain-form.is-step2 .url-box{overflow:hidden}
html.verify-landing #domain-form .url-box .jd-edit{flex-shrink:0;min-width:96px;white-space:nowrap;width:auto}

/* ── Ventana translúcida de avance (2026-10-30): aparece al enviar y muestra que
   se están haciendo cosas; al terminar cambia a "Listo" en la misma ventana. ── */
html.verify-landing dialog#access.jd-glass{width:min(460px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border-radius:24px;border:1px solid #ffffff2e;background:rgba(18,38,86,.55);-webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%);box-shadow:0 30px 80px #020a1f80;color:#fff;overflow:auto}
html.verify-landing dialog#access.jd-glass::backdrop{background:rgba(7,20,49,.35);backdrop-filter:blur(3px)}
html.verify-landing dialog#access.jd-glass #dialog-content{padding:0;min-height:0;display:block;width:auto}
.jd-g{padding:30px 30px 26px}
.jd-g-k{margin:0 0 6px!important;font-size:11px!important;letter-spacing:1.3px;text-transform:uppercase;color:#9fb2d6!important}
.jd-g-t{margin:0 0 14px!important;font-size:22px!important;line-height:1.25!important;font-weight:600;letter-spacing:-.4px!important;color:#fff!important}
.jd-g-t span{color:#72ded5}
.jd-g-pct{display:flex;align-items:baseline;gap:2px;font-size:18px;color:#9fb2d6;font-variant-numeric:tabular-nums}
.jd-g-pct b{font-size:46px;line-height:1;letter-spacing:-1.5px;color:#fff;font-weight:600}
.jd-g-bar{height:8px;margin:12px 0 10px;border-radius:8px;background:#ffffff1f;overflow:hidden}
.jd-g-bar i{position:relative;display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,#72ded5,#ffb28d);transition:width .8s ease;overflow:hidden}
.jd-g-bar i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#ffffff8c,transparent);animation:jdShine 1.6s linear infinite}
@keyframes jdShine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.jd-g-s{margin:0 0 16px!important;font-size:13.5px!important;line-height:1.5;color:#c3d1ec!important}
.jd-g-s strong{color:#fff}
.jd-stages{list-style:none;margin:0;padding:14px 0 0;border-top:1px solid #ffffff1f;display:grid;gap:10px}
.jd-stages li{display:flex;align-items:center;gap:10px;font-size:14px;color:#8fa3c8}
.jd-stages .dot{flex:0 0 16px;height:16px;border-radius:50%;border:2px solid #ffffff3d}
.jd-stages li.done{color:#fff}
.jd-stages li.done .dot{background:#72ded5;border-color:#72ded5}
.jd-stages li.now{color:#fff;font-weight:600}
.jd-stages li.now .dot{border-color:#ffb28d;border-top-color:transparent;animation:jdSpin .9s linear infinite}
@keyframes jdSpin{to{transform:rotate(360deg)}}
.jd-g-ok{width:52px;height:52px;margin:0 0 14px;border-radius:50%;display:grid;place-items:center;font-size:24px;font-weight:700;background:#72ded5;color:#0b1c42;animation:jdPop .45s cubic-bezier(.2,.8,.2,1.2) both}
@keyframes jdPop{from{transform:scale(.6);opacity:0}}
.jd-g-btn{width:100%;min-height:48px;margin-top:20px;border:0;border-radius:999px;background:#fff;color:#0b1c42;font:inherit;font-size:15px;font-weight:600;cursor:pointer}
.jd-g-btn:hover{background:#e9f5f3}
.jd-g-alt{display:block;margin-top:14px;text-align:center;font-size:13px;color:#bfe9ff!important;text-decoration:none}
.jd-g-alt:hover{text-decoration:underline}
@media (prefers-reduced-motion:reduce){.jd-g-bar i::after,.jd-stages li.now .dot,.jd-g-ok{animation:none}.jd-g-bar i{transition:none}}
html.verify-landing dialog#access.jd-glass .close{position:absolute;top:16px;right:16px;width:34px;height:34px;border-radius:50%;background:#ffffff14;font-size:20px}
html.verify-landing dialog#access.jd-glass .close:focus:not(:focus-visible){outline:none}

/* Nota de 1 a 7 en "Cuatro miradas" (2026-10-30) */
.section-heading .nota-demo{display:flex;align-items:center;flex-wrap:wrap;gap:14px 22px;margin-top:26px;padding:16px 22px;border:1px solid #dbe2ee;border-radius:16px;background:#fff;width:max-content;max-width:100%}
.nota-demo>b{font-size:44px;line-height:1;font-weight:600;letter-spacing:-1.5px;color:#14213d;font-variant-numeric:tabular-nums}
.nota-demo>span{display:grid;gap:2px;font-size:12.5px;color:#586780}
.nota-demo>span strong{font-size:14px;color:#14213d}
.nota-demo ul{list-style:none;margin:0;padding:0 0 0 22px;border-left:1px solid #dbe2ee;display:flex;flex-wrap:wrap;gap:6px 16px}
.nota-demo li{font-size:13px;color:#586780}
.nota-demo li em{font-style:normal;font-weight:600;color:#14213d;margin-left:4px}
@media (max-width:640px){.nota-demo ul{padding:12px 0 0;border-left:0;border-top:1px solid #dbe2ee;width:100%}}

/* Términos + verificación de Cloudflare en una sola fila, alineados al formulario (2026-10-31) */
#flow .jd-legal{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 20px;margin:2px 4px 0}
#flow .jd-legal .jd-check{margin:0}
#flow .jd-legal .jd-ts{margin:0;line-height:0}
#flow .jd-legal .jd-ts iframe{border-radius:10px}
