@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root {
  --paper:#fafbfc;
  --ink:#16263b;
  --muted:#536478;
  --green:#087f77;
  --line:#dce4eb;
  --sans:'DM Sans',Arial,sans-serif;
  --heading:'Manrope',Arial,sans-serif;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:30px;
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.8 var(--sans);
  -webkit-font-smoothing:antialiased;
}
a {
  color:inherit;
  text-decoration:none;
}
button {
  font:inherit;
}
a:focus-visible,button:focus-visible {
  outline:3px solid #15ac9e;
  outline-offset:6px;
}
::selection {
  background:#b5e9e1;
}
h1,h2,h3,h4,p {
  margin-top:0;
}
.container,.site-header {
  width:min(1160px,calc(100% - 96px));
  margin-inline:auto;
}
.site-header {
  height:100px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
}
.wordmark {
  font:800 25px var(--heading);
  letter-spacing:-1.2px;
}
.wordmark span {
  color:var(--green);
}
nav {
  display:flex;
  align-items:center;
  gap:32px;
  font-size:13px;
  font-weight:600;
}
nav>a:hover,.text-link:hover {
  color:var(--green);
}
.nav-contact {
  border:1px solid #bac9d5;
  padding:9px 18px;
  border-radius:5px;
}
.nav-contact span {
  margin-left:18px;
}
.menu-toggle {
  display:none;
}
.skip-link {
  position:fixed;
  top:-100px;
  left:20px;
  z-index:20;
  background:var(--ink);
  color:white;
  padding:12px;
}
.skip-link:focus {
  top:10px;
}
.hero {
  padding-top:78px;
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:50px;
  align-items:center;
}
.eyebrow {
  font-size:10px;
  font-weight:700;
  letter-spacing:1.8px;
  line-height:1.7;
  margin-bottom:24px;
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--green);
}
.status-dot {
  width:7px;
  height:7px;
  flex-shrink:0;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 4px #e0f0ec;
}
h1,h2 {
  font-family:var(--heading);
  font-weight:700;
  letter-spacing:-2.7px;
  line-height:1.14;
}
h1 {
  font-size:clamp(40px,4.3vw,60px);
  margin-bottom:27px;
}
h1 em,h2 em {
  font-style:normal;
  color:var(--green);
}
.hero-description {
  font-size:16px;
  line-height:1.9;
  max-width:490px;
  color:var(--muted);
}
.hero-actions {
  display:flex;
  gap:26px;
  align-items:center;
  margin-top:31px;
}
.button {
  padding:13px 20px;
  font-size:12px;
  border-radius:5px;
  display:inline-flex;
  align-items:center;
  gap:24px;
  transition:background .2s,transform .2s;
}
.button-dark {
  background:var(--ink);
  color:white;
}
.button-dark:hover {
  background:var(--green);
  transform:translateY(-2px);
}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-size:12px;
  font-weight:600;
  border-bottom:1px solid #a9b9c4;
  padding-bottom:4px;
}
.architecture {
  margin:0;
  background:#0d1b2e;
  color:#e9f2f7;
  border:1px solid #243449;
  border-radius:10px;
  box-shadow:0 20px 50px #15263b18;
  overflow:hidden;
}
.architecture-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:15px 20px;
  border-bottom:1px solid #29394b;
  font:10px/1.5 monospace;
  letter-spacing:1px;
  color:#a6b7c9;
}
.diagram-dots {
  letter-spacing:3px;
  color:#5e738a;
}
.architecture-body {
  padding:24px 30px 19px;
  background-image:radial-gradient(#2d3e504f 1px,transparent 1px);
  background-size:16px 16px;
}
.diagram-label {
  font:10px/1.6 monospace;
  letter-spacing:2px;
  color:#6fd9cb;
  margin-bottom:19px;
}
.flow-node {
  display:flex;
  align-items:center;
  gap:14px;
  padding:13px 16px;
  background:#14253a;
  border:1px solid #30445b;
  border-radius:5px;
}
.node-icon {
  width:33px;
  height:33px;
  display:grid;
  place-items:center;
  border:1px solid #3f566d;
  border-radius:5px;
  font:22px monospace;
  color:#c1d0df;
}
.flow-node strong {
  display:block;
  font-size:13px;
  font-weight:500;
}
.flow-node small {
  display:block;
  color:#a8bbcd;
  font-size:10px;
  margin-top:2px;
}
.node-number {
  margin-left:auto;
  font:10px monospace;
  color:#8ba6bb;
}
.primary-node {
  background:#123a3d;
  border-color:#2b9186;
}
.primary-node .node-icon {
  color:#8ae5d6;
  border-color:#398f84;
}
.flow-line {
  height:26px;
  text-align:center;
  line-height:26px;
  color:#55bcae;
}
.observability {
  display:flex;
  align-items:center;
  gap:9px;
  border-top:1px dashed #385167;
  margin-top:20px;
  padding-top:14px;
  color:#b8cbd8;
  font-size:10px;
}
.observability span {
  color:#77d8c7;
}
.architecture figcaption {
  font-size:9px;
  color:#a2b5c6;
  padding:10px 20px;
  background:#101e30;
  letter-spacing:.4px;
}
.hero-foot {
  grid-column:1/-1;
  margin-top:8px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid var(--line);
  padding:23px 0;
  font-size:9px;
  letter-spacing:1px;
  color:var(--muted);
}
.hero-foot>a {
  font-size:11px;
  letter-spacing:0;
}
.hero-foot>a span {
  margin-left:15px;
}
.sep {
  margin:0 12px;
  color:#9cabba;
}
.section-pad {
  padding-block:96px;
}
.experience-section {
  background:#eef3f6;
  border-block:1px solid var(--line);
}
.section-grid {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:95px;
}
h2 {
  font-size:42px;
  margin-bottom:25px;
  letter-spacing:-1.8px;
}
.section-intro>p:not(.eyebrow) {
  font-size:14px;
  line-height:1.9;
  color:var(--muted);
  max-width:350px;
}
.section-intro>.text-link {
  margin-top:15px;
}
.timeline {
  border-left:1px solid #c8d6e1;
  padding-left:30px;
}
.experience {
  position:relative;
  padding:28px 0;
  border-bottom:1px solid #d0dce5;
}
.experience:first-child {
  padding-top:0;
}
.experience:last-child {
  border:0;
  padding-bottom:0;
}
.experience:before {
  content:'';
  position:absolute;
  left:-35px;
  top:39px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#8b9ead;
  border:2px solid #eef3f6;
}
.experience:first-child:before {
  top:11px;
  background:var(--green);
  box-shadow:0 0 0 4px #d6e6e6;
}
.experience-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
}
.company {
  font:700 22px var(--heading);
  letter-spacing:-.7px;
}
.date {
  font:10px var(--sans);
  color:var(--muted);
  letter-spacing:.6px;
}
.experience h3 {
  font-size:13px;
  font-weight:600;
  color:var(--green);
  margin:6px 0 16px;
}
.experience p {
  font-size:14px;
  line-height:1.85;
  color:var(--muted);
  margin-bottom:12px;
}
.tags {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:18px;
}
.tags>span {
  border:1px solid #ccd9e2;
  background:#ffffff55;
  border-radius:4px;
  padding:2px 10px;
  font-size:10px;
  color:#435c70;
}
.section-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  margin-bottom:42px;
}
.section-heading h2 {
  margin-bottom:0;
}
.project-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:36px;
}
.project-cover {
  min-height:225px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:#e6eef3;
  border:1px solid #d3dfe8;
  border-radius:7px;
  padding:24px 28px;
  color:#26465f;
  transition:background .2s;
}
.project-cover:hover {
  background:#dae7ed;
}
.project-cover.alternate {
  background:#e3efec;
  color:#225d57;
  border-color:#cddfd9;
}
.cover-index {
  font:10px monospace;
  letter-spacing:1.4px;
}
.cover-symbol {
  font:48px monospace;
  letter-spacing:-5px;
  align-self:center;
  opacity:.65;
}
.project-cover>span:last-child {
  display:flex;
  justify-content:space-between;
  font-size:12px;
}
.project-detail {
  padding-top:23px;
}
.project-number {
  font-size:9px;
  letter-spacing:1.3px;
  color:var(--muted);
}
.project h3 {
  font:600 23px var(--heading);
  letter-spacing:-.7px;
  margin:8px 0 12px;
}
.project h3 a {
  display:flex;
  justify-content:space-between;
  gap:15px;
}
.project h3 a:hover {
  color:var(--green);
}
.project-detail>p,.project-compact p {
  font-size:14px;
  color:var(--muted);
  line-height:1.85;
  margin-bottom:10px;
}
.project-compact {
  grid-column:1/-1;
  border-block:1px solid var(--line);
  display:flex;
  align-items:center;
  gap:26px;
  padding:28px 0;
}
.compact-icon {
  min-width:70px;
  height:70px;
  background:#e7edf2;
  border:1px solid #d6e0e8;
  border-radius:5px;
  display:grid;
  place-items:center;
  font-size:30px;
  color:var(--green);
}
.project-compact h3 {
  font-size:20px;
}
.project-compact h3 a {
  justify-content:flex-start;
}
.project-compact h3 a>span {
  display:none;
}
.compact-link {
  margin-left:auto;
  font-size:24px;
  padding:10px;
}
.about-section {
  background:#eef3f6;
  border-block:1px solid var(--line);
}
.education {
  border-top:1px solid #ccd8e2;
  padding-top:24px;
  margin-top:30px;
}
.education .eyebrow {
  margin-bottom:9px;
  font-size:9px;
}
.education h3 {
  font-size:14px;
  margin-bottom:5px;
}
.education p {
  font-size:12px;
  color:var(--muted);
  margin:0;
}
.toolbox {
  display:flex;
  flex-direction:column;
}
.toolbox>h3 {
  order:-1;
  font:600 22px var(--heading);
  margin-bottom:25px;
}
.skill-group {
  border-bottom:1px solid #ccd8e2;
  padding-bottom:18px;
  margin-bottom:20px;
}
.skill-group h4,.certifications h4 {
  font-size:10px;
  letter-spacing:1.3px;
  color:var(--green);
  margin-bottom:8px;
}
.skill-group p {
  font-size:14px;
  margin:0;
  line-height:2;
}
.skill-group p>span {
  margin:0 6px;
  color:#95a8b8;
}
.certifications>div {
  display:flex;
  gap:14px;
  margin-top:15px;
}
.certifications>div>span {
  color:var(--green);
}
.certifications p {
  font-size:13px;
  margin:0;
}
.certifications small {
  display:block;
  font-size:11px;
  color:var(--muted);
}
.contact-section {
  text-align:center;
}
.contact-section>.eyebrow {
  justify-content:center;
}
.contact-section h2 {
  font-size:52px;
}
.contact-section>p:not(.eyebrow) {
  font-size:14px;
  color:var(--muted);
  margin-bottom:30px;
}
.contact-email {
  display:inline-flex;
  align-items:center;
  gap:30px;
  max-width:100%;
  overflow-wrap:anywhere;
  font:500 25px var(--heading);
  letter-spacing:-.8px;
  padding-bottom:14px;
  border-bottom:1px solid #a9b9c4;
}
.contact-email:hover {
  color:var(--green);
}
.contact-links {
  display:flex;
  justify-content:center;
  gap:28px;
  margin-top:28px;
}
.contact-links .text-link {
  border:0;
}
.site-footer {
  border-top:1px solid var(--line);
  padding-block:28px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}
.site-footer .wordmark {
  font-size:20px;
}
.site-footer p,.site-footer>a:last-child {
  font-size:11px;
  color:var(--muted);
  margin:0;
}
@media(min-width:1500px) {
  .hero {
    padding-top:100px;
  }
  .hero-foot {
    margin-top:30px;
  }
}
@media(max-width:1000px) {
  .container,.site-header {
    width:calc(100% - 64px);
  }
  .hero {
    gap:30px;
  }
  .hero-actions {
    gap:16px;
    flex-wrap:wrap;
  }
  .section-grid {
    gap:45px;
    grid-template-columns:.85fr 1.15fr;
  }
  .architecture-body {
    padding:22px 20px;
  }
  .section-pad {
    padding-block:75px;
  }
  h2 {
    font-size:36px;
  }
  .hero-foot {
    font-size:8px;
  }
  .hero-foot>a {
    font-size:10px;
  }
  .sep {
    margin:0 5px;
  }
}
@media(max-width:720px) {
  .container,.site-header {
    width:calc(100% - 40px);
  }
  .site-header {
    height:78px;
    position:relative;
    z-index:10;
  }
  .wordmark {
    font-size:23px;
  }
  .menu-toggle {
    display:flex;
    align-items:center;
    gap:12px;
    border:0;
    background:transparent;
    color:var(--ink);
    padding:10px;
    font-size:12px;
  }
  .menu-toggle>span {
    font-size:20px;
  }
  nav {
    position:absolute;
    top:77px;
    left:-20px;
    right:-20px;
    padding:20px;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    background:var(--paper);
    border-bottom:1px solid var(--line);
    box-shadow:0 15px 20px #15263b10;
  }
  nav[data-collapsible]:not(.is-open) {
    display:none;
  }
  nav>a {
    min-height:44px;
    display:flex;
    align-items:center;
  }
  .nav-contact {
    justify-content:space-between;
  }
  .hero {
    padding-top:46px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:32px;
  }
  h1 {
    font-size:clamp(34px,8.8vw,58px);
    letter-spacing:-1.8px;
  }
  .hero .eyebrow {
    font-size:9px;
    letter-spacing:1px;
  }
  .hero-description {
    font-size:15px;
  }
  .hero-actions {
    margin-top:24px;
    gap:18px;
  }
  .hero-actions .text-link {
    font-size:11px;
  }
  .architecture {
    width:100%;
    max-width:470px;
    align-self:center;
  }
  .architecture-body {
    padding:22px 25px;
  }
  .hero-foot {
    margin-top:0;
    display:block;
    padding:20px 0;
    text-align:center;
    font-size:8px;
    letter-spacing:.6px;
  }
  .hero-foot>a {
    display:none;
  }
  .section-pad {
    padding-block:58px;
  }
  .section-grid {
    grid-template-columns:1fr;
    gap:32px;
  }
  h2 {
    font-size:36px;
    letter-spacing:-1.5px;
  }
  .section-intro>p:not(.eyebrow) {
    max-width:100%;
  }
  .timeline {
    padding-left:22px;
  }
  .experience:before {
    left:-27px;
  }
  .experience-top {
    flex-wrap:wrap;
    gap:6px;
  }
  .date {
    font-size:9px;
  }
  .section-heading {
    display:block;
    margin-bottom:28px;
  }
  .section-heading>.text-link {
    margin-top:20px;
  }
  .text-link {
    min-height:44px;
  }
  .project-grid {
    grid-template-columns:1fr;
    gap:32px;
  }
  .project-cover {
    min-height:205px;
  }
  .project-compact {
    gap:15px;
    align-items:flex-start;
  }
  .compact-icon {
    min-width:42px;
    height:42px;
    font-size:24px;
    margin-top:6px;
  }
  .project-compact h3 {
    font-size:18px;
    line-height:1.5;
  }
  .compact-link {
    display:none;
  }
  .toolbox {
    border-top:1px solid var(--line);
    padding-top:28px;
  }
  .contact-section h2 {
    font-size:40px;
  }
  .contact-email {
    font-size:clamp(14px,4.3vw,24px);
    gap:12px;
    letter-spacing:-.4px;
  }
  .contact-section>p br {
    display:none;
  }
  .site-footer {
    flex-wrap:wrap;
    gap:15px;
  }
  .site-footer>a:last-child {
    display:none;
  }
  .site-footer p {
    font-size:10px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
}

.experience-highlights {
  margin: 18px 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.85;
}
.experience-highlights li {
  padding-left: 4px;
  margin-bottom: 12px;
}
.experience-highlights li::marker {
  color: var(--green);
}
.experience-highlights strong {
  color: var(--ink);
  font-weight: 600;
}