:root{--ink:#0a1220;--muted:#5f6875;--paper:#f4f6f8;--white:#fff;--blue:#2f70ff;--cyan:#3de1c5;--line:#d9dee5;--display:"Space Grotesk",sans-serif;--body:"DM Sans",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65}a{color:inherit}button,a{touch-action:manipulation}.site-header{height:84px;padding:0 clamp(24px,5vw,72px);display:flex;align-items:center;justify-content:space-between;background:rgba(244,246,248,.92);backdrop-filter:blur(18px);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(10,18,32,.08)}.brand{font:700 1.5rem var(--display);text-decoration:none;letter-spacing:-.05em}.brand span{color:var(--blue)}nav{display:flex;align-items:center;gap:34px}nav a{font-size:.93rem;font-weight:600;text-decoration:none}nav a:hover{color:var(--blue)}.nav-cta{padding:10px 18px;border:1px solid var(--ink)}.menu-toggle{display:none;border:0;background:none;font:600 .95rem var(--body)}main{overflow:hidden}.hero{min-height:calc(100vh - 84px);display:grid;grid-template-columns:minmax(0,1.42fr) minmax(360px,.58fr);padding:clamp(48px,8vw,110px) clamp(24px,6vw,90px);gap:6vw;align-items:center;background:linear-gradient(110deg,#f4f6f8 0%,#fff 60%,#eef3ff 100%)}.eyebrow{display:flex;align-items:center;gap:11px;text-transform:uppercase;letter-spacing:.11em;font-size:.78rem;font-weight:700;color:#46505e}.eyebrow span{width:34px;height:2px;background:var(--blue)}h1,h2,h3{font-family:var(--display);margin-top:0}h1{max-width:950px;font-size:clamp(3.2rem,6.2vw,6.8rem);letter-spacing:-.065em;line-height:.96;margin:30px 0 32px}h1 em{font-style:normal;color:var(--blue)}.hero-lead{font-size:clamp(1.05rem,1.4vw,1.3rem);max-width:720px;color:var(--muted)}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:38px}.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;padding:15px 22px;text-decoration:none;font-weight:700;border:1px solid var(--ink);transition:.2s}.button.primary{background:var(--ink);color:white}.button.primary:hover{background:var(--blue);border-color:var(--blue);transform:translateY(-2px)}.button.secondary:hover{background:white}.hero-panel{align-self:stretch;min-height:500px;background:var(--ink);color:white;padding:34px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.hero-panel:before{content:"";position:absolute;width:320px;height:320px;border:1px solid rgba(61,225,197,.42);border-radius:50%;top:42%;left:50%;transform:translate(-50%,-50%)}.panel-index{font-size:.75rem;letter-spacing:.14em;color:#aab4c3}.monogram{font:700 clamp(12rem,20vw,20rem)/.8 var(--display);color:var(--cyan);letter-spacing:-.12em;align-self:center;z-index:1}.panel-bottom{display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid #344052;padding-top:20px}.panel-bottom div{display:flex;flex-direction:column}.panel-bottom span{font-size:.75rem;color:#8f9aaa}.panel-bottom strong{font-size:.9rem}.section{padding:110px clamp(24px,6vw,90px);display:grid;grid-template-columns:160px 1fr;gap:5vw;border-top:1px solid var(--line)}.section-label{text-transform:uppercase;letter-spacing:.1em;font-size:.76rem;font-weight:700;color:var(--blue);padding-top:10px}.about-content h2,.section-heading h2,.timeline-wrap>h2{font-size:clamp(2.3rem,4.3vw,4.8rem);line-height:1.05;letter-spacing:-.055em;margin-bottom:42px;max-width:1050px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:5vw;color:var(--muted);font-size:1.08rem}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:50px}.section-heading h2{margin:0}.section-heading p{max-width:390px;color:var(--muted);margin:0}.skills,.project-section{background:#fff}.skill-grid{grid-column:2;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);border-left:1px solid var(--line)}.skill-card{min-height:210px;padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.skill-card>span,.project-number{font:600 .74rem var(--display);color:var(--blue)}.skill-card h3{font-size:1.65rem;margin:46px 0 9px}.skill-card p{margin:0;color:var(--muted)}.project-card{grid-column:2;display:grid;grid-template-columns:1.05fr .95fr;background:var(--ink);color:white}.project-visual{margin:28px;background:#e8edf4;min-height:500px;color:var(--ink);box-shadow:0 20px 60px #05080d}.window-bar{height:44px;background:white;display:flex;align-items:center;gap:7px;padding:0 13px;border-bottom:1px solid #d5dbe3}.window-bar i{width:9px;height:9px;border-radius:50%;background:#d4dae2}.window-bar i:first-child{background:#ff6d64}.window-bar span{font:600 .65rem var(--display);margin-left:auto;color:#6d7581}.app-preview{height:calc(100% - 44px);display:grid;grid-template-columns:36% 64%}.preview-sidebar{background:#101a2a;color:white;padding:32px 22px;display:flex;flex-direction:column;gap:20px;font-size:.78rem}.preview-sidebar b{font:700 .95rem var(--display);color:var(--cyan);margin-bottom:26px}.preview-sidebar span{padding:9px}.preview-sidebar .active{background:var(--blue)}.preview-main{padding:60px 7%;display:flex;flex-direction:column}.preview-main small{color:var(--blue);font-weight:700;letter-spacing:.1em}.preview-main>strong{font:700 clamp(1.6rem,3vw,2.7rem) var(--display);margin:10px 0 40px}.preview-row{display:flex;align-items:center;gap:12px;background:white;padding:15px;margin-bottom:12px;font-size:.8rem}.preview-row i{width:10px;height:10px;background:var(--cyan)}.project-copy{padding:48px 48px 52px}.project-copy>div:first-child{display:flex;justify-content:space-between}.status{font-size:.75rem;color:var(--cyan);text-transform:uppercase;letter-spacing:.1em}.project-copy h3{font-size:clamp(2rem,3vw,3.5rem);line-height:1.05;letter-spacing:-.04em;margin:54px 0 22px}.project-copy>p{color:#aeb8c7}.project-features{list-style:none;padding:0;margin:28px 0}.project-features li{padding:10px 0;border-bottom:1px solid #2d394b}.project-features li:before{content:"✓";color:var(--cyan);margin-right:12px}.tags{display:flex;gap:8px;flex-wrap:wrap;margin:26px 0 34px}.tags span{font-size:.73rem;border:1px solid #3d4858;padding:5px 9px}.text-link{color:var(--cyan);font-weight:700;text-decoration:none;border-bottom:1px solid var(--cyan);padding-bottom:5px}.timeline-wrap{grid-column:2}.timeline article{display:grid;grid-template-columns:220px 1fr;gap:40px;padding:36px 0;border-top:1px solid var(--line)}.time{font-weight:700;color:var(--blue)}.timeline h3{font-size:1.55rem;margin-bottom:6px}.timeline p{color:var(--muted);max-width:780px}.timeline .place{color:var(--ink);font-weight:600}.certs{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:32px}.certs h3{margin:0 auto 0 0}.certs span{border:1px solid var(--line);padding:8px 13px;font-size:.85rem}.contact{background:var(--blue);color:white;padding:clamp(80px,11vw,150px) clamp(24px,10vw,150px)}.eyebrow.light{color:#dbe6ff}.eyebrow.light span{background:var(--cyan)}.contact h2{font-size:clamp(2.8rem,6vw,6.5rem);line-height:1;letter-spacing:-.06em;max-width:1100px;margin:35px 0}.contact>p:not(.eyebrow){font-size:1.18rem;max-width:700px;color:#dfe7ff}.contact-email{display:inline-flex;gap:15px;font:600 clamp(1.15rem,2vw,1.8rem) var(--display);margin-top:40px;text-decoration:none;border-bottom:2px solid var(--cyan);padding-bottom:8px}.contact-links{display:flex;gap:28px;flex-wrap:wrap;margin-top:72px;padding-top:28px;border-top:1px solid rgba(255,255,255,.28);font-size:.9rem}.contact-links a{font-weight:700}footer{display:flex;justify-content:space-between;align-items:center;padding:32px clamp(24px,6vw,90px);background:var(--ink);color:white}footer p,footer>a:last-child{font-size:.82rem;color:#a9b3c1}footer>a:last-child{text-decoration:none}.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:980px){nav{gap:18px}.hero{grid-template-columns:1fr}.hero-panel{min-height:410px}.monogram{font-size:15rem}.section{grid-template-columns:1fr}.section-label{margin-bottom:25px}.skill-grid,.project-card,.timeline-wrap{grid-column:1}.skill-grid{grid-template-columns:repeat(2,1fr)}.project-card{grid-template-columns:1fr}.project-visual{min-height:440px}.section-heading{align-items:start;flex-direction:column}.about-grid{gap:30px}.timeline article{grid-template-columns:180px 1fr}}
@media(max-width:720px){.site-header{height:70px}.menu-toggle{display:block}nav{position:absolute;top:70px;left:0;right:0;background:var(--paper);padding:22px 24px 28px;display:none;flex-direction:column;align-items:stretch;border-bottom:1px solid var(--line)}nav.open{display:flex}.nav-cta{text-align:center}.hero{min-height:auto;padding-top:70px}.hero-panel{min-height:360px}.section{padding-top:76px;padding-bottom:76px}.about-grid,.skill-grid{grid-template-columns:1fr}.skill-card{min-height:170px}.skill-card h3{margin-top:28px}.project-visual{margin:16px;min-height:330px}.project-copy{padding:34px 26px 42px}.preview-sidebar{padding:25px 12px}.preview-sidebar span{font-size:.65rem;padding:6px}.preview-main{padding-top:40px}.preview-row{padding:10px;font-size:.62rem}.timeline article{grid-template-columns:1fr;gap:10px}.contact-links{flex-direction:column;gap:10px}footer{gap:18px;flex-wrap:wrap}h1{font-size:clamp(3rem,15vw,5rem)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}

.skill-card .skill-detail{margin-top:14px;font-size:.9rem}.upcoming{grid-column:2;border:1px dashed var(--line);padding:32px;background:var(--paper)}.upcoming h3{font-size:1.7rem;margin:16px 0 8px}.upcoming p{margin:0;color:var(--muted)}.certs+ .certs{margin-top:28px}.certs h3{flex-basis:100%;margin-bottom:12px}.panel-bottom{grid-template-columns:1fr}.panel-bottom strong{overflow-wrap:anywhere}@media(max-width:980px){.upcoming{grid-column:1}}

.monogram {
  letter-spacing: 0;
}
.certs a {
  display: inline-block;
  border: 1px solid var(--line);
  padding: 8px 13px;
  font-size: .85rem;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 4px;
  transition: background-color .2s, color .2s, border-color .2s;
}

.certs a:hover {
  background-color: var(--blue);
  border-color: var(--blue);
  color: white;
}

.certs a:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 4px;
}
