@font-face{font-family:"IBM Plex Sans";src:url("../portfolio/fonts/ibm-plex-sans-latin-300-normal.woff2") format("woff2");font-style:normal;font-weight:300;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("../portfolio/fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../portfolio/fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}

:root{--ground:#09090a;--ink:#f2f1ed;--muted:#aaa9a4;--signal:#c8ff32;--edge:clamp(20px,3vw,48px)}
*{box-sizing:border-box}
html{background:var(--ground)}
body{margin:0;background:var(--ground);color:var(--ink);font-family:"IBM Plex Sans",Arial,sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none;transition:color .2s ease}
a:hover,a:focus-visible{color:var(--signal)}
main{min-height:100svh;padding:0 var(--edge);display:grid;grid-template-rows:auto 1fr auto}
header,footer{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px;font:clamp(12px,.82vw,14px)/1.3 "IBM Plex Mono",monospace;letter-spacing:.055em;text-transform:uppercase}
header{border-bottom:1px solid rgba(242,241,237,.2)}
header span{color:var(--muted)}
.identity{font-weight:400}
.intro{align-self:end;padding:clamp(80px,12vh,150px) 0 clamp(60px,9vh,110px);display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(18px,2.3vw,36px)}
.eyebrow{grid-column:1/4;margin:8px 0 0;color:var(--muted);font:clamp(13px,.9vw,15px)/1.4 "IBM Plex Mono",monospace;letter-spacing:.04em}
h1{grid-column:4/13;margin:0;font-size:clamp(54px,9vw,154px);font-weight:300;line-height:.88;letter-spacing:-.06em}
.statement{grid-column:7/12;margin:clamp(34px,5vw,70px) 0 0;max-width:40ch;font-size:clamp(19px,1.55vw,27px);line-height:1.34;letter-spacing:-.018em}
.statement p{margin:0}
.statement .closing{margin-top:1.1em;color:var(--signal);max-width:31ch}
footer{min-height:110px;border-top:1px solid rgba(242,241,237,.2)}
footer p{margin:0;color:var(--muted);text-transform:none;letter-spacing:0;font-family:"IBM Plex Sans",Arial,sans-serif;font-size:clamp(14px,1vw,17px)}
footer nav{display:flex;gap:clamp(22px,3vw,46px)}
@media(max-width:760px){
  header{align-items:flex-start;padding:22px 0}header span{max-width:12ch;text-align:right}
  .intro{display:block;align-self:center;padding:72px 0}
  .eyebrow{margin:0 0 24px}
  h1{font-size:clamp(50px,15vw,86px);line-height:.91}
  .statement{margin:40px 0 0;max-width:28ch}
  footer{align-items:flex-end;padding:24px 0;flex-direction:column-reverse}
  footer p{align-self:flex-start}footer nav{align-self:flex-end}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}