@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
:root {
  --paper:#f7faff;
  --ink:#182d4b;
  --muted:#586a80;
  --accent:#3057ce;
  --line:#d4deeb;
  --green:#e0edf1;
  --selection:#c8d9ff;
  --control-border:#acbdd4;
  --dot-grid:#c6d5e5;
  --live-node:#467d92;
  --quiet-heading:#708399;
  --card-shadow:#1835500a;
  --company-surface:#eaf0fc;
  --product-surface:#e4f1f3;
  --pill-border:#b3c4d7;
  --arrow-border:#adbfce;
  --card-text:#4b6079;
  --card-rule:#c6d5e3;
  --card-caption:#455e76;
  --volume-border:#578291;
  --volume-ring:#57829170;
  --volume-fill:#72a4ae30;
  --volume-detail:#82acb590;
  --volume-shadow:#d3e8ef66;
  --volume-caption:#577987;
  --separator:#8fa8bd;
  --interest-surface:#edf2fa;
  --interest-rule:#cedae8;
  --interest-icon:#457c92;
  --link-rule:#a4bacd;
  --tag-border:#c3d2e5;
  --contact-surface:#e4ebfa;
  --contact-border:#ced9ed;
  --contact-rule:#aabbdb;
  --network-line:#7c98b3;
  --network-node:#4e8598;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:30px;
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'DM Sans',sans-serif;
  -webkit-font-smoothing:antialiased;
}
a {
  color:inherit;
  text-decoration:none;
}
button {
  font:inherit;
}
::selection {
  background:var(--selection);
}
a:focus-visible,button:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:6px;
}
.wrap {
  width:min(1280px,calc(100% - 112px));
  margin:auto;
}
.header {
  height:112px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
}
.wordmark {
  font-family:Manrope,sans-serif;
  font-size:25px;
  font-weight:800;
  letter-spacing:-1.2px;
  display:flex;
  align-items:center;
  gap:9px;
}
.wordmark span {
  color:var(--accent);
  font-size:34px;
}
.header nav {
  display:flex;
  align-items:center;
  gap:36px;
  font-size:13px;
  font-weight:500;
}
.nav-contact {
  border:1px solid var(--control-border);
  padding:12px 18px;
  border-radius:5px;
}
.nav-contact span {
  padding-left:17px;
}
.hero {
  display:grid;
  grid-template-columns:1.13fr 1fr;
  column-gap:35px;
  padding-top:72px;
}
.eyebrow,.small-label,.paper-meta {
  font-size:10px;
  letter-spacing:1.5px;
  font-weight:650;
}
.eyebrow {
  margin:0 0 27px;
  display:flex;
  align-items:center;
  gap:9px;
}
.status-dot {
  width:7px;
  height:7px;
  background:var(--accent);
  border-radius:50%;
}
h1,h2,h3,p {
  margin-top:0;
}
h1,h2,h3 {
  font-family:Manrope,sans-serif;
}
h1 {
  font-size:clamp(60px,6.7vw,96px);
  font-weight:500;
  letter-spacing:-6px;
  line-height:1.065;
  margin-bottom:28px;
}
h1 em {
  color:var(--accent);
  font-style:normal;
}
p {
  line-height:1.65;
}
.intro {
  font-size:16px;
  color:var(--muted);
  max-width:400px;
  margin-bottom:27px;
}
.intro a {
  color:var(--ink);
  text-decoration:underline;
  text-underline-offset:4px;
}
.button {
  display:inline-flex;
  gap:43px;
  background:var(--ink);
  color:#fff;
  padding:15px 21px;
  border-radius:4px;
  font-size:13px;
  transition:background .2s,transform .2s;
}
.idea-space {
  position:relative;
  align-self:center;
  aspect-ratio:1.02;
  background-image:radial-gradient(var(--dot-grid) .8px,transparent .8px);
  background-size:19px 19px;
  margin-top:9px;
}
.diagram-top,.diagram-bottom {
  position:absolute;
  left:0;
  right:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:8px;
  letter-spacing:1.2px;
}
.diagram-top {
  top:0;
  background:var(--paper);
  padding-bottom:15px;
}
.live-dot {
  display:flex;
  gap:6px;
  align-items:center;
}
.live-dot:before {
  content:'';
  height:5px;
  width:5px;
  background:var(--live-node);
  border-radius:50%;
}
.diagram-bottom {
  bottom:0;
  background:var(--paper);
  padding-top:15px;
  font-size:10px;
  letter-spacing:0;
  color:var(--muted);
}
.diagram-bottom button {
  border:0;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font-size:10px;
  padding:8px;
}
.diagram-bottom button span {
  font-size:18px;
  vertical-align:middle;
  margin-left:8px;
}
#idea-map {
  width:100%;
  height:100%;
  overflow:visible;
}
.orbit-label {
  position:absolute;
  background:var(--paper);
  padding:4px 9px;
  font-size:12px;
  font-family:monospace;
  border:1px solid var(--line);
  border-radius:4px;
  pointer-events:none;
}
.label-science {
  left:8%;
  top:24%;
  transform:rotate(-8deg);
}
.label-code {
  right:3%;
  top:40%;
  transform:rotate(6deg);
}
.label-curiosity {
  left:33%;
  bottom:12%;
  transform:rotate(-5deg);
}
.hero-foot {
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  margin-top:65px;
  padding:25px 0;
  border-bottom:1px solid var(--line);
  font-size:9px;
  letter-spacing:1.3px;
  color:var(--muted);
}
.location-mark {
  color:var(--accent);
  font-size:15px;
  margin-right:6px;
}
.down-arrow {
  margin-left:20px;
}
.work-section {
  padding-top:77px;
}
.section-heading {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:end;
  margin-bottom:33px;
}
.section-heading .eyebrow {
  grid-column:1/-1;
  margin-bottom:21px;
}
h2 {
  font-weight:500;
  font-size:46px;
  letter-spacing:-2px;
  line-height:1.15;
  margin-bottom:0;
}
.section-heading h2 span {
  color:var(--quiet-heading);
}
.section-heading>p {
  font-size:14px;
  color:var(--muted);
  padding-left:24px;
  margin-bottom:6px;
}
.work-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}
.work-card {
  border:1px solid var(--line);
  border-radius:9px;
  padding:25px 28px 23px;
  overflow:hidden;
  transition:transform .3s,box-shadow .3s;
}
.company-card {
  background:var(--company-surface);
}
.product-card {
  background:var(--product-surface);
}
.card-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.pill {
  font-size:9px;
  letter-spacing:1px;
  border:1px solid var(--pill-border);
  border-radius:20px;
  padding:6px 10px;
}
.circle-arrow {
  border:1px solid var(--arrow-border);
  width:32px;
  height:32px;
  border-radius:50%;
  display:grid;
  place-items:center;
  transition:background .2s;
}
.company-art {
  height:211px;
  display:flex;
  gap:7px;
  align-items:center;
  justify-content:center;
  transform:rotate(-13deg);
}
.company-art span {
  background:var(--accent);
  width:23px;
  border-radius:20px;
  transform:skewY(-13deg);
  transition:transform .4s;
}
.company-art span:nth-child(1),.company-art span:nth-child(7) {
  height:47px;
}
.company-art span:nth-child(2),.company-art span:nth-child(6) {
  height:80px;
}
.company-art span:nth-child(3),.company-art span:nth-child(5) {
  height:113px;
}
.company-art span:nth-child(4) {
  height:147px;
}
.small-label {
  font-size:8px;
  letter-spacing:1.4px;
  color:var(--muted);
  margin-bottom:11px;
}
.card-copy h3 {
  font-size:32px;
  letter-spacing:-1.3px;
  font-weight:600;
  margin-bottom:14px;
}
.accent {
  color:var(--accent);
}
.card-copy>p:not(.small-label) {
  font-size:13px;
  max-width:415px;
  color:var(--card-text);
  min-height:65px;
}
.card-footer {
  border-top:1px solid var(--card-rule);
  margin-top:25px;
  padding-top:17px;
  display:flex;
  justify-content:space-between;
  font-size:9px;
  gap:12px;
  color:var(--card-caption);
}
.card-footer span:last-child {
  white-space:nowrap;
}
.volume-art {
  height:211px;
  position:relative;
  perspective:700px;
}
.volume-plane {
  position:absolute;
  width:153px;
  height:136px;
  left:calc(50% - 77px);
  top:28px;
  border:1px solid var(--volume-border);
  transform:rotateX(53deg) rotateZ(-35deg);
  background:repeating-radial-gradient(ellipse at 20% 40%,transparent 0 10px,var(--volume-ring) 11px 12px,transparent 13px 19px),repeating-radial-gradient(ellipse at 80% 70%,var(--volume-fill) 0 12px,var(--volume-detail) 13px 15px,transparent 16px 23px);
  box-shadow:0 0 0 5px var(--volume-shadow);
  transition:translate .4s;
}
.plane-one {
  top:21px;
  z-index:3;
}
.plane-two {
  top:45px;
  z-index:2;
  opacity:.7;
}
.plane-three {
  top:69px;
  z-index:1;
  opacity:.45;
}
.volume-caption {
  position:absolute;
  bottom:12px;
  right:0;
  font-size:7px;
  font-family:monospace;
  color:var(--volume-caption);
  letter-spacing:1px;
}
.research-note {
  padding:28px 0 65px;
  display:flex;
  gap:35px;
  align-items:center;
  justify-content:center;
}
.research-note>span {
  font-size:8px;
  letter-spacing:1px;
  color:var(--muted);
}
.research-note>div {
  font-size:14px;
  font-weight:600;
}
.research-note i {
  font-style:normal;
  margin:0 15px;
  color:var(--separator);
}
.interests-section {
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:var(--interest-surface);
  padding:65px 0;
}
.interests-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:50px;
}
.asterisk {
  color:var(--accent);
  font-size:75px;
  line-height:1;
  transition:transform .7s;
}
.interests-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:36px;
}
.interests-grid article+article {
  border-left:1px solid var(--interest-rule);
  padding-left:34px;
}
.interest-icon {
  font-family:monospace;
  color:var(--interest-icon);
  font-size:28px;
  display:block;
  margin-bottom:20px;
}
.interests-grid h3 {
  font-size:21px;
  font-weight:600;
  letter-spacing:-.6px;
  margin-bottom:14px;
}
.interests-grid p {
  font-size:13px;
  color:var(--muted);
  margin-bottom:20px;
}
.text-links,.tags {
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  font-size:9px;
}
.text-links a {
  border-bottom:1px solid var(--link-rule);
  padding-bottom:3px;
}
.tags span {
  border:1px solid var(--tag-border);
  padding:4px 7px;
  border-radius:4px;
}
.publications {
  display:grid;
  grid-template-columns:1fr 1.65fr;
  gap:65px;
  padding-top:80px;
  padding-bottom:85px;
}
.publications>div>p:last-child {
  color:var(--muted);
  font-size:13px;
  margin-top:19px;
}
.paper-list a {
  display:block;
  position:relative;
  padding:21px 38px 22px 0;
  border-bottom:1px solid var(--line);
}
.paper-list a:first-child {
  padding-top:0;
}
.paper-meta {
  font-size:8px;
  letter-spacing:1px;
  color:var(--muted);
}
.paper-list h3 {
  font-size:16px;
  line-height:1.55;
  font-weight:500;
  letter-spacing:-.2px;
  margin:7px 0 0;
  max-width:570px;
}
.paper-arrow {
  position:absolute;
  right:0;
  top:44%;
  transition:transform .2s;
}
.contact {
  background:var(--contact-surface);
  border:1px solid var(--contact-border);
  border-radius:8px;
  padding:45px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.contact .eyebrow {
  font-size:8px;
  margin-bottom:18px;
}
.contact h2 {
  font-size:60px;
  letter-spacing:-3px;
}
.contact h2>span {
  display:inline-block;
  color:var(--accent);
  margin-left:20px;
}
.contact-links {
  display:flex;
  flex-direction:column;
  min-width:230px;
  gap:18px;
  font-size:12px;
}
.contact-links a {
  display:flex;
  justify-content:space-between;
  gap:35px;
  border-bottom:1px solid var(--contact-rule);
  padding-bottom:10px;
}
.footer {
  display:flex;
  justify-content:space-between;
  padding:29px 0;
  font-size:9px;
  color:var(--muted);
}
.skip-link {
  position:absolute;
  top:-100px;
  left:20px;
  background:var(--ink);
  color:white;
  padding:14px;
  z-index:10;
}
.skip-link:focus {
  top:10px;
}
.hero-copy {
  animation:arrive .8s both;
}
.idea-space {
  animation:arrive 1s .15s both;
}
@keyframes arrive {
  from {
    opacity:0;
    transform:translateY(15px);
  }
  to {
    opacity:1;
    transform:translateY(0);
  }
}
@media(min-width:1500px) {
  .hero {
    padding-top:90px;
  }
  h1 {
    font-size:100px;
  }
}
@media(max-width:1000px) {
  .wrap {
    width:calc(100% - 64px);
  }
  .hero {
    gap:20px;
  }
  h1 {
    font-size:70px;
    letter-spacing:-4px;
  }
  .eyebrow {
    font-size:8px;
  }
  .idea-space {
    aspect-ratio:.95;
  }
  .card-footer {
    flex-direction:column;
  }
  .research-note {
    flex-direction:column;
    gap:15px;
  }
  .interests-grid {
    gap:23px;
  }
  .interests-grid article+article {
    padding-left:23px;
  }
  .contact h2 {
    font-size:49px;
  }
}
@media(max-width:700px) {
  .wrap {
    width:calc(100% - 40px);
  }
  .header {
    height:88px;
  }
  .wordmark {
    font-size:21px;
  }
  .wordmark span {
    font-size:28px;
  }
  .header nav {
    gap:16px;
    font-size:11px;
  }
  .header nav>a:nth-child(2) {
    display:none;
  }
  .nav-contact {
    padding:9px 11px;
  }
  .nav-contact span {
    padding-left:5px;
  }
  .hero {
    padding-top:42px;
    grid-template-columns:1fr;
  }
  .hero .eyebrow {
    font-size:8px;
    letter-spacing:1px;
    margin-bottom:22px;
  }
  h1 {
    font-size:clamp(57px,12vw,82px);
    letter-spacing:-3.5px;
  }
  .intro {
    font-size:15px;
    max-width:360px;
  }
  .idea-space {
    width:100%;
    max-width:440px;
    justify-self:center;
    aspect-ratio:1.1;
    margin-top:28px;
  }
  .hero-foot {
    margin-top:16px;
    font-size:8px;
    padding:20px 0;
  }
  .hero-foot>span:last-child {
    display:none;
  }
  .work-section {
    padding-top:45px;
  }
  .section-heading {
    grid-template-columns:1fr;
  }
  .section-heading>p {
    padding:0;
    margin:20px 0 0;
    font-size:13px;
  }
  h2 {
    font-size:37px;
    letter-spacing:-1.7px;
  }
  .work-grid {
    grid-template-columns:1fr;
    gap:18px;
  }
  .work-card {
    padding:21px;
  }
  .card-footer {
    flex-direction:row;
    flex-wrap:wrap;
  }
  .card-copy h3 {
    font-size:30px;
  }
  .research-note {
    padding:25px 0 40px;
    align-items:flex-start;
    gap:12px;
  }
  .research-note>div {
    font-size:12px;
    line-height:2;
  }
  .research-note i {
    margin:0 6px;
  }
  .interests-section {
    padding:43px 0;
  }
  .interests-header {
    margin-bottom:30px;
  }
  .interests-header h2 {
    max-width:250px;
  }
  .asterisk {
    font-size:55px;
  }
  .interests-grid {
    grid-template-columns:1fr;
    gap:27px;
  }
  .interests-grid article+article {
    border-left:0;
    padding-left:0;
    border-top:1px solid var(--interest-rule);
    padding-top:25px;
  }
  .interest-icon {
    margin-bottom:13px;
  }
  .interests-grid p {
    max-width:430px;
  }
  .publications {
    grid-template-columns:1fr;
    gap:28px;
    padding-top:45px;
    padding-bottom:45px;
  }
  .publications h2 br {
    display:none;
  }
  .publications .eyebrow {
    margin-bottom:18px;
  }
  .paper-list h3 {
    font-size:15px;
  }
  .contact {
    padding:27px;
    flex-direction:column;
    align-items:flex-start;
    gap:28px;
  }
  .contact h2 {
    font-size:43px;
    letter-spacing:-2px;
  }
  .contact-links {
    width:100%;
  }
  .contact .eyebrow {
    font-size:7px;
    letter-spacing:1px;
  }
  .footer {
    font-size:8px;
    flex-wrap:wrap;
    gap:15px;
  }
  .footer>span:nth-child(2) {
    display:none;
  }
}
/* Shared SVG icons bypass platform emoji and symbol font substitution. */
.icon-definitions {
  position:absolute;
  width:0;
  height:0;
  overflow:hidden;
  pointer-events:none;
}
.icon {
  display:inline-block;
  width:1em;
  height:1em;
  min-width:12px;
  min-height:12px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  vertical-align:-.13em;
  flex-shrink:0;
  pointer-events:none;
}
.icon-arrow {
  stroke-width:1.15;
  stroke-linecap:butt;
  stroke-linejoin:miter;
}
.button {
  align-items:center;
}
.asterisk .icon {
  display:block;
}
.diagram-bottom button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:8px 12px;
  border-radius:4px;
}
a, button {
  -webkit-tap-highlight-color:transparent;
}
/* Color feedback is shared by keyboard focus and press, without moving targets. */
.button:is(:active, :focus-visible) {
  background:var(--accent);
}
.work-card:is(:active, :focus-visible) {
  border-color:var(--accent);
}
.work-card:is(:active, :focus-visible) .circle-arrow {
  background:var(--accent);
  color:white;
}
.header nav a:is(:active, :focus-visible),
.text-links a:is(:active, :focus-visible),
.contact-links a:is(:active, :focus-visible),
.footer a:is(:active, :focus-visible),
.paper-list a:is(:active, :focus-visible) h3 {
  color:var(--accent);
}
.diagram-bottom button:is(:active, :focus-visible) {
  background:var(--company-surface);
}
@media (hover:hover) and (pointer:fine) {
  .header nav a:hover {
    color:var(--accent);
  }
  .button:hover {
    background:var(--accent);
    transform:translateY(-3px);
  }
  .work-card:hover {
    transform:translateY(-5px);
    box-shadow:0 12px 25px var(--card-shadow);
  }
  .work-card:hover .circle-arrow {
    background:var(--ink);
    color:white;
  }
  .work-card:hover .company-art span:nth-child(even) {
    transform:skewY(-13deg) translateY(-10px);
  }
  .work-card:hover .plane-one {
    translate:0 -8px;
  }
  .work-card:hover .plane-three {
    translate:0 8px;
  }
  .asterisk:hover {
    transform:rotate(180deg);
  }
  .text-links a:hover {
    color:var(--accent);
  }
  .paper-list a:hover h3 {
    color:var(--accent);
  }
  .paper-list a:hover .paper-arrow {
    transform:translate(3px,-3px);
  }
  .contact-links a:hover {
    color:var(--accent);
  }
}
@media (pointer:coarse) {
  .nav-contact, .header nav a, .contact-links a, .footer a, .text-links a {
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .text-links {
    column-gap:14px;
  }
  .circle-arrow {
    background:var(--ink);
    color:white;
  }
}

/* Illustrations move on their own; the link targets stay stationary. */
.company-art span {
  animation:company-wave 4.2s ease-in-out infinite;
  animation-play-state:paused;
}
.company-art span:nth-child(2) { animation-delay:-.3s; }
.company-art span:nth-child(3) { animation-delay:-.6s; }
.company-art span:nth-child(4) { animation-delay:-.9s; }
.company-art span:nth-child(5) { animation-delay:-1.2s; }
.company-art span:nth-child(6) { animation-delay:-1.5s; }
.company-art span:nth-child(7) { animation-delay:-1.8s; }
.volume-plane {
  animation-duration:4.8s;
  animation-timing-function:ease-in-out;
  animation-iteration-count:infinite;
  animation-play-state:paused;
}
.plane-one { animation-name:volume-top; }
.plane-two { animation-name:volume-middle; }
.plane-three { animation-name:volume-bottom; }
.work-card.is-in-view .company-art span,
.work-card.is-in-view .volume-plane {
  animation-play-state:running;
}
html.motion-paused .company-art span,
html.motion-paused .volume-plane {
  animation-play-state:paused;
}
@keyframes company-wave {
  0%, 100% { translate:0 5px; }
  50% { translate:0 -7px; }
}
@keyframes volume-top {
  0%, 100% { transform:translateY(-2px) rotateX(53deg) rotateZ(-35deg); }
  50% { transform:translateY(-14px) rotateX(53deg) rotateZ(-35deg); }
}
@keyframes volume-middle {
  0%, 100% { transform:rotateX(53deg) rotateZ(-35deg); }
  50% { transform:translateY(-3px) rotateX(53deg) rotateZ(-35deg); }
}
@keyframes volume-bottom {
  0%, 100% { transform:translateY(2px) rotateX(53deg) rotateZ(-35deg); }
  50% { transform:translateY(14px) rotateX(53deg) rotateZ(-35deg); }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*:before,*:after {
    animation:none!important;
    transition:none!important;
  }
}