:root{
  --bg:#ffffff;
  --text:#111827;
  --muted:#4b5563;
  --border:#e5e7eb;
  --surface:#f9fafb;
  --focus:#111827;
  --nav-w: 280px;

  --prof-link:#0b2e5f; /* azul oscuro */
  --lab-link:#0b4a2a;  /* verde oscuro */
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial;
  color:var(--text);
  background:var(--bg);
  line-height:1.65;
}
a{color:#0b5fff}
a:hover{text-decoration:underline}
a:focus-visible{outline:3px solid var(--focus); outline-offset:3px;}
.skip-link{position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden;}
.skip-link:focus{left:12px; top:12px; width:auto; height:auto; padding:10px 12px; background:#fff; border:2px solid var(--text); z-index:1000;}
.layout{display:grid; grid-template-columns: var(--nav-w) 1fr; min-height:100vh;}
nav{position:sticky; top:0; height:100vh; padding:18px 14px; border-right:1px solid var(--border); background:var(--surface); overflow:auto;}
.brand{font-weight:700; letter-spacing:.02em; margin:4px 8px 14px;}
.navlist{list-style:none; padding:0; margin:0;}
.navlist li{margin:6px 0}
.navlist a{display:block; padding:8px 10px; border-radius:10px; text-decoration:none; color:var(--text);}
.navlist a:hover{background:#fff}
.navlist a.nav-prof{color:var(--prof-link);}
.navlist a.nav-lab{color:var(--lab-link);}
.nav-section-label{
  display:block;
  padding:8px 10px;
  color:var(--muted);
  font-weight:700;
  letter-spacing:.02em;
  margin-top:8px;
}
main{padding:28px 28px 60px; max-width: 980px;}
header.page-header{padding-bottom:14px; border-bottom:1px solid var(--border); margin-bottom:20px;}
header.page-header h1{font-size:1.8rem; margin:0 0 6px; line-height:1.25;}
header.page-header p{margin:0; color:var(--muted);}
section{padding:18px 0; border-bottom:1px solid var(--border);}
section:last-child{border-bottom:none}
h2{font-size:1.35rem; margin:0 0 10px; line-height:1.25;}
p{margin:10px 0}
.figure-grid{display:flex; flex-wrap:wrap; gap:14px; margin:12px 0;}
figure{margin:0; padding:12px; border:1px solid var(--border); border-radius:14px; background:#fff; box-shadow: 0 1px 0 rgba(0,0,0,.03);}
figure img{display:block; max-width:100%; height:auto;}
.slide-bg{padding:0; border-radius:16px; overflow:hidden;}
.slide-bg img{width:100%; height:auto; display:block;}
.table-wrap{overflow:auto; border:1px solid var(--border); border-radius:14px; background:#fff;}
table{border-collapse:collapse; width:100%; min-width:560px;}
th, td{border-bottom:1px solid var(--border); padding:10px 12px; vertical-align:top; text-align:left;}
th{background:var(--surface); font-weight:650}
tr:last-child td{border-bottom:none}
.cards{display:grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap:14px; margin-top:14px;}
.card{border:1px solid var(--border); border-radius:16px; padding:14px; background:#fff; box-shadow: 0 1px 0 rgba(0,0,0,.03);}
.card h3{margin:10px 0 6px}
.card img{display:block; margin:0 auto; border-radius:14px}
.hero-prof{
  display:flex;
  gap:16px;
  align-items:center;
  padding:14px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.03);
  margin-bottom:16px;
}
.hero-prof img{border-radius:14px; height:auto; max-width:none;}
.footer{margin-top:26px; color:var(--muted); font-size:.92rem;}
.backlink{display:inline-block; margin-top:10px;}
@media (max-width: 900px){
  .layout{grid-template-columns: 1fr}
  nav{position:relative; height:auto; border-right:none; border-bottom:1px solid var(--border)}
  main{padding:20px 16px 54px}
  table{min-width:520px}
  .hero-prof{flex-direction:column; align-items:flex-start}
  .hero-prof img{max-width:100%;}
}