
/* Base dark theme (overridden by light via data-theme) */
:root{
  --bg:#0b0f14;
  --bg-elev:#11161d;
  --text:#e8edf3;
  --muted:#a9b4c2;
  --brand:#4cc9f0;
  --accent:#80ffdb;
  --border:#1b2330;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  line-height:1.6;
  font-size:clamp(15px, 1.1vw + 12px, 18px);
}
.container{max-width:1000px; margin:0 auto; padding:0 1.25rem}
.site-header{background:linear-gradient(180deg,rgba(128,255,219,.15),transparent 60%), var(--bg-elev); border-bottom:1px solid var(--border)}
.header-grid{display:grid; grid-template-columns:1.2fr .8fr .4fr; gap:2rem; padding:3rem 0}
.name{font-size:2rem; margin:.25rem 0}
.title{margin:.25rem 0 0.5rem; color:var(--muted)}
.tagline{margin:.35rem 0 1rem; color:var(--muted); font-size:0.95rem}
.contact{list-style:none; padding:0; margin:0; display:flex; gap:1rem; flex-wrap:wrap}
.contact a{color:var(--brand); text-decoration:none; min-height:44px; padding:.6rem .8rem}
.contact a:hover{color:var(--accent)}
.summary{font-size:1rem; color:#d6dde6}
.sticky-nav{position:sticky; top:0; background:rgba(11,15,20,.85); backdrop-filter:saturate(1.2) blur(8px); border-bottom:1px solid var(--border); z-index:10}
.sticky-nav .container{display:flex; gap:1rem; overflow:auto; align-items:center}
.sticky-nav a{display:block; padding:.75rem 1rem; color:var(--muted); text-decoration:none}
.sticky-nav a:hover{color:var(--text)}
.theme-toggle{ margin-left:auto; background:transparent; color:var(--text); border:1px solid var(--border); border-radius:10px; padding:.5rem .75rem; cursor:pointer }
.theme-toggle:hover{ background:var(--bg-elev); }
.theme-toggle:focus{ outline:2px solid var(--accent); outline-offset:2px }
.section{padding:2.5rem 0}
.section h2{margin:0 0 1rem; font-size:1.4rem; font-weight:700}
.role{padding:1rem 1rem 1.25rem; border:1px solid var(--border); background:#0e1319; border-radius:12px; margin-bottom:1rem}
.role-head{display:flex; justify-content:space-between; align-items:baseline; gap:1rem; flex-wrap:wrap}
.role h3{margin:.25rem 0; font-size:1.1rem}
.role .meta{color:var(--muted); font-size:.95rem}
.role .description{margin:.5rem 0 0}
.skills-grid{display:grid; grid-template-columns:1fr 1fr; gap:1rem}
.skills-grid ul{margin:0; padding-left:1rem}
.education{margin:0; padding-left:1rem}
.site-footer{border-top:1px solid var(--border); padding:2rem 0; color:var(--muted)}
.avatar-wrap{display:flex; align-items:flex-start; justify-content:flex-end}
.avatar{width:120px; height:120px; border-radius:50%; object-fit:cover; border:2px solid var(--border); box-shadow:0 8px 24px rgba(0,0,0,.35)}

/* Light theme overrides */
html[data-theme="light"] {
  --bg:#f7f9fc; --bg-elev:#ffffff; --text:#0f172a; --muted:#475569; --brand:#2563eb; --accent:#0891b2; --border:#e2e8f0;
}
html[data-theme="light"] .site-header{ background:linear-gradient(180deg, rgba(37,99,235,.08), transparent 60%), var(--bg-elev); }
html[data-theme="light"] .sticky-nav{ background:rgba(255,255,255,.85); }
html[data-theme="light"] .role{ background:var(--bg-elev); }
html[data-theme="light"] .site-footer{ border-top-color:var(--border); }

/* Outlined download button */
.btn{ display:inline-block; padding:.5rem .9rem; border-radius:10px; font-weight:600; text-decoration:none; transition:.2s ease; }
.btn-download{ background:transparent; border:1.5px solid var(--brand); color:var(--brand); }
.btn-download:hover{ background:var(--brand); color:#fff; }
.btn-download:focus{ outline:2px solid var(--accent); outline-offset:2px }

/* Mobile-friendly enhancements */
@media (max-width: 640px){
  .container{ padding: 0 0.9rem; }
  .site-header{ padding-bottom: 0.5rem; }
  .header-grid{ grid-template-columns: 1fr; gap: 1rem; padding: 1.75rem 0; }
  .avatar{ width:96px; height:96px; }
  .contact{ gap:0.5rem; }
  .contact li{ width:100%; }
  .contact a{ display:block; width:100%; border:1px solid var(--border); border-radius:10px; padding:.6rem .8rem; background:var(--bg-elev); }
  .btn-download{ width:100%; text-align:center; }
  .sticky-nav .container{ gap:0.5rem; }
  .theme-toggle{ padding:.55rem .7rem; }
  .skills-grid{ grid-template-columns: 1fr; }
  .role{ padding:0.85rem 0.85rem 1rem; }
  .section{ padding:1.5rem 0; }
}
@media (max-width: 400px){
  .name{ font-size:1.6rem; }
  .title{ font-size:1rem; }
  .tagline{ font-size:0.9rem; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; }
}
