@font-face {
  font-family:Portfolio Sans;
  src:url('/font/roboto/Roboto-Regular.woff2') format('woff2');
  font-weight:400;
  font-display:swap
}
@font-face {
  font-family:Portfolio Sans;
  src:url('/font/roboto/Roboto-Medium.woff2') format('woff2');
  font-weight:500 700;
  font-display:swap
}
:root {
  --paper:#f6f4ed;
  --ink:#193d30;
  --text:#43564c;
  --line:#d3d9cd;
  --muted:#eaece2;
  --accent:#a65c3b;
  --serif:Georgia,'Times New Roman',serif;
  --sans:'Portfolio Sans',Arial,sans-serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:110px
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.7 var(--sans);
  -webkit-font-smoothing:antialiased
}
::selection {
  background:#d8ddbd
}
a {
  color:inherit;
  text-underline-offset:5px
}
button {
  font:inherit;
  color:inherit;
  cursor:pointer
}
button,a,summary {
  -webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:3px solid #b46a42;
  outline-offset:5px
}
h1,h2,h3,h4,p,figure {
  margin:0
}
h1,h2,h3 {
  font-weight:400
}
h1,h2 {
  font-family:var(--serif);
  letter-spacing:-.045em;
  line-height:1.1
}
h1 {
  font-size:clamp(64px,6.8vw,108px)
}
h2 {
  font-size:clamp(38px,4.4vw,66px)
}
h3 {
  font-family:var(--serif);
  font-size:36px;
  line-height:1.2;
  letter-spacing:-.025em
}
h4 {
  font-size:17px;
  font-weight:500;
  line-height:1.4;
  margin-bottom:12px
}
em {
  font-weight:400;
  color:#677b56
}
p {
  color:var(--text)
}
p+p {
  margin-top:18px
}
.wrap {
  width:min(1280px,88%);
  margin:auto
}
.section {
  padding:112px 0
}
.eyebrow {
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:500;
  color:var(--ink);
  line-height:1.6
}
.site-header {
  height:94px;
  width:88%;
  max-width:1280px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line)
}
.wordmark {
  font:italic 43px var(--serif);
  letter-spacing:-4px;
  text-decoration:none
}
.wordmark span {
  color:var(--accent)
}
nav {
  display:flex;
  align-items:center;
  gap:36px
}
nav a {
  font-size:13px;
  text-decoration:none;
  padding:10px 0
}
nav a:hover,.text-link:hover {
  color:var(--accent)
}
.nav-contact {
  border-bottom:1px solid var(--ink)
}
.nav-contact span {
  margin-left:22px
}
.menu-toggle {
  display:none
}
.skip {
  position:fixed;
  top:-100px;
  left:20px;
  padding:12px 24px;
  background:var(--ink);
  color:white;
  z-index:10
}
.skip:focus {
  top:15px
}
.hero {
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:7%;
  align-items:center;
  padding-top:64px;
  padding-bottom:64px;
  min-height:760px
}
.hero .eyebrow {
  margin-bottom:30px
}
.dot {
  display:inline-block;
  background:var(--accent);
  border-radius:50%;
  width:6px;
  height:6px;
  margin:0 9px 2px 0
}
.hero-role {
  font-size:18px;
  color:var(--ink);
  margin-top:28px
}
.hero-description {
  max-width:425px;
  font-size:16px;
  margin-top:14px
}
.button {
  display:inline-flex;
  gap:38px;
  align-items:center;
  min-height:52px;
  padding:10px 22px;
  background:var(--ink);
  color:var(--paper);
  text-decoration:none;
  font-size:13px;
  margin-top:30px;
  transition:background .2s,transform .2s
}
.button:hover {
  background:#2c5542;
  transform:translateY(-2px)
}
.hero-note {
  display:flex;
  gap:24px;
  font-size:11px;
  color:var(--text);
  margin-top:44px
}
.hero-portrait {
  position:relative
}
.hero-portrait img {
  width:100%;
  height:auto;
  max-height:640px;
  object-fit:cover;
  object-position:center 30%;
  display:block;
  border-radius:2px 2px 90px 2px
}
.hero-portrait figcaption {
  font-size:10px;
  letter-spacing:.03em;
  margin-top:14px;
  color:var(--text)
}
.hero-copy {
  animation:enter .7s ease-out
}
.hero-portrait {
  animation:enter 1s ease-out
}
@keyframes enter {
  from {
    opacity:0;
    transform:translateY(15px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
}
.chapter-strip {
  display:flex;
  justify-content:space-between;
  gap:16px;
  border-block:1px solid var(--line);
  padding:24px 0;
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase
}
.two-column {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10%
}
.two-column h2 {
  margin-top:24px
}
.two-column>div>p:not(.eyebrow) {
  margin-top:24px;
  max-width:440px
}
.prose {
  max-width:620px
}
.lead {
  font-size:21px;
  line-height:1.55;
  color:var(--ink)
}
.achievements {
  padding:45px 0 60px;
  border-top:1px solid var(--line)
}
.small-heading {
  font-family:var(--sans);
  font-size:24px;
  letter-spacing:-.02em;
  margin-top:12px
}
.metrics {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:38px
}
.metrics a {
  display:block;
  position:relative;
  text-decoration:none;
  padding:10px 50px 10px 28px;
  border-left:1px solid var(--line)
}
.metrics a:first-child {
  padding-left:0;
  border-left:0
}
.metrics strong {
  font:54px var(--serif);
  letter-spacing:-.05em
}
.metrics span {
  display:block;
  max-width:230px;
  margin-top:12px;
  font-size:13px;
  line-height:1.6;
  color:var(--text)
}
.metrics b {
  position:absolute;
  right:24px;
  top:28px;
  font-weight:400
}
.section-heading {
  margin-bottom:48px
}
.section-heading h2 {
  margin-top:20px
}
.section-heading>p:last-child:not(.eyebrow) {
  margin-top:24px;
  max-width:560px
}
.case {
  padding:48px;
  margin-bottom:32px;
  border:1px solid var(--line);
  scroll-margin-top:35px
}
.case-top {
  display:flex;
  justify-content:space-between;
  gap:16px;
  border-bottom:1px solid var(--line);
  padding-bottom:22px;
  margin-bottom:38px
}
.case-top>span:last-child {
  font-size:12px;
  color:var(--text)
}
.case-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7%;
  align-items:start
}
.case h3 {
  margin-bottom:24px
}
.case p {
  font-size:15px
}
.case .lead {
  font-size:19px
}
.luma {
  background:#e9eddf
}
.pipeline {
  padding:26px 32px;
  background:#f4f5ec
}
.pipeline ol {
  list-style:none;
  padding:0;
  margin:24px 0
}
.pipeline li {
  display:flex;
  gap:20px;
  position:relative;
  padding:0 0 28px
}
.pipeline li:last-child {
  padding-bottom:0
}
.pipeline li>span {
  color:#526447;
  font-size:11px;
  padding-top:3px
}
.pipeline li:not(:last-child):before {
  content:'';
  position:absolute;
  left:6px;
  top:30px;
  bottom:6px;
  border-left:1px solid #bcc7b0
}
.pipeline strong {
  display:block;
  font-size:15px;
  font-weight:500
}
.pipeline small {
  display:block;
  font-size:12px;
  color:var(--text);
  margin-top:4px
}
.diagram-note {
  font-size:11px!important;
  color:#5c6b60!important;
  line-height:1.5
}
.stack {
  border-top:1px solid var(--line);
  padding-top:22px;
  margin-top:24px!important;
  font-size:11px!important;
  letter-spacing:.03em
}
details {
  margin-top:32px;
  border-top:1px solid var(--line)
}
summary {
  min-height:64px;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  font-size:14px;
  list-style:none
}
summary::-webkit-details-marker {
  display:none
}
details[open] summary span {
  transform:rotate(45deg)
}
details .prose {
  padding:10px 0 24px
}
.detail-grid,.three-up {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px
}
.detail-grid {
  padding:12px 0 24px
}
.detail-grid p,.three-up p {
  font-size:13px
}
.three-up {
  margin-top:38px;
  padding-top:30px;
  border-top:1px solid var(--line)
}
.architecture {
  background:#eeeee5;
  padding:20px
}
.diagram-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px
}
.segmented {
  display:flex;
  border:1px solid #bbc4b5;
  padding:3px;
  border-radius:3px
}
.segmented button {
  border:0;
  background:none;
  font-size:12px;
  min-height:38px;
  min-width:58px
}
.segmented button[aria-pressed=true] {
  background:var(--ink);
  color:var(--paper)
}
svg {
  width:100%;
  height:auto;
  display:block;
  margin:20px 0 12px
}
svg text {
  text-anchor:middle;
  font-family:var(--sans);
  font-size:13px;
  fill:var(--ink)
}
.systems rect {
  fill:var(--paper);
  stroke:#c3cbbe
}
.connections {
  fill:none;
  stroke:#9aa98d;
  stroke-width:1.5
}
.boundary {
  fill:#e2e8d7;
  stroke:#9dab8e;
  stroke-dasharray:5 5;
  transition:fill .4s
}
.connector rect {
  fill:#f6f7ef;
  stroke:#819772;
  transition:fill .4s,stroke .4s
}
.sub-label {
  font-size:10px;
  fill:#526846
}
#boundary-label {
  font-size:11px
}
.architecture[data-mode=before] .boundary {
  fill:#e6ded3;
  stroke:#a6896f;
  stroke-dasharray:0
}
.architecture[data-mode=before] .connector rect {
  fill:#e6ded3;
  stroke:transparent
}
.architecture[data-mode=before] .sub-label {
  opacity:0
}
.diagram-caption {
  font-size:12px!important;
  min-height:66px;
  margin-bottom:12px
}
.cloud {
  background:var(--ink);
  color:var(--paper)
}
.cloud p,.cloud .case-top>span:last-child {
  color:#ccd7cb
}
.cloud .eyebrow {
  color:#d6dfc5
}
.cloud .case-top,.cloud .three-up {
  border-color:#4b6354
}
.cost-results {
  display:grid;
  gap:24px
}
.cost-results strong {
  font:52px var(--serif);
  letter-spacing:-.035em
}
.cost-results strong small {
  font:14px var(--sans)
}
.cost-results p {
  font-size:13px;
  margin-top:4px
}
.text-link {
  display:inline-block;
  padding:12px 0;
  font-size:13px;
  text-decoration:none;
  border-bottom:1px solid currentColor
}
.cloud>.text-link {
  margin-top:30px
}
.leadership-notes>div {
  padding:0 0 25px 38px;
  position:relative
}
.leadership-notes>div>span {
  position:absolute;
  left:0;
  font-size:11px;
  color:#526447
}
.leadership-notes p {
  font-size:13px
}
.method-section {
  background:#e9ecdf;
  border-block:1px solid var(--line)
}
.workflow-controls {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-bottom:1px solid #b9c4af
}
.workflow-controls button {
  border:0;
  border-bottom:3px solid transparent;
  background:transparent;
  min-height:78px;
  text-align:left;
  padding:18px;
  font-size:20px
}
.workflow-controls button[aria-pressed=true] {
  border-bottom-color:var(--ink);
  background:#dfe5d3
}
.workflow-controls span {
  font-size:11px;
  margin-right:16px;
  color:#576a4d
}
.workflow-controls b {
  float:right;
  font-weight:400
}
.workflow-panel {
  padding:42px 0;
  max-width:820px
}
.workflow-panel h3 {
  margin:15px 0 20px
}
.workflow-panel p:not(.eyebrow) {
  max-width:720px
}
.workflow-panel[hidden] {
  display:none
}
.gate {
  border-top:1px solid #bdc8b4;
  padding-top:24px;
  margin-top:30px!important;
  font-size:13px
}
.gate span {
  display:inline-block;
  color:var(--ink);
  font-weight:500;
  margin-right:20px
}
.method-footnote {
  font-size:12px
}
.expertise-list>div {
  padding:24px 0;
  border-top:1px solid var(--line)
}
.expertise-list h3 {
  font:19px var(--sans);
  margin-bottom:12px
}
.expertise-list p {
  font-size:14px
}
.career {
  border-top:1px solid var(--line)
}
.timeline {
  list-style:none;
  margin:0;
  padding:0
}
.timeline li {
  display:grid;
  grid-template-columns:30% 1fr;
  padding:30px 0;
  border-top:1px solid var(--line);
  gap:25px
}
.timeline time {
  font-size:12px;
  color:var(--text);
  padding-top:7px
}
.timeline h3 {
  font-size:29px
}
.timeline p {
  font-size:14px;
  max-width:680px;
  margin-top:10px
}
.timeline .role {
  color:var(--ink);
  font-weight:500
}
.recognition {
  border-top:1px solid var(--line)
}
.recognition-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:36px
}
.recognition-grid>a {
  text-decoration:none
}
.recognition-grid h3 {
  font-size:28px;
  margin:18px 0
}
.recognition-grid p {
  font-size:14px
}
.recognition-grid .text-link {
  margin-top:18px
}
.education {
  display:grid;
  grid-template-columns:1fr 2fr 2fr;
  gap:25px;
  margin-top:70px;
  padding-top:35px;
  border-top:1px solid var(--line)
}
.education h3 {
  font-size:24px
}
.education p {
  font-size:13px
}
.education .eyebrow {
  font-size:11px
}
.contact {
  background:#193d30;
  color:var(--paper);
  padding:90px 0 0
}
.contact .eyebrow {
  color:#ced9c5
}
.contact h2 {
  font-size:clamp(50px,6.2vw,92px);
  margin-top:24px
}
.contact em {
  color:#b8c7a1
}
.contact p {
  color:#ced9cb;
  margin-top:24px
}
.contact-email {
  display:inline-block;
  font-size:clamp(16px,2.5vw,30px);
  margin-top:32px;
  text-decoration:none;
  border-bottom:1px solid #a8b79d;
  padding-bottom:10px;
  overflow-wrap:anywhere
}
.contact-email span {
  margin-left:24px
}
.contact-links {
  display:flex;
  gap:30px;
  margin-top:28px
}
.contact-links a {
  font-size:13px;
  padding:10px 0;
  text-decoration:none
}
footer {
  border-top:1px solid #4b6354;
  margin-top:80px;
  padding:28px 0;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:11px;
  color:#ced9cb
}
footer a {
  text-decoration:none
}
@media(min-width:1600px) {
  .hero {
    gap:10%;
    padding-block:80px
  }
  .hero-portrait img {
    max-height:680px
  }
  .hero h1 {
    font-size:108px
  }
}
@media(max-width:1024px) {
  .wrap,.site-header {
    width:90%
  }
  .hero {
    gap:5%;
    min-height:650px;
    padding-block:45px
  }
  h1 {
    font-size:72px
  }
  .hero-note {
    gap:14px;
    font-size:10px
  }
  .section {
    padding:80px 0
  }
  .case {
    padding:30px
  }
  .case-grid {
    gap:5%
  }
  .case h3 {
    font-size:32px
  }
  .pipeline {
    padding:24px
  }
  .diagram-toolbar {
    flex-wrap:wrap
  }
  .three-up,.detail-grid {
    gap:20px
  }
  .workflow-controls button {
    padding:16px 10px;
    font-size:18px
  }
  .workflow-controls span {
    margin-right:8px
  }
  .two-column {
    gap:6%
  }
}
@media(max-width:700px) {
  html {
    scroll-padding-top:25px
  }
  .site-header {
    height:78px;
    position:relative
  }
  .menu-toggle {
    display:flex;
    align-items:center;
    gap:16px;
    border:0;
    background:none;
    min-height:44px;
    padding:0 6px;
    font-size:13px
  }
  .site-header nav {
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:77px;
    background:var(--paper);
    z-index:5;
    border:1px solid var(--line);
    padding:20px;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    box-shadow:0 16px 25px #193d3010
  }
  .site-header nav.open {
    display:flex
  }
  nav a {
    padding:12px
  }
  .hero {
    grid-template-columns:1fr;
    gap:36px;
    padding-top:42px;
    padding-bottom:32px;
    min-height:0
  }
  .hero h1 {
    font-size:clamp(62px,12vw,84px)
  }
  .hero .eyebrow {
    margin-bottom:24px;
    font-size:10px
  }
  .hero-role {
    font-size:16px;
    margin-top:24px
  }
  .hero-description {
    font-size:15px;
    max-width:420px
  }
  .hero-note {
    margin-top:25px;
    font-size:10px;
    justify-content:space-between
  }
  .hero-portrait img {
    max-height:none;
    aspect-ratio:1/1.05;
    object-position:50% 27%;
    border-bottom-right-radius:65px
  }
  .hero-portrait figcaption {
    font-size:10px
  }
  .chapter-strip {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    font-size:9px;
    padding:22px 0
  }
  .section {
    padding:64px 0
  }
  .two-column,.case-grid {
    grid-template-columns:1fr;
    gap:28px
  }
  .two-column h2 {
    margin-top:18px
  }
  .prose .lead {
    font-size:20px
  }
  .achievements {
    padding:30px 0
  }
  .metrics {
    grid-template-columns:1fr;
    margin-top:25px
  }
  .metrics a,.metrics a:first-child {
    padding:23px 45px 23px 0;
    border:0;
    border-top:1px solid var(--line);
    display:grid;
    grid-template-columns:42% 1fr;
    align-items:center;
    gap:12px
  }
  .metrics strong {
    font-size:42px
  }
  .metrics span {
    font-size:12px;
    margin:0
  }
  .metrics b {
    right:5px;
    top:32px
  }
  .section-heading {
    margin-bottom:32px
  }
  .case {
    padding:23px;
    margin-bottom:22px
  }
  .case-top {
    flex-direction:column;
    gap:7px;
    margin-bottom:28px;
    padding-bottom:18px
  }
  .case h3 {
    font-size:32px
  }
  .case p {
    font-size:14px
  }
  .pipeline {
    padding:22px
  }
  .three-up,.detail-grid {
    grid-template-columns:1fr;
    gap:24px
  }
  .three-up {
    margin-top:28px;
    padding-top:24px
  }
  .architecture {
    padding:14px;
    margin-inline:-8px
  }
  .diagram-toolbar .eyebrow {
    font-size:9px
  }
  .diagram-caption {
    min-height:0
  }
  .cost-results {
    grid-template-columns:1fr 1fr;
    gap:18px
  }
  .cost-results strong {
    font-size:36px
  }
  .cost-results strong small {
    display:block;
    margin-top:8px
  }
  .cost-results p {
    font-size:12px
  }
  .leadership-notes>div:last-child {
    padding-bottom:0
  }
  .workflow-controls {
    grid-template-columns:1fr 1fr
  }
  .workflow-controls button {
    font-size:18px;
    min-height:65px
  }
  .workflow-panel {
    padding:30px 0
  }
  .workflow-panel h3 {
    font-size:29px
  }
  .workflow-panel p {
    font-size:14px
  }
  .gate span {
    display:block;
    margin-bottom:8px
  }
  .expertise-list>div:first-child {
    margin-top:12px
  }
  .timeline li {
    grid-template-columns:1fr;
    gap:12px;
    padding:25px 0
  }
  .timeline h3 {
    font-size:27px
  }
  .timeline time {
    font-size:11px
  }
  .recognition-grid {
    grid-template-columns:1fr;
    gap:32px
  }
  .recognition-grid>div,.recognition-grid>a {
    padding-top:25px;
    border-top:1px solid var(--line)
  }
  .recognition-grid h3 {
    font-size:28px
  }
  .education {
    grid-template-columns:1fr;
    gap:18px;
    margin-top:45px
  }
  .contact {
    padding-top:64px
  }
  .contact h2 {
    font-size:56px
  }
  .contact p {
    font-size:14px
  }
  .contact-email {
    font-size:17px
  }
  .contact-email span {
    margin-left:6px
  }
  .contact-links {
    gap:24px
  }
  footer {
    margin-top:55px;
    flex-wrap:wrap;
    padding-block:24px
  }
  footer span:first-child {
    flex-basis:100%
  }
  .stack {
    line-height:2
  }
  summary {
    font-size:13px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    animation:none!important;
    transition:none!important
  }
}
@media print {
  .menu-toggle,.workflow-controls,.segmented,.button {
    display:none!important
  }
  .workflow-panel[hidden] {
    display:block
  }
  .case,.contact,.method-section {
    background:white;
    color:black
  }
  .case p,.contact p {
    color:black
  }
  .section {
    padding:30px 0
  }
  details {
    display:block
  }
  .hero {
    min-height:0
  }
  .case {
    break-inside:avoid
  }
}
@media(max-width:700px) {
  .hero h1 {
    font-size:clamp(48px,13vw,80px)
  }
  .hero h1 em {
    white-space:nowrap
  }
}
@media(min-width:701px) and (max-width:1024px) {
  .hero h1 {
    font-size:clamp(48px,6.5vw,66px)
  }
  .hero h1 em {
    white-space:nowrap
  }
}
/* Editorial refinements: strong chapter navigation and attributed perspectives. */
:root {
  color-scheme: light dark;
  --surface: #eeeee5;
  --panel: #f4f5ec;
  --tint: #e9eddf;
  --emphasis: #677b56;
  --solid: #193d30;
  --on-solid: #f6f4ed;
}
html {
  background: var(--paper);
}
.hero-portrait {
  padding: 12px 0 0 12px;
}
.hero-portrait::before {
  content: '';
  position: absolute;
  inset: 0 12px 36px 0;
  border: 1px solid var(--line);
  border-radius: 2px 2px 90px 2px;
  pointer-events: none;
}
.hero-portrait img {
  position: relative;
}
.hero-portrait figcaption {
  position: relative;
}
.case-index {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 0;
  margin: 0 0 48px;
  border-block: 1px solid var(--line);
}
.case-index a {
  position: relative;
  padding: 25px 18px;
  border-right: 1px solid var(--line);
  font-size: 19px;
  line-height: 1.4;
  text-decoration: none;
  transition: background .2s;
}
.case-index a:first-child {
  padding-left: 0;
}
.case-index a:last-child {
  border-right: 0;
}
.case-index a:hover {
  color: var(--ink);
  background: var(--muted);
}
.case-index span {
  display: block;
  font-size: 10px;
  letter-spacing: .14em;
  color: var(--text);
  margin-bottom: 12px;
}
.case-index small {
  display: block;
  font-size: 11px;
  margin-top: 8px;
  color: var(--text);
}
.case {
  position: relative;
}
.case-top {
  align-items: baseline;
}
#fareye {
  padding-bottom: 40px;
}
#fareye > .case-grid {
  grid-template-columns: .85fr 1.15fr;
  align-items: center;
}
.architecture {
  padding: 28px;
  border: 1px solid var(--line);
}
.architecture svg {
  overflow: visible;
}
.connector {
  transition: opacity .35s;
}
.connector rect {
  transition: fill .35s,stroke .35s,stroke-width .35s;
}
.architecture[data-tracing=true][data-mode=after] .connector:nth-of-type(2) rect,
.architecture[data-tracing=true][data-mode=after] .connector:nth-of-type(4) rect {
  opacity: .55;
}
.architecture[data-tracing=true][data-mode=after] .connector:nth-of-type(3) rect {
  stroke: var(--accent);
  stroke-width: 3;
}
.architecture[data-tracing=true][data-mode=before] .boundary {
  stroke: var(--accent);
  stroke-width: 3;
}
.release-demo {
  margin-top: 22px;
  border-top: 1px solid var(--line);
  padding-top: 18px;
}
.release-demo[hidden] {
  display: none;
}
.release-button {
  background: none;
  border: 1px solid var(--ink);
  min-height: 44px;
  padding: 9px 13px;
  font-size: 12px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.release-button:hover,.release-button[aria-pressed=true] {
  background: var(--ink);
  color: var(--paper);
}
.release-explanation {
  font-size: 12px!important;
  line-height: 1.6;
  margin-top: 12px;
  min-height: 58px;
}
.architecture .diagram-note {
  margin-top: 18px;
}
.engineering-note {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 30px;
  border-top: 1px solid var(--line);
  margin-top: 20px;
  padding-top: 24px;
}
.engineering-note p {
  font-size: 13px;
}
.quality-gates {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 28px;
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
  font-size: 13px;
  color: var(--text);
}
.quality-gates li::before {
  content: '↳';
  margin-right: 10px;
  color: var(--ink);
}
.workflow-panel {
  animation: panel-enter .25s ease-out;
}
@keyframes panel-enter {
  from {
    opacity: .5;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.recommendations {
  border-top: 1px solid var(--line);
}
.recommendation {
  margin: 0;
  min-width: 0;
}
.recommendation blockquote {
  margin: 0;
}
.featured-quote {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 8%;
  padding: 48px 0 58px;
  border-block: 1px solid var(--line);
}
.featured-quote blockquote p {
  font: 34px/1.45 var(--serif);
  letter-spacing: -.025em;
  color: var(--ink);
}
.recommendation figcaption {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 12px;
}
.recommendation figcaption strong {
  display: block;
  font-weight: 500;
  color: var(--ink);
}
.recommendation figcaption div>span {
  display: block;
  font-size: 11px;
  color: var(--text);
  line-height: 1.6;
  margin-top: 4px;
}
.quote-initials {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--emphasis);
  font: 16px var(--serif);
}
.recommendation-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 44px 8%;
  margin-top: 45px;
}
.recommendation-grid .recommendation {
  padding-bottom: 30px;
  border-bottom: 1px solid var(--line);
}
.recommendation-grid blockquote p {
  font-size: 15px;
  line-height: 1.85;
}
.recommendation-grid figcaption {
  margin-top: 24px;
}
.recommendation details {
  margin-top: 20px;
}
.recommendation details summary {
  font-size: 12px;
  min-height: 48px;
}
.recommendation details p {
  font-size: 14px;
  margin-bottom: 16px;
}
.recommendation-note {
  font-size: 11px;
  margin-top: 25px;
}
@media(min-width:1100px) {
  #expertise .two-column>div:first-child {
    position: sticky;
    top: 40px;
    align-self: start;
  }
  #work>.section-heading {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    align-items: end;
    column-gap: 60px;
  }
  #work>.section-heading .eyebrow {
    grid-column: 1/-1;
  }
}
@media(max-width:1024px) {
  nav {
    gap: 22px;
  }
  .case-index a {
    font-size: 16px;
    padding-inline: 12px;
  }
  #fareye>.case-grid {
    grid-template-columns: 1fr;
  }
  #fareye>.case-grid>div:first-child {
    max-width: 670px;
  }
  .architecture svg {
    max-height: 340px;
  }
  .featured-quote {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}
@media(max-width:700px) {
  .hero-portrait {
    padding: 9px 0 0 9px;
  }
  .hero-portrait::before {
    inset: 0 9px 33px 0;
    border-bottom-right-radius: 65px;
  }
  .case-index {
    grid-template-columns: 1fr 1fr;
    margin-bottom: 30px;
  }
  .case-index a {
    padding: 18px 12px!important;
    font-size: 17px;
  }
  .case-index a:nth-child(2) {
    border-right: 0;
  }
  .case-index a:nth-child(-n+2) {
    border-bottom: 1px solid var(--line);
  }
  .case-index small {
    font-size: 10px;
  }
  .architecture {
    padding: 16px;
  }
  .engineering-note {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .quality-gates {
    grid-template-columns: 1fr;
  }
  .recommendation-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .featured-quote {
    padding: 28px 0;
  }
  .featured-quote blockquote p {
    font-size: 27px;
  }
  .recommendation-grid blockquote p {
    font-size: 14px;
  }
  .recommendation-note {
    font-size: 11px;
  }
}
/* The operating system is the source of truth, including changes while open. */
@media(prefers-color-scheme:dark) {
  :root {
    --paper: #101b17;
    --ink: #e6eadd;
    --text: #b4c1b7;
    --line: #35483c;
    --muted: #1b2b22;
    --accent: #dfab83;
    --surface: #18271f;
    --panel: #16251d;
    --tint: #1b2d22;
    --emphasis: #b7c89a;
    --solid: #c3d0ae;
    --on-solid: #101b17;
  }
  ::selection {
    background: #496042;
    color: #f5f5e9;
  }
  em {
    color: var(--emphasis);
  }
  .button,.segmented button[aria-pressed=true],.skip {
    background: var(--solid);
    color: var(--on-solid);
  }
  .button:hover {
    background: #d6dfc4;
  }
  .luma {
    background: var(--tint);
  }
  .pipeline {
    background: var(--panel);
  }
  .pipeline li>span,.leadership-notes>div>span,.workflow-controls span {
    color: #b4c69f;
  }
  .pipeline li:not(:last-child)::before {
    border-color: #516347;
  }
  .diagram-note {
    color: #a8b7a6!important;
  }
  .architecture {
    background: var(--surface);
  }
  .segmented {
    border-color: #5f7457;
  }
  svg text {
    fill: var(--ink);
  }
  .systems rect {
    fill: #18271f;
    stroke: #607354;
  }
  .connections {
    stroke: #7c926c;
  }
  .boundary {
    fill: #213322;
    stroke: #708761;
  }
  .connector rect {
    fill: #16271b;
    stroke: #849a72;
  }
  .sub-label {
    fill: #b8c9a8;
  }
  .architecture[data-mode=before] .boundary {
    fill: #322b23;
    stroke: #ae8d6b;
  }
  .architecture[data-mode=before] .connector rect {
    fill: #322b23;
  }
  .cloud {
    background: #1c3528;
    color: #edf0e2;
  }
  .cloud p,.cloud .case-top>span:last-child {
    color: #c5d2c2;
  }
  .method-section {
    background: #1a2b20;
  }
  .workflow-controls {
    border-color: #526549;
  }
  .workflow-controls button[aria-pressed=true] {
    background: #2b3e28;
  }
  .gate {
    border-color: #526549;
  }
  .contact {
    background: #15271d;
  }
  a:focus-visible,button:focus-visible,summary:focus-visible {
    outline-color: #dfab83;
  }
}
@media(prefers-reduced-motion:reduce) {
  .workflow-panel {
    animation:none;
  }
}
@media print {
  :root {
    --paper:white;
    --ink:#193d30;
    --text:#43564c;
    --line:#d3d9cd;
  }
  .case-index,.release-demo {
    display:none;
  }
}
.timeline .career-recognition {
  font-size: 12px;
  color: var(--text);
}
.education-detail .detail-grid p {
  font-size: 13px;
}
.quote-initials {
  color: var(--text);
}
@media(prefers-color-scheme:dark) {
  .contact {
    color: var(--ink);
  }
}
.skip:not(:focus) {
  left: -10000px;
}
/* The journey is an editorial sequence, with a persistent stage rather than cards. */
.hero {
  padding-bottom: 80px;
}
.hero-role {
  letter-spacing: .015em;
}
.story {
  border-top: 1px solid var(--line);
  padding-top: 80px;
}
.story-intro {
  padding-bottom: 60px;
}
.story-intro h2 {
  margin: 20px 0;
}
.story-intro>p:last-child {
  font-size: 13px;
}
.story-layout {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 8%;
  align-items: start;
}
.story-stage {
  position: sticky;
  top: 40px;
  margin-bottom: 90px;
  border-block: 1px solid var(--line);
  background: var(--paper);
}
.story-stage-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 22px 0;
}
.story-counter {
  font: 12px var(--sans);
  color: var(--text);
}
.story-art {
  position: relative;
  aspect-ratio: 600/420;
  overflow: hidden;
}
.story-scene {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(22px) scale(.97);
  transition: opacity .55s,transform .7s cubic-bezier(.2,.7,.2,1);
  pointer-events: none;
}
[data-chapter=founder] .scene-founder,[data-chapter=platform] .scene-platform,[data-chapter=product] .scene-product {
  opacity: 1;
  transform: none;
}
.scene-core {
  position: absolute;
  z-index: 2;
  inset: 36% 30% auto;
  text-align: center;
  font: 32px var(--serif);
  padding: 15px 0;
  background: var(--paper);
}
.scene-core small {
  display: block;
  font: 10px/1.5 var(--sans);
  margin-top: 8px;
  color: var(--text);
}
.scene-orbit {
  position: absolute;
  width: 60%;
  height: 75%;
  left: 20%;
  top: 10%;
  border: 1px solid var(--line);
  border-radius: 50%;
}
.touchpoint {
  position: absolute;
  z-index: 2;
  border: 1px solid var(--line);
  background: var(--paper);
  min-width: 85px;
  text-align: center;
  padding: 12px;
  font-size: 12px;
}
.touch-ios {
  top: 16%;
  left: 10%;
}
.touch-android {
  top: 16%;
  right: 10%;
}
.touch-web {
  bottom: 13%;
  left: calc(50% - 42px);
}
.scene-founder svg {
  position: absolute;
  inset: 0;
  margin: 0;
  height: 100%;
}
.scene-founder path {
  fill: none;
  stroke: var(--accent);
  stroke-width: 1;
  stroke-dasharray: 600;
  stroke-dashoffset: 600;
  transition: stroke-dashoffset 1.6s .15s;
}
[data-chapter=founder] .scene-founder path {
  stroke-dashoffset: 0;
}
.scene-caption {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  font-size: 10px;
  color: var(--text);
}
.platform-label {
  display: block;
  text-align: center;
  font: 17px/1.5 var(--serif);
  margin-top: 6%;
}
.platform-boundary,.platform-deployments {
  position: absolute;
  display: flex;
  gap: 5%;
  width: 94%;
  left: 3%;
  top: 28%;
  justify-content: space-between;
}
.platform-boundary span,.platform-deployments span {
  flex: 1;
  border: 1px solid var(--line);
  padding: 24px 2px;
  text-align: center;
  background: var(--muted);
  font-size: 12px;
}
.platform-boundary span {
  transform: translateX(0);
  transition: transform .8s;
}
.platform-deployments {
  top: 65%;
}
.platform-deployments span {
  padding: 13px 2px;
  background: var(--paper);
  border-color: var(--accent);
}
.platform-rails {
  position: absolute;
  left: 3%;
  width: 94%;
  top: 47%;
  height: 18%;
  display: flex;
  justify-content: space-around;
}
.platform-rails i {
  border-left: 1px solid var(--accent);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .8s .3s;
}
[data-chapter=platform] .platform-rails i {
  transform: scaleY(1);
}
.scan-frame {
  position: relative;
  width: 48%;
  margin: 0 auto;
  height: 31%;
  border: 1px solid var(--line);
}
.scan-frame>span {
  position: absolute;
  left: 10px;
  top: 5px;
  font-size: 8px;
  letter-spacing: .12em;
}
.scan-frame svg {
  width: 75%;
  margin: 20px auto 0;
  height: 75%;
}
.scan-frame path,.scan-frame circle {
  fill: none;
  stroke: var(--ink);
  stroke-width: 1.2;
}
.scan-path {
  width: 1px;
  height: 8%;
  background: var(--accent);
  margin: auto;
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .8s .3s;
}
[data-chapter=product] .scan-path {
  transform: scaleY(1);
}
.inference-node {
  width: 65%;
  margin: auto;
  padding: 15px;
  text-align: center;
  border: 1px solid var(--line);
  background: var(--muted);
  font: 23px var(--serif);
}
.inference-node small {
  display: block;
  font: 10px var(--sans);
  margin-top: 8px;
}
.assessment-node {
  border-bottom: 1px solid var(--accent);
  padding: 10px;
  width: 65%;
  margin: auto;
  font-size: 13px;
}
.assessment-node span {
  float: right;
}
.story-navigation {
  display: flex;
  gap: 0;
  padding-top: 24px;
}
.story-navigation a {
  flex: 1;
  font-size: 12px;
  border-top: 2px solid var(--line);
  padding: 14px 0;
  text-decoration: none;
  transition: border-color .3s;
}
.story-navigation a[aria-current] {
  border-color: var(--accent);
}
.story-navigation span {
  margin-right: 8px;
  font-size: 10px;
  color: var(--text);
}
.story-art-note {
  font-size: 10px;
  margin: 0 0 20px;
}
.story-chapter {
  position: relative;
  min-height: 75vh;
  padding: 100px 0;
  scroll-margin-top: 80px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.story-chapter .eyebrow {
  margin-bottom: 30px;
}
.story-chapter h3 {
  font-size: clamp(32px,3vw,46px);
  margin-bottom: 25px;
}
.story-chapter p:not(.eyebrow) {
  font-size: 15px;
}
.story-chapter .text-link {
  align-self: start;
  margin-top: 18px;
}
.chapter-number {
  font: 110px/.8 var(--serif);
  letter-spacing: -.07em;
  color: var(--line);
  margin-bottom: 30px;
}
.founder-section {
  border-block: 1px solid var(--line);
}
.founder-heading h2 {
  margin-top: 22px;
}
.founder-body {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 12%;
  margin-top: 65px;
}
.founder-stat {
  border-left: 2px solid var(--accent);
  padding-left: 30px;
}
.founder-stat>span {
  display: block;
  font: 29px var(--serif);
}
.founder-stat strong {
  display: block;
  font: clamp(62px,7vw,100px) var(--serif);
  letter-spacing: -.06em;
  margin-top: 24px;
}
.founder-stat small {
  display: block;
  color: var(--text);
  margin-top: 25px;
  font-size: 12px;
}
.founder-principles {
  margin-top: 35px;
}
.founder-principles>div {
  position: relative;
  padding: 22px 0 22px 35px;
  border-top: 1px solid var(--line);
}
.founder-principles span {
  position: absolute;
  left: 0;
  font-size: 10px;
}
.founder-principles h3 {
  font: 18px var(--sans);
  margin-bottom: 12px;
}
.founder-principles p {
  font-size: 14px;
}
#work .case {
  border-inline: 0;
  padding: 70px 0;
  margin-bottom: 0;
  border-bottom: 0;
}
.case.luma {
  background: transparent;
}
#work .cloud {
  margin: 40px -4%;
  padding: 60px 4%;
}
.case-top {
  margin-bottom: 48px;
}
@media(max-width:1024px) {
  .story-layout {
    gap: 6%;
  }
  .story-stage {
    top: 25px;
  }
  .story-chapter {
    padding-block: 65px;
  }
  .story-navigation a {
    font-size: 10px;
  }
  .story-navigation span {
    display: block;
  }
  .scene-core {
    font-size: 26px;
  }
  .touchpoint {
    min-width: 65px;
    font-size: 10px;
  }
  .touch-web {
    left: calc(50% - 32px);
  }
  .platform-label {
    font-size: 14px;
  }
  .platform-boundary span,.platform-deployments span {
    font-size: 9px;
  }
  .scan-frame {
    height: 28%;
  }
  .inference-node {
    font-size: 17px;
    padding: 10px;
  }
  .inference-node small {
    font-size: 8px;
  }
  .assessment-node {
    font-size: 11px;
  }
}
@media(max-width:700px) {
  .hero {
    padding-bottom: 40px;
  }
  .story {
    padding-top: 50px;
  }
  .story-intro {
    padding-bottom: 30px;
  }
  .story-layout {
    display: block;
  }
  .story-stage {
    top: 0;
    z-index: 3;
    margin-bottom: 0;
    padding: 0 10px;
    box-shadow: 0 14px 24px -20px #0006;
  }
  .story-stage-top {
    padding: 12px 0;
  }
  .story-stage-top .eyebrow {
    font-size: 9px;
  }
  .story-art {
    height: 215px;
    aspect-ratio: auto;
  }
  .story-navigation {
    padding-top: 12px;
  }
  .story-navigation a {
    padding: 10px 0;
    font-size: 11px;
  }
  .story-navigation span {
    display: inline;
  }
  .story-art-note {
    display: none;
  }
  .story-chapter {
    min-height: 80vh;
    padding: 65px 0;
    scroll-margin-top: 340px;
  }
  .story-chapter .eyebrow {
    margin-bottom: 22px;
  }
  .chapter-number {
    font-size: 72px;
    margin-bottom: 25px;
  }
  .story-chapter h3 {
    font-size: 34px;
  }
  .scene-core {
    font-size: 24px;
    top: 30%;
  }
  .scene-core small {
    font-size: 9px;
  }
  .touchpoint {
    padding: 8px;
  }
  .scene-caption {
    font-size: 9px;
  }
  .founder-body {
    grid-template-columns: 1fr;
    gap: 35px;
    margin-top: 40px;
  }
  .founder-stat strong {
    font-size: 72px;
  }
  .founder-stat small {
    margin-top: 12px;
  }
  #work .case {
    padding: 45px 0;
  }
  #work .cloud {
    margin: 25px -3%;
    padding: 35px 5%;
  }
  .case-top {
    margin-bottom: 28px;
  }
  .architecture {
    margin-inline: 0;
  }
}
@media(prefers-reduced-motion:reduce) {
  .story-stage {
    position: relative;
    top: auto;
  }
  .story-chapter {
    min-height: auto;
    padding-block: 45px;
    scroll-margin-top: 30px;
  }
  .story-scene,.platform-rails i,.scan-path,.scene-founder path {
    transition: none;
  }
}
@media print {
  .story-stage {
    display:none;
  }
  .story-layout {
    display:block;
  }
  .story-chapter {
    min-height:0;
    padding:20px 0;
  }
}
/* Each transition explains a change: connector boundaries separate;
processing assembles. */
.platform-boundary::before {
  content: '';
  position: absolute;
  inset: -10px;
  border: 1px solid var(--accent);
  pointer-events:none;
  opacity: 0;
}
[data-chapter=platform] .platform-boundary::before {
  animation: release-boundary 1.2s ease-out both;
}
.platform-boundary span:first-child {
  transform: translateX(18%);
}
.platform-boundary span:last-child {
  transform: translateX(-18%);
}
[data-chapter=platform] .platform-boundary span {
  transform: translateX(0);
}
.scene-product .scan-frame,.scene-product .inference-node,.scene-product .assessment-node {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .5s,transform .6s;
}
.scene-product .inference-node {
  transition-delay: .2s;
}
.scene-product .assessment-node {
  transition-delay: .45s;
}
[data-chapter=product] .scan-frame,[data-chapter=product] .inference-node,[data-chapter=product] .assessment-node {
  opacity: 1;
  transform: none;
}
@keyframes release-boundary {
  0%,25% {
    opacity:1;
  }
  100% {
    opacity:0;
  }
}
.chapter-number {
  color: var(--emphasis);
}

.hero-portrait::before { bottom: 12px; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

.platform-scope {
  margin-top: clamp(2.5rem, 5vw, 5rem);
  padding-top: clamp(2rem, 4vw, 4rem);
  border-top: 1px solid var(--line);
  align-items: start;
}
.platform-scope .expertise-list h4 {
  margin: 0 0 .75rem;
}
.platform-scope .expertise-list > div:first-child {
  padding-top: 0;
  border-top: 0;
}


/* Editorial cover: unframed typography, a clear portrait and direct paths into the work. */
.hero { display: grid; grid-template-columns: 1.08fr 1fr; grid-template-rows: auto 1fr auto; column-gap: 7%; row-gap: 0; align-items: start; padding-top: 48px; padding-bottom: 0; min-height: 0; }
.hero-copy { grid-column: 1; grid-row: 1; animation: none; }
.hero .eyebrow { margin: 0 0 13px; font-size: 12px; letter-spacing: .18em; }
.hero-role { font-size: 14px; letter-spacing: .015em; margin: 0 0 28px; }
.hero h1 { font-size: clamp(84px,9vw,138px); line-height: .91; letter-spacing: -.065em; }
.hero-line { display: block; padding-bottom: .06em; animation: cover-type .85s cubic-bezier(.2,.7,.2,1) both; }
.hero-line:nth-child(2) { animation-delay: .08s; }
.hero-line:nth-child(3) { animation-delay: .16s; }
.hero h1 em { font-size: 1.11em; white-space: nowrap; }
.hero .hero-portrait { grid-column: 2; grid-row: 1 / 3; padding: 0; margin: 0; position: relative; animation: none; }
.hero .hero-portrait::before { display: none; }
.portrait-window { overflow: hidden; background: var(--surface); }
.hero .hero-portrait img { display: block; width: 100%; height: clamp(520px,48vw,690px); max-height: none; border-radius: 0; object-fit: cover; object-position: 50% 25%; animation: cover-portrait 1.1s cubic-bezier(.2,.7,.2,1) both; }
.hero .hero-portrait figcaption { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0; padding: 17px 0; font-size: 11px; border-bottom: 1px solid var(--line); letter-spacing: 0; }
.hero .hero-portrait figcaption a { padding-block: 8px; text-decoration: none; }
.hero-bottom { grid-column: 1; grid-row: 2; padding-top: 27px; padding-bottom: 26px; align-self: end; }
.hero-description { font-size: 15px; line-height: 1.8; max-width: 405px; margin: 0; }
.hero-actions { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 22px; }
.hero-actions .button { margin: 0; }
.hero-method-link { font-size: 12px; margin: 0; }
.hero-index { grid-column: 1 / -1; display: flex; border-top: 1px solid var(--line); margin-top: 42px; padding-block: 24px 32px; gap: 36px; }
.hero-index a { flex: 1; position: relative; padding: 8px 25px 8px 0; text-decoration: none; }
.hero-index a>span { display: block; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--text); margin-bottom: 10px; }
.hero-index strong { font-weight: 400; font-size: 15px; }
.hero-index b { position: absolute; right: 0; bottom: 8px; font-weight: 400; transition: transform .2s; }
.hero-index a:hover b { transform: translate(3px,-3px); }
@keyframes cover-type { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes cover-portrait { from { opacity: .3; transform: scale(1.055); } to { opacity: 1; transform: scale(1); } }
@media(min-width:701px) and (max-width:1100px) {
 .hero { column-gap: 5%; }
 .hero h1 { font-size: clamp(72px,9vw,100px); }
 .hero-role { max-width: 270px; font-size: 13px; }
 .hero .hero-portrait img { height: 575px; }
 .hero-description { font-size: 14px; }
 .hero-actions { gap: 17px; }
 .hero-index { gap: 25px; }
 .hero-index strong { font-size: 13px; }
}
@media(max-width:700px) {
 .hero { display: flex; flex-direction: column; padding-top: 28px; padding-bottom: 0; gap: 0; }
 .hero-copy { width: 100%; }
 .hero .eyebrow { font-size: 10px; margin-bottom: 10px; }
 .hero-role { font-size: 12px; margin-bottom: 24px; letter-spacing: 0; }
 .hero h1 { font-size: clamp(75px,19vw,122px); line-height: .88; letter-spacing: -.06em; }
 .hero-line { padding-bottom: .05em; }
 .hero h1 em { font-size: 1.05em; }
 .hero .hero-portrait { width: 100%; margin-top: 26px; }
 .hero .hero-portrait img { height: auto; aspect-ratio: 1/.95; object-position: center 24%; }
 .hero .hero-portrait figcaption { font-size: 10px; padding-block: 8px; }
 .hero-bottom { padding-block: 25px 0; }
 .hero-description { font-size: 14px; }
 .hero-actions { gap: 20px; margin-top: 20px; }
 .hero-index { width: 100%; flex-direction: column; gap: 0; padding-block: 0 16px; margin-top: 30px; }
 .hero-index a { display: flex; align-items: center; gap: 20px; padding: 18px 25px 18px 0; border-bottom: 1px solid var(--line); }
 .hero-index a>span { width: 96px; flex-shrink: 0; margin: 0; font-size: 9px; }
 .hero-index strong { font-size: 12px; }
 .hero-index b { bottom: 15px; }
}
@media(prefers-reduced-motion:reduce) { .hero-line,.hero .hero-portrait img { animation: none; } .hero-index b { transition: none; } }

.contact-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 10%; align-items: start; }
.contact-intro>p:not(.eyebrow) { max-width: 350px; font-size: 15px; }
.contact-form { min-width: 0; padding-top: 12px; }
.contact-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; }
.contact-field { margin-bottom: 28px; }
.contact-field label { display: block; color: #e8eddf; font-size: 13px; margin-bottom: 10px; }
.contact-field label span { color: #bdcbbd; font-size: 11px; }
.contact-field input,.contact-field textarea { display: block; width: 100%; min-height: 48px; padding: 10px 0; border: 0; border-bottom: 1px solid #79907c; border-radius: 0; color: #f6f4ed; background: transparent; font: 16px/1.6 var(--sans); box-shadow: none; }
.contact-field textarea { resize: vertical; min-height: 125px; }
.contact-field input:focus-visible,.contact-field textarea:focus-visible { outline: 2px solid #c4d1ae; outline-offset: 5px; }
.contact-field input:autofill { -webkit-text-fill-color: #f6f4ed; box-shadow: 0 0 0 100px #193d30 inset; }
.contact .contact-privacy { font-size: 12px; margin: 0 0 22px; }
.contact-submit { background: #d1dcbf; color: #193d30; border: 1px solid #d1dcbf; padding: 14px 22px; min-height: 50px; font-size: 13px; display: inline-flex; align-items: center; gap: 45px; }
.contact-submit:hover:enabled { background: #e6edda; }
.contact-submit:disabled { opacity: .65; cursor: not-allowed; }
.contact .contact-status { min-height: 48px; font-size: 13px; margin-top: 18px; max-width: 470px; }
@media(max-width:700px) { .contact-layout { grid-template-columns: 1fr; gap: 35px; } .contact-fields { grid-template-columns: 1fr; gap: 0; } .contact-field { margin-bottom: 24px; } .contact-submit { width: 100%; justify-content: space-between; } }
.resume-format { font-size: 9px; letter-spacing: .08em; padding: 3px 5px; margin-left: 5px; border: 1px solid var(--line); vertical-align: 1px; }
.career-resume { display: inline-block; margin-top: 24px; font-size: 13px; }