:root {
  color-scheme:dark;
  --bg:#111111;
  --panel:#171717;
  --text:#f0eee9;
  --muted:#a09f9a;
  --line:#343431;
  --orange:#ff8200;
  --sans:'Manrope',Arial,sans-serif;
  --display:'Space Grotesk',Arial,sans-serif;
  --mono:'IBM Plex Mono',monospace;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:35px;
}
body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-size:15px;
  line-height:1.75;
}
a {
  color:inherit;
  text-decoration:none;
}
button {
  font:inherit;
}
a,button {
  -webkit-tap-highlight-color:transparent;
}
a:focus-visible,button:focus-visible {
  outline:2px solid var(--orange);
  outline-offset:7px;
}
::selection {
  background:var(--orange);
  color:var(--bg);
}
.wrap {
  width:min(1240px,calc(100% - 112px));
  margin-inline:auto;
}
.orange {
  color:var(--orange);
}
.muted {
  color:var(--muted);
}
.tiny-label,.eyebrow,.project-kicker,.visual-top,.pipeline-labels {
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:1px;
}
.site-header {
  height:112px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
}
.wordmark {
  font-family:var(--display);
  font-size:36px;
  font-weight:700;
  letter-spacing:-3px;
  line-height:1;
}
.wordmark span {
  color:var(--orange);
}
nav {
  display:flex;
  gap:38px;
  font-size:13px;
}
nav a:hover,footer a:hover {
  color:var(--orange);
}
nav a:last-child span {
  margin-left:12px;
  color:var(--orange);
}
.hero {
  padding-top:63px;
  padding-bottom:49px;
  border-bottom:1px solid var(--line);
  margin-bottom:77px;
}
.eyebrow {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:10px;
}
.status-dot {
  display:inline-block;
  width:6px;
  height:6px;
  background:var(--orange);
  border-radius:50%;
  flex-shrink:0;
}
.eyebrow-divider {
  color:#646460;
  margin:0 6px;
}
.hero-heading {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,320px);
  align-items:center;
  gap:40px;
  margin:38px 0 43px;
}
.hero-portrait {
  display:block;
  width:100%;
  height:auto;
  border:1px solid var(--line);
  border-radius:3px;
}
.hero-heading .headline {
  margin:0;
}
.headline {
  font-family:var(--display);
  font-weight:600;
  font-size:clamp(75px,8.7vw,125px);
  line-height:1.02;
  letter-spacing:-7px;
  margin:38px 0 43px;
}
.headline>span {
  display:block;
  height:1.08em;
}
.hero-bottom {
  display:flex;
  justify-content:space-between;
  gap:40px;
  align-items:end;
}
.hero-intro {
  font-size:17px;
  line-height:1.7;
  margin:0 0 25px;
  color:#c5c4bf;
}
.hero-actions {
  display:flex;
  align-items:center;
  gap:29px;
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:42px;
  padding:12px 22px;
  background:var(--orange);
  color:#111;
  font-weight:700;
  font-size:13px;
  border:1px solid var(--orange);
  transition:background .2s;
}
.button:hover {
  background:#ff9c36;
}
.text-link {
  display:inline-flex;
  gap:20px;
  align-items:center;
  font-size:13px;
  font-weight:600;
  border-bottom:1px solid #62615c;
  padding-bottom:5px;
}
.text-link span {
  color:var(--orange);
}
.text-link:hover {
  color:var(--orange);
  border-color:var(--orange);
}
.hero-note {
  min-width:242px;
}
.hero-note .tiny-label {
  color:var(--muted);
}
.hero-note p {
  font-size:13px;
  color:#b5b4af;
  margin:10px 0 15px;
}
.scroll-link {
  font-family:var(--mono);
  font-size:11px;
  display:flex;
  justify-content:space-between;
}
.scroll-link span {
  color:var(--orange);
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:31px;
}
.section-heading h2 {
  font-size:21px;
  letter-spacing:-.6px;
  font-weight:500;
  margin:0;
}
.section-number {
  font:11px var(--mono);
  letter-spacing:0;
  color:var(--orange);
  margin-right:22px;
}
.section-heading>.tiny-label {
  color:var(--muted);
  font-size:9px;
}
.featured-project {
  border:1px solid var(--line);
  display:grid;
  grid-template-columns:1.05fr 1fr;
  background:var(--panel);
}
.project-copy {
  padding:36px;
}
.project-kicker {
  display:flex;
  justify-content:space-between;
  gap:15px;
  color:var(--muted);
  font-size:9px;
}
.project-copy h3 {
  font-family:var(--display);
  font-size:47px;
  line-height:1.2;
  letter-spacing:-2px;
  margin:30px 0 10px;
}
.project-subtitle {
  font-size:16px;
  color:var(--text)!important;
  margin-top:0!important;
}
.project-copy>p,.project-card>p {
  font-size:13px;
  color:var(--muted);
  line-height:1.85;
}
.tags {
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  padding:0;
  margin:24px 0;
}
.tags li {
  font:9px var(--mono);
  color:#c1c0b9;
  border:1px solid #3b3b36;
  padding:6px 9px;
}
.project-links {
  display:flex;
  gap:24px;
  align-items:center;
  flex-wrap:wrap;
}
.project-visual {
  border-left:1px solid var(--line);
  padding:28px;
  background-color:#1d1e19;
  background-image:radial-gradient(#6b6d4836 .8px,transparent .8px);
  background-size:16px 16px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
}
.visual-top {
  display:flex;
  justify-content:space-between;
  color:#babba5;
  font-size:8px;
}
.pipeline-art {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:30px 8px 0;
  height:174px;
  gap:8px;
}
.image-stack {
  width:90px;
  height:102px;
  position:relative;
  flex-shrink:0;
}
.image-stack>div {
  position:absolute;
  width:80px;
  height:96px;
  border:1px solid #85866b;
  background:#26271f;
  transform:rotate(-12deg);
  top:0;
  left:0;
}
.image-stack>div:nth-child(2) {
  transform:rotate(-5deg);
  left:4px;
  top:3px;
}
.image-stack>div:last-child {
  transform:rotate(3deg);
  left:8px;
  top:6px;
  color:#e4e3c9;
  display:flex;
  align-items:center;
}
.image-stack svg {
  width:100%;
}
.pipeline-connector {
  color:#898b6b;
}
.model-grid {
  width:64px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:5px;
  transform:rotate(-8deg);
}
.model-grid i {
  aspect-ratio:1;
  background:#9fa27838;
  border:1px solid #989b6c;
}
.model-grid i:nth-child(3n+1) {
  background:#ff820040;
  border-color:#ff8200;
}
.output-mark {
  font-family:var(--display);
  font-size:40px;
  line-height:1.2;
  color:var(--orange);
}
.output-mark span {
  font:9px var(--mono);
  display:block;
  letter-spacing:2px;
  color:#c0c2a6;
  text-align:center;
}
.pipeline-labels {
  display:flex;
  justify-content:space-between;
  font-size:7px;
  color:#b0b29a;
  margin-top:12px;
}
.visual-caption {
  font-family:var(--display);
  font-size:24px;
  line-height:1.35;
  letter-spacing:-.5px;
  color:#dddfcb;
  margin:29px 0;
}
.project-stats {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid #474936;
  padding-top:16px;
  gap:10px;
}
.project-stats strong {
  display:block;
  font-family:var(--display);
  font-size:27px;
  font-weight:500;
}
.project-stats span {
  font-family:var(--mono);
  font-size:8px;
  color:#b0b29a;
  display:block;
}
.metric-note {
  font:8px var(--mono);
  color:#a1a38c;
  margin:15px 0 0;
}
.other-projects {
  display:grid;
  grid-template-columns:1fr 1fr;
  margin-top:20px;
  gap:20px;
}
.project-card {
  padding:30px 34px 34px;
  border:1px solid var(--line);
  display:flex;
  flex-direction:column;
}
.card-top {
  min-height:45.5px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:var(--muted);
}
.project-card h3 {
  font:500 29px var(--display);
  letter-spacing:-1px;
  margin:27px 0 10px;
}
.project-card>.project-subtitle {
  font-size:15px;
  margin-bottom:3px;
}
.project-card .tags {
  margin-top:auto;
  padding-top:15px;
}
.project-card .text-link {
  align-self:start;
}
.about {
  padding-top:98px;
  padding-bottom:93px;
}
.about-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:65px;
  margin-top:42px;
}
.about-statement {
  font-family:var(--display);
  font-size:clamp(28px,3vw,43px);
  line-height:1.3;
  letter-spacing:-1.5px;
}
.about-copy>p {
  margin:0 0 18px;
  color:var(--muted);
  font-size:14px;
}
.experience {
  border-top:1px solid var(--line);
  margin:28px 0 24px;
  padding-top:25px;
}
.experience h3 {
  font-size:15px;
  font-weight:500;
  margin:13px 0 2px;
}
.experience h3 span {
  display:block;
  font-size:12px;
  color:var(--muted);
  font-weight:400;
  margin-top:2px;
}
.experience>.tiny-label:not(.orange) {
  font-size:9px;
  color:var(--muted);
}
.experience p {
  font-size:13px;
  color:var(--muted);
  margin-bottom:0;
}
.contact {
  border-top:1px solid var(--line);
  padding-top:49px;
  padding-bottom:65px;
}
.contact h2 {
  font-family:var(--display);
  font-size:clamp(45px,6.5vw,88px);
  font-weight:500;
  line-height:1.08;
  letter-spacing:-4px;
  margin:25px 0 30px;
}
.contact-bottom {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:30px;
}
.contact-bottom p {
  font-size:13px;
  color:var(--muted);
  margin:0;
}
.contact-email {
  font-size:clamp(15px,1.8vw,24px);
  letter-spacing:-.5px;
  border-bottom:1px solid #67655e;
  padding-bottom:8px;
}
.contact-email span {
  color:var(--orange);
  margin-left:20px;
}
.contact-email:hover {
  color:var(--orange);
}
.footer-main {
  border-top:1px solid var(--line);
  padding:24px 0;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font:10px var(--mono);
  color:var(--muted);
}
.footer-main>div {
  display:flex;
  gap:25px;
}
.vols {
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:var(--orange);
  font:500 18px var(--display);
  margin:15px 0 30px;
}
.vols span {
  font-size:32px;
}
.skip-link {
  position:fixed;
  left:15px;
  top:-80px;
  padding:10px 20px;
  background:var(--orange);
  color:#111;
  z-index:10;
}
.skip-link:focus {
  top:10px;
}
@media(min-width:1500px) {
  .headline {
    font-size:132px;
  }
}
@media(max-width:1000px) {
  .wrap {
    width:calc(100% - 64px);
  }
  .project-copy {
    padding:27px;
  }
  .project-visual {
    padding:23px;
  }
  .project-kicker {
    font-size:8px;
  }
  .project-links {
    gap:16px;
  }
  .pipeline-art {
    padding-inline:0;
  }
  .model-grid {
    width:48px;
  }
  .image-stack {
    width:75px;
  }
  .image-stack>div {
    width:65px;
    height:86px;
  }
  .output-mark {
    font-size:32px;
  }
  .section-heading>.tiny-label {
    display:none;
  }
  .project-card {
    padding:26px;
  }
  .about-grid {
    gap:38px;
  }
  .hero-note {
    min-width:220px;
  }
}
@media(max-width:720px) {
  .wrap {
    width:calc(100% - 40px);
  }
  .site-header {
    height:83px;
  }
  nav {
    gap:22px;
    font-size:12px;
  }
  .wordmark {
    font-size:31px;
  }
  .hero {
    padding-top:37px;
    padding-bottom:30px;
    margin-bottom:46px;
  }
  .eyebrow {
    font-size:8px;
    letter-spacing:.45px;
    gap:8px;
    flex-wrap:wrap;
  }
  .eyebrow-divider {
    margin:0;
  }
  .headline {
    font-size:clamp(54px,12vw,85px);
    letter-spacing:-3.5px;
    margin:32px 0;
  }
  .hero-bottom {
    display:block;
  }
  .hero-intro {
    font-size:15px;
  }
  .desktop-break {
    display:none;
  }
  .hero-note {
    margin-top:35px;
    display:grid;
    grid-template-columns:1fr auto;
    gap:7px 15px;
  }
  .hero-note .tiny-label {
    grid-column:1/-1;
    font-size:8px;
  }
  .hero-note p {
    margin:0;
    font-size:12px;
  }
  .scroll-link {
    align-items:center;
    gap:15px;
    font-size:10px;
  }
  .featured-project {
    grid-template-columns:1fr;
  }
  .project-copy {
    padding:25px;
  }
  .project-copy h3 {
    font-size:40px;
    margin-top:24px;
  }
  .project-visual {
    border-left:0;
    border-top:1px solid var(--line);
    padding:24px;
  }
  .pipeline-art {
    height:154px;
    justify-content:space-around;
  }
  .pipeline-labels {
    justify-content:space-around;
  }
  .image-stack {
    width:90px;
  }
  .image-stack>div {
    width:80px;
    height:96px;
  }
  .model-grid {
    width:64px;
  }
  .output-mark {
    font-size:40px;
  }
  .visual-caption {
    margin-top:30px;
  }
  .other-projects {
    grid-template-columns:1fr;
  }
  .project-card h3 {
    margin-top:20px;
  }
  .about {
    padding-top:58px;
    padding-bottom:56px;
  }
  .about-grid {
    grid-template-columns:1fr;
    gap:26px;
    margin-top:28px;
  }
  .about-statement {
    font-size:34px;
  }
  .section-heading h2 {
    font-size:19px;
  }
  .section-number {
    margin-right:15px;
  }
  .contact {
    padding-top:34px;
    padding-bottom:40px;
  }
  .contact h2 {
    letter-spacing:-2.5px;
  }
  .contact-bottom {
    display:block;
  }
  .contact-email {
    display:inline-block;
    margin-top:25px;
    font-size:19px;
  }
  .footer-main {
    flex-direction:column;
    font-size:9px;
    gap:15px;
  }
  .footer-main>div {
    justify-content:space-between;
  }
  .vols {
    margin-top:0;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    transition:none!important;
  }
}

@media(min-width:721px) and (max-width:1000px) {
  .hero-heading {
    grid-template-columns:minmax(0,1fr) minmax(0,27vw);
    gap:24px;
  }
}
@media(max-width:720px) {
  .hero-heading {
    grid-template-columns:minmax(0,1fr);
    gap:28px;
    margin:32px 0;
  }
  .hero-portrait {
    width:min(100%,280px);
    justify-self:center;
  }
}
