/* V46.20 (sitio) · casos-de-exito/casos.css — NUEVO: estilos de Casos de éxito y de la verificación de certificados (Digitalización Incluyente). Detalle: README.md → "Registro de cambios V46.20". */
:root{
  --bg:#070A22; --bg2:#0E1440; --bg3:#1B2266; --turquesa:#2EE6D6; --violeta:#8B5CF6; --rosa:#FF5FAE; --card:rgba(255,255,255,.055); --borde:rgba(201,162,39,.35);
  --texto:#F5F1E6; --suave:#D5CCB4; --oro:#E3BE52; --oro2:#C9A227; --verde:#4ADE80; --rojo:#FF6B7A; --cian:#7DD3FC;
  --f-titulo:'Cormorant Garamond',Georgia,serif; --f-texto:'Sora',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:calc(16.5px * var(--a11y-scale,1));background:var(--bg);color-scheme:dark;scroll-behavior:smooth}
html,body{overflow-x:clip}
body{font-family:var(--f-texto);color:var(--texto);background:radial-gradient(60vmax 40vmax at 0 0,rgba(46,230,214,.18),transparent 60%),radial-gradient(60vmax 45vmax at 100% 10%,rgba(139,92,246,.26),transparent 60%),radial-gradient(70vmax 50vmax at 50% 110%,rgba(255,95,174,.14),transparent 60%),var(--bg);min-height:100vh;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--oro);outline-offset:3px;border-radius:10px}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.saltar{position:absolute;left:12px;top:-90px;z-index:200;background:var(--oro);color:#0E1B3D;padding:12px 18px;border-radius:12px;font-weight:800;text-decoration:none}
.saltar:focus{top:12px}
.barra{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:10px;padding:10px 14px;padding-top:calc(10px + env(safe-area-inset-top));background:rgba(7,11,24,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--borde)}
.barra .marca{display:flex;align-items:center;gap:10px;margin-right:auto;text-decoration:none;font-weight:800;letter-spacing:.06em;font-size:.92rem;min-width:0;line-height:1.2}
.barra .marca img{width:40px;height:40px;border-radius:50%}
.bb{min-height:46px;min-width:46px;padding:0 14px;border-radius:999px;border:1.5px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);font-weight:800;font-size:.92rem;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.bb.oro{border-color:var(--oro);color:var(--oro)}
@media(max-width:460px){.bb .txt{display:none}.bb.oro .txt{display:inline}}
main{max-width:1060px;margin:0 auto;padding:0 16px 80px}
.hero{text-align:center;padding:40px 0 20px}
.hero .sello{width:min(46vw,190px);margin:0 auto 14px;filter:drop-shadow(0 10px 30px rgba(201,162,39,.35))}
.ceja{display:inline-block;font-weight:700;letter-spacing:.35em;text-transform:uppercase;font-size:.78rem;color:var(--turquesa)}
h1{font-family:var(--f-titulo);font-weight:700;font-size:clamp(2.4rem,9vw,4rem);line-height:1.05;margin-top:8px}
h1 em{display:block;font-style:italic;color:var(--oro);font-size:1.25em;line-height:1}
h1 .uno{display:block;font-family:var(--f-texto);font-weight:300;font-size:.38em;letter-spacing:.45em;margin-right:-.45em}
.lead{max-width:62ch;margin:14px auto 0;color:var(--suave);font-size:1.1rem}
h2{font-family:var(--f-titulo);font-weight:700;font-size:clamp(1.8rem,6vw,2.6rem);line-height:1.1;margin:40px 0 14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 22px;border-radius:999px;font-weight:800;text-decoration:none;border:0;font-size:1.02rem}
.btn-oro{background:linear-gradient(135deg,#F6DE8D,#C9A227);color:#0E1B3D}
.btn-sec{background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.22)}
.acciones{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:18px}
.pilares{display:grid;gap:12px;margin-top:10px}
@media(min-width:720px){.pilares{grid-template-columns:repeat(3,1fr)}}
.pilar{padding:18px;border-radius:22px;background:var(--card);border:1px solid rgba(255,255,255,.1)}
.pilar b{display:block;font-size:1.08rem;color:var(--oro);margin-bottom:4px}
.pilar span{color:var(--suave)}
/* Verificador de folio */
.verificador{margin-top:16px;padding:18px;border-radius:24px;background:linear-gradient(135deg,rgba(29,50,112,.6),rgba(255,255,255,.03));border:1px solid var(--borde)}
.verificador form{display:flex;gap:10px;flex-wrap:wrap}
.verificador input{flex:1 1 220px;min-height:54px;border-radius:999px;border:1.5px solid rgba(255,255,255,.25);background:rgba(0,0,0,.25);color:var(--texto);font:inherit;font-size:1.1rem;padding:0 18px;text-transform:uppercase;letter-spacing:.08em}
.resultado{margin-top:12px;font-weight:700;font-size:1.05rem;min-height:1.5em}
.resultado.ok{color:var(--verde)} .resultado.no{color:var(--rojo)}
/* Tarjetas de casos */
.casos{display:grid;gap:16px}
@media(min-width:760px){.casos{grid-template-columns:1fr 1fr}}
.caso{display:flex;flex-direction:column;border-radius:26px;overflow:hidden;background:var(--card);border:1px solid rgba(255,255,255,.12);text-decoration:none;transition:transform .2s,border-color .2s}
.caso:hover{transform:translateY(-3px);border-color:var(--oro)}
.caso .top{display:flex;align-items:center;gap:14px;padding:18px}
.caso .top img{width:72px;height:72px;border-radius:50%;box-shadow:0 0 0 3px var(--oro2)}
.caso .top b{display:block;font-size:1.3rem}
.caso .top small{display:block;color:var(--suave);font-weight:600}
.caso p{padding:0 18px;color:var(--suave)}
.caso .pie{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 18px 18px;margin-top:auto;flex-wrap:wrap}
.folio{font-weight:800;letter-spacing:.12em;font-size:.82rem;color:var(--oro);border:1px solid var(--borde);border-radius:999px;padding:5px 12px}
.estado{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:.9rem;color:var(--verde)}
/* Verificación de un certificado */
.sellook{display:flex;gap:16px;align-items:center;padding:20px;border-radius:26px;margin-top:26px;background:linear-gradient(135deg,rgba(74,222,128,.16),rgba(29,50,112,.4));border:2px solid rgba(74,222,128,.6)}
.sellook.no{background:linear-gradient(135deg,rgba(255,107,122,.18),rgba(29,50,112,.4));border-color:rgba(255,107,122,.7)}
.sellook.cargando{background:var(--card);border-color:rgba(255,255,255,.2)}
.sellook .ico{width:64px;height:64px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;font-size:2rem;background:var(--verde);color:#062612;font-weight:900}
.sellook.no .ico{background:var(--rojo);color:#2A0408}
.sellook.cargando .ico{background:rgba(255,255,255,.15);color:var(--texto)}
.sellook b{display:block;font-size:1.35rem}
.sellook span{color:var(--suave);font-weight:600}
.ficha{display:grid;gap:18px;margin-top:20px;align-items:start}
@media(min-width:860px){.ficha{grid-template-columns:1fr 1fr}}
.cert{border-radius:16px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.6);border:1px solid var(--borde);background:#fff;cursor:zoom-in;padding:0;display:block;width:100%}
.cert img,#zoom img{height:auto}
.datos{border-radius:24px;background:var(--card);border:1px solid rgba(255,255,255,.12);padding:18px}
.datos dl{display:grid;gap:10px}
.datos dt{font-size:.8rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--oro)}
.datos dd{font-size:1.1rem;font-weight:700;margin-bottom:6px}
.datos ul{list-style:none;display:grid;gap:8px;margin-top:6px}
.datos li{display:flex;gap:10px;align-items:flex-start;color:var(--suave)}
.datos li::before{content:"✓";color:var(--verde);font-weight:900}
#zoom{border:0;padding:0;background:rgba(0,0,0,.94);width:100%;height:100%;max-width:none;max-height:none;margin:0}
#zoom .in{height:100%;overflow:auto;padding:60px 10px 20px;touch-action:pan-x pan-y pinch-zoom}
#zoom img{max-width:900px;width:100%;margin:0 auto;border-radius:8px}
#zoom .cerrar{position:fixed;top:12px;right:12px;width:50px;height:50px;border-radius:50%;border:2px solid rgba(255,255,255,.4);background:rgba(0,0,0,.6);font-size:1.6rem}
footer{border-top:1px solid var(--borde);padding:30px 16px 40px;text-align:center;color:var(--suave);font-size:.92rem}
footer a{color:var(--oro);font-weight:800}
/* Panel de Inclusión (js/a11y.js) */
#a11y-modal{margin:auto;width:95vw;max-width:900px;max-height:92vh;background:#0E1440;border:2px solid var(--oro);border-radius:28px;padding:0;color:var(--texto);position:fixed;overflow-y:auto}
#a11y-modal::backdrop{background:rgba(0,0,0,.85);backdrop-filter:blur(10px)}
#a11y-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid rgba(255,255,255,.1);position:sticky;top:0;background:#0E1440;z-index:2}
#a11y-modal .modal-header h3{font-size:1.4rem;color:var(--oro);display:flex;gap:12px;align-items:center}
#a11y-modal .close-modal-btn{width:48px;height:48px;border-radius:50%;border:2px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:var(--texto);font-size:1.3rem}
#a11y-modal .modal-body{padding:20px 22px 26px}
.a11y-grid-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.a11y-card-btn{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;border:2px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:var(--texto);font-weight:800;font-size:1.05rem;text-align:left}
.a11y-card-btn i{font-size:1.5rem;width:2rem;text-align:center;color:var(--oro)}
.a11y-card-btn:hover,.a11y-card-btn[aria-pressed="true"]{background:var(--oro);border-color:var(--oro);color:#0E1B3D}
.a11y-card-btn:hover i,.a11y-card-btn[aria-pressed="true"] i{color:#0E1B3D}
@media(max-width:700px){#a11y-modal{width:100vw;max-width:100vw;max-height:100vh;height:100vh;border-radius:0;border:0}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}