:root {
  --bg: #080808;
  --surface: #0d0d0d;
  --surface-2: #121212;
  --surface-3: #171717;
  --line: #242424;
  --line-strong: #353535;
  --text: #f2f0ea;
  --muted: #aaa69e;
  --dim: #817e77;
  --red: #ed5144;
  --red-soft: #7c2621;
  --red-surface: #b72c25;
  --red-hover: #c63831;
  --green: #88a78b;
  --mono: "SFMono-Regular", "Cascadia Code", "Liberation Mono", Menlo, monospace;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --max: 1360px;
  --pad: clamp(1.25rem, 4.6vw, 5rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-color: var(--red-surface) var(--bg); }
body {
  margin: 0;
  min-width: 320px;
  background:
    linear-gradient(rgba(255,255,255,.014) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.012) 1px, transparent 1px),
    var(--bg);
  background-size: 48px 48px;
  color: var(--text);
  font-family: var(--sans);
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

::selection { background: var(--red-surface); color: #fff; }
a { color: inherit; }
button, input { font: inherit; }
button { color: inherit; }
h1, h2, h3, p { margin-top: 0; }

.skip-link {
  position: fixed; z-index: 100; top: .75rem; left: .75rem;
  transform: translateY(-160%); padding: .7rem 1rem;
  background: var(--text); color: var(--bg); font: 700 .72rem var(--mono); text-decoration: none;
}
.skip-link:focus { transform: none; }

.status-line {
  height: 30px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem;
  padding: 0 var(--pad); border-bottom: 1px solid var(--line); color: var(--dim);
  font: 600 .6rem var(--mono); letter-spacing: .08em; text-transform: uppercase;
}
.status-line > span:nth-child(2) { color: var(--muted); }
.status-line > span:last-child { text-align: right; }
.status-line i { display: inline-block; width: 5px; height: 5px; margin-right: .45rem; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px rgba(136,167,139,.7); }

.site-header {
  position: sticky; z-index: 50; top: 0; height: 74px;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem;
  padding: 0 var(--pad); border-bottom: 1px solid transparent;
  background: rgba(8,8,8,.84); backdrop-filter: blur(16px);
  transition: height .2s ease, border-color .2s ease;
}
.site-header.is-scrolled { height: 62px; border-color: var(--line); }
.brand { width: max-content; display: flex; align-items: center; gap: .75rem; text-decoration: none; font: 700 .63rem/1.1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.brand-mark { position: relative; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--line-strong); color: var(--text); letter-spacing: -.08em; }
.brand-mark::after { content: ""; position: absolute; right: -1px; bottom: -1px; width: 8px; height: 8px; background: var(--red); }
.primary-nav { display: flex; align-items: center; gap: clamp(1.3rem, 3vw, 3.2rem); }
.primary-nav a { position: relative; padding: .8rem 0; color: var(--dim); font: 650 .65rem var(--mono); letter-spacing: .07em; text-decoration: none; text-transform: uppercase; }
.primary-nav a::after { content: ""; position: absolute; right: 0; bottom: .45rem; left: 0; height: 1px; transform: scaleX(0); transform-origin: right; background: var(--red); transition: transform .2s ease; }
.primary-nav a:hover, .primary-nav a[aria-current="true"] { color: var(--text); }
.primary-nav a:hover::after, .primary-nav a[aria-current="true"]::after { transform: scaleX(1); transform-origin: left; }
.header-cta { justify-self: end; display: inline-flex; gap: .8rem; padding: .55rem .7rem; border: 1px solid var(--line-strong); color: var(--muted); font: 650 .63rem var(--mono); text-decoration: none; text-transform: uppercase; }
.header-cta span { color: var(--red); }
.header-cta:hover { border-color: var(--red); color: var(--text); }

.hero {
  position: relative; min-height: calc(100svh - 104px); max-width: var(--max); margin: 0 auto;
  display: grid; grid-template-columns: minmax(0,1.16fr) minmax(390px,.84fr); gap: clamp(3rem,7vw,8rem); align-items: center;
  padding: clamp(5rem,10vh,8rem) var(--pad) clamp(4rem,8vh,7rem);
}
.hero::before { content: ""; position: absolute; z-index: -1; right: 2%; top: 13%; width: 540px; height: 540px; background: radial-gradient(circle, rgba(129,34,28,.14), transparent 65%); filter: blur(20px); }
.eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-bottom: 1.5rem; color: var(--dim); font: 650 .65rem var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.eyebrow span { color: var(--red); }
.hero h1 { margin-bottom: 1.6rem; font-size: clamp(4rem,8vw,8.4rem); font-weight: 720; line-height: .84; letter-spacing: -.075em; }
.hero h1 em { color: var(--muted); font-style: normal; font-weight: 450; }
.hero-lede { max-width: 700px; margin-bottom: 2rem; color: #c0bdb5; font-size: clamp(1rem,1.7vw,1.22rem); line-height: 1.7; }
.hero-actions, .contact-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 1.5rem; min-height: 48px; padding: .82rem 1rem; border: 1px solid var(--line-strong); font: 700 .66rem var(--mono); letter-spacing: .035em; text-decoration: none; text-transform: uppercase; transition: transform .18s ease, background .18s ease, border-color .18s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { border-color: var(--red-surface); background: var(--red-surface); color: #fff; }
.button-primary:hover { border-color: var(--red-hover); background: var(--red-hover); }
.button-secondary { color: var(--muted); }
.button-secondary:hover { border-color: var(--muted); color: var(--text); }
.text-link { padding: .6rem; color: var(--muted); font: 650 .66rem var(--mono); text-decoration: none; text-transform: uppercase; }
.text-link:hover { color: var(--text); }
.hero-stack { display: flex; flex-wrap: wrap; gap: .45rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.hero-stack li { padding: .4rem .55rem; border: 1px solid var(--line); color: var(--dim); font: 600 .58rem var(--mono); letter-spacing: .05em; text-transform: uppercase; }

.hero-machine { position: relative; min-height: 520px; overflow: hidden; border: 1px solid var(--line); background: rgba(13,13,13,.82); box-shadow: 24px 24px 0 rgba(0,0,0,.24); }
.hero-machine::before { content: ""; position: absolute; top: -1px; left: 38px; width: 90px; height: 2px; background: var(--red); }
.machine-head, .machine-foot, .trace-head { min-height: 42px; display: flex; justify-content: space-between; align-items: center; padding: 0 1rem; border-bottom: 1px solid var(--line); color: var(--dim); font: 600 .58rem var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.machine-live, .trace-head span:last-child { color: var(--green); }
.machine-foot { position: absolute; right: 0; bottom: 0; left: 0; border-top: 1px solid var(--line); border-bottom: 0; }
.orbit-field { position: absolute; inset: 42px 0; overflow: hidden; background: linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px); background-size: 28px 28px; }
.orbit-field::after { content: ""; position: absolute; z-index: 0; left: 50%; top: 50%; width: 370px; height: 370px; border-radius: 50%; transform: translate(-50%,-50%); background: conic-gradient(from 210deg, transparent 0 72%, rgba(237,81,68,.11) 88%, transparent 96%); mask-image: radial-gradient(circle, transparent 0 15%, #000 75%); }
.orbit { position: absolute; z-index: 1; left: 50%; top: 50%; border: 1px solid #292929; border-radius: 50%; transform: translate(-50%,-50%); }
.orbit::after { content: ""; position: absolute; left: 50%; top: -3px; width: 6px; height: 6px; border-radius: 50%; background: var(--red); box-shadow: 0 0 12px rgba(237,81,68,.85); }
.orbit-a { width: 280px; height: 280px; }
.orbit-b { width: 410px; height: 410px; border-style: dashed; }
.orbit-b::after { width: 4px; height: 4px; top: auto; bottom: -2px; background: var(--green); box-shadow: 0 0 10px rgba(136,167,139,.8); }
.orbit-core { position: absolute; z-index: 3; left: 50%; top: 50%; width: 90px; height: 90px; display: grid; place-content: center; border: 1px solid var(--red-soft); background: #0a0a0a; transform: translate(-50%,-50%) rotate(45deg); text-align: center; }
.orbit-core > * { transform: rotate(-45deg); }
.orbit-core span { color: var(--text); font: 700 1.3rem var(--mono); }
.orbit-core small { color: var(--red); font: 500 .45rem var(--mono); }
.node { position: absolute; z-index: 4; width: 126px; padding: .7rem; border: 1px solid var(--line-strong); background: #0d0d0d; }
.node::after { content: ""; position: absolute; right: 7px; top: 7px; width: 4px; height: 4px; border-radius: 50%; background: #424242; }
.node > span { display: block; margin-bottom: .25rem; color: var(--red); font: 600 .5rem var(--mono); }
.node b { display: block; font: 650 .66rem var(--mono); }
.node small { color: var(--dim); font: .5rem var(--mono); }
.node-camera { left: 7%; top: 14%; }
.node-state { right: 7%; top: 19%; }
.node-control { right: 12%; bottom: 12%; }

.proof-strip { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); padding: 0 var(--pad); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.proof-strip > div { min-height: 145px; display: flex; flex-direction: column; justify-content: center; padding: 1.5rem clamp(1rem,2vw,2rem); border-right: 1px solid var(--line); }
.proof-strip > div:first-child { border-left: 1px solid var(--line); }
.proof-strip strong { color: var(--text); font: 450 clamp(2rem,4vw,3.5rem)/1 var(--mono); letter-spacing: -.08em; }
.proof-strip strong small { color: var(--red); font-size: .35em; letter-spacing: 0; }
.proof-strip span { max-width: 170px; margin-top: .65rem; color: var(--dim); font: 600 .57rem/1.5 var(--mono); text-transform: uppercase; }

.section { max-width: var(--max); margin: 0 auto; padding: clamp(7rem,12vw,12rem) var(--pad); scroll-margin-top: 62px; }
.section-heading { display: grid; grid-template-columns: minmax(150px,.35fr) 1fr .62fr; align-items: end; gap: clamp(2rem,5vw,6rem); margin-bottom: clamp(4rem,7vw,7rem); }
.section-code { align-self: start; color: var(--dim); font: 650 .6rem var(--mono); letter-spacing: .08em; }
.section-code span { margin-right: .8rem; color: var(--red); }
.section-kicker { margin-bottom: .65rem; color: var(--red); font: 650 .6rem var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.section h2, .contact h2 { margin-bottom: 0; font-size: clamp(3rem,5.7vw,6.2rem); line-height: .9; letter-spacing: -.068em; }
.section-heading > p { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.75; }

.case-study { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 530px; border: 1px solid var(--line-strong); background: var(--surface); }
.case-copy { padding: clamp(2rem,4vw,4rem); }
.case-topline { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; color: var(--red); font: 650 .58rem var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.case-topline span:last-child { color: var(--green); }
.case-study h3 { max-width: 600px; margin-bottom: 1.2rem; font-size: clamp(2.3rem,4vw,4.5rem); line-height: .95; letter-spacing: -.055em; }
.case-copy > p { max-width: 650px; color: var(--muted); line-height: 1.75; }
.case-results { display: grid; grid-template-columns: repeat(3,1fr); margin: 2.4rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.case-results div { padding: 1rem; border-right: 1px solid var(--line); }
.case-results div:first-child { padding-left: 0; }
.case-results div:last-child { border: 0; }
.case-results b { display: block; color: var(--text); font: 500 1.15rem var(--mono); }
.case-results span { display: block; margin-top: .4rem; color: var(--dim); font: 550 .54rem/1.5 var(--mono); text-transform: uppercase; }
.case-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.case-actions > span { color: var(--dim); font: .55rem var(--mono); }
.trace { position: relative; overflow: hidden; border-left: 1px solid var(--line); background: #090909; }
.trace-flow { display: grid; grid-template-columns: 1fr 24px 1fr 24px 1fr 24px 1fr; align-items: center; gap: .35rem; padding: 2rem 1.25rem; }
.trace-flow div { padding: .8rem; border: 1px solid var(--line); background: var(--surface); }
.trace-flow div > * { display: block; }
.trace-flow span { color: var(--red); font: .48rem var(--mono); }
.trace-flow b { margin: .25rem 0; font: 650 .61rem var(--mono); }
.trace-flow small { color: var(--dim); font: .48rem var(--mono); }
.trace-flow > i { height: 1px; background: var(--line-strong); }
.trace-flow .trace-accent { border-color: var(--red-soft); }
.trace-chart { position: relative; height: 240px; display: flex; align-items: end; gap: 6px; padding: 1.5rem; border-top: 1px solid var(--line); background: linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px); background-size: 100% 32px; }
.trace-chart::before { content: ""; position: absolute; left: 0; right: 0; top: 42%; border-top: 1px dashed var(--red-soft); }
.trace-chart span { flex: 1; height: 35%; background: linear-gradient(#5d211d, #18100f); border-top: 1px solid var(--red); }
.trace-chart span:nth-child(2), .trace-chart span:nth-child(9) { height: 52%; }
.trace-chart span:nth-child(3), .trace-chart span:nth-child(8) { height: 70%; }
.trace-chart span:nth-child(4), .trace-chart span:nth-child(7) { height: 84%; }
.trace-chart span:nth-child(5), .trace-chart span:nth-child(6) { height: 62%; }
.trace-chart span:nth-child(10) { height: 29%; }.trace-chart span:nth-child(11) { height: 46%; }.trace-chart span:nth-child(12) { height: 38%; }
.trace-legend { display: flex; gap: 1.5rem; padding: .8rem 1.5rem; color: var(--dim); font: .52rem var(--mono); text-transform: uppercase; }
.trace-legend i { display: inline-block; width: 12px; height: 1px; margin-right: .4rem; background: var(--red); vertical-align: middle; }
.trace-legend span:last-child i { border-top: 1px dashed var(--dim); background: none; }

.project-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 1.1rem; gap: 1.1rem; }
.project-card { min-height: 390px; display: flex; flex-direction: column; padding: 1.5rem; border: 1px solid var(--line); background: var(--surface); transition: transform .2s ease, border-color .2s ease; }
.project-card:hover { transform: translateY(-4px); border-color: var(--line-strong); }
.card-head { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 2.5rem; color: var(--dim); font: 600 .55rem var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.card-head span:last-child { color: var(--red); }
.project-card h3 { margin-bottom: .8rem; font-size: clamp(1.35rem,2.3vw,2rem); line-height: 1.05; letter-spacing: -.04em; }
.project-card > p { color: var(--muted); font-size: .83rem; line-height: 1.7; }
.project-card ul { margin: auto 0 1.4rem; padding: 0; list-style: none; }
.project-card li { padding: .43rem 0; border-bottom: 1px solid var(--line); color: var(--dim); font: .55rem var(--mono); text-transform: uppercase; }
.project-card > a { width: max-content; color: var(--red); font: 650 .62rem var(--mono); text-decoration: none; text-transform: uppercase; }

.fit { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.fit-heading { display: grid; grid-template-columns: 1fr .55fr; align-items: end; gap: 4rem; margin-bottom: 3rem; }
.fit-heading > p { margin: 0; color: var(--muted); line-height: 1.7; }
.fit-heading h2 { margin-top: 1.5rem; }
.role-console { display: grid; grid-template-columns: .32fr .68fr; border: 1px solid var(--line-strong); background: var(--surface); }
.role-tabs { border-right: 1px solid var(--line); }
.role-tabs button { width: 100%; min-height: 92px; display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--dim); font: 650 .66rem var(--mono); text-align: left; text-transform: uppercase; cursor: pointer; }
.role-tabs button span { color: var(--dim); }
.role-tabs button:hover { color: var(--text); background: var(--surface-2); }
.role-tabs button[aria-selected="true"] { box-shadow: inset 3px 0 var(--red); background: var(--surface-2); color: var(--text); }
.role-tabs button[aria-selected="true"] span { color: var(--red); }
.role-output { min-height: 520px; padding: clamp(2rem,5vw,5rem); }
.role-status { display: flex; align-items: center; gap: .8rem; margin-bottom: 2rem; color: var(--red); font: 650 .58rem var(--mono); letter-spacing: .08em; }
.role-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px var(--green); }
.role-output h3 { max-width: 800px; margin-bottom: 1rem; font-size: clamp(2.2rem,4.2vw,4.8rem); line-height: .95; letter-spacing: -.055em; }
.role-output > p { max-width: 730px; color: var(--muted); font-size: 1rem; line-height: 1.75; }
.role-evidence { margin: 2rem 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.role-evidence li { display: grid; grid-template-columns: 32px 1fr; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid var(--line); color: #c3c0b8; font-size: .8rem; }
.role-evidence li span { color: var(--red); font: .55rem var(--mono); }
.role-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; }
.role-skills { display: flex; flex-wrap: wrap; gap: .4rem; }
.role-skills span { padding: .38rem .5rem; border: 1px solid var(--line); color: var(--dim); font: .54rem var(--mono); text-transform: uppercase; }
.role-footer a { color: var(--red); font: 650 .61rem var(--mono); text-decoration: none; text-transform: uppercase; }

.experience-list { border-top: 1px solid var(--line-strong); }
.experience-list article { display: grid; grid-template-columns: .26fr .38fr .36fr; gap: clamp(1.5rem,4vw,4.5rem); padding: 2.2rem 0; border-bottom: 1px solid var(--line); }
.experience-time { color: var(--dim); font: 600 .59rem var(--mono); text-transform: uppercase; }
.experience-role span { color: var(--red); font: 650 .56rem var(--mono); text-transform: uppercase; }
.experience-role h3 { margin: .5rem 0 0; font-size: clamp(1.15rem,2vw,1.6rem); line-height: 1.15; letter-spacing: -.025em; }
.experience-proof p { margin-bottom: .65rem; color: var(--muted); font-size: .78rem; line-height: 1.65; }
.experience-proof strong { color: var(--text); }

.about { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(4rem,9vw,10rem); border-top: 1px solid var(--line); }
.about h2 { margin: 2rem 0; }
.about-lead > p:not(.section-code) { max-width: 690px; color: var(--muted); font-size: .98rem; line-height: 1.8; }
.interest-cloud { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2rem; }
.interest-cloud span { padding: .48rem .6rem; border: 1px solid var(--line); color: var(--dim); font: .57rem var(--mono); text-transform: uppercase; }
.about-details { border-top: 1px solid var(--line-strong); }
.about-details article { padding: 1.8rem 0; border-bottom: 1px solid var(--line); }
.detail-index { color: var(--red); font: 600 .54rem var(--mono); }
.about-details h3 { margin: .65rem 0 .45rem; font-size: clamp(1.2rem,2vw,1.65rem); line-height: 1.1; }
.about-details p { margin-bottom: .5rem; color: var(--muted); font-size: .78rem; }
.about-details strong { color: var(--dim); font: 600 .55rem var(--mono); text-transform: uppercase; }

.contact { position: relative; min-height: 78vh; display: grid; place-items: center; overflow: hidden; padding: clamp(8rem,15vw,14rem) var(--pad); border-top: 1px solid var(--line); background: #0b0b0b; }
.contact-grid { position: absolute; inset: 0; background: radial-gradient(circle at 74% 52%, rgba(132,30,25,.18), transparent 34%), linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px); background-size: auto,48px 48px,48px 48px; }
.contact-inner { position: relative; z-index: 1; width: min(1040px,100%); }
.contact h2 { margin-bottom: 1.5rem; font-size: clamp(4rem,8vw,8rem); }
.contact-inner > p:not(.eyebrow) { max-width: 660px; margin-bottom: 2rem; color: var(--muted); font-size: 1rem; line-height: 1.75; }
.button-large { min-height: 56px; padding: 1rem 1.2rem; }
.copy-button { min-height: 48px; padding: .8rem 1rem; border: 0; background: transparent; color: var(--dim); font: 650 .62rem var(--mono); text-transform: uppercase; cursor: pointer; }
.copy-button:hover { color: var(--text); }

.site-footer { min-height: 100px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; padding: 2rem var(--pad); border-top: 1px solid var(--line); color: var(--dim); font: 600 .58rem var(--mono); text-transform: uppercase; }
.site-footer p { margin: 0; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { color: var(--text); }
.site-footer p:last-child { text-align: right; }

:focus-visible { outline: 2px solid var(--red); outline-offset: 4px; }

@media (max-width: 1080px) {
  .primary-nav { display: none; }
  .site-header { grid-template-columns: 1fr auto; }
  .hero { grid-template-columns: 1fr; }
  .hero-copy { max-width: 850px; }
  .hero-machine { width: min(100%,720px); min-height: 480px; }
  .section-heading { grid-template-columns: .3fr 1fr; }
  .section-heading > p { grid-column: 2; }
  .case-study { grid-template-columns: 1fr; }
  .trace { min-height: 440px; border-top: 1px solid var(--line); border-left: 0; }
  .project-grid { grid-template-columns: 1fr; }
  .project-card { min-height: 310px; }
  .project-card ul { margin-top: 1.5rem; }
  .about { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  :root { --pad: 1.15rem; }
  body { background-size: 32px 32px; }
  .status-line { grid-template-columns: 1fr 1fr; }
  .status-line span:nth-child(2) { display: none; }
  .site-header { height: 62px; }
  .brand > span:last-child { display: none; }
  .hero { min-height: auto; padding-top: 5rem; }
  .hero h1 { font-size: clamp(3.7rem,17vw,6rem); }
  .hero-lede { font-size: .98rem; }
  .hero-actions .button { width: 100%; }
  .text-link { margin: 0 auto; }
  .hero-machine { min-height: 430px; }
  .orbit-b { width: 320px; height: 320px; }
  .orbit-a { width: 220px; height: 220px; }
  .node { width: 108px; padding: .55rem; }
  .node-camera { left: 3%; }.node-state { right: 3%; }.node-control { right: 5%; }
  .proof-strip { grid-template-columns: 1fr 1fr; }
  .proof-strip > div { min-height: 125px; border-bottom: 1px solid var(--line); }
  .section-heading, .fit-heading { grid-template-columns: 1fr; gap: 1.5rem; }
  .section-heading > p { grid-column: 1; }
  .case-copy { padding: 1.25rem; }
  .case-results { grid-template-columns: 1fr; }
  .case-results div, .case-results div:first-child { padding: .8rem 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .case-results div:last-child { border-bottom: 0; }
  .trace-flow { grid-template-columns: 1fr 12px 1fr; }
  .trace-flow > :nth-child(n+4) { display: none; }
  .role-console { grid-template-columns: 1fr; }
  .role-tabs { display: grid; grid-template-columns: repeat(3,1fr); border-right: 0; border-bottom: 1px solid var(--line); }
  .role-tabs button { min-height: 76px; padding: .65rem; border-right: 1px solid var(--line); font-size: .56rem; }
  .role-tabs button span { display: none; }
  .role-tabs button[aria-selected="true"] { box-shadow: inset 0 3px var(--red); }
  .role-output { min-height: 560px; padding: 1.4rem; }
  .role-footer { align-items: flex-start; flex-direction: column; }
  .experience-list article { grid-template-columns: 1fr; gap: .7rem; }
  .contact-actions .button { width: 100%; word-break: break-word; }
  .site-footer { grid-template-columns: 1fr; gap: 1.2rem; }
  .site-footer p:last-child { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media (prefers-reduced-motion: no-preference) {
  .orbit-field::after { animation: radar-sweep 9s linear infinite; }
  .orbit-a { animation: orbit-clockwise 12s linear infinite; }
  .orbit-b { animation: orbit-counter 24s linear infinite; }
  .orbit-core { animation: core-breathe 4s ease-in-out infinite; }
  .node::after { animation: node-signal 4.8s ease-in-out infinite; }
  .node-state::after { animation-delay: 1.6s; }
  .node-control::after { animation-delay: 3.2s; }
  .trace-chart span { transform-origin: bottom; animation: trace-rise .7s ease-out both; }
  .trace-chart span:nth-child(2) { animation-delay: .04s; }.trace-chart span:nth-child(3) { animation-delay: .08s; }.trace-chart span:nth-child(4) { animation-delay: .12s; }
  .trace-chart span:nth-child(5) { animation-delay: .16s; }.trace-chart span:nth-child(6) { animation-delay: .2s; }.trace-chart span:nth-child(7) { animation-delay: .24s; }
  .trace-chart span:nth-child(8) { animation-delay: .28s; }.trace-chart span:nth-child(9) { animation-delay: .32s; }.trace-chart span:nth-child(10) { animation-delay: .36s; }
  .trace-chart span:nth-child(11) { animation-delay: .4s; }.trace-chart span:nth-child(12) { animation-delay: .44s; }
}

@keyframes radar-sweep { to { transform: translate(-50%,-50%) rotate(1turn); } }
@keyframes orbit-clockwise { to { transform: translate(-50%,-50%) rotate(1turn); } }
@keyframes orbit-counter { to { transform: translate(-50%,-50%) rotate(-1turn); } }
@keyframes core-breathe {
  0%, 100% { box-shadow: 0 0 0 rgba(237,81,68,0); }
  50% { box-shadow: 0 0 28px rgba(237,81,68,.13); }
}
@keyframes node-signal {
  0%, 18%, 100% { background: #424242; box-shadow: none; }
  5%, 12% { background: var(--green); box-shadow: 0 0 9px rgba(136,167,139,.85); }
}
@keyframes trace-rise { from { transform: scaleY(.06); opacity: .25; } }

@media (prefers-contrast: more) {
  :root { --line: #464646; --dim: #aaa69e; --muted: #cfcbc3; }
}

/* Writing shares the portfolio's NOC visual language. */
.header-actions { display: flex; justify-content: flex-end; align-items: center; gap: 1.2rem; }
.mobile-writing { display: none; }
.writing { border-top: 1px solid var(--line); }
.writing-card { display: grid; grid-template-columns: .25fr 1fr auto; gap: 2rem; padding: 2.5rem 0; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.writing-meta, .writing-time { color: var(--muted); font: .65rem/1.8 var(--mono); }
.writing-meta span { display: block; }
.writing-meta span:first-child { color: var(--red); margin-bottom: .7rem; }
.writing-card h3 { font-size: clamp(1.7rem,3vw,2.7rem); line-height: 1.1; letter-spacing: -.04em; }
.writing-card h3 a { text-decoration: none; }
.writing-card h3 a:hover { color: var(--red); }
.writing-card h3 span { color: var(--red); }
.writing-card p { max-width: 670px; color: var(--muted); line-height: 1.8; }
.writing-card .text-link { display: inline-block; margin-top: 1rem; }
@media (max-width: 1080px) { .mobile-writing { display: inline; color: var(--muted); font: .65rem var(--mono); text-decoration: none; } }
@media (max-width: 760px) { .writing-card { grid-template-columns: 1fr; gap: 1rem; } }