:root {
  color-scheme: dark;
  --bg: #090a0c;
  --surface: #101216;
  --surface-2: #15181d;
  --border: #292d34;
  --border-strong: #3b4049;
  --text: #f0f1f2;
  --muted: #a0a5ae;
  --muted-2: #747b86;
  --coral: #ff5b5f;
  --coral-dark: #d84249;
  --cyan: #50d6df;
  --green: #56d49b;
  --sidebar: 228px;
  --mono: Menlo, "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--text); background: var(--bg); font-family: var(--sans); }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
::selection { color: var(--bg); background: var(--coral); }

body::before {
  position: fixed; inset: 0; pointer-events: none; content: ""; opacity: .32;
  background-image: linear-gradient(rgb(255 255 255 / .018) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / .018) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: linear-gradient(to bottom, black, transparent 75%);
}

.skip-link { position: fixed; z-index: 100; top: .75rem; left: .75rem; padding: .65rem .85rem; color: var(--bg); background: var(--coral); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.app-shell { position: relative; display: grid; grid-template-columns: var(--sidebar) minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: fixed; z-index: 20; inset: 0 auto 0 0; display: flex; flex-direction: column; width: var(--sidebar); padding: 1.6rem 1rem; border-right: 1px solid var(--border); background: rgb(9 10 12 / .94); backdrop-filter: blur(18px); }
.brand { display: inline-flex; width: fit-content; gap: .3rem; align-items: baseline; color: var(--text); font: 700 1.25rem/1 var(--mono); letter-spacing: .1em; text-decoration: none; }
.brand span { color: var(--coral); }
.primary-nav { display: grid; gap: .35rem; margin-top: 3.5rem; }
.nav-link { position: relative; display: grid; grid-template-columns: 2.1rem 1fr; gap: .45rem; align-items: center; width: 100%; padding: .8rem .85rem; border: 1px solid transparent; color: var(--muted); background: transparent; text-align: left; text-decoration: none; cursor: pointer; }
.nav-link::before { position: absolute; top: .45rem; bottom: .45rem; left: -.95rem; width: 3px; background: var(--coral); content: ""; opacity: 0; }
.nav-link:hover, .nav-link:focus-visible { color: var(--text); border-color: var(--border); outline: none; }
.nav-link.is-active { color: var(--text); border-color: var(--border); background: var(--surface-2); }
.nav-link.is-active::before { opacity: 1; }
.nav-icon { display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; color: var(--coral); font: 700 1.1rem/1 var(--mono); letter-spacing: -.06em; text-align: center; transition: transform .2s ease, color .2s ease; }
.primary-nav .nav-link:nth-child(1) .nav-icon { transform: scale(1.08); }
.primary-nav .nav-link:nth-child(2) .nav-icon { transform: scale(1.12); }
.primary-nav .nav-link:nth-child(3) .nav-icon { transform: scale(.92); }
.primary-nav .nav-link:nth-child(4) .nav-icon { transform: scale(1.1); }
.primary-nav .nav-link:nth-child(5) .nav-icon { transform: scale(1.35); }
.primary-nav .nav-link:nth-child(6) .nav-icon { transform: scale(1.35); }
.nav-link:hover .nav-icon, .nav-link:focus-visible .nav-icon { color: var(--cyan); transform: scale(1.18) rotate(-4deg); animation: icon-glitch .28s steps(2, end); }
.nav-link:hover > span:last-child, .nav-link:focus-visible > span:last-child { animation: nav-glitch .32s steps(2, end); }
@keyframes nav-glitch { 0%, 100% { text-shadow: none; transform: none; } 30% { text-shadow: 2px 0 var(--cyan), -2px 0 var(--coral); transform: translateX(1px); } 60% { text-shadow: -1px 0 var(--cyan); transform: translateX(-1px); } }
@keyframes icon-glitch { 0%, 100% { filter: none; } 40% { filter: drop-shadow(2px 0 var(--cyan)) drop-shadow(-2px 0 var(--coral)); } }
.sidebar-footer { margin-top: auto; color: var(--muted-2); font: .68rem/1.7 var(--mono); text-transform: uppercase; letter-spacing: .06em; }
.sidebar-footer p { margin: .25rem 0; }
.sidebar-footer a { color: var(--muted); text-transform: none; text-decoration: none; }
.sidebar-footer a:hover { color: var(--cyan); }
.system-status { color: var(--green); }
.system-status span { display: inline-block; width: .45rem; height: .45rem; margin-right: .5rem; border-radius: 50%; background: var(--green); box-shadow: 0 0 .35rem var(--green); animation: status-breathe 2.4s ease-in-out infinite; }
@keyframes status-breathe {
  0%, 100% { opacity: .55; box-shadow: 0 0 .2rem rgb(118 242 161 / .4); transform: scale(.9); }
  50% { opacity: 1; box-shadow: 0 0 .35rem var(--green), 0 0 .9rem rgb(118 242 161 / .55); transform: scale(1.08); }
}
@media (prefers-reduced-motion: reduce) {
  .system-status span { animation: none; }
}

.workspace { position: relative; grid-column: 2; min-width: 0; padding: clamp(2rem, 5vw, 5rem) clamp(1.5rem, 5vw, 5.5rem) 8rem; }
.workspace::before { position: fixed; z-index: -1; top: 0; left: 0; width: 24rem; height: 24rem; pointer-events: none; content: ""; background: radial-gradient(circle, rgb(55 225 255 / .07), transparent 68%); transform: translate(calc(var(--cursor-x, 50vw) - 50%), calc(var(--cursor-y, 50vh) - 50%)); transition: transform .25s ease-out; }
.mobile-header, .mobile-nav { display: none; }
.view { max-width: 1220px; margin-inline: auto; animation: reveal .32s ease both; }
.view[hidden] { display: none; }
@keyframes reveal { from { opacity: 0; transform: translateY(8px); } }

.command-label, .section-heading > p, .section-heading > div > p { margin: 0 0 1.25rem; color: var(--coral); font: .8rem/1.2 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(240px, .55fr); gap: clamp(2rem, 6vw, 6rem); align-items: end; }
h1 { margin: 0; font-size: clamp(3.4rem, 8vw, 7.3rem); line-height: .92; letter-spacing: -.055em; }
.role { margin: 1.1rem 0; color: var(--coral); font: clamp(1.15rem, 2vw, 1.7rem)/1.3 var(--mono); }
.hero-copy { max-width: 760px; margin: 0; color: #c4c7cc; font: clamp(1rem, 1.5vw, 1.26rem)/1.7 var(--mono); }
.hero-copy p { margin: 0; }
.hero-copy p + p { margin-top: 1.2rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2rem; }
.button { display: inline-flex; min-height: 3.25rem; align-items: center; justify-content: center; padding: .8rem 1.25rem; border: 1px solid var(--coral); font: 700 .88rem/1 var(--mono); text-decoration: none; cursor: pointer; transition: transform .18s ease, background .18s ease, color .18s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: var(--bg); background: var(--coral); }
.button-primary:hover { background: #ff7376; }
.button-secondary { color: var(--coral); background: transparent; }
.button-secondary:hover { color: var(--bg); background: var(--coral); }
.hero-note { padding: 1.2rem 0 1.2rem 1.25rem; border-left: 1px solid var(--border-strong); }
.hero-note span { display: block; margin-bottom: .75rem; color: var(--cyan); font: .72rem/1.2 var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.ascii-portrait-frame + span { margin-top: 1rem; }
.hero-note strong { display: block; font-size: 1.08rem; line-height: 1.45; }
.hero-note p { margin: .75rem 0 0; color: var(--muted-2); font: .75rem/1.5 var(--mono); }
.ascii-portrait-frame { position: relative; display: flex; overflow: hidden; height: 9rem; margin-top: 1.5rem; align-items: center; justify-content: center; border: 1px solid var(--border); background: #07090b; opacity: .78; }
.ascii-portrait-frame::after { position: absolute; inset: 0; pointer-events: none; content: ""; background: radial-gradient(circle 5rem at var(--cursor-x, 50%) var(--cursor-y, 50%), rgb(75 229 255 / .18), transparent 72%); mix-blend-mode: screen; }
.ascii-source { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ascii-portrait { position: relative; max-width: none; margin: 0; color: var(--cyan); font: .21rem/.21rem var(--mono); letter-spacing: 0; white-space: pre; transform: scale(1.65); transform-origin: center; }

.proof-strip { display: grid; grid-template-columns: repeat(3, 1fr); margin: clamp(3rem, 7vw, 6rem) 0; border-block: 1px solid var(--border); }
.proof-strip div { padding: 1.6rem clamp(.8rem, 2.4vw, 2rem); border-right: 1px solid var(--border); }
.proof-strip div:last-child { border: 0; }
.proof-strip dt { color: var(--coral); font: clamp(2rem, 4vw, 3.5rem)/1 var(--mono); letter-spacing: -.06em; }
.proof-strip dd { margin: .6rem 0 0; color: var(--muted); font: .68rem/1.4 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.js .expertise-grid article { opacity: 0; transform: translateY(12px); transition: opacity .55s ease, transform .55s ease; }
.js .expertise-grid article.is-visible { opacity: 1; transform: none; }
.section-block { margin-top: 4rem; }
.section-heading h2 { max-width: 780px; margin: 0; font-size: clamp(1.7rem, 3.3vw, 3rem); line-height: 1.12; letter-spacing: -.035em; }
.expertise-grid { display: grid; grid-template-columns: repeat(6, 1fr); margin-top: 2rem; border-top: 1px solid var(--border); }
.expertise-grid article { padding: 1.5rem 1.2rem 0 0; border-right: 1px solid var(--border); }
.expertise-grid article + article { padding-left: 1.2rem; }
.expertise-grid article:last-child { border-right: 0; }
.expertise-grid span, .principles-grid span { color: var(--coral); font: .72rem/1 var(--mono); }
.expertise-grid h3 { margin: 1rem 0 .6rem; font: 700 .98rem/1.3 var(--mono); }
.expertise-grid p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.65; }

.page-heading { padding-bottom: 2rem; border-bottom: 1px solid var(--border); }
.page-heading h1 { font-size: clamp(2.7rem, 6vw, 5.2rem); }
.page-heading > p:last-child { max-width: 700px; margin: 1.2rem 0 0; color: var(--muted); font: 1rem/1.65 var(--mono); text-transform: none; letter-spacing: 0; }
.experience-layout { display: grid; grid-template-columns: minmax(0, 1fr) 265px; gap: 3rem; margin-top: 2rem; }
.timeline { position: relative; }
.timeline::before { position: absolute; top: 1.4rem; bottom: 1.4rem; left: 7.85rem; width: 1px; background: var(--border-strong); content: ""; }
.timeline-entry { position: relative; border-bottom: 1px solid var(--border); }
.timeline-toggle { display: grid; grid-template-columns: 7rem minmax(0, 1fr) auto; gap: 1.5rem; align-items: start; width: 100%; padding: 1.3rem 0; border: 0; color: var(--text); background: transparent; text-align: left; cursor: pointer; }
.timeline-toggle::before { position: absolute; top: 1.45rem; left: 7.43rem; width: .72rem; height: .72rem; border: 2px solid var(--cyan); border-radius: 50%; background: var(--bg); content: ""; }
.timeline-entry.is-expanded .timeline-toggle::before { border-color: var(--coral); }
.timeline-date { color: var(--cyan); font: .72rem/1.4 var(--mono); }
.timeline-toggle strong { display: block; font-size: 1.15rem; }
.timeline-toggle small { display: block; margin-top: .3rem; color: var(--cyan); font: .82rem/1.4 var(--mono); }
.timeline-toggle > span:last-child { color: var(--coral); font: 1.4rem/1 var(--mono); }
.company-identity { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: .9rem; align-items: center; min-width: 0; }
.company-logo { display: grid; place-items: center; width: 3rem; height: 3rem; }
.company-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.company-logo--wide img { width: 3rem; height: auto; }
.timeline-detail { margin: -.4rem 0 1.4rem 8.5rem; color: var(--muted); font-size: .9rem; line-height: 1.65; }
.timeline-detail ul { padding-left: 1.1rem; }
.timeline-detail li { margin: .55rem 0; }
.timeline-detail li::marker { color: var(--coral); }
.role-history { color: var(--muted-2); font: .72rem/1.5 var(--mono); }
.capability-rail { padding-left: 2rem; border-left: 1px solid var(--border-strong); }
.capability-rail > p { margin: 0 0 1rem; color: var(--cyan); font: .72rem/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.capability-rail ul { padding: 0; margin: 0; list-style: none; }
.capability-rail li { padding: .78rem 0; border-top: 1px solid var(--border); color: #c3c7cd; font-size: .82rem; }

.split-heading { display: grid; grid-template-columns: 1.2fr .8fr; gap: 4rem; align-items: end; }
.split-heading > p:last-child { margin: 0; }
.project-list { margin-top: 1rem; }
.project-row { position: relative; display: grid; grid-template-columns: 3rem minmax(250px, .9fr) minmax(300px, 1.1fr) 130px; grid-template-areas: "number story detail action"; gap: 1.5rem; padding: 2rem 0; border-bottom: 1px solid var(--border); }
.project-number { color: var(--coral); font: 1rem/1.5 var(--mono); }
.project-number { grid-area: number; }
.project-copy { grid-area: story; }
.project-row > :not(.workflow-map) { transition: filter .2s ease, opacity .2s ease; }
.project-row:hover > :not(.workflow-map), .project-row:focus-within > :not(.workflow-map), .project-row.is-previewing > :not(.workflow-map) { filter: blur(3px); opacity: .22; }
.project-row h2 { margin: 0; font: 1.35rem/1.2 var(--mono); }
.project-row p { margin: .8rem 0 0; color: var(--muted); font-size: .86rem; line-height: 1.6; }
.project-row .project-subtitle { margin-top: .35rem; color: var(--cyan); font: .76rem/1.4 var(--mono); }
.project-row dl { grid-area: detail; margin: 0; }
.project-row dl div + div { margin-top: 1.1rem; }
.project-row dt { color: var(--muted-2); font: .65rem/1.4 var(--mono); text-transform: uppercase; }
.project-row dd { margin: .3rem 0 0; color: #c5c8cd; font: .78rem/1.55 var(--mono); }
.status-dot { display: inline-block; width: .48rem; height: .48rem; margin-right: .4rem; border-radius: 50%; background: var(--green); }
.project-actions { grid-area: action; display: grid; align-content: start; gap: .8rem; }
.project-actions a { color: var(--coral); font: .8rem/1.4 var(--mono); text-decoration: none; }
.project-actions a:hover { color: var(--cyan); }
.workflow-map { --flow-accent: var(--cyan); position: absolute; z-index: 15; top: 50%; right: 1rem; left: 4rem; display: grid; grid-template-columns: minmax(90px, 1fr) auto minmax(90px, 1fr) auto minmax(90px, 1fr) auto minmax(90px, 1fr); gap: .55rem; align-items: center; min-width: 0; padding: .8rem .9rem; border: 1px solid var(--flow-accent); background: rgb(10 12 15 / .98); box-shadow: 0 18px 45px rgb(0 0 0 / .6), 0 0 1.2rem color-mix(in srgb, var(--flow-accent) 16%, transparent); font: .68rem/1.35 var(--mono); opacity: 0; pointer-events: none; transform: translateY(calc(-50% + .35rem)) scale(.985); transition: opacity .18s ease, transform .18s ease; }
.project-row:hover .workflow-map, .project-row:focus-within .workflow-map, .project-row.is-previewing .workflow-map { opacity: 1; pointer-events: auto; transform: translateY(-50%) scale(1); }
.workflow-map::before { position: absolute; top: 5.82rem; right: 10%; left: 10%; height: 1px; background: var(--border-strong); content: ""; }
.workflow-map::after { position: absolute; top: 5.55rem; left: 10%; width: .55rem; height: .55rem; border-radius: 50%; background: var(--flow-accent); box-shadow: 0 0 .45rem var(--flow-accent), 0 0 1rem var(--flow-accent); content: ""; animation: workflow-signal 4.2s linear infinite; }
@keyframes workflow-signal { from { left: 10%; } to { left: 89%; } }
.workflow-preview-label { grid-column: 1 / -1; display: flex; padding-bottom: .65rem; border-bottom: 1px solid var(--border); color: var(--muted-2); font: 500 .62rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.workflow-preview-label em { margin-left: auto; color: var(--flow-accent); font-style: normal; }
.workflow-map span { min-width: 0; color: #c5c8cd; }
.workflow-map .workflow-command { grid-column: 1 / -1; color: var(--flow-accent); }
.workflow-map .workflow-command::before { color: var(--muted-2); content: "> "; }
.workflow-map i { color: var(--muted-2); font-style: normal; text-align: center; }
.workflow-map .workflow-output { color: var(--green); }
.workflow-map > span:not(.workflow-command) { position: relative; z-index: 1; margin-top: .8rem; padding: .45rem .5rem; border: 1px solid var(--border); background: var(--bg); text-align: center; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.workflow-map > span:not(.workflow-command):hover { border-color: var(--flow-accent); box-shadow: 0 0 .8rem color-mix(in srgb, var(--flow-accent) 25%, transparent); transform: translateY(-2px); }
.workflow-map > span[data-detail]::after { position: absolute; z-index: 4; right: -.5rem; bottom: calc(100% + .65rem); width: 190px; padding: .6rem .7rem; border: 1px solid var(--flow-accent); color: #d8dade; background: #0a0c0f; box-shadow: 0 12px 28px rgb(0 0 0 / .45); content: attr(data-detail); font: .62rem/1.5 var(--mono); text-align: left; opacity: 0; pointer-events: none; transform: translateY(.25rem); transition: opacity .16s ease, transform .16s ease; }
.workflow-map > span[data-detail]:hover::after { opacity: 1; transform: translateY(0); }
.workflow-map--identity { --flow-accent: #50d6df; }
.workflow-map--governance { --flow-accent: #b889ff; }
.workflow-map--support { --flow-accent: #62a8ff; }
.workflow-map--network { --flow-accent: #f2b65d; }
.workflow-map--sync { --flow-accent: #e67ad1; }

.principles-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 2rem; border: 1px solid var(--border); }
.principles-grid article { min-height: 210px; padding: 1.5rem; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.principles-grid article:nth-child(3n) { border-right: 0; }
.principles-grid article:nth-last-child(-n+3) { border-bottom: 0; }
.principles-grid h2 { margin: 2.3rem 0 .7rem; font: 1.05rem/1.3 var(--mono); }
.principles-grid p { margin: 0; color: var(--muted); font-size: .87rem; line-height: 1.65; }
.principles-grid p.principle-proof { margin-top: .85rem; color: var(--muted-2); font-size: .78rem; line-height: 1.55; }

.systems-strategy { display: flex; flex-wrap: wrap; gap: .55rem; margin: 1.5rem 0 0; padding: 1.1rem 0 0; border-top: 1px solid var(--border); list-style: none; }
.systems-strategy li { padding: .45rem .7rem; border: 1px solid var(--border); color: var(--cyan); font: .7rem/1.35 var(--mono); }

.lab-grid { display: grid; grid-template-columns: 1fr; margin-top: 2rem; border: 1px solid var(--border); }
.lab-grid article { position: relative; overflow: hidden; min-height: 270px; padding: clamp(1.4rem, 3vw, 2rem); border-bottom: 1px solid var(--border); }
.lab-grid article:last-child { border-bottom: 0; }
.lab-grid article > :not(.workflow-map) { transition: filter .2s ease, opacity .2s ease; }
.lab-grid article:hover > :not(.workflow-map), .lab-grid article:focus-within > :not(.workflow-map) { filter: blur(3px); opacity: .22; }
.lab-grid article > span { color: var(--coral); font: .7rem/1 var(--mono); letter-spacing: .06em; }
.lab-grid .workflow-map { top: 50%; right: .85rem; left: .85rem; }
.lab-grid article:hover .workflow-map, .lab-grid article:focus-within .workflow-map { opacity: 1; pointer-events: auto; transform: translateY(-50%) scale(1); }
.workflow-map--lab-dense { grid-template-columns: minmax(64px, 1fr) auto minmax(64px, 1fr) auto minmax(64px, 1fr) auto minmax(64px, 1fr) auto minmax(64px, 1fr); }
.workflow-map--lab-ai { --flow-accent: #50d6df; }
.workflow-map--lab-ops { --flow-accent: #f2b65d; }
.workflow-map--lab-iac { --flow-accent: var(--green); }
.lab-grid .workflow-map-footer { grid-column: 1 / -1; max-width: none; margin: .55rem 0 0; padding-top: .65rem; border-top: 1px solid var(--border); }
.lab-grid .workflow-map-footer a { color: var(--flow-accent); font: 700 .68rem/1.2 var(--mono); text-decoration: none; }
.lab-grid .workflow-map-footer a:hover, .lab-grid .workflow-map-footer a:focus-visible { color: var(--text); }
.workflow-map--lab-diagram { display: grid; grid-template-columns: 1fr; gap: .55rem; align-items: stretch; left: .75rem; right: .75rem; padding: .75rem .8rem; max-height: min(86%, 640px); overflow: auto; }
.workflow-map--lab-diagram::before, .workflow-map--lab-diagram::after { display: none; }
.workflow-map--lab-diagram .workflow-preview-label { margin: 0; padding-bottom: .45rem; }
.lab-diagram-note { margin: 0; color: #c5c8cd; font: .68rem/1.5 var(--mono); }
.lab-diagram { display: block; width: 100%; height: auto; border: 1px solid var(--border); background: #05070b; }
.lab-diagram-caption { margin: 0; color: var(--flow-accent); font: .66rem/1.4 var(--mono); }
.lab-grid .workflow-map--lab-diagram { top: 50%; max-width: none; }

.lab-grid h2 { margin: 2rem 0 .7rem; font: 1.25rem/1.3 var(--mono); }
.lab-grid p { max-width: 620px; margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.7; }
.lab-grid ul, .iac-chips { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1.4rem 0 0; padding: 0; list-style: none; }
.lab-grid li, .iac-chips li { padding: .35rem .55rem; border: 1px solid var(--border); color: var(--cyan); font: .67rem/1.2 var(--mono); }

.iac-section { margin-top: 3rem; }
.iac-section > span { color: var(--coral); font: .7rem/1 var(--mono); letter-spacing: .06em; }
.iac-section h2 { margin: 1rem 0 .7rem; font: 1.25rem/1.3 var(--mono); }
.iac-section h3 { margin: 1.6rem 0 .5rem; color: var(--cyan); font: .85rem/1.3 var(--mono); }
.iac-section p { max-width: 760px; margin: .6rem 0 0; color: var(--muted); font-size: .9rem; line-height: 1.7; }
.iac-table { width: 100%; max-width: 900px; margin-top: 1rem; border-collapse: collapse; font: .78rem/1.5 var(--mono); }
.iac-table th, .iac-table td { padding: .6rem .8rem; border: 1px solid var(--border); text-align: left; vertical-align: top; }
.iac-table th { color: var(--muted-2); font-weight: 500; text-transform: uppercase; letter-spacing: .06em; }
.iac-table td { color: #c5c8cd; }
.iac-table td:first-child { color: var(--cyan); white-space: nowrap; }
.iac-code { max-width: 900px; margin: .8rem 0 0; padding: 1rem 1.1rem; overflow-x: auto; border: 1px solid var(--border); color: #c5c8cd; background: var(--surface); font: .75rem/1.6 var(--mono); }
.iac-callout { max-width: 900px; padding: 1rem 1.2rem; border: 1px solid var(--border); border-left: 3px solid var(--coral); background: var(--surface); }
figure.iac-section { margin: 3rem 0 0; }
.iac-section .lab-diagram { max-width: 900px; margin-top: 1rem; }
.iac-section .lab-diagram-caption { margin-top: .6rem; }
.iac-callout h2 { margin-top: 0; color: var(--coral); }
.contact-view { max-width: 950px; padding-top: clamp(2rem, 7vw, 6rem); }
.contact-view h1 { max-width: 900px; font-size: clamp(3.3rem, 7vw, 6.5rem); }
.contact-view > p { max-width: 760px; margin: 1.6rem 0 3.5rem; color: var(--muted); font: 1rem/1.7 var(--mono); }
.contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--border); }
.contact-grid a { display: grid; gap: .55rem; padding: 1.5rem; border-right: 1px solid var(--border); text-decoration: none; }
.contact-grid a:last-child { border-right: 0; }
.contact-grid a:hover { background: var(--surface); }
.contact-grid span { color: var(--coral); font: .7rem/1.2 var(--mono); text-transform: uppercase; }
.contact-grid strong { font-size: .92rem; }

.terminal-dock { position: fixed; z-index: 30; right: 1rem; bottom: 0; left: calc(var(--sidebar) + 1rem); border: 1px solid var(--border-strong); border-bottom: 0; background: rgb(10 11 13 / .98); box-shadow: 0 -18px 45px rgb(0 0 0 / .25); }
.terminal-bar { display: flex; justify-content: space-between; width: 100%; padding: .7rem .9rem; border: 0; color: var(--muted); background: var(--surface); font: .7rem/1 var(--mono); cursor: pointer; }
.terminal-bar b { color: var(--coral); }
.terminal-bar i { display: inline-block; margin-left: .4rem; font-style: normal; transition: transform .2s ease; }
.terminal-bar[aria-expanded="true"] i { transform: rotate(180deg); }
.terminal-panel { max-height: 270px; padding: .85rem 1rem; overflow-y: auto; font: .74rem/1.55 var(--mono); }
.terminal-history p { margin: .2rem 0; }
.terminal-history b { color: var(--cyan); }
.prompt { color: var(--cyan); }
.command-form { display: flex; gap: .65rem; align-items: center; margin-top: .35rem; }
.command-form input { flex: 1; min-width: 0; padding: 0; border: 0; outline: none; color: var(--text); background: transparent; font: inherit; caret-color: var(--coral); }
.terminal-error { color: var(--coral); }

:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }

@media (max-width: 980px) {
  :root { --sidebar: 190px; }
  .hero-grid, .split-heading { grid-template-columns: 1fr; gap: 2rem; }
  .hero-note { max-width: 520px; }
  .proof-strip { grid-template-columns: repeat(3, 1fr); }
  .expertise-grid { grid-template-columns: repeat(2, 1fr); }
  .expertise-grid article { padding: 1.25rem; border-bottom: 1px solid var(--border); }
  .expertise-grid article + article { padding-left: 1.25rem; }
  .expertise-grid article:nth-child(2n) { border-right: 0; }
  .experience-layout { grid-template-columns: 1fr; }
  .capability-rail { padding: 1.5rem 0 0; border: 0; border-top: 1px solid var(--border); }
  .capability-rail ul { columns: 2; column-gap: 2rem; }
  .project-row { grid-template-columns: 2.5rem 1fr; grid-template-areas: "number story" ". detail" ". action"; }
  .workflow-map { left: 2.5rem; grid-template-columns: minmax(90px, 1fr) auto minmax(90px, 1fr) auto minmax(90px, 1fr) auto minmax(90px, 1fr); }
}

@media (max-width: 720px) {
  .app-shell { display: block; }
  .sidebar { display: none; }
  .workspace { padding: 0 1rem 6rem; }
  .mobile-header { position: sticky; z-index: 40; top: 0; display: flex; justify-content: space-between; align-items: center; margin: 0 -1rem 2rem; padding: 1rem; border-bottom: 1px solid var(--border); background: rgb(9 10 12 / .94); backdrop-filter: blur(18px); }
  .mobile-header .brand { font-size: 1rem; }
  .menu-toggle { padding: .55rem .7rem; border: 1px solid var(--border-strong); color: var(--text); background: transparent; font: .72rem/1 var(--mono); text-transform: uppercase; }
  .mobile-nav { position: fixed; z-index: 35; top: 58px; right: 0; left: 0; display: none; grid-template-columns: 1fr 1fr; gap: 1px; padding: 1px; background: var(--border); }
  .mobile-nav.is-open { display: grid; }
  .mobile-nav button, .mobile-nav a { padding: 1rem; border: 0; color: var(--text); background: var(--surface); font: .78rem/1 var(--mono); text-decoration: none; }
  .view { padding-top: .5rem; }
  h1 { font-size: clamp(3rem, 15vw, 5rem); }
  .role { font-size: 1rem; }
  .hero-copy { font-size: .92rem; }
  .hero-note { display: none; }
  .proof-strip { grid-template-columns: 1fr; margin: 3rem 0; }
  .proof-strip div { border-right: 0; border-bottom: 1px solid var(--border); }
  .proof-strip div:last-child { border-bottom: 0; }
  .proof-strip div { padding: 1.2rem .8rem; }
  .proof-strip dt { font-size: 2rem; }
  .proof-strip dd { font-size: .56rem; }
  .expertise-grid { grid-template-columns: 1fr; }
  .expertise-grid article, .expertise-grid article + article { padding: 1.2rem 0; border-right: 0; }
  .page-heading h1 { font-size: clamp(2.6rem, 13vw, 4rem); }
  .experience-layout { gap: 2rem; }
  .timeline::before { display: none; }
  .timeline-toggle { grid-template-columns: 1fr auto; gap: .5rem; }
  .timeline-toggle::before { display: none; }
  .timeline-date { grid-column: 1 / -1; }
  .timeline-date { grid-column: 1 / -1; }
  .timeline-detail { margin: 0 0 1.4rem; }
  .capability-rail ul { columns: 1; }
  .project-row { grid-template-columns: 2rem 1fr; gap: 1rem; }
  .workflow-map { position: relative; top: auto; right: auto; left: auto; grid-area: flow; grid-template-columns: 1fr; gap: .5rem; margin-top: .25rem; opacity: 1; pointer-events: auto; transform: none; }
  .project-row { grid-template-areas: "number story" ". flow" ". detail" ". action"; }
  .project-row:hover > :not(.workflow-map), .project-row:focus-within > :not(.workflow-map), .project-row.is-previewing > :not(.workflow-map) { filter: none; opacity: 1; }
  .project-row:hover .workflow-map, .project-row:focus-within .workflow-map, .project-row.is-previewing .workflow-map { transform: none; }
  .workflow-map::before, .workflow-map::after { display: none; }
  .workflow-map .workflow-command { grid-column: 1 / -1; padding-bottom: .45rem; border-bottom: 1px solid var(--border); }
  .workflow-map > span:not(.workflow-command) { margin-top: 0; padding-left: .65rem; border-left: 1px solid var(--flow-accent); text-align: left; }
  .workflow-map i { display: none; }
  .principles-grid { grid-template-columns: 1fr; }
  .principles-grid article, .principles-grid article:nth-child(3n), .principles-grid article:nth-last-child(-n+3) { min-height: 0; border-right: 0; border-bottom: 1px solid var(--border); }
  .principles-grid article:last-child { border-bottom: 0; }
  .principles-grid h2 { margin-top: 1.4rem; }
  .lab-grid article { min-height: 0; }
  .lab-grid article:hover > :not(.workflow-map), .lab-grid article:focus-within > :not(.workflow-map) { filter: none; opacity: 1; }
  .lab-grid .workflow-map { position: relative; top: auto; right: auto; left: auto; margin-top: 1rem; opacity: 1; pointer-events: auto; transform: none; }
  .lab-grid article:hover .workflow-map, .lab-grid article:focus-within .workflow-map { transform: none; }
  .workflow-map--lab-dense { grid-template-columns: 1fr; }
  .workflow-map--lab-diagram { max-height: none; }

  .contact-grid { grid-template-columns: 1fr; }
  .contact-grid a { border-right: 0; border-bottom: 1px solid var(--border); }
  .contact-grid a:last-child { border-bottom: 0; }
  .terminal-dock { left: .5rem; right: .5rem; }
}

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