/* ==========================================================================
   Adrian Castaneda Juarez — site stylesheet
   Shared across index.html, cv.html, research.html, links.html
   ========================================================================== */

:root{
  --paper:#F5F6F3;
  --paper-raised:#EFF1EC;
  --ink:#3A3F3C;
  --ink-strong:#20241F;
  --muted:#767F76;
  --border:#DCE0D9;
  --link:#2F6E7A;
  --link-hover:#20505A;

  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --sidebar-w: 250px;
  --content-max: 640px;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--link); text-decoration:none;}
a:hover, a:focus-visible{color:var(--link-hover); text-decoration:underline;}
h1,h2,h3{color:var(--ink-strong); line-height:1.25; font-weight:700; margin:0;}
p{margin:0;}
ul{margin:0; padding:0;}
hr{border:none; border-top:1px solid var(--border); margin:0;}

.layout{
  display:flex;
  max-width:1040px;
  margin:0 auto;
  align-items:flex-start;
}

/* ---------------- sidebar ---------------- */
.sidebar{
  width:var(--sidebar-w);
  flex-shrink:0;
  padding:48px 24px 48px 32px;
  position:sticky;
  top:0;
  max-height:100vh;
  overflow-y:auto;
  opacity:0.82;
  transition:opacity .2s ease-in-out;
}
.sidebar:hover{opacity:1;}

.avatar{
  width:84px; height:84px; border-radius:50%;
  border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:700; letter-spacing:0.02em;
  color:var(--ink-strong);
  margin-bottom:18px;
}
.sidebar h1{font-size:19px;}
.sidebar .tagline{
  margin-top:8px; font-size:13.5px; color:var(--muted); line-height:1.55;
}
.sidebar .location{
  margin-top:10px; font-size:13px; color:var(--muted);
}

.sidebar hr{margin:22px 0;}

.side-nav ul{list-style:none; display:flex; flex-direction:column; gap:9px;}
.side-nav a{
  font-size:14px; color:var(--ink); font-weight:500;
}
.side-nav a:hover, .side-nav a:focus-visible{color:var(--link); text-decoration:none;}
.side-nav a.active{color:var(--ink-strong); font-weight:700;}

.side-contact ul{list-style:none; display:flex; flex-direction:column; gap:8px;}
.side-contact li{font-size:13px; color:var(--muted);}
.side-contact a{color:var(--muted); font-size:13px;}
.side-contact a:hover, .side-contact a:focus-visible{color:var(--link);}

/* ---------------- main content ---------------- */
main{
  flex-grow:1;
  min-width:0;
  padding:56px 32px 80px 40px;
  border-left:1px solid var(--border);
}
.content-inner{max-width:var(--content-max);}

.page-title{
  font-size:24px;
  margin-bottom:22px;
  padding-bottom:14px;
  border-bottom:1px solid var(--border);
}

section{margin-bottom:56px;}
section:last-child{margin-bottom:0;}
section > h2{
  font-size:20px;
  padding-bottom:10px;
  border-bottom:1px solid var(--border);
  margin-bottom:20px;
}

.prose p{color:var(--ink); font-size:15.5px;}
.prose p + p{margin-top:14px;}

/* buttons */
.btn{
  display:inline-block;
  font-size:14.5px;
  font-weight:600;
  padding:10px 18px;
  border-radius:5px;
  border:1px solid var(--ink-strong);
  color:var(--ink-strong);
  text-decoration:none;
  transition:background .15s ease, color .15s ease;
}
.btn:hover, .btn:focus-visible{background:var(--ink-strong); color:var(--paper); text-decoration:none;}

/* experience */
.exp-item{padding-bottom:26px; border-bottom:1px solid var(--border); margin-bottom:26px;}
.exp-item:last-child{border-bottom:none; margin-bottom:0; padding-bottom:0;}
.exp-head{display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px;}
.exp-head h3{font-size:16px;}
.exp-role{font-size:14px; color:var(--muted); display:block; margin-top:2px;}
.exp-dates{font-size:13px; color:var(--muted); white-space:nowrap;}
.exp-bullets{margin:12px 0 0; padding-left:20px; font-size:14.5px; color:var(--ink);}
.exp-bullets li{margin-bottom:6px;}
.exp-bullets li::marker{color:var(--muted);}

/* projects / links: link-list style */
.link-item{padding-bottom:22px; border-bottom:1px solid var(--border); margin-bottom:22px;}
.link-item:last-child{border-bottom:none; margin-bottom:0; padding-bottom:0;}
.link-item h3{font-size:15.5px; display:inline;}
.link-item h3 a{font-weight:700;}
.link-role{font-size:13px; color:var(--muted);}
.link-item p{margin-top:6px; font-size:14.5px; color:var(--ink);}

/* skills: plain label + list */
.skill-group{margin-bottom:16px;}
.skill-group:last-child{margin-bottom:0;}
.skill-group dt{font-size:14.5px; font-weight:700; color:var(--ink-strong); margin-bottom:4px;}
.skill-group dd{margin:0; font-size:14.5px; color:var(--ink);}

/* education / awards */
.edu-item{margin-bottom:14px;}
.edu-item:last-child{margin-bottom:0;}
.edu-item .deg{font-weight:700; font-size:15px;}
.edu-item .where{font-size:14px; color:var(--muted);}
.awards-list{list-style:none; margin-top:14px;}
.awards-list li{font-size:14.5px; padding-left:14px; position:relative; margin-bottom:8px;}
.awards-list li::before{content:'–'; position:absolute; left:0; color:var(--muted);}
.subhead{font-size:13px; text-transform:uppercase; letter-spacing:0.04em; color:var(--muted); font-weight:700; margin-bottom:2px;}

footer.page-footer{
  padding:24px 32px 40px 40px;
  border-left:1px solid var(--border);
  font-size:12.5px;
  color:var(--muted);
}

@media (max-width:760px){
  .layout{flex-direction:column;}
  .sidebar{
    position:relative; width:100%; max-height:none; opacity:1;
    padding:32px 24px 24px;
    border-bottom:1px solid var(--border);
  }
  main{border-left:none; padding:36px 24px 60px;}
  footer.page-footer{border-left:none; padding:20px 24px 36px;}
  .side-nav ul{flex-direction:row; flex-wrap:wrap; gap:14px;}
}

@media (prefers-reduced-motion: reduce){
  *{transition:none !important;}
}
