:root {
    --bg: #070a0f;
    --bg-2: #0a0f17;
    --surface: #0d131d;
    --surface-2: #111925;
    --ink: #f4f7fb;
    --ink-2: #aab4c2;
    --ink-3: #6f7b8b;
    --line: rgba(255,255,255,.12);
    --line-soft: rgba(255,255,255,.065);
    --orange: #ff7426;
    --orange-soft: rgba(255,116,38,.12);
    --blue: #4d8cff;
    --cyan: #55d8ff;
    --success: #57e69a;
    --display: "Instrument Sans", "Segoe UI", Arial, sans-serif;
    --meta: "Instrument Sans", "Segoe UI", Arial, sans-serif;
    --shell: 1360px;
    --header: 78px;
    --ease: cubic-bezier(.16,1,.3,1);
    --ease-out: cubic-bezier(.22,1,.36,1);
}

html[data-theme="light"] {
    --bg: #f1f2f4;
    --bg-2: #e8eaed;
    --surface: #ffffff;
    --surface-2: #e4e7eb;
    --ink: #10141b;
    --ink-2: #4d5663;
    --ink-3: #737d89;
    --line: rgba(16,20,27,.16);
    --line-soft: rgba(16,20,27,.085);
    --orange-soft: rgba(255,116,38,.10);
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header) + 18px); background: var(--bg); }
body {
    min-height: 100vh;
    overflow-x: hidden;
    color: var(--ink);
    background: var(--bg);
    font-family: var(--display);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
body.menu-open { overflow: hidden; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
img, svg, canvas { display: block; max-width: 100%; }
::selection { color: #fff; background: var(--orange); }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }
[hidden] { display: none !important; }

/* Vector-like CSS arrows: avoids iOS rendering Unicode arrows as emoji. */
.ui-arrow {
    display: inline-block;
    flex: 0 0 auto;
    width: .9em;
    height: .9em;
    color: var(--orange);
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h11M9 4l4 4-4 4' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h11M9 4l4 4-4 4' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ui-arrow-up-right { transform: rotate(-45deg); }
.ui-arrow-down-right { transform: rotate(45deg); }
.ui-arrow-down { transform: rotate(90deg); }
.ui-arrow-up { transform: rotate(-90deg); }

.shell { width: min(calc(100% - 56px), var(--shell)); margin-inline: auto; }
.section { position: relative; padding: clamp(76px, 7.4vw, 108px) 0; border-top: 1px solid var(--line-soft); }
.eyebrow {
    margin-bottom: 20px;
    color: var(--orange);
    font-family: var(--meta);
    font-size: .68rem;
    font-weight: 500;
    letter-spacing: .13em;
    text-transform: uppercase;
}
.section-label {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: clamp(38px, 5vw, 64px);
    color: var(--ink-3);
    font-family: var(--meta);
    font-size: .66rem;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.section-label span:first-child { color: var(--orange); }
.section-label::after { content: ""; flex: 1; height: 1px; margin-left: 8px; background: var(--line); }

.skip-link {
    position: fixed;
    z-index: 9999;
    top: 10px;
    left: 10px;
    padding: 10px 14px;
    color: #fff;
    background: var(--orange);
    transform: translateY(-160%);
    transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }
.scroll-progress {
    position: fixed;
    z-index: 3000;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    pointer-events: none;
    transform: scaleX(0);
    transform-origin: left center;
    background: linear-gradient(90deg, var(--orange), var(--cyan), var(--blue));
}

.intro {
    position: fixed;
    z-index: 10000;
    inset: 0;
    display: grid;
    place-items: center;
    color: #f7f8fb;
    background: #070a0f;
    transition: opacity .4s var(--ease), visibility .4s;
    animation: introFallback .4s 2.4s forwards;
}
.intro.is-done { opacity: 0; visibility: hidden; pointer-events: none; }
.intro-inner { width: min(calc(100% - 52px), 760px); }
.intro-index { display: block; margin-bottom: 16px; color: #798596; font-family: var(--meta); font-size: .64rem; letter-spacing: .14em; }
.intro strong { display: block; font-size: clamp(2rem, 6.5vw, 5.8rem); font-weight: 680; letter-spacing: -.045em; line-height: .96; }
.intro-line { height: 1px; margin-top: 26px; overflow: hidden; background: rgba(255,255,255,.12); }
.intro-line i { display: block; width: 100%; height: 100%; background: var(--orange); transform: translateX(-100%); animation: introLine .72s var(--ease-out) forwards; }
@keyframes introLine { to { transform: translateX(0); } }
@keyframes introFallback { to { opacity:0; visibility:hidden; pointer-events:none; } }

.site-header {
    position: fixed;
    z-index: 2500;
    top: 0;
    left: 0;
    width: 100%;
    color: #f4f7fb;
    background: rgba(7,10,15,.72);
    border-bottom: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(20px) saturate(135%);
    -webkit-backdrop-filter: blur(20px) saturate(135%);
    transition: background .3s ease, border-color .3s ease, transform .35s var(--ease);
}
.site-header.is-scrolled { background: rgba(7,10,15,.92); border-bottom-color: rgba(255,116,38,.22); }
html[data-theme="light"] .site-header { color: #121720; background: rgba(241,242,244,.78); border-bottom-color: rgba(16,20,27,.10); }
html[data-theme="light"] .site-header.is-scrolled { background: rgba(241,242,244,.95); border-bottom-color: rgba(255,116,38,.28); }
.header-inner { min-height: var(--header); display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.wordmark { display: inline-grid; gap: 0; flex: 0 0 auto; line-height: .82; }
.wordmark span { font-size: .82rem; font-weight: 680; letter-spacing: -.035em; }
.wordmark span:last-child { color: var(--orange); }
.desktop-nav { display: flex; align-items: center; gap: clamp(20px, 3vw, 42px); margin-left: auto; }
.desktop-nav a {
    position: relative;
    padding: 8px 0;
    color: rgba(244,247,251,.63);
    font-size: .77rem;
    font-weight: 520;
    transition: color .25s ease;
}
html[data-theme="light"] .desktop-nav a { color: rgba(18,23,32,.58); }
.desktop-nav a::after {
    content: "";
    position: absolute;
    right: 100%;
    bottom: 2px;
    left: 0;
    height: 1px;
    background: var(--orange);
    transition: right .35s var(--ease);
}
.desktop-nav a:hover, .desktop-nav a.is-active { color: inherit; }
.desktop-nav a:hover::after, .desktop-nav a.is-active::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 18px; }
.language-switch { display: flex; align-items: center; gap: 6px; color: rgba(244,247,251,.38); }
html[data-theme="light"] .language-switch { color: rgba(18,23,32,.38); }
.language-switch > span { font-family:var(--meta); font-size:.72rem; }
.language-btn {
    padding: 5px 1px;
    color: rgba(244,247,251,.48);
    background: none;
    border: 0;
    font-family:var(--meta);
    font-size:.7rem;
    font-weight:650;
    letter-spacing:.035em;
    transition: color .25s ease;
}
html[data-theme="light"] .language-btn { color: rgba(18,23,32,.46); }
.language-btn:hover, .language-btn.active { color: var(--orange); }
.theme-button {
    position: relative;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: rgba(244,247,251,.8);
    background: transparent;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    transition: color .25s ease, border-color .25s ease, transform .3s var(--ease), background .25s ease;
}
.theme-button:hover { color: #fff; border-color: var(--orange); transform: rotate(14deg); background: rgba(255,116,38,.06); }
html[data-theme="light"] .theme-button { color: #1a2029; border-color: rgba(16,20,27,.22); }
.theme-icon { position: absolute; width: 17px; height: 17px; transition: opacity .3s ease, transform .4s var(--ease); }
html[data-theme="dark"] .theme-icon-sun { opacity: 1; transform: scale(1) rotate(0); }
html[data-theme="dark"] .theme-icon-moon { opacity: 0; transform: scale(.5) rotate(-25deg); }
html[data-theme="light"] .theme-icon-sun { opacity: 0; transform: scale(.5) rotate(25deg); }
html[data-theme="light"] .theme-icon-moon { opacity: 1; transform: scale(1) rotate(0); }
.menu-toggle { display: none; width: 38px; height: 38px; background: none; border: 0; }
.menu-toggle span { display: block; width: 20px; height: 1px; margin: 6px auto; background: currentColor; transition: transform .3s var(--ease), opacity .2s ease; }
.menu-toggle.active span:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-toggle.active span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.mobile-menu { position: fixed; z-index: 2400; inset: 0; padding-top: var(--header); color: #f4f7fb; background: rgba(7,10,15,.985); transform: translateY(-105%); transition: transform .55s var(--ease); }
.mobile-menu.open { transform: translateY(0); }
.mobile-menu-inner { height: calc(100svh - var(--header)); display: flex; flex-direction: column; justify-content: space-between; padding-block: 42px 28px; }
.mobile-menu nav { display: grid; }
.mobile-menu nav a { display: grid; grid-template-columns: 46px 1fr; align-items: baseline; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.mobile-menu nav span { color: var(--orange); font-family: var(--meta); font-size: .63rem; }
.mobile-menu nav strong { font-size: clamp(2.1rem, 9vw, 4.6rem); font-weight: 520; letter-spacing: -.055em; line-height: 1; }
.mobile-menu-foot { display: flex; justify-content: space-between; gap: 20px; color: #7f8b9a; font-size: .75rem; }

.hero {
    position: relative;
    min-height: 820px;
    overflow: hidden;
    padding: calc(var(--header) + 52px) 0 54px;
    color: #f4f7fb;
    background: #070a0f;
    isolation: isolate;
}
.hero-canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .54; pointer-events: none; transform: translateZ(0); backface-visibility: hidden; }
.hero-grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .18;
    background-image: linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
    background-size: 70px 70px;
    mask-image: linear-gradient(to bottom, #000 20%, rgba(0,0,0,.72) 70%, transparent 100%);
}
.hero-glow { position: absolute; border-radius: 50%; pointer-events: none; filter: blur(2px); }
.hero-glow-a { width: 46vw; height: 46vw; right: -16vw; top: -15vw; background: radial-gradient(circle, rgba(77,140,255,.22), rgba(85,216,255,.06) 35%, transparent 67%); animation: glowFloatA 10s ease-in-out infinite alternate; }
.hero-glow-b { width: 48vw; height: 36vw; left: 22%; bottom: -25vw; background: radial-gradient(circle, rgba(255,116,38,.16), transparent 67%); animation: glowFloatB 12s ease-in-out infinite alternate; }
@keyframes glowFloatA { to { transform: translate3d(-4vw, 3vw, 0) scale(1.08); } }
@keyframes glowFloatB { to { transform: translate3d(4vw, -2vw, 0) scale(.94); } }
.hero-shell { position: relative; z-index: 2; }
.hero-topline { display: flex; justify-content: space-between; gap: 20px; padding-bottom: 26px; color: #6e7a89; border-bottom: 1px solid rgba(255,255,255,.11); font-family: var(--meta); font-size: .61rem; letter-spacing: .08em; }
.hero-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(390px, .72fr); align-items: center; gap: clamp(48px, 7vw, 110px); padding-top: clamp(52px, 7vh, 78px); }
.hero-copy { min-width: 0; }
.hero-kicker { margin-bottom: 22px; color: var(--orange); font-family: var(--meta); font-size: .64rem; letter-spacing: .11em; }
.hero-title {
    width: 100%;
    max-width: 900px;
    overflow: visible;
    font-size: clamp(4.45rem, 8vw, 8.3rem);
    font-weight: 700;
    letter-spacing: -.066em;
    line-height: .82;
}
.hero-name-line { display:block; overflow:visible; padding:.12em .16em .08em 0; margin:-.12em 0 -.08em; }
.hero-name-line i { display:block; font-style:normal; transform:translateY(18%); clip-path:inset(100% 0 0 0); animation:nameReveal .9s var(--ease-out) forwards; }
.hero-name-line:nth-child(1) i { animation-delay: .64s; }
.hero-name-line:nth-child(2) i { animation-delay: .72s; }
.hero-name-line:nth-child(3) i { animation-delay: .80s; }
.hero-name-last { color: #708093; }
@keyframes nameReveal { to { transform:translateY(0); clip-path:inset(-.18em 0 -.08em 0); } }
.hero-role { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 16px; margin-top: 34px; }
.hero-role strong { font-size: clamp(1.25rem, 2vw, 1.72rem); font-weight: 600; letter-spacing: -.025em; }
.hero-role span { color: #7c8897; font-family: var(--meta); font-size: .68rem; }
.hero-lead { max-width: 760px; margin-top: 22px; color: #aab4c2; font-size: clamp(1rem, 1.22vw, 1.12rem); line-height: 1.72; }
.hero-lead strong { color: #f4f7fb; font-weight: 580; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 34px; }
.text-action { display: inline-flex; align-items: center; gap: 20px; min-height: 44px; padding: 0 0 9px; color: #c5ced9; border-bottom: 1px solid rgba(255,255,255,.28); font-size: .8rem; font-weight: 600; transition: color .25s ease, border-color .25s ease, gap .35s var(--ease); }
.text-action i { font-style: normal; color: var(--orange); }
.text-action:hover { color: #fff; border-color: var(--orange); gap: 28px; }
.text-action-primary { color: #fff; border-bottom-color: var(--orange); }
.hero-links { display:flex; flex-wrap:wrap; gap:10px 24px; margin-top:32px; color:#7d8998; font-family:var(--meta); font-size:.74rem; font-weight:500; letter-spacing:.01em; }
.hero-links a { display:inline-flex; align-items:center; gap:5px; transition: color .25s ease; }
.hero-links a:hover { color: var(--orange); }

.engineering-profile { position: relative; min-height: 560px; padding: 20px 0 0 28px; border-left: 1px solid rgba(255,255,255,.13); }
.profile-head { display: flex; justify-content: space-between; gap: 20px; padding-bottom: 14px; color: #667485; border-bottom: 1px solid rgba(255,255,255,.11); font-family: var(--meta); font-size: .58rem; letter-spacing: .08em; }
.profile-flow { position: relative; height: 315px; overflow: hidden; border-bottom: 1px solid rgba(255,255,255,.10); }
.profile-flow svg { width: 100%; height: 100%; }
.profile-flow .flow-grid { stroke: rgba(255,255,255,.07); stroke-width: 1; }
.profile-flow .flow-route { stroke-width: 1.6; stroke-linecap: round; stroke-dasharray: 8 11; animation: routeMove 12s linear infinite; }
.profile-flow .flow-route-a { stroke: rgba(77,140,255,.78); }
.profile-flow .flow-route-b { stroke: rgba(255,116,38,.86); animation-direction: reverse; animation-duration: 10s; }
.profile-flow .flow-route-c { stroke: rgba(85,216,255,.46); animation-duration: 16s; }
.profile-flow circle { fill: #070a0f; stroke: #f4f7fb; stroke-width: 1.6; animation: nodePulse 2.8s ease-in-out infinite; }
@keyframes routeMove { to { stroke-dashoffset: -190; } }
@keyframes nodePulse { 50% { stroke: var(--orange); r: 7px; } }
.flow-pulse { position: absolute; width: 5px; height: 5px; border-radius: 50%; box-shadow: 0 0 0 6px rgba(255,116,38,.10), 0 0 24px rgba(255,116,38,.9); background: var(--orange); }
.flow-pulse-a { left: 12%; top: 21%; animation: pulseTravelA 5.4s var(--ease) infinite; }
.flow-pulse-b { left: 10%; top: 67%; background: var(--cyan); box-shadow: 0 0 0 6px rgba(85,216,255,.10), 0 0 24px rgba(85,216,255,.75); animation: pulseTravelB 6.2s var(--ease) 1.1s infinite; }
@keyframes pulseTravelA { 0%,10% { transform: translate(0,0); opacity:0 } 20% { opacity:1 } 55% { transform: translate(170px,54px) } 88% { transform: translate(345px,-3px); opacity:1 } 100% { transform: translate(390px,-4px); opacity:0 } }
@keyframes pulseTravelB { 0%,10% { transform:translate(0,0);opacity:0 } 20% { opacity:1 } 58% { transform:translate(185px,-52px) } 90% { transform:translate(375px,18px);opacity:1 } 100% { transform:translate(410px,18px);opacity:0 } }
.profile-rows { display: grid; }
.profile-row { display: grid; grid-template-columns: 34px 1fr; gap: 3px 12px; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.085); }
.profile-row > span { grid-row: 1 / span 2; color: var(--orange); font-family: var(--meta); font-size: .56rem; }
.profile-row strong { font-size: .69rem; font-weight: 620; letter-spacing: .015em; }
.profile-row small { color: #6f7c8d; font-family: var(--meta); font-size: .56rem; line-height: 1.5; }
.profile-status { display: flex; align-items: center; gap: 10px; padding-top: 15px; color: #8895a5; font-family: var(--meta); font-size: .56rem; letter-spacing: .05em; }
.profile-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(87,230,154,.1); animation: statusPulse 2s ease-in-out infinite; }
@keyframes statusPulse { 50% { opacity:.45; box-shadow:0 0 0 8px rgba(87,230,154,0); } }

.kinetic-strip { overflow: hidden; color: #081019; background: var(--orange); border-block: 1px solid rgba(255,255,255,.16); }
.kinetic-track { display:flex; width:max-content; will-change:transform; animation:kineticLoop 30s linear infinite; transform:translateZ(0); backface-visibility:hidden; }
.kinetic-group { flex: 0 0 auto; display: flex; align-items: center; gap: 22px; padding: 13px 22px 13px 0; white-space: nowrap; }
.kinetic-group span { font-size: .68rem; font-weight: 700; letter-spacing: .015em; }
.kinetic-group i { font-style: normal; opacity: .5; font-size: .62rem; }
@keyframes kineticLoop { from { transform:translate3d(0,0,0); } to { transform:translate3d(-16.6666667%,0,0); } }

.snapshot { border-bottom: 1px solid var(--line-soft); background: var(--bg-2); }
.snapshot-grid { display: grid; grid-template-columns: repeat(5,1fr); }
.snapshot-item { min-width: 0; padding: 28px 22px 28px 0; border-right: 1px solid var(--line); }
.snapshot-item + .snapshot-item { padding-left: 22px; }
.snapshot-item:last-child { border-right: 0; }
.snapshot-item strong { display: block; margin-bottom: 8px; color: var(--ink); font-size: clamp(1.65rem, 3vw, 2.6rem); font-weight: 580; letter-spacing: -.06em; line-height: .95; }
.snapshot-item span { display: block; max-width: 160px; color: var(--ink-3); font-size: .7rem; line-height: 1.45; }

.profile-intro { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(340px,.72fr); gap: clamp(54px, 8vw, 128px); align-items: end; }
.profile-title h2 { max-width: 860px; font-size: clamp(2.7rem, 5.4vw, 5.6rem); font-weight: 530; letter-spacing: -.06em; line-height: .94; text-wrap: balance; }
.profile-title h2 em { color: var(--ink-3); font-style: normal; }
.profile-copy { display: grid; gap: 17px; color: var(--ink-2); font-size: .94rem; line-height: 1.75; }
.discipline-grid { display: grid; grid-template-columns: 1fr 1fr; margin-top: clamp(52px, 6vw, 82px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.discipline { position: relative; padding: 32px 42px 38px 0; }
.discipline + .discipline { padding-left: 42px; border-left: 1px solid var(--line); }
.discipline::after { content:""; position:absolute; top:-1px; left:0; width:0; height:2px; background:var(--blue); transition:width .8s var(--ease); }
.discipline-quality::after { background: var(--orange); }
.discipline.is-visible::after { width: 44%; }
.discipline-head { display: grid; gap: 8px; margin-bottom: 20px; }
.discipline-head span { color: var(--ink-3); font-family: var(--meta); font-size: .58rem; letter-spacing: .11em; }
.discipline-head strong { font-size: 1.35rem; font-weight: 620; letter-spacing: -.025em; }
.discipline > p { max-width: 590px; margin-bottom: 24px; color: var(--ink-2); font-size: .84rem; line-height: 1.7; }
.discipline ul { display: grid; gap: 10px; }
.discipline li { position: relative; padding-left: 18px; color: var(--ink-2); font-size: .76rem; }
.discipline li::before { content:""; position:absolute; top:.68em; left:0; width:6px; height:1px; background:var(--orange); }
.delivery-line { display: flex; align-items: center; gap: 14px; margin-top: 28px; color: var(--ink-3); font-family: var(--meta); font-size: .56rem; letter-spacing: .08em; white-space: nowrap; overflow: hidden; }
.delivery-line i { flex: 1; min-width: 28px; height: 1px; background: linear-gradient(90deg,var(--line),var(--orange),var(--line)); background-size:200% 100%; animation: deliveryMove 4s linear infinite; }
@keyframes deliveryMove { to { background-position:-200% 0; } }

.experience-section { background: var(--bg-2); }
.experience-heading { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(320px,.62fr); gap: clamp(50px, 8vw, 120px); align-items: end; margin-bottom: clamp(48px, 6vw, 74px); }
.experience-heading h2 { max-width: 840px; font-size: clamp(2.65rem, 5vw, 5rem); font-weight: 530; letter-spacing: -.058em; line-height: .96; }
.experience-heading > p { color: var(--ink-2); font-size: .9rem; line-height: 1.72; }
.timeline { position: relative; }
.timeline-line { position: absolute; top: 0; bottom: 0; left: 12px; width: 1px; background: var(--line); }
.timeline-line i { display: block; width: 100%; height: 0%; background: linear-gradient(to bottom,var(--orange),var(--blue),var(--cyan)); }
.role { position: relative; display: grid; grid-template-columns: 250px minmax(0,1fr); gap: clamp(34px,5vw,78px); padding: 0 0 62px 48px; }
.role:last-child { padding-bottom: 0; }
.role-marker { position: absolute; z-index:2; top: 3px; left: 7px; width: 11px; height: 11px; border: 2px solid var(--bg-2); border-radius: 50%; background: var(--ink-3); box-shadow: 0 0 0 1px var(--line); transition:background .45s ease,box-shadow .45s ease,transform .45s var(--ease); }
.role.is-visible .role-marker { background: var(--orange); box-shadow:0 0 0 1px rgba(255,116,38,.4),0 0 22px rgba(255,116,38,.24); transform:scale(1.08); }
.role-meta { padding-top: 0; }
.role-date { display: block; margin-bottom: 12px; color: var(--orange); font-family: var(--meta); font-size: .6rem; letter-spacing: .08em; }
.role-meta strong { display: block; font-size: 1rem; font-weight: 680; letter-spacing: .015em; }
.role-meta small { display: block; margin-top: 4px; color: var(--ink-3); font-size: .69rem; }
.role-body { min-width: 0; padding-bottom: 46px; border-bottom: 1px solid var(--line); }
.role:last-child .role-body { padding-bottom: 0; border-bottom: 0; }
.role-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 26px; margin-bottom: 20px; }
.role-title-row h3 { max-width: 780px; font-size: clamp(1.55rem, 2.8vw, 2.6rem); font-weight: 560; letter-spacing: -.045em; line-height: 1.03; }
.role-title-row > span { flex: 0 0 auto; padding-top: 5px; color: var(--ink-3); font-family: var(--meta); font-size: .56rem; letter-spacing: .08em; }
.role-body > p { max-width: 900px; color: var(--ink-2); font-size: .9rem; line-height: 1.72; }
.role-points { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 28px; margin-top: 22px; }
.role-points li { position: relative; padding-left: 17px; color: var(--ink-2); font-size: .76rem; line-height: 1.6; }
.role-points li::before { content:""; position:absolute; top:.72em; left:0; width:6px; height:1px; background:var(--orange); }
.role-results { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 28px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.role-results span { min-width:0; padding: 18px 18px 18px 0; border-right: 1px solid var(--line); }
.role-results span + span { padding-left: 18px; }
.role-results span:last-child { border-right: 0; }
.role-results strong { display: block; margin-bottom: 6px; color: var(--ink); font-size: 1.2rem; font-weight: 650; letter-spacing: -.04em; }
.role-results small { display: block; color: var(--ink-3); font-size: .64rem; line-height: 1.42; }
.role-results-compact { grid-template-columns: repeat(2,1fr); max-width: 720px; }
.role-stack { display: flex; flex-wrap: wrap; gap: 8px 17px; margin-top: 20px; color: var(--ink-3); font-family: var(--meta); font-size: .58rem; }
.role-stack span::before { content:"/"; margin-right:7px; color:var(--orange); }

.expertise-heading { margin-bottom: clamp(42px,5vw,66px); }
.expertise-heading h2 { max-width: 940px; font-size: clamp(2.7rem,5.2vw,5.25rem); font-weight:530; letter-spacing:-.058em; line-height:.95; }
.expertise-heading h2 em { color:var(--ink-3); font-style:normal; }
.expertise-table { border-top: 1px solid var(--line); }
.expertise-row { display:grid; grid-template-columns:58px minmax(190px,.6fr) minmax(0,1.4fr); gap:24px; align-items:baseline; padding:22px 0; border-bottom:1px solid var(--line); transition:padding .35s var(--ease), background .25s ease; }
.expertise-row:hover { padding-left:12px; padding-right:12px; background:var(--orange-soft); }
.expertise-row > span { color:var(--orange); font-family:var(--meta); font-size:.58rem; }
.expertise-row > strong { font-size:.88rem; font-weight:620; }
.expertise-row > p { color:var(--ink-2); font-size:.78rem; line-height:1.65; }
.expertise-row-quality > strong { color:var(--orange); }
.education-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:48px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.education-item { padding:28px 28px 30px 0; }
.education-item + .education-item { padding-left:28px; border-left:1px solid var(--line); }
.education-item > span { display:block; margin-bottom:14px; color:var(--orange); font-family:var(--meta); font-size:.57rem; letter-spacing:.08em; }
.education-item strong { display:block; max-width:330px; font-size:1rem; font-weight:620; line-height:1.3; }
.education-item p { margin-top:10px; color:var(--ink-3); font-size:.68rem; line-height:1.5; }

.contact-section { overflow:hidden; padding-bottom: clamp(86px,9vw,130px); background:var(--bg-2); }
.contact-lines { position:absolute; inset:0; pointer-events:none; opacity:.45; }
.contact-lines i { position:absolute; width:1px; height:140%; top:-20%; background:linear-gradient(to bottom,transparent,var(--line),transparent); transform:rotate(21deg); }
.contact-lines i:nth-child(1){left:67%}.contact-lines i:nth-child(2){left:76%;animation:contactLine 8s ease-in-out infinite alternate}.contact-lines i:nth-child(3){left:85%}
@keyframes contactLine { to { transform:rotate(21deg) translateX(30px); } }
.contact-layout { position:relative; z-index:1; }
.contact-main { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.72fr); gap:clamp(56px,9vw,140px); align-items:start; }
.contact-main h2 { max-width:800px; font-size:clamp(2.8rem,5.7vw,5.8rem); font-weight:530; letter-spacing:-.06em; line-height:.94; }
.contact-main h2 em { color:var(--orange); font-style:normal; }
.contact-copy > p { margin-bottom:30px; color:var(--ink-2); font-size:.91rem; line-height:1.75; }
.contact-links { border-top:1px solid var(--line); }
.contact-links a { display:grid; grid-template-columns:88px 1fr auto; gap:18px; align-items:center; padding:17px 0; border-bottom:1px solid var(--line); transition:padding .35s var(--ease),color .25s ease; }
.contact-links a:hover { padding-left:10px; color:var(--orange); }
.contact-links span { min-width:0; color:var(--ink-3); font-family:var(--meta); font-size:.68rem; font-weight:600; letter-spacing:.045em; text-transform:uppercase; white-space:nowrap; }
.contact-links strong { min-width:0; overflow-wrap:anywhere; font-size:.9rem; font-weight:560; letter-spacing:-.01em; }
.contact-links i { font-style:normal; color:var(--orange); }

.site-footer { padding:24px 0; border-top:1px solid var(--line); background:var(--bg); }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; color:var(--ink-3); font-family:var(--meta); font-size:.7rem; font-weight:500; letter-spacing:.005em; }
.footer-inner a { display:inline-flex; align-items:center; gap:7px; transition:color .25s ease; }
.footer-inner a:hover { color:var(--orange); }

[data-reveal] { opacity:1; transform:none; }
.motion-enabled [data-reveal].reveal-managed { opacity:0; transform:translateY(26px); transition:opacity .72s var(--ease), transform .82s var(--ease); }
.motion-enabled [data-reveal="scale"].reveal-managed { transform:translateY(18px) scale(.975); }
.motion-enabled [data-reveal].reveal-managed.is-visible { opacity:1; transform:none; }
.motion-enabled .role.reveal-managed .role-body { transform:translateX(12px); transition:transform .85s var(--ease); }
.motion-enabled .role.reveal-managed.is-visible .role-body { transform:none; }

html[data-theme="light"] .hero { color:#f4f7fb; } 
html[data-theme="light"] .hero .hero-lead { color:#aab4c2; }
html[data-theme="light"] .hero .hero-lead strong { color:#f4f7fb; }
html[data-theme="light"] .hero .text-action { color:#c5ced9; }
html[data-theme="light"] .hero .text-action:hover { color:#fff; }
html[data-theme="light"] .hero .engineering-profile { border-color:rgba(255,255,255,.13); }
html[data-theme="light"] .hero .profile-head,
html[data-theme="light"] .hero .profile-row { border-color:rgba(255,255,255,.1); }

@media (max-width: 1180px) {
    .hero { min-height: 780px; }
    .hero-layout { grid-template-columns:minmax(0,1.1fr) minmax(350px,.72fr); gap:44px; }
    .hero-title { font-size:clamp(4.5rem,8.6vw,7.4rem); }
    .engineering-profile { min-height:530px; padding-left:22px; }
    .profile-flow { height:292px; }
    .snapshot-grid { grid-template-columns:repeat(5,1fr); }
    .snapshot-item { padding-right:14px; }
    .snapshot-item + .snapshot-item { padding-left:14px; }
    .role { grid-template-columns:210px minmax(0,1fr); gap:36px; }
    .role-results { grid-template-columns:repeat(2,1fr); }
    .role-results span:nth-child(2) { border-right:0; }
    .role-results span:nth-child(3) { padding-left:0; border-top:1px solid var(--line); }
    .role-results span:nth-child(4) { border-top:1px solid var(--line); }
    .role-results-compact { grid-template-columns:repeat(2,1fr); }
    .role-results-compact span:nth-child(2) { border-top:0; }
}

@media (max-width: 920px) {
    :root { --header:72px; }
    .shell { width:min(calc(100% - 38px), var(--shell)); }
    .desktop-nav { display:none; }
    .menu-toggle { display:block; }
    .hero { min-height:0; padding-top:calc(var(--header) + 38px); padding-bottom:48px; }
    .hero-layout { grid-template-columns:1fr; gap:54px; padding-top:46px; }
    .hero-title { max-width:780px; font-size:clamp(4.25rem,14vw,7.4rem); line-height:.79; }
    .engineering-profile { min-height:510px; max-width:640px; padding-left:22px; }
    .hero-topline span:last-child { display:none; }
    .snapshot-grid { grid-template-columns:repeat(3,1fr); }
    .snapshot-item:nth-child(3) { border-right:0; }
    .snapshot-item:nth-child(n+4) { border-top:1px solid var(--line); }
    .snapshot-item:nth-child(4) { padding-left:0; }
    .profile-intro, .experience-heading, .contact-main { grid-template-columns:1fr; gap:34px; }
    .discipline-grid { grid-template-columns:1fr; }
    .discipline { padding:30px 0; }
    .discipline + .discipline { padding-left:0; border-left:0; border-top:1px solid var(--line); }
    .delivery-line { gap:10px; }
    .role { grid-template-columns:1fr; gap:20px; padding-left:44px; padding-bottom:54px; }
    .role-meta { display:grid; grid-template-columns:1fr auto; gap:4px 20px; }
    .role-meta .role-date { grid-column:1 / -1; margin-bottom:5px; }
    .role-meta small { text-align:right; }
    .role-points { grid-template-columns:1fr; }
    .expertise-row { grid-template-columns:46px minmax(170px,.7fr) minmax(0,1.3fr); gap:18px; }
    .education-grid { grid-template-columns:1fr; }
    .education-item { padding:24px 0; }
    .education-item + .education-item { padding-left:0; border-left:0; border-top:1px solid var(--line); }
}

@media (max-width: 640px) {
    :root { --header:68px; }
    .shell { width:min(calc(100% - 28px), var(--shell)); }
    .section { padding:66px 0; }
    .header-actions { gap:12px; }
    .language-switch { gap:4px; }
    .theme-button { width:35px; height:35px; }
    .menu-toggle { width:35px; height:35px; }
    .wordmark span { font-size:.75rem; }
    .hero { padding-top:calc(var(--header) + 28px); }
    .hero-topline { font-size:.55rem; }
    .hero-layout { padding-top:38px; gap:46px; }
    .hero-kicker { max-width:290px; line-height:1.55; }
    .hero-title { font-size:clamp(3.75rem,19vw,6rem); letter-spacing:-.075em; line-height:.8; }
    .hero-name-line { padding-right:.18em; }
    .hero-role { margin-top:28px; }
    .hero-role strong { font-size:1.2rem; }
    .hero-role span { font-size:.58rem; }
    .hero-lead { font-size:.92rem; line-height:1.68; }
    .hero-actions { display:grid; gap:12px; }
    .text-action { width:max-content; max-width:100%; font-size:.72rem; }
    .hero-links { gap:9px 17px; font-size:.56rem; }
    .engineering-profile { min-height:465px; padding-left:14px; }
    .profile-flow { height:250px; }
    .profile-row { grid-template-columns:28px 1fr; gap:2px 8px; padding:11px 0; }
    .profile-row strong { font-size:.63rem; }
    .profile-row small { font-size:.51rem; }
    .profile-status { font-size:.5rem; line-height:1.5; }
    .kinetic-group { gap:15px; padding-top:10px; padding-bottom:10px; }
    .kinetic-group span { font-size:.59rem; }
    .snapshot-grid { grid-template-columns:repeat(2,1fr); }
    .snapshot-item { padding:22px 14px 22px 0; }
    .snapshot-item + .snapshot-item { padding-left:14px; }
    .snapshot-item:nth-child(2n) { border-right:0; }
    .snapshot-item:nth-child(3) { border-right:1px solid var(--line); }
    .snapshot-item:nth-child(n+3) { border-top:1px solid var(--line); }
    .snapshot-item:nth-child(3), .snapshot-item:nth-child(5) { padding-left:0; }
    .snapshot-item:nth-child(4) { padding-left:14px; }
    .snapshot-item:last-child { grid-column:1 / -1; border-right:0; }
    .snapshot-item strong { font-size:1.9rem; }
    .section-label { margin-bottom:34px; }
    .profile-title h2, .experience-heading h2, .expertise-heading h2, .contact-main h2 { font-size:clamp(2.35rem,11vw,4.1rem); }
    .profile-copy { font-size:.86rem; }
    .discipline-head strong { font-size:1.18rem; }
    .delivery-line { display:grid; grid-template-columns:auto 1fr auto 1fr auto; gap:8px; white-space:normal; }
    .delivery-line span:nth-of-type(n+4), .delivery-line i:nth-of-type(n+3) { display:none; }
    .experience-heading { margin-bottom:42px; }
    .timeline-line { left:7px; }
    .role { padding-left:30px; }
    .role-marker { left:2px; }
    .role-meta { display:block; }
    .role-meta small { text-align:left; }
    .role-title-row { display:grid; gap:9px; }
    .role-title-row h3 { font-size:1.55rem; }
    .role-title-row > span { padding-top:0; }
    .role-body > p { font-size:.83rem; }
    .role-results, .role-results-compact { grid-template-columns:1fr 1fr; }
    .role-results span { padding:15px 12px 15px 0; }
    .role-results span + span { padding-left:12px; }
    .role-results span:nth-child(3) { padding-left:0; }
    .role-stack { gap:7px 12px; }
    .expertise-row { grid-template-columns:34px 1fr; gap:7px 12px; padding:18px 0; }
    .expertise-row > span { grid-row:1 / span 2; }
    .expertise-row > p { grid-column:2; }
    .expertise-row:hover { padding-left:0; padding-right:0; background:transparent; }
    .contact-links a { grid-template-columns:minmax(0,1fr) auto; gap:4px 12px; align-items:center; }
    .contact-links span { grid-column:1; grid-row:1; }
    .contact-links strong { grid-column:1; grid-row:2; font-size:.7rem; }
    .contact-links .ui-arrow { grid-column:2; grid-row:1 / span 2; align-self:center; }
    .footer-inner { display:grid; gap:8px; text-align:left; }
    .footer-inner a { justify-self:start; }
    .mobile-menu-foot { display:grid; }
}

@media (max-width: 390px) {
    .hero-title { font-size:clamp(3.35rem,18.7vw,4.3rem); }
    .hero-links { display:grid; }
    .snapshot-item span { font-size:.64rem; }
    .role-results, .role-results-compact { grid-template-columns:1fr; }
    .role-results span, .role-results span + span, .role-results span:nth-child(3) { padding:14px 0; border-right:0; border-top:1px solid var(--line); }
    .role-results span:first-child { border-top:0; }
    .contact-links a { grid-template-columns:minmax(0,1fr) auto; }
}

/* iPhone/touch devices: keep heavy hero background layers stable while scrolling. */
@media (hover: none) and (pointer: coarse) {
    .hero-glow { animation: none; transform: translateZ(0); }
    .hero-grid { transform: translateZ(0); backface-visibility: hidden; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
    .intro { display:none; }
    .hero-canvas { display:none; }
    .motion-enabled [data-reveal].reveal-managed { opacity:1; transform:none; }
}