/* ===== Design tokens (Syntactic Logic) ===== */
:root{
  --background:#0e141a;
  --surface:#0e141a;
  --surface-container-lowest:#080f14;
  --surface-container-low:#161c22;
  --surface-container:#1a2026;
  --surface-container-high:#242b31;
  --surface-container-highest:#2f353c;
  --surface-variant:#2f353c;
  --surface-bright:#333a40;
  --on-surface:#dde3eb;
  --on-surface-variant:#bcc9cd;
  --on-background:#dde3eb;
  --outline:#869397;
  --outline-variant:#3d494c;
  --primary:#4cd7f6;
  --on-primary:#003640;
  --primary-container:#06b6d4;
  --secondary:#ffb95f;
  --on-secondary:#472a00;

  --container-max:1280px;
  --gutter:24px;
  --margin-mobile:20px;
  --stack-sm:8px;
  --stack-md:16px;
  --stack-lg:32px;
  --section-gap:120px;

  --font-body:'Inter',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
}

/* ===== Reset / base ===== */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--background);color:var(--on-background);font-family:var(--font-body);font-size:16px;line-height:24px;-webkit-font-smoothing:antialiased;transition:background-color .3s,color .3s;}
body.light{
  --background:#f5f7fa;--surface:#ffffff;--surface-container-lowest:#eef1f5;
  --surface-container-low:#ffffff;--surface-container:#f0f3f7;--surface-container-high:#e6eaf0;
  --surface-container-highest:#dde3eb;--surface-variant:#e2e8f0;--on-surface:#11181f;
  --on-surface-variant:#475059;--on-background:#11181f;--outline:#5b6770;--outline-variant:#c4ccd4;
  --primary:#0891b2;--primary-container:#06b6d4;--secondary:#d97706;
}
a{text-decoration:none;color:inherit;}
.mono{font-family:var(--font-mono);}
.material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;vertical-align:middle;line-height:1;}
.ico-sm{font-size:14px;}
.container{max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter);}
::selection{background:rgba(76,215,246,.3);}
.cyan{color:var(--primary);}
.amber{color:var(--secondary);}

/* ===== Navigation ===== */
.nav{position:fixed;top:0;width:100%;z-index:50;background:rgba(14,20,26,.7);backdrop-filter:blur(12px);border-bottom:1px solid rgba(61,73,76,.3);transition:background .3s;}
.nav.scrolled{background:rgba(14,20,26,.92);}
.nav__inner{display:flex;justify-content:space-between;align-items:center;height:64px;max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter);}
.nav__logo{font-size:24px;font-weight:700;letter-spacing:-.04em;color:var(--primary);}
.nav__links{display:none;gap:var(--stack-lg);align-items:center;}
.nav__link{color:var(--on-surface-variant);transition:color .3s;}
.nav__link:hover{color:var(--primary);}
.nav__link--active{color:var(--primary);border-bottom:2px solid var(--primary);padding-bottom:4px;}
.nav__actions{display:flex;align-items:center;gap:var(--stack-sm);}
.nav__btn{background:none;border:none;cursor:pointer;padding:8px;border-radius:9999px;color:var(--on-surface-variant);display:inline-flex;transition:color .2s,transform .15s;}
.nav__btn:hover{color:var(--primary);}
.nav__btn:active{transform:scale(.95);}
@media(min-width:768px){.nav__links{display:flex;}}

/* ===== Footer ===== */
.footer{width:100%;padding:var(--stack-lg) 0;border-top:1px solid rgba(61,73,76,.2);background:var(--surface-container-lowest);}
.footer__inner{display:flex;flex-direction:column;align-items:center;gap:var(--stack-md);max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter);}
.footer__copy{font-size:12px;letter-spacing:.1em;color:var(--on-surface-variant);}
.footer__links{display:flex;gap:var(--stack-lg);}
.footer__links a{font-family:var(--font-mono);font-size:14px;color:var(--on-surface-variant);transition:color .3s;}
.footer__links a:hover{color:var(--secondary);}
@media(min-width:768px){.footer__inner{flex-direction:row;justify-content:space-between;}}

/* ===== Page ===== */
.page{position:relative;min-height:100vh;padding-top:128px;padding-bottom:var(--section-gap);overflow:hidden;}
.circuit-trace-bg{position:absolute;inset:0;opacity:.1;pointer-events:none;
  background-image:radial-gradient(circle at 1px 1px, var(--outline-variant) 1px, transparent 0);background-size:24px 24px;}
.side-glow{position:absolute;top:0;right:0;width:33%;height:100%;pointer-events:none;background:linear-gradient(to left,rgba(76,215,246,.05),transparent);}

.head{margin-bottom:var(--section-gap);position:relative;}
.eyebrow{display:inline-flex;align-items:center;gap:var(--stack-sm);margin-bottom:var(--stack-sm);}
.eyebrow__line{height:1px;width:32px;background:var(--primary);}
.eyebrow__text{font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--primary);}
.head__title{font-size:60px;line-height:72px;font-weight:800;letter-spacing:-.02em;color:var(--on-surface);margin-bottom:var(--stack-md);}
.head__desc{font-size:18px;line-height:28px;color:var(--on-surface-variant);max-width:42rem;}
@media(max-width:767px){.head__title{font-size:40px;line-height:48px;}}

/* Timeline */
.timeline{position:relative;display:flex;flex-direction:column;gap:var(--section-gap);}
.timeline__line{position:absolute;top:0;bottom:0;left:16px;width:1px;transform:translateX(-50%);
  background:linear-gradient(to bottom,transparent,var(--primary),var(--secondary),transparent);}
.row{position:relative;display:flex;flex-direction:column;align-items:flex-start;width:100%;}
.row__side{width:100%;}
.row--center{align-items:center;justify-content:center;text-align:center;padding:var(--stack-lg) 0;}
.node{position:absolute;left:16px;top:0;width:32px;height:32px;border-radius:9999px;transform:translateX(-50%);z-index:10;display:flex;align-items:center;justify-content:center;}
.node--cyan,.node--amber{background:var(--background);border:2px solid var(--primary);}
.node--amber{border-color:var(--secondary);}
.node--outline{background:var(--background);border:2px solid var(--outline);color:var(--on-surface-variant);}
.node--solid{background:var(--primary);box-shadow:0 0 20px rgba(76,215,246,.4);}
.node__ico{color:var(--on-primary);}
.node__dot{width:12px;height:12px;border-radius:9999px;background:var(--primary);}
.node__dot--pulse{animation:pulse 2s infinite;}
.node__dot--amber{background:var(--secondary);}

.row__side--left,.row__side--right{padding-left:48px;}

@media(min-width:768px){
  .timeline__line{left:50%;}
  .row{flex-direction:row;align-items:center;}
  .row__side{width:50%;}
  .node{left:50%;}
  .row__side--left{padding-left:0;padding-right:48px;text-align:right;}
  .row__side--right{padding-left:48px;padding-right:0;}
}

.t-card{padding:var(--stack-lg);border:1px solid rgba(61,73,76,.3);border-radius:12px;background:var(--surface-container-low);transition:border-color .3s,box-shadow .3s;}
.t-card--cyan:hover{border-color:var(--primary);box-shadow:0 0 15px rgba(76,215,246,.2);}
.t-card--amber:hover{border-color:var(--secondary);box-shadow:0 0 15px rgba(255,185,95,.2);}
.t-card--plain:hover{border-color:rgba(76,215,246,.5);}
.t-card__date{font-size:14px;display:block;margin-bottom:8px;}
.t-card__title{font-size:24px;font-weight:600;color:var(--on-surface);margin-bottom:8px;}
.t-card__org{font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--on-surface-variant);margin-bottom:var(--stack-md);}
.t-card__text{color:var(--on-surface-variant);}
.t-card__text b{font-weight:700;}
.t-card__loc{margin-top:16px;display:flex;align-items:center;gap:8px;font-size:14px;color:var(--on-surface-variant);opacity:.6;}
.t-tags{margin-top:var(--stack-md);display:flex;flex-wrap:wrap;gap:8px;}
.t-tags--end{justify-content:flex-start;}
@media(min-width:768px){.t-tags--end{justify-content:flex-end;}.t-card--plain .t-card__loc{justify-content:flex-end;}}
.t-tag{background:var(--surface-variant);padding:4px 8px;border-radius:4px;font-family:var(--font-mono);font-size:14px;color:var(--on-surface-variant);border:1px solid rgba(61,73,76,.2);}

.edu-pill{display:inline-block;padding:12px 32px;background:var(--surface-container);border:1px solid rgba(61,73,76,.5);border-radius:9999px;color:var(--on-surface);font-size:12px;font-weight:700;letter-spacing:.1em;position:relative;z-index:10;}

.certs{display:grid;grid-template-columns:1fr;gap:var(--stack-md);}
@media(min-width:640px){.certs{grid-template-columns:1fr 1fr;}}
.cert{background:var(--surface-container-highest);padding:var(--stack-md);border:1px solid rgba(61,73,76,.3);border-radius:8px;transition:background .2s;}
.cert:hover{background:var(--surface-container);}
.cert__head{display:flex;align-items:center;gap:12px;margin-bottom:8px;}
.cert__icon{width:40px;height:40px;border-radius:4px;background:rgba(221,227,235,.05);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.cert__title{font-size:14px;font-weight:700;color:var(--on-surface);}
.cert__rule{height:1px;width:100%;background:rgba(61,73,76,.2);margin:8px 0;}
.cert__tag{font-size:10px;color:var(--on-surface-variant);text-transform:uppercase;letter-spacing:.2em;}

.sys-deco{position:absolute;bottom:80px;left:50%;transform:translateX(-50%);opacity:.2;pointer-events:none;display:none;}
.sys-deco .mono{display:flex;gap:16px;align-items:center;font-size:14px;color:var(--on-surface-variant);}
.sys-deco__line{width:192px;height:1px;background:var(--outline-variant);}
.sys-deco__dots{display:flex;gap:4px;}
.sys-deco__dots i{width:4px;height:4px;border-radius:9999px;background:var(--primary);}
@media(min-width:768px){.sys-deco{display:block;}}

/* reveal */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1);}
.reveal.active{opacity:1;transform:translateY(0);}

@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.4;}}