.zjd{--g1:#00423a;--g2:#277600;--or:#ffb000;--cr:#fdeaa8;--ink:#1f2d27;--line:#e3e9e5;
	max-width:880px;margin:0 auto;padding:20px 16px 50px;box-sizing:border-box;color:var(--ink);
	font-family:'Gotham Light','Gotham',Montserrat,Arial,sans-serif;font-weight:300;line-height:1.7;font-size:16px}
.zjd *,.zjd *::before,.zjd *::after{box-sizing:border-box}
.zjd h1,.zjd h2,.zjd h3,.zjd .zjd-card__name{font-family:Montserrat,Arial,sans-serif;color:inherit;margin:0}

/* Portada del perfil */
.zjd-hero{position:relative;overflow:hidden;display:flex;align-items:center;gap:28px;padding:30px 34px;border-radius:20px;color:#fff;
	background:radial-gradient(900px 400px at 85% -10%,rgba(255,176,0,.22),transparent 60%),linear-gradient(135deg,#00423a 0%,#012e29 100%)}
.zjd-hero::before{content:"";position:absolute;inset:0;opacity:.07;pointer-events:none;
	background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:36px 36px}
.zjd-photo{position:relative;flex:0 0 150px;height:150px;border-radius:50%;padding:5px;
	background:conic-gradient(from 0deg,#ffb000,#277600,#00423a,#ffb000);animation:zjd-spin 14s linear infinite}
.zjd-photo__in{width:100%;height:100%;border-radius:50%;overflow:hidden;background:#0a5a50;border:5px solid #00423a;animation:zjd-spin 14s linear infinite reverse}
.zjd-photo__in img{width:100%;height:100%;object-fit:cover;display:block}
.zjd-initials{display:flex;width:100%;height:100%;align-items:center;justify-content:center;font:700 40px Montserrat,Arial,sans-serif;color:var(--or)}
.zjd-id{position:relative;z-index:1}
.zjd-id h1{font-size:clamp(24px,3.4vw,32px);font-weight:700;line-height:1.15;letter-spacing:-.01em}
.zjd-role{margin:8px 0 0;font-size:16px;color:var(--cr)}
.zjd-social{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.zjd-social a{padding:6px 15px;border:1px solid rgba(255,255,255,.35);border-radius:999px;color:#fff;text-decoration:none;font:600 13px Montserrat,Arial,sans-serif;transition:background .2s,color .2s,border-color .2s}
.zjd-social a:hover{background:var(--or);border-color:var(--or);color:var(--g1)}

/* Contenido */
.zjd-layout{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:20px;margin-top:20px;align-items:start}
.zjd-main{display:grid;gap:24px}
.zjd-panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px}
.zjd-panel h2{font-size:20px;font-weight:700;color:var(--g1);margin-bottom:16px}
.zjd-bio p{margin:0 0 14px}.zjd-bio p:last-child{margin:0}

/* Cursos */
.zjd-timeline{list-style:none;margin:0;padding:0 0 0 22px;border-left:2px solid var(--line)}
.zjd-course{position:relative;padding:0 0 26px 20px}
.zjd-course:last-child{padding-bottom:0}
.zjd-course::before{content:"";position:absolute;left:-30px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--or);box-shadow:0 0 0 4px #fff,0 0 0 5px var(--or)}
.zjd-course__when{display:block;font:600 12px Montserrat,Arial,sans-serif;color:var(--g2);margin-bottom:2px}


/* QR */
.zjd-side{position:sticky;top:24px;display:grid;gap:16px}
.zjd-qr{text-align:center;padding:24px}
.zjd-qr__code canvas{width:100%;max-width:220px;height:auto;display:block;margin:0 auto;border-radius:12px;border:1px solid var(--line)}
.zjd-qr p{margin:14px 0;font-size:14px}
.zjd-qr button{cursor:pointer;border:0;border-radius:999px;padding:11px 24px;background:var(--g1);color:#fff;font:600 13px Montserrat,Arial,sans-serif;transition:background .2s,color .2s}
.zjd-qr button:hover{background:var(--or);color:var(--g1)}
.zjd-back{text-align:center;color:var(--g2);font:600 13px Montserrat,Arial,sans-serif;text-decoration:none}
.zjd-back:hover{text-decoration:underline}

/* Listado de docentes */
.zjd-archive__head{text-align:center;margin-bottom:34px}
.zjd-archive__head h1{font-size:clamp(28px,4vw,40px);font-weight:700;color:var(--g1)}
.zjd-archive__head p{margin:8px 0 0}
.zjd-grid{display:grid;grid-template-columns:repeat(var(--zjd-cols,3),minmax(0,1fr));gap:22px;padding-top:0;padding-bottom:0}
.zjd-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px 20px;background:#fff;border:1px solid var(--line);border-radius:20px;text-decoration:none;color:var(--ink);transition:transform .25s,box-shadow .25s,border-color .25s}
.zjd-card:hover{transform:translateY(-4px);border-color:var(--or);box-shadow:0 14px 34px rgba(0,66,58,.14)}
.zjd-card__photo{width:130px;height:130px;border-radius:50%;overflow:hidden;background:var(--g1);margin-bottom:16px;display:block;border:3px solid var(--or)}
.zjd-card__photo img{width:100%;height:100%;object-fit:cover;display:block}
.zjd-card__photo .zjd-initials{font-size:36px}
.zjd-card__name{font-size:17px;font-weight:700;color:var(--g1);line-height:1.3}
.zjd-card__role{margin-top:6px;font-size:14px}
.zjd-card__count{margin-top:14px;padding:4px 14px;border-radius:999px;background:var(--cr);color:var(--g1);font:600 12px Montserrat,Arial,sans-serif}

/* Entrada inicial (una sola vez) */
.zjd-hero{animation:zjd-in .7s ease both}
.zjd-panel,.zjd-card{animation:zjd-in .7s ease .15s both}
@keyframes zjd-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes zjd-spin{to{transform:rotate(360deg)}}

@media(max-width:860px){
	.zjd-hero{flex-direction:column;text-align:center;padding:36px 22px;gap:24px}
	.zjd-social{justify-content:center}
	.zjd-layout{grid-template-columns:1fr}
	.zjd-side{position:static}
	.zjd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:520px){.zjd-grid{grid-template-columns:1fr}.zjd-panel{padding:22px}}
@media(prefers-reduced-motion:reduce){.zjd *,.zjd{animation:none!important;transition:none!important}}

/* Cursos en los que participó */
.zjd-course__name{background:#07294d;color:#fff;text-align:center;border-radius:4px;padding:20px 24px;font:600 16px/1.45 Montserrat,Arial,sans-serif}
.zjd-course__meta{margin:6px 0 0;font-size:13px;color:var(--g2)}
