/* Premium portfolio: ink, paper and a single electric-blue signal.
   The independent SVG delivery-signal treatment adapts the animated path idea from
   Magic UI Animated Beam (MIT): https://github.com/magicuidesign/magicui */
@font-face {
  font-family:"Space Grotesk";
  src:url("assets/fonts/SpaceGrotesk.woff2") format("woff2");
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
}
@media screen {
  :root { --premium-ink:#071a2f; --premium-deep:#07182b; --premium-panel:#102c49; --premium-blue:#1469b8; --premium-signal:#63baff; --premium-paper:#f4f7fb; --premium-line:#c9d5e3; }
  body.portfolio-page { background:var(--premium-deep); color:#e9f2fb; }
  .portfolio-page .header, .case-page .header { background:rgba(7,24,43,.97); border-color:#2c4661; }
  .portfolio-page .header-inner, .case-page .header-inner { min-height:76px; }
  .portfolio-page .wordmark, .case-page .wordmark { color:#f4f8fd; font-family:"Space Grotesk",sans-serif; letter-spacing:-.08em; }
  .portfolio-page .wordmark span, .case-page .wordmark span { color:#5db6ff; }
  .portfolio-page .desktop-nav a { color:#c0d3e4; }
  .portfolio-page .desktop-nav a:hover, .portfolio-page .desktop-nav a[aria-current="location"] { color:#fff; border-color:#6fc2ff; }
  .portfolio-page .header .language-switch, .case-page .header .language-switch { border-color:#4e6881; }
  .portfolio-page .header .language-switch a, .case-page .header .language-switch a { color:#d8e7f5; }
  .portfolio-page .header .language-switch a[aria-current="page"], .case-page .header .language-switch a[aria-current="page"] { background:#dceeff; color:#0c365d; }
  .portfolio-page .menu-trigger { background:#e9f4ff; color:#0b2d4d; border-radius:0; }
  .portfolio-page .site-menu { background:#0a2542; color:#f3f8fd; }
  .portfolio-page .menu-links a, .portfolio-page .menu-bottom, .portfolio-page .menu-label, .portfolio-page .menu-caption { color:#e7f2fc; }
  .portfolio-page .menu-feature { border-color:#4a6886; }
  .portfolio-page .hero { position:relative; grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr); gap:0 clamp(44px,7vw,110px); align-items:center; padding-top:clamp(50px,6vw,88px); }
  .portfolio-page .hero::before { inset:0; background:linear-gradient(90deg,rgba(113,166,213,.08) 1px,transparent 1px),linear-gradient(rgba(113,166,213,.08) 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(90deg,#000,transparent 92%); }
  .portfolio-page .hero-copy { max-width:760px; padding:0; }
  .portfolio-page .hero-name { color:#f6faff; font-family:"Space Grotesk",sans-serif; font-size:clamp(1.6rem,2.6vw,2.7rem); font-weight:600; letter-spacing:-.05em; }
  .portfolio-page .hero-name span { color:#9ebad2; font-size:.7rem; }
  .portfolio-page .hero h1 { max-width:13ch; margin:clamp(35px,4vw,58px) 0 22px; color:#f4f8fd; font-family:"Space Grotesk",sans-serif; font-size:clamp(3.1rem,5.1vw,5.7rem); font-weight:600; line-height:1.01; letter-spacing:-.065em; }
  .portfolio-page .hero h1 .hero-word:last-child { color:#8acbff; }
  .portfolio-page .hero-role { color:#e7f1fb; font-weight:600; }
  .portfolio-page .hero-intro { color:#bbd0e1; font-size:1.04rem; }
  .portfolio-page .hero-actions { margin-top:30px; gap:8px 16px; }
  .portfolio-page .hero-actions .primary { background:#a9dbff; border-color:#a9dbff; color:#08223b; }
  .portfolio-page .hero-actions .primary:hover { background:#d4eeff; }
  .portfolio-page .hero-actions .secondary { color:#eaf5ff; border-color:#7291ae; background:transparent; }
  .portfolio-page .hero-actions .secondary img { filter:invert(1); }
  .portfolio-page .hero-labs-jump { color:#aad9ff; }
  .portfolio-page .hero-profile { max-width:none; min-height:500px; padding:12px; align-self:stretch; border:1px solid #406480; background:#173f62; }
  .portfolio-page .hero-profile::before { inset:12px; border-color:#9ec5e055; }
  .portfolio-page .hero-profile .portrait-frame { min-height:100%; background:#c8d8e7; }
  .portfolio-page .hero-profile img { min-height:500px; object-position:center top; }
  .portfolio-page .hero-profile figcaption { inset:auto 12px 12px; padding:36px 18px 18px; background:linear-gradient(transparent,#07182be8); color:#fff; }
  .portfolio-page .profile-cross { color:#173e5c; }
  .portfolio-page .career-strip { margin-top:0; border:0; border-bottom:1px solid #36516b; }
  .portfolio-page .career-strip a { color:#e5f2ff; }
  .portfolio-page .career-strip strong { color:#f5faff; }
  .portfolio-page .career-strip span { color:#b5cde0; }
  .portfolio-page .career-strip small { color:#91cfff; }
  .portfolio-page .career-strip a + a { border-color:#36516b; }
  .portfolio-page .career-strip a:hover { background:#153a5a; }
  .portfolio-page .work-section { background:var(--premium-paper); color:#102c46; border-color:#c7d4e0; }
  .portfolio-page .work-section .section { padding-block:clamp(90px,9vw,140px); }
  .portfolio-page .section-heading h2, .portfolio-page .explore-index h2, .portfolio-page .scene-section h2, .portfolio-page .about-grid h2, .portfolio-page .contact h2 { font-family:"Space Grotesk",sans-serif; font-weight:600; letter-spacing:-.06em; }
  .portfolio-page .work-section .section-heading h2 { color:#0a2844; font-size:clamp(3.3rem,6.8vw,6.6rem); }
  .portfolio-page .editorial-section-label, .portfolio-page .work-section .eyebrow { color:#175d99; }
  .portfolio-page .work-shortcuts { border-color:#b9cadc; }
  .portfolio-page .work-shortcuts a, .portfolio-page .project .text-link:not(.case-study-entry), .portfolio-page .github-link { color:#075b9d; }
  .portfolio-page .project-filters button { border-color:#a4bad0; color:#244966; background:transparent; border-radius:0; }
  .portfolio-page .project-filters button[aria-pressed="true"] { background:#0b375f; border-color:#0b375f; color:#fff; }
  .portfolio-page .project-grid { gap:20px; }
  .portfolio-page .project { border-radius:0; border-color:#c0d1e2; background-color:#fff; box-shadow:none; }
  .portfolio-page .project-featured { background-color:#e4f0fb; border-color:#adcae4; }
  .portfolio-page .project-robotics { background-color:#fff; }
  .portfolio-page .project-production { background-color:#e9eef7; }
  .portfolio-page .project-compact { background-color:transparent; border:0; border-top:1px solid #aabfd1; }
  .portfolio-page .project[data-spotlight="on"] { background-image:radial-gradient(500px circle at var(--spot-x) var(--spot-y),rgba(49,136,207,.15),transparent 62%); }
  .portfolio-page .project:focus-within { outline:2px solid #2678b9; outline-offset:2px; }
  .portfolio-page .project::after { background:linear-gradient(90deg,#1677c9,#98d4ff,transparent); }
  .portfolio-page .project-index { color:#1568a6; }
  .portfolio-page .project h3 { color:#102d48; font-family:"Space Grotesk",sans-serif; font-weight:600; }
  .portfolio-page .project .project-summary, .portfolio-page .project .project-footnote, .portfolio-page .project-kind, .portfolio-page .case-facts dt { color:#395771; }
  .portfolio-page .case-facts { border-color:#b6cadc; }
  .portfolio-page .case-facts dd { color:#163e5e; }
  .portfolio-page .project .tags span { background:#f4f9fd; border-color:#bad0e3; color:#335773; }
  .portfolio-page .project-featured .case-study-entry { background:#0b3a64; border-color:#0b3a64; color:#fff; }
  .portfolio-page .project-featured .world-return, .portfolio-page .project-robotics .world-return, .portfolio-page .project-details > summary, .portfolio-page .robotics-story > summary { color:#075b9d; }
  .portfolio-page .robotics-photo, .portfolio-page .robotics-photo figcaption { background:#0c2e4b; }
  .portfolio-page #experience, .portfolio-page #skills { color:#dceaf7; }
  .portfolio-page #experience .section-heading h2, .portfolio-page #skills .section-heading h2 { color:#f2f8ff; }
  .portfolio-page #experience .section-heading p, .portfolio-page #skills .section-heading p { color:#bdcfe0; }
  .portfolio-page #experience .eyebrow, .portfolio-page #skills .eyebrow { color:#8dc8f3; }
  .portfolio-page .experience-layout, .portfolio-page .timeline-item { border-color:#34536e; }
  .portfolio-page .company-block { background:#123b60; color:#edf6ff; }
  .portfolio-page .company-block :is(.company-name,.company-name span,p,.company-period,.world-return) { color:#dbeeff; }
  .portfolio-page .timeline-item h3 { color:#f0f7fe; }
  .portfolio-page .timeline-item :is(li,.role-context) { color:#c6d9e9; }
  .portfolio-page .role-badge { background:#dceeff; color:#164b75; border-color:#9ec4df; }
  .portfolio-page .earlier-spotlight { background:#0d2944; border-color:#34536e; }
  .portfolio-page .earlier-grid article { background:#173854; border-color:#45647f; }
  .portfolio-page .earlier-grid h3, .portfolio-page .earlier-grid p { color:#e6f2fd; }
  .portfolio-page .earlier-spotlight .text-link { color:#b7dfff; }
  .portfolio-page .study-focus { background:#153b5b; border-color:#486c8b; }
  .portfolio-page .study-focus h3, .portfolio-page .study-focus p { color:#e8f4ff; }
  .portfolio-page .study-focus .tags span { background:#e4f2ff; border-color:#a8cce8; color:#1c4e74; }
  .portfolio-page .study-experiment-link, .portfolio-page #skills .world-return { color:#b9e0ff; }
  .portfolio-page .skill-grid { border-color:#45637b; }
  .portfolio-page .skill-grid article { background:#102c47; border-color:#45637b; }
  .portfolio-page .skill-grid article h3 { color:#f2f8ff; }
  .portfolio-page .skill-grid article p, .portfolio-page .support-tools p, .portfolio-page .support-tools span { color:#c4d8e8; }
  .portfolio-page .skill-number { color:#94ccf6; }
  .portfolio-page .explore-region { background:#e8f0f8; border-color:#bed1e3; color:#15354e; }
  .portfolio-page .explore-index-heading, .portfolio-page .explore-index-grid { border-color:#adc2d5; }
  .portfolio-page .explore-index h2 { color:#0b2944; }
  .portfolio-page .explore-index-heading > p, .portfolio-page .explore-index-note { color:#425e75; }
  .portfolio-page .explore-index-kicker, .portfolio-page .explore-card-top { color:#135e9c; }
  .portfolio-page .explore-card { background:#f7fafd; border-color:#b7cbde; color:#183c5a; }
  .portfolio-page .explore-card:nth-child(even) { background:#dceaf7; }
  .portfolio-page .explore-card strong { color:#102f4c; }
  .portfolio-page .explore-card > span:nth-of-type(2) { color:#3f5d74; }
  .portfolio-page .explore-card-action { color:#075b9d; }
  .portfolio-page .scene-section-heading h2 { color:#f1f8ff; }
  .portfolio-page .scene-section-heading > div > p, .portfolio-page .hero-visual-header p, .portfolio-page .hero-focus-detail { color:#c5d9e9; }
  .portfolio-page .scene-section .eyebrow, .portfolio-page .hero-explore-label, .portfolio-page .hero-detail-kicker { color:#a7d6fa; }
  .portfolio-page .hero-explore:not([hidden]) { border-color:#486782; }
  .portfolio-page .hero-focus-buttons { border-color:#577a98; }
  .portfolio-page .hero-focus-buttons button { background:#123552; border-color:#577a98; color:#e0effc; }
  .portfolio-page .hero-focus-buttons button:not([aria-pressed="true"]) span:first-child { color:#bbd8ef; }
  .portfolio-page .hero-focus-buttons button[aria-pressed="true"], .portfolio-page .hero-explore[data-focus] .hero-focus-buttons button[aria-pressed="true"] { background:#d9eeff; color:#103b5c; }
  .portfolio-page .hero-guided > summary, .portfolio-page .hero-visual-notes summary, .portfolio-page .hero-camera-disclosure > summary, .portfolio-page .hero-project-links a, .portfolio-page .hero-focus-detail .hero-detail-links a:not(:first-child) { color:#c4e5ff; }
  .portfolio-page .hero-detail-note, .portfolio-page .hero-focus-detail .hero-detail-note { color:#c3d8e8; }
  .portfolio-page .hero-focus-detail [data-hero-detail] > a, .portfolio-page .hero-focus-detail .hero-detail-links a:first-child { background:#d7ecfc; border-color:#d7ecfc; color:#103450; }
  .portfolio-page .hero-field-panel { background:#123957; border-color:#6385a1; }
  .portfolio-page .hero-parameter-reset, .portfolio-page .hero-stage-toggle { color:#d8edff; border-color:#6989a4; }
  .portfolio-page .hero-orbit, .portfolio-page .hero-orbit[data-focus] { background-color:#0a2946; }
  .portfolio-page .world-bridge, .portfolio-page .world-bridge[data-focus] { --bridge-accent:#1a6aab; background:#e4eef8; border-color:#bacfe1; }
  .portfolio-page .world-bridge-heading h2, .portfolio-page .world-bridge-content h3 { color:#123550; }
  .portfolio-page .world-bridge-heading p, .portfolio-page .world-bridge-content p { color:#405e74; }
  .portfolio-page .world-bridge-content a { color:#075b9d; }
  .portfolio-page .about-section { background:#e6eef7; border-color:#b9cedf; color:#16354c; }
  .portfolio-page .about-grid h2 { color:#0c2d48; }
  .portfolio-page .about-copy, .portfolio-page .education-list p, .portfolio-page .education-list .subtle { color:#3d596e; }
  .portfolio-page .education-list h3 { color:#0e3655; }
  .portfolio-page .about-section .eyebrow { color:#12639f; }
  .portfolio-page section.contact { background:#1267a8; border-color:#76b9e9; color:#fff; }
  .portfolio-page section.contact h2 { color:#fff; }
  .portfolio-page section.contact .eyebrow, .portfolio-page section.contact > p:not(.eyebrow) { color:#e5f4ff; }
  .portfolio-page .contact-email { background:#f4f9ff; border-color:#d2e9fb; color:#0b3c62; }
  .portfolio-page .contact-links { border-color:#b6dfff80; }
  .portfolio-page .contact-links a { color:#fff; }
  .portfolio-page .footer { color:#c8d9e8; border-color:#36516b; }
  .portfolio-page .footer .wordmark { color:#f5faff; }
  .portfolio-page .footer-back { color:#b8e3ff; }
  .portfolio-page :is(a,button,summary,input,select):focus-visible, .case-page :is(a,button,summary,input,select):focus-visible { outline:3px solid #197dcc; outline-offset:3px; }
  .portfolio-page :is(.hero,.header,.site-menu,#experience,#skills,.scene-section,.delivery-section,.signal-section,section.contact) :is(a,button,summary,input,select):focus-visible { outline-color:#c8ecff; }
  /* Resume and case study retain their print and native-link behavior. */
  body.resume-page { --blue:#1265a4; --line:#c4d4e1; --surface:#e8f0f8; background:#f3f7fb; color:#102c43; }
  .resume-page .resume-toolbar { background:#07182b; border-color:#36516b; }
  .resume-page .wordmark, .resume-page .back-link, .resume-page .language-switch a { color:#e7f3fd; }
  .resume-page .wordmark span, .resume-page .resume-name > span { color:#2787cf; }
  .resume-page .language-switch a[aria-current="page"], .resume-page .resume-index a[aria-current="location"], .resume-page .current-badge { background:#dceeff; color:#145586; }
  .resume-page .print-button { background:#dceeff; color:#113e61; }
  .resume-page .resume-hero { margin-top:36px; padding:clamp(24px,4vw,58px); border:1px solid #b8cde0; background:#e1edf8; }
  .resume-page .resume-name, .resume-page .resume-section-heading h2 { font-family:"Space Grotesk",sans-serif; }
  .resume-page .resume-portrait { background:#bcd3e5; border-color:#92b5d0; }
  .resume-page #work .resume-entry { background:#e8f1f9; border-color:#c1d3e1; }
  .resume-page .resume-footer { border-color:#c4d4e1; }
  body.case-page { background:#f3f7fb; color:#112e47; }
  .case-page .case-home { color:#d9eafd; }
  .case-page .case-intro h1, .case-page .case-section h2 { font-family:"Space Grotesk",sans-serif; color:#0d2e4b; }
  .case-page .case-intro .eyebrow, .case-page .case-index a[aria-current="location"] { color:#13639f; }
  .case-page .case-architecture { background:#e0ecf7; }
  .case-page .case-actions .button-primary { background:#103e64; color:#fff; }
  .recognition-page { --ink:#f1f7ff; --muted:#c1d6e9; --line:#3b5d79; --accent:#99d2ff; background:#071a2f; color:var(--ink); }
  .recognition-page .hero h1, .recognition-page .section h2 { font-family:"Space Grotesk",sans-serif; }
  .recognition-page .card { background:#12334f; }
  .recognition-page .intro, .recognition-page .section p { color:#c7dced; }
}
@media screen {
  .portfolio-page .delivery-section { background:#061625; }
  .portfolio-page .delivery-studio { background:#102c45; border-color:#476985; border-radius:2px; }
  .portfolio-page .delivery-topbar { background:#173b5c; border-color:#42637d; }
  .portfolio-page .delivery-scenarios { background:#0c2941; border-color:#42637d; }
  .portfolio-page .delivery-scenario { background:#173b58; border-color:#506e88; }
  .portfolio-page .delivery-scenario.is-selected { background:#25577d; border-color:#a5d9ff; }
  .portfolio-page .delivery-scenario-icon { background:#315e80; color:#d1edff; }
  .portfolio-page .delivery-column-no, .portfolio-page .delivery-label, .portfolio-page .delivery-eyebrow, .portfolio-page .delivery-context > span { color:#a8d6f7; }
  .portfolio-page .delivery-heading-copy a, .portfolio-page .delivery-scenario-foot span { color:#b7e2ff; }
  .portfolio-page .delivery-brand-icon, .portfolio-page .delivery-run, .portfolio-page .delivery-takeaway { background:#c7e8ff; border-color:#c7e8ff; color:#11364f; }
  .portfolio-page .delivery-brand-icon i { background:#1c5882; }
  .portfolio-page .delivery-visual { background:radial-gradient(ellipse at 74% 56%,#2c6084,#153a57 45%,#0c263d); border-color:#466e8c; }
  .portfolio-page .delivery-visual-grid { background-image:linear-gradient(#b6ddff20 1px,transparent 1px),linear-gradient(90deg,#b6ddff20 1px,transparent 1px); }
  .portfolio-page .delivery-cube-front { background:linear-gradient(140deg,#c6e9ff,#6baad7); }
  .portfolio-page .delivery-cube-side { background:#427da8; }
  .portfolio-page .delivery-cube-top { background:#d9f2ff; }
  .portfolio-page .delivery-server { border-color:#6c9fbe; background:linear-gradient(135deg,#467899,#15364e); box-shadow:.35rem .55rem 0 #092338,0 .8rem 1.5rem #0004; }
  .portfolio-page .delivery-track-fill { background:#8bcfff; }
  .portfolio-page .delivery-node { background:#193e59; border-color:#587f9c; color:#d5edff; }
  .portfolio-page .delivery-inspector, .portfolio-page .delivery-log, .portfolio-page .delivery-health, .portfolio-page .delivery-health-chart, .portfolio-page .delivery-history-item { background:#102e47; border-color:#486b87; }
  .portfolio-page .delivery-takeaway-icon { background:#174f77; color:#e0f2ff; }
  .portfolio-page .convolution-lab { background:#0b2841; border:1px solid #355f7d; }
  .portfolio-page .convolution-viewport { background:radial-gradient(ellipse at center,#285b80,#102c45 72%); }
  .portfolio-page .conv-calculation, .portfolio-page .signal-result, .portfolio-page .spectral-results { background:#173e5b; border-color:#567e9b; }
  .portfolio-page .conv-calculation [data-calculation] { color:#e1f2ff; }
  .portfolio-page .convolution-pixel[aria-pressed="true"], .portfolio-page .convolution-kernels button[aria-pressed="true"] { background:#a6dbff; border-color:#d4efff; color:#0b2b42; }
  .portfolio-page .signal-section { background:#091f34; border-color:#355d7b; }
  .portfolio-page .signal-section::before { background:radial-gradient(ellipse at 15% 10%,#1d5279,transparent 45%),radial-gradient(ellipse at 90% 90%,#213e65,transparent 45%); }
  .portfolio-page .signal-plot-panel, .portfolio-page .signal-controls, .portfolio-page .spectral-visual, .portfolio-page .spectral-controls { background:#12314c; border-color:#4b7391; }
  .portfolio-page .spectral-lab { background:#0e2c45; border-color:#527695; }
  .portfolio-page .spectral-summary { background:linear-gradient(110deg,#1c4c70,#183450); }
  .portfolio-page .signal-section :is(button,a,input,select,summary):focus-visible, .portfolio-page .convolution-lab :is(button,a,input,select,summary):focus-visible { outline-color:#fff; }
}
@media screen and (max-width:900px) {
  .portfolio-page .hero { grid-template-columns:minmax(0,1.1fr) minmax(230px,.9fr); gap:0 28px; }
  .portfolio-page .hero h1 { font-size:clamp(2.8rem,6vw,4.5rem); }
  .portfolio-page .hero-profile, .portfolio-page .hero-profile img { min-height:390px; }
}
@media screen and (max-width:760px) {
  .portfolio-page .header-inner { min-height:64px; }
  .portfolio-page .hero { grid-template-columns:1fr; gap:0; padding-top:32px; }
  .portfolio-page .hero-copy { display:contents; }
  .portfolio-page .hero-identity { grid-column:1; grid-row:1; }
  .portfolio-page .hero-name { font-size:1.7rem; }
  .portfolio-page .hero h1, .portfolio-page:lang(de) .hero h1 { grid-column:1; grid-row:2; max-width:13ch; margin:28px 0 16px; font-size:clamp(2.65rem,9vw,4rem); line-height:1; }
  .portfolio-page .hero-role { grid-column:1; grid-row:3; }
  .portfolio-page .hero-profile { grid-column:1; grid-row:4; width:100%; min-height:0; height:270px; margin-top:24px; padding:8px; }
  .portfolio-page .hero-profile::before { inset:8px; }
  .portfolio-page .hero-profile .portrait-frame, .portfolio-page .hero-profile img { height:254px; min-height:0; }
  .portfolio-page .hero-profile img { object-position:center 18%; }
  .portfolio-page .hero-profile figcaption { inset:auto 8px 8px; }
  .portfolio-page .hero-profile figcaption span:first-child { display:block; }
  .portfolio-page .hero-profile figcaption span:last-child { font-size:.62rem; }
  .portfolio-page .hero-intro { grid-column:1; grid-row:5; margin-top:20px; }
  .portfolio-page .hero-actions { grid-column:1; grid-row:6; margin-top:18px; }
  .portfolio-page .career-strip { grid-column:1; grid-row:8; }
  .portfolio-page .career-strip a + a { border-left:0; border-top:1px solid #36516b; }
  .portfolio-page .work-section .section { padding-block:70px; }
  .portfolio-page .work-section .section-heading h2 { font-size:clamp(2.8rem,10vw,4rem); }
  .portfolio-page .project { padding:22px 18px; }
  .portfolio-page .project-robotics .robotics-photo { grid-column:1/-1; }
  .portfolio-page .scene-section .engineering-hero { grid-template-columns:1fr; }
  .resume-page .resume-hero { margin-top:24px; }
  .resume-page .resume-name { font-size:clamp(2.5rem,10vw,4rem); }
}
@media (prefers-reduced-motion:no-preference) {
}
@media (prefers-reduced-motion:no-preference) and (hover:hover) {
}
@media (prefers-reduced-motion:reduce) {
}
@media screen and (min-width:761px) {
  .portfolio-page .project-featured { grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); gap:clamp(28px,4vw,60px); padding:clamp(24px,3vw,40px); }
  .portfolio-page .project-featured > .project-index { position:absolute; z-index:2; top:clamp(36px,4vw,52px); left:clamp(36px,4vw,52px); display:grid; place-items:center; width:58px; height:58px; color:#fff; background:#0b3458; font-size:1.5rem; }
  .portfolio-page .project-featured > .project-preview { grid-column:1; grid-row:1; align-self:stretch; background:#d8e7f4; }
  .portfolio-page .project-featured > .project-preview img { height:auto; aspect-ratio:1.08; object-fit:cover; }
  .portfolio-page .project-featured > .thesis-overview { grid-column:2; grid-row:1; padding-block:8px; }
  .portfolio-page .project-featured > .project-lab { grid-column:1/-1; grid-row:2; }
  .portfolio-page .project-production { grid-template-columns:56px minmax(0,1fr) minmax(0,1.12fr); padding:clamp(28px,4vw,52px); }
  .portfolio-page section.contact { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.8fr); grid-template-areas:"label label" "title copy" "title email" "links links"; gap:16px clamp(40px,7vw,100px); align-items:start; }
  .portfolio-page section.contact > .eyebrow { grid-area:label; }
  .portfolio-page section.contact h2 { grid-area:title; margin:0; }
  .portfolio-page section.contact > p:not(.eyebrow) { grid-area:copy; margin:12px 0 0; }
  .portfolio-page section.contact > .contact-email { grid-area:email; margin:0; }
  .portfolio-page section.contact > .contact-links { grid-area:links; width:100%; margin-top:36px; }
}
@media screen {
  .portfolio-page .project .text-link, .portfolio-page .project .world-return { text-decoration-color:#6b9dc4; }
  .portfolio-page .skill-grid article { display:grid; grid-template-columns:46px minmax(0,1fr); gap:8px 16px; align-content:start; }
  .portfolio-page .skill-grid article .skill-number { grid-row:1/3; }
  .portfolio-page .skill-grid article h3 { margin:0; }
  .portfolio-page .skill-grid article p { grid-column:2; margin:0; }
  .portfolio-page .footer { display:grid; grid-template-columns:1.1fr 1.5fr 1fr auto; align-items:start; gap:22px; }
  .portfolio-page .footer .wordmark { font-size:2.8rem; }
  .portfolio-page .footer-nav { display:flex; flex-wrap:wrap; gap:12px 22px; }
  .portfolio-page .footer-nav a { color:#d5e9f9; min-height:44px; display:inline-flex; align-items:center; text-decoration:underline; text-underline-offset:4px; }
  .portfolio-page .footer p { margin:0; }
}
@media screen and (max-width:760px) {
  .portfolio-page .hero-profile img { object-position:center top; }
  .portfolio-page .hero-profile figcaption { justify-content:flex-end; }
  .portfolio-page .hero-profile figcaption span:first-child { display:none; }
  .portfolio-page .project-featured { grid-template-columns:1fr; }
  .portfolio-page .project-featured > .project-index, .portfolio-page .project-featured > .thesis-overview, .portfolio-page .project-featured > .project-preview, .portfolio-page .project-featured > .project-lab { grid-column:1; }
  .portfolio-page .project-featured > .project-index { margin-bottom:-14px; }
  .portfolio-page .skill-grid article { grid-template-columns:1fr; gap:8px; }
  .portfolio-page .skill-grid article .skill-number, .portfolio-page .skill-grid article p { grid-column:1; grid-row:auto; }
  .portfolio-page .footer { grid-template-columns:1fr 1fr; }
  .portfolio-page .footer-nav { grid-column:1/-1; grid-row:2; }
}
@media screen {
  .portfolio-page .hero-actions .primary .icon { filter:none; }
  .portfolio-page .hero-focus-detail [data-hero-detail] > p:not(.hero-detail-kicker), .portfolio-page .hero-explode, .portfolio-page .hero-explode output { color:#cfe1ef; }
  .portfolio-page .hero-stage-toggle { background:#173d5b; color:#e4f3ff; }
  .portfolio-page .hero-stage-toggle[aria-pressed="true"] { background:#d8ecfc; color:#113a59; }
  .portfolio-page .hero-explode input { accent-color:#91d2ff; }
  .portfolio-page .footer p { color:#c4d8e9; }
  .portfolio-page section.contact .contact-email { font-size:clamp(1rem,1.8vw,1.55rem); letter-spacing:-.025em; }
}
@media screen and (max-width:760px) {
  .portfolio-page section.contact .contact-email { font-size:clamp(.875rem,4vw,1rem); }
}
@media screen and (max-width:760px) and (prefers-reduced-motion:no-preference) {
}
@media screen {
  .portfolio-page .delivery-scenario.is-selected small { color:#e0effb; }
  .portfolio-page .hero-focus-buttons button[aria-pressed="true"] span:first-child { color:#255b81; }
}
@media screen {
  .portfolio-page .mobile-nav summary { color:#e8f4ff; border-color:#7596af; }
  .portfolio-page .mobile-nav[open] summary { background:#dceeff; color:#103753; }
  .portfolio-page .mobile-nav nav { background:#0c2c48; border-color:#6184a0; }
  .portfolio-page .mobile-nav nav a { color:#e6f4ff; }
  .portfolio-page .skip-link, .case-page .skip-link { background:#dceeff; color:#0c3150; }
  .portfolio-page .reading-progress { background:#74c4ff; }
  .portfolio-page .motion-toggle[aria-pressed="true"] { color:#0b3655; background:#d7efff; border-color:#4c95c9; }
}
@media (hover:hover) {
  .portfolio-page .explore-card:hover { background:#d5e9f8; box-shadow:inset 0 -4px #277ebd; }
  .portfolio-page .project-featured .case-study-entry:hover { background:#185880; }
  .resume-page .print-button:hover { background:#c2e5ff; color:#103753; }
}
@media screen {
  .case-page .case-facts { border-color:#bfd1df; }
  .case-page .case-facts > div { border-color:#bfd1df; }
  .case-page .case-facts dt { color:#4b687e; }
  .case-page .case-facts dd { color:#173f5e; }
  .case-page .case-lead { color:#465f72; }
  .case-page .case-actions .text-link { border-color:#70a6cb; }
}



/* One continuous portfolio: the directory points to the work itself. */
@media screen {
  .portfolio-page { --surface-ink:#06182d; --surface-blue:#0b4e82; --rule-blue:#315b7e; }
  .portfolio-page .header { background:#06182df5; border-bottom:1px solid #31506a; }
  .portfolio-page .header-inner { min-height:80px; }
  .portfolio-page .wordmark { font-size:2.35rem; }
  .portfolio-page .desktop-nav { gap:clamp(4px,1vw,18px); }
  .portfolio-page .desktop-nav a { font-size:.83rem; letter-spacing:.015em; }
  .portfolio-page .header-controls { gap:12px; }
  .header-resume { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:9px 16px; color:#dcefff; border:1px solid #567a98; font-size:.82rem; font-weight:700; text-decoration:none; }
  .header-resume:hover { background:#dcefff; color:#0b2e4c; }
  .portfolio-page .menu-trigger { border:1px solid #d9efff; background:transparent; color:#f5faff; }
  .portfolio-page .menu-trigger:hover { background:#dcefff; color:#0b2e4c; }
  .portfolio-page .site-menu { background:#071d35; }
  .portfolio-page .menu-links > a { border-color:#42617c; }
  .portfolio-page .menu-row { font-family:"Space Grotesk",sans-serif; letter-spacing:-.05em; }
  .portfolio-page .hero { grid-template-columns:minmax(0,1.12fr) minmax(310px,.88fr); gap:0 clamp(32px,5vw,80px); align-items:stretch; padding-top:0; }
  .portfolio-page .hero::before { background:linear-gradient(90deg,#a7d8ff0d 1px,transparent 1px),linear-gradient(#a7d8ff0d 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(90deg,#000,transparent 95%); }
  .portfolio-page .hero-copy { position:relative; display:flex; flex-direction:column; justify-content:center; max-width:none; padding:clamp(70px,9vw,140px) 0 clamp(60px,7vw,110px); }
  .portfolio-page .hero-identity { display:flex; align-items:center; gap:20px; }
  .portfolio-page .hero-name { font-size:clamp(1.7rem,2.7vw,2.6rem); line-height:1.05; }
  .portfolio-page .hero-name span { margin-top:11px; letter-spacing:.17em; }
  .portfolio-page .hero h1 { max-width:11ch; margin:clamp(32px,4vw,62px) 0 24px; font-size:clamp(3.3rem,5.3vw,6.3rem); line-height:.98; }
  .portfolio-page .hero-role { max-width:42ch; padding-left:18px; border-left:2px solid #62b7f3; color:#d8ebfa; }
  .portfolio-page .hero-intro { max-width:37ch; margin-top:20px; font-size:1.05rem; }
  .portfolio-page .hero-actions { display:flex; align-items:center; max-width:41rem; margin-top:28px; }
  .portfolio-page .hero-actions .button { min-height:54px; }
  .portfolio-page .hero-actions .hero-labs-jump { min-height:44px; }
  .portfolio-page .hero-profile { position:relative; min-height:0; height:auto; padding:0; margin:clamp(45px,5vw,78px) 0; border:1px solid #6c9dbd; background:#153f60; clip-path:polygon(0 0,88% 0,100% 9%,100% 100%,0 100%); }
  .portfolio-page .hero-profile::before { inset:14px; z-index:2; border:1px solid #d8efff80; clip-path:polygon(0 0,87% 0,100% 11%,100% 100%,0 100%); }
  .portfolio-page .hero-profile .portrait-frame, .portfolio-page .hero-profile img { width:100%; height:100%; min-height:560px; }
  .portfolio-page .hero-profile img { object-fit:cover; object-position:center top; }
  .portfolio-page .hero-profile figcaption { inset:auto 0 0; padding:55px 25px 22px; background:linear-gradient(transparent,#06182df2); }
  .portfolio-page .profile-cross { color:#0a3555; top:24px; }
  .portfolio-page .career-strip { margin:0; border-top:1px solid #315673; border-bottom:1px solid #315673; }
  .portfolio-page .career-strip a { min-height:104px; align-content:center; }
  .portfolio-page .work-section .section { padding-block:clamp(85px,9vw,140px); }
  .portfolio-page .work-section .section-heading { margin-bottom:clamp(36px,5vw,70px); }
  .portfolio-page .work-section .section-heading > div { grid-template-columns:minmax(0,1fr) minmax(240px,.55fr); }
  .portfolio-page .work-section .section-heading h2 { max-width:10ch; }
  .work-directory { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0 0 34px; border-block:1px solid #adc5d8; }
  .work-directory a { display:grid; grid-template-columns:1fr auto; gap:12px; min-width:0; min-height:120px; padding:20px; color:#123a5b; text-decoration:none; }
  .work-directory a:first-child { padding-left:0; }
  .work-directory a + a { border-left:1px solid #adc5d8; }
  .work-directory a > span { grid-column:1/-1; color:#246596; font:700 .68rem/1.4 monospace; letter-spacing:.1em; }
  .work-directory strong { font:600 clamp(1rem,1.3vw,1.25rem)/1.2 "Space Grotesk",sans-serif; }
  .work-directory b { color:#126daf; font-size:1.1rem; }
  .work-directory a:hover, .work-directory a:focus-visible { background:#dcecf8; }
  .portfolio-page .work-toolbar { margin-bottom:26px; }
  .portfolio-page .project-grid { gap:clamp(22px,3.5vw,52px); }
  .portfolio-page .project { border-radius:0; }
  .portfolio-page .project h3 { font-size:clamp(2.1rem,3.2vw,3.8rem); line-height:1; }
  .portfolio-page .project-featured { background:#e1eef9; border-color:#b1cde2; }
  .portfolio-page .project-featured > .project-preview img { aspect-ratio:1.05; }
  .portfolio-page .project-featured > .thesis-overview { align-self:center; }
  .portfolio-page .project-robotics { grid-template-columns:64px minmax(0,.82fr) minmax(0,1.18fr); padding:clamp(28px,4vw,58px); background:#0d3151; border-color:#456d8b; color:#eef8ff; }
  .portfolio-page .project-robotics h3, .portfolio-page .project-robotics .project-summary, .portfolio-page .project-robotics .project-footnote, .portfolio-page .project-robotics .project-kind, .portfolio-page .project-robotics .case-facts :is(dt,dd), .portfolio-page .project-robotics .robotics-story span, .portfolio-page .project-robotics .robotics-story strong { color:#e7f4fe; }
  .portfolio-page .project-robotics .case-facts, .portfolio-page .project-robotics .robotics-story { border-color:#5a809d; }
  .portfolio-page .project-robotics :is(.world-return,.text-link,.robotics-story summary) { color:#bfe4ff; }
  .portfolio-page .project-robotics .project-index { color:#99d7ff; }
  .portfolio-page .robotics-photo { align-self:stretch; }
  .portfolio-page .robotics-photo img { aspect-ratio:1.05; object-fit:cover; }
  .portfolio-page .project-production { background:#f9fbfd; border-color:#b8cfe0; }
  .portfolio-page .project-production .project-preview { padding:10px; background:#d8e7f3; border:1px solid #b5ccde; }
  .portfolio-page .project-compact { padding:30px 0; }
  .portfolio-page .project-compact h3 { font-size:clamp(1.8rem,2.5vw,2.8rem); }
  .portfolio-page #experience { padding-block:clamp(90px,9vw,140px); }
  .portfolio-page .experience-layout { gap:clamp(28px,4vw,64px); }
  .portfolio-page .company-block { position:relative; top:auto; align-self:start; padding:clamp(28px,3.5vw,48px); background:#0b4e82; }
  .portfolio-page .company-name { font:600 clamp(2.8rem,5vw,5rem)/.95 "Space Grotesk",sans-serif; letter-spacing:-.06em; }
  .portfolio-page .company-name span { font:600 .8rem/1.5 system-ui,sans-serif; letter-spacing:.08em; }
  .portfolio-page .timeline { border-top:1px solid #426784; }
  .portfolio-page .timeline-item { padding:28px 0 36px; border-color:#426784; }
  .portfolio-page .timeline-item h3 { max-width:25ch; font-family:"Space Grotesk",sans-serif; font-size:clamp(1.5rem,2.2vw,2.2rem); }
  .portfolio-page .timeline-item ul { max-width:68ch; }
  .delivery-feature { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); margin-top:clamp(50px,6vw,90px); border:1px solid #4d7898; background:#0e3150; }
  .delivery-feature-copy { align-self:center; padding:clamp(28px,4vw,58px); }
  .delivery-feature-copy h3 { margin:12px 0; color:#f4faff; font:600 clamp(2rem,3vw,3.4rem)/1.02 "Space Grotesk",sans-serif; letter-spacing:-.055em; }
  .delivery-feature-copy > p:not(.eyebrow) { max-width:48ch; color:#d0e3f2; line-height:1.6; }
  .delivery-feature-copy small { display:block; max-width:42ch; margin-top:18px; color:#b6d1e4; line-height:1.5; }
  .delivery-feature-link { display:inline-flex; align-items:center; gap:24px; min-height:48px; margin-top:18px; color:#eaf7ff; font-weight:700; text-decoration:underline; text-underline-offset:5px; }
  .window-diagram { position:relative; min-height:330px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; padding:clamp(24px,3vw,42px); background:#0a2743; }
  .window-diagram::before { content:""; position:absolute; inset:0; background-image:linear-gradient(#9ccdf50e 1px,transparent 1px),linear-gradient(90deg,#9ccdf50e 1px,transparent 1px); background-size:32px 32px; }
  .window-diagram > * { position:relative; }
  .window-diagram-top { display:flex; justify-content:space-between; gap:12px; color:#c3e2f7; font:700 .67rem/1.4 monospace; letter-spacing:.1em; }
  .window-diagram-flow { display:flex; align-items:center; justify-content:center; gap:clamp(6px,1vw,14px); }
  .window-diagram-flow div { display:grid; gap:8px; min-width:0; flex:1; max-width:145px; padding:16px 12px; border:1px solid #659ac0; background:#0b3556; color:#f3faff; }
  .window-diagram-flow :is(span,small) { color:#b5daf4; font:600 .65rem/1.3 monospace; }
  .window-diagram-flow strong { font-size:clamp(.7rem,1vw,1rem); }
  .window-diagram-flow i { width:clamp(10px,2vw,32px); height:1px; flex:none; background:#80caff; }
  .window-diagram-traces { display:flex; align-items:end; gap:5px; height:28px; opacity:.7; }
  .window-diagram-traces span { width:7px; height:40%; background:#82ceff; }
  .window-diagram-traces span:nth-child(3n) { height:100%; }.window-diagram-traces span:nth-child(4n) { height:65%; }
  .window-diagram-caption { color:#badcf2; font:600 .65rem/1.4 monospace; letter-spacing:.1em; }
  .delivery-beam { position:absolute !important; left:0; right:0; top:50%; width:100%; height:30px; pointer-events:none; }
  .delivery-beam-track { fill:none; stroke:#5889ad; stroke-width:1; }
  .delivery-beam-current { fill:none; stroke:#b8e8ff; stroke-width:2; stroke-dasharray:80 920; stroke-dashoffset:1000; }
  .portfolio-page .earlier-spotlight { margin-top:clamp(36px,5vw,70px); padding:clamp(24px,3.5vw,48px); }
  .portfolio-page .earlier-grid { gap:0; border-top:1px solid #4a6c86; }
  .portfolio-page .earlier-grid article { border:0; border-bottom:1px solid #4a6c86; border-radius:0; background:transparent; }
  .portfolio-page #skills { padding-block:clamp(80px,8vw,125px); }
  .portfolio-page .skill-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 40px; border:0; }
  .portfolio-page .skill-grid article { grid-template-columns:54px minmax(0,1fr); min-height:135px; padding:24px 0; border:0; border-top:1px solid #52708a; background:transparent; }
  .portfolio-page .skill-grid article h3 { font-family:"Space Grotesk",sans-serif; font-size:1.3rem; }
  .portfolio-page .support-tools { border-color:#52708a; }
  .experiment-drawer { width:100%; color:#e9f6ff; background:#0a2540; border-block:1px solid #3c6280; }
  .experiment-drawer > summary { width:min(1360px,calc(100% - 96px)); min-height:120px; margin:auto; padding:22px 0; display:flex; align-items:center; justify-content:space-between; gap:24px; cursor:pointer; list-style:none; }
  .experiment-drawer > summary::-webkit-details-marker { display:none; }
  .experiment-drawer > summary > span { display:grid; gap:5px; min-width:0; }
  .experiment-drawer > summary small { color:#9cd2f6; font:700 .68rem/1.4 monospace; letter-spacing:.1em; }
  .experiment-drawer > summary strong { color:#f2f9ff; font:600 clamp(1.35rem,2.3vw,2.3rem)/1.1 "Space Grotesk",sans-serif; letter-spacing:-.04em; }
  .experiment-drawer > summary em { color:#c7dfef; font-size:.87rem; font-style:normal; line-height:1.5; }
  .experiment-drawer > summary > b { display:grid; place-items:center; flex:none; width:44px; height:44px; border:1px solid #77afd4; border-radius:50%; color:#d7f0ff; font-size:1.5rem; font-weight:400; }
  .experiment-drawer[open] > summary > b { font-size:0; }
  .experiment-drawer[open] > summary > b::after { content:"−"; font-size:1.5rem; }
  .experiment-drawer > summary:hover { color:#fff; }
  .experiment-drawer > summary:focus-visible { outline:3px solid #bde8ff; outline-offset:4px; }
  .convolution-drawer { margin-top:38px; border:1px solid #3c6280; }
  .convolution-drawer > summary { width:calc(100% - 48px); }
  .convolution-drawer .convolution-lab { margin:0; border:0; }
  .portfolio-page .scene-section { padding-block:clamp(45px,6vw,90px); }
  .portfolio-page .about-section { background:#dceaf6; }
  .portfolio-page .about-grid { gap:clamp(40px,7vw,110px); }
  .portfolio-page .education-list article { padding:24px 0; border-bottom:1px solid #a5c0d4; }
  .portfolio-page section.contact { margin-block:clamp(48px,7vw,100px); border:0; background:#0a5b99; }
  .portfolio-page section.contact h2 { max-width:9ch; }
  .portfolio-page .footer { grid-template-columns:1fr 1.4fr 1fr auto; padding-block:50px 70px; }
  .portfolio-page .footer .wordmark { font-size:clamp(3rem,5vw,5rem); }
}
@media screen and (max-width:900px) {
  .portfolio-page .hero { grid-template-columns:minmax(0,1fr) minmax(250px,.8fr); }
  .portfolio-page .hero h1 { font-size:clamp(2.8rem,6.2vw,4.8rem); }
  .portfolio-page .hero-profile .portrait-frame, .portfolio-page .hero-profile img { min-height:440px; }
  .header-resume { display:none; }
  .work-directory { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .work-directory a:nth-child(3) { border-left:0; border-top:1px solid #adc5d8; }
  .work-directory a:nth-child(4) { border-top:1px solid #adc5d8; }
}
@media screen and (max-width:760px) {
  .portfolio-page .header-inner { min-height:66px; }
  .portfolio-page .hero { display:grid; grid-template-columns:1fr; gap:0; }
  .portfolio-page .hero-copy { display:contents; }
  .portfolio-page .hero-identity { grid-column:1; grid-row:1; padding-top:32px; }
  .portfolio-page .hero-name { font-size:1.75rem; }
  .portfolio-page .hero h1, .portfolio-page:lang(de) .hero h1 { grid-column:1; grid-row:2; max-width:12ch; margin:32px 0 18px; font-size:clamp(2.8rem,10vw,4.5rem); }
  .portfolio-page .hero-role { grid-column:1; grid-row:3; }
  .portfolio-page .hero-profile { grid-column:1; grid-row:4; width:100%; height:clamp(260px,78vw,390px); min-height:0; margin:28px 0 0; }
  .portfolio-page .hero-profile .portrait-frame, .portfolio-page .hero-profile img { height:100%; min-height:0; }
  .portfolio-page .hero-profile figcaption { inset:auto 0 0; padding:44px 18px 16px; }
  .portfolio-page .hero-intro { grid-column:1; grid-row:5; margin-top:24px; }
  .portfolio-page .hero-actions { grid-column:1; grid-row:6; gap:6px 14px; margin:20px 0 0; }
  .portfolio-page .career-strip { grid-column:1; grid-row:7; margin-top:36px; }
  .portfolio-page .career-strip a { min-height:76px; }
  .portfolio-page .work-section .section { padding-block:75px; }
  .portfolio-page .work-section .section-heading > div { grid-template-columns:1fr; gap:16px; }
  .work-directory { margin-bottom:24px; }
  .work-directory a { min-height:104px; padding:16px 12px; }
  .work-directory a:first-child, .work-directory a:nth-child(3) { padding-left:0; }
  .work-directory strong { font-size:1rem; }
  .portfolio-page .project-robotics { grid-template-columns:1fr; gap:20px; padding:24px; }
  .portfolio-page .project-robotics > * { grid-column:1; }
  .portfolio-page .project-robotics .robotics-photo { grid-column:1; }
  .portfolio-page .project-featured { gap:20px; }
  .portfolio-page .experience-layout { gap:28px; }
  .delivery-feature { grid-template-columns:1fr; }
  .window-diagram { min-height:250px; }
  .window-diagram-flow div { padding:12px 8px; }
  .portfolio-page .skill-grid { grid-template-columns:1fr; }
  .portfolio-page .skill-grid article { grid-template-columns:42px minmax(0,1fr); min-height:0; gap:8px 12px; }
  .portfolio-page .skill-grid article .skill-number { grid-row:1/3; }
  .portfolio-page .skill-grid article p { grid-column:2; }
  .experiment-drawer > summary { width:calc(100% - 40px); min-height:100px; }
  .convolution-drawer > summary { width:calc(100% - 32px); }
  .portfolio-page .footer { grid-template-columns:1fr 1fr; gap:18px; }
}
@media (prefers-reduced-motion:no-preference) {
  html:not([data-motion="off"]) .delivery-feature[data-visible="true"] .delivery-beam-current { animation:delivery-signal-beam 5s linear infinite; }
}
@keyframes delivery-signal-beam { to { stroke-dashoffset:0; } }
@media (prefers-reduced-motion:no-preference) and (hover:hover) {
  html:not([data-motion="off"]) .work-directory a, html:not([data-motion="off"]) .delivery-feature-link { transition:background-color .2s ease,color .2s ease; }
  html:not([data-motion="off"]) .project-preview img, html:not([data-motion="off"]) .robotics-photo img { transition:transform .6s ease; }
  html:not([data-motion="off"]) .project:hover :is(.project-preview img,.robotics-photo img) { transform:scale(1.025); }
}

/* Connected editorial layouts for the résumé, thesis and archive. */
@media screen {
  .resume-page .resume-toolbar nav { min-height:78px; }
  .resume-page .resume-hero { grid-template-columns:minmax(0,1.4fr) minmax(220px,.6fr); gap:clamp(35px,7vw,100px); align-items:end; margin-top:0; padding:clamp(40px,6vw,90px); background:#0b3152; border:0; color:#f2f9ff; }
  .resume-page .resume-hero .eyebrow { color:#addbfa; }
  .resume-page .resume-name { max-width:9ch; margin-block:22px; color:#fff; font-size:clamp(3.5rem,6.2vw,6rem); line-height:.98; }
  .resume-page .resume-name > span { color:#77c9ff; }
  .resume-page .resume-hero :is(.subtitle,.location,.contact a) { color:#d4e9f7; }
  .resume-page .resume-portrait { padding:10px; background:#a9c9e1; border:1px solid #91bad6; }
  .resume-page .resume-layout { gap:clamp(35px,6vw,95px); padding-block:clamp(50px,6vw,90px); }
  .resume-page .resume-sidebar { padding-right:20px; border-right:1px solid #bfd1df; }
  .resume-page .resume-index a { border-radius:0; }
  .resume-page .resume-summary { max-width:64ch; font-size:clamp(1.15rem,1.4vw,1.45rem); }
  .resume-page .resume-section { padding-block:46px; border-color:#b8cede; }
  .resume-page .resume-section-heading { gap:24px; align-items:baseline; }
  .resume-page .resume-section-heading > span { color:#146ea9; }
  .resume-page .resume-section-heading h2 { font-size:clamp(2.2rem,3.5vw,3.5rem); }
  .resume-page .resume-entry { padding-left:28px; border-color:#8fb6d2; }
  .resume-page .resume-entry::before { background:#1a79b7; }
  .resume-page #work .resume-entry { border-radius:0; background:#e5f0f9; }
  .resume-page .resume-skill-group { display:grid; grid-template-columns:minmax(150px,.65fr) minmax(0,1.35fr); gap:20px; }
  .resume-page .resume-skill-group strong { margin:0; font-weight:700; }
  .case-page .case-intro { margin-top:0; padding:clamp(38px,5vw,76px); background:#0b3152; color:#eff8ff; }
  .case-page .case-intro h1 { max-width:11ch; color:#fff; }
  .case-page .case-intro .eyebrow { color:#b6e2ff; }
  .case-page .case-lead { color:#d1e7f5; }
  .case-page .case-intro .case-facts, .case-page .case-intro .case-facts > div { border-color:#6486a0; }
  .case-page .case-intro .case-facts :is(dt,dd) { color:#d8eefc; }
  .case-page .case-actions .button-primary { background:#d8efff; color:#0c3150; }
  .case-page .case-actions .text-link { color:#d8efff; border-color:#91c9ed; }
  .case-page .case-cover { position:relative; margin:0; }
  .case-page .case-cover img { height:clamp(260px,38vw,540px); border-radius:0; }
  .case-page .case-cover figcaption { padding:10px 0; color:#4b6478; }
  .case-page .case-body { grid-template-columns:minmax(160px,.28fr) minmax(0,1fr); gap:clamp(40px,6vw,95px); padding-block:clamp(60px,7vw,110px); }
  .case-page .case-index a { min-height:48px; display:flex; gap:10px; align-items:center; }
  .case-page .case-section { padding-bottom:clamp(45px,6vw,85px); }
  .case-page .case-section + .case-section { padding-top:clamp(45px,6vw,85px); }
  .case-page .case-section h2 { font-size:clamp(2.4rem,4vw,4rem); }
  .case-page .case-architecture { border-radius:0; background:#e1eef8; }
  .case-page .architecture-device { border-radius:0; background:#fff; }
  .case-page .case-deliverables li { grid-template-columns:55px minmax(0,1fr); gap:24px; border-color:#bdcfdd; }
  .case-page .case-boundary { background:#dcebf7; border-color:#166aa6; }
  .recognition-page { background:#071c31; color:#f2f8fd; }
  .recognition-page .recognition-skip { position:fixed; z-index:30; top:10px; left:16px; padding:12px 18px; color:#0c2c46; background:#e2f3ff; transform:translateY(-160%); }
  .recognition-page .recognition-skip:focus { transform:none; }
  .recognition-page .top { min-height:82px; padding-block:14px; border-color:#486983; }
  .recognition-page .brand { font-family:"Space Grotesk",sans-serif; font-size:2.2rem; letter-spacing:-.08em; }
  .recognition-page .top nav a { display:inline-flex; align-items:center; min-height:44px; color:#d1e7f7; }
  .recognition-page .hero { grid-template-columns:minmax(0,1.25fr) minmax(220px,.55fr); gap:clamp(30px,6vw,90px); padding:clamp(75px,9vw,135px) 0 55px; }
  .recognition-page .hero h1 { max-width:9ch; font-size:clamp(3.5rem,8vw,8rem); }
  .recognition-page .hero-stat { padding:24px; border:1px solid #6b96b5; background:#0e385b; }
  .recognition-page .hero-stat strong { color:#bce5ff; }
  .recognition-page .lead { position:relative; margin:0; }
  .recognition-page .lead img { aspect-ratio:2/1; object-fit:cover; }
  .recognition-page .caption { color:#c3dbea; line-height:1.5; }
  .recognition-page .section { padding-block:clamp(75px,8vw,120px); border-color:#42627a; }
  .recognition-page .section-heading { gap:clamp(30px,6vw,80px); }
  .recognition-page .section h2 { max-width:14ch; font-size:clamp(2.5rem,5vw,5rem); }
  .recognition-page .gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(14px,2vw,24px); }
  .recognition-page #photos .gallery figure:first-child { grid-column:span 2; }
  .recognition-page #photos .gallery figure:first-child img { aspect-ratio:16/9; }
  .recognition-page .gallery img { aspect-ratio:4/3; object-fit:cover; }
  .recognition-page .gallery .portrait img { object-position:center 30%; }
  .recognition-page .evidence { gap:18px; }
  .recognition-page .card { display:flex; flex-direction:column; background:#103858; border:1px solid #527b98; }
  .recognition-page .card img { height:clamp(200px,22vw,300px); margin-top:auto; }
  .recognition-page .card a { min-height:44px; }
  .recognition-page .document-list a { min-height:72px; border-color:#42627a; }
  .recognition-page .document-list a:hover { background:#123a5b; }
}
@media screen and (max-width:900px) {
  .case-page .case-body { grid-template-columns:1fr; }
  .resume-page .resume-hero { grid-template-columns:minmax(0,1fr) 180px; gap:28px; }
}
@media screen and (max-width:760px) {
  .resume-page .resume-hero { grid-template-columns:1fr; padding:28px 24px; }
  .resume-page .resume-portrait { grid-row:1; width:140px; }
  .resume-page .resume-name { font-size:clamp(2.8rem,10vw,4.2rem); }
  .resume-page .resume-sidebar { border:0; padding:0; }
  .resume-page .resume-section { padding-block:32px; }
  .resume-page .resume-skill-group { grid-template-columns:1fr; gap:5px; }
  .case-page .case-intro { padding:32px 24px; }
  .case-page .case-intro h1 { font-size:clamp(2.8rem,10vw,4rem); }
  .case-page .case-cover img { height:230px; }
  .case-page .case-body { padding-block:38px; }
  .case-page .case-deliverables li { grid-template-columns:32px minmax(0,1fr); gap:14px; }
  .recognition-page .top { align-items:center; gap:16px; }
  .recognition-page .top nav { justify-content:flex-end; gap:6px 14px; }
  .recognition-page .hero { grid-template-columns:1fr; gap:32px; padding:60px 0 35px; }
  .recognition-page .hero h1 { font-size:clamp(3.5rem,12vw,5rem); }
  .recognition-page .lead img { aspect-ratio:4/3; }
  .recognition-page .gallery { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .recognition-page #photos .gallery figure:first-child { grid-column:1/-1; }
  .recognition-page .evidence { grid-template-columns:1fr; }
}
@media screen and (max-width:420px) {
  .recognition-page .top { align-items:flex-start; }
  .recognition-page .top nav { max-width:250px; }
  .recognition-page .gallery { grid-template-columns:1fr; }
  .recognition-page #photos .gallery figure:first-child { grid-column:1; }
}
@media screen and (max-width:1100px) {
  .portfolio-page .header-resume { display:none; }
}
@media screen {
  .portfolio-page .footer-signature { grid-column:1/-1; display:flex; align-items:end; justify-content:space-between; gap:24px; padding:0 0 clamp(35px,5vw,65px); border-bottom:1px solid #426681; }
  .portfolio-page .footer-signature span { color:#f2f9ff; font:600 clamp(2.6rem,6vw,6rem)/.95 "Space Grotesk",sans-serif; letter-spacing:-.065em; }
  .portfolio-page .footer-signature p { max-width:18ch; color:#bcd8ec; font-size:1rem; text-align:right; }
}
@media screen and (max-width:760px) {
  .portfolio-page .footer-signature { display:block; }
  .portfolio-page .footer-signature p { margin-top:16px; text-align:left; }
  .portfolio-page .footer-nav { grid-row:auto; }
}
@media screen {
  .portfolio-page .robotics-photo { overflow:hidden; }
}
@media screen and (max-width:960px) {
  .portfolio-page .mobile-nav { display:block; position:relative; }
  .portfolio-page .mobile-nav summary { min-height:44px; padding:8px 12px; cursor:pointer; border:1px solid #7596af; border-radius:30px; color:#e8f4ff; }
  .portfolio-page .mobile-nav nav { position:absolute; z-index:10; top:54px; right:0; width:220px; display:flex; flex-direction:column; padding:10px; background:#0c2c48; border:1px solid #6184a0; border-radius:12px; }
  .portfolio-page .mobile-nav nav a { min-height:44px; padding:10px 12px; color:#e6f4ff; }
}

/* Lead with the work: a clear route from the role to the project evidence. */
@media screen {
  .portfolio-page .work-section .delivery-feature { margin-top:0; }
  .portfolio-page .delivery-feature .eyebrow { color:#a8d8f8; }
  .delivery-feature-actions { display:flex; flex-wrap:wrap; gap:0 26px; }
  .delivery-feature-actions .delivery-feature-link { gap:10px; }
  .delivery-feature-link:hover { color:#96d5ff; }
  .more-work-heading { display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin:clamp(50px,6vw,90px) 0 20px; border-top:1px solid #a8c3d7; padding-top:22px; }
  .portfolio-page .more-work-heading .eyebrow { margin:0; color:#175d99; }
  .more-work-heading > p:last-child { margin:0; color:#365a72; }
  .portfolio-page .project-featured > .project-preview { position:relative; overflow:hidden; }
  .firmware-path { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:18px 20px; background:#082a47eF; color:#e5f5ff; font:700 .7rem/1.2 monospace; letter-spacing:.08em; text-transform:uppercase; }
  .firmware-path span { display:flex; align-items:center; gap:8px; }
  .firmware-path span:not(:last-child)::after { content:'→'; color:#80caff; }
  .portfolio-page .project-featured .project-preview figcaption { position:relative; }
  .portfolio-page .robotics-photo { position:relative; padding:10px; border:1px solid #6594b4; background:#0a2743; }
  .portfolio-page .robotics-photo img { clip-path:polygon(0 0,88% 0,100% 12%,100% 100%,0 100%); }
  .portfolio-page .robotics-photo figcaption { padding:18px 8px 8px; }
  /* The base résumé stylesheet uses multiply; on a navy surface it obscures the portrait. */
  .resume-page .resume-portrait { mix-blend-mode:normal; isolation:isolate; background:#e6eef5; }
}
@media screen and (max-width:760px) {
  .more-work-heading { display:block; }
  .more-work-heading > p:last-child { margin-top:8px; }
  .portfolio-page .work-section .delivery-feature { margin-top:0; }
  .window-diagram { min-height:240px; }
  .window-diagram-flow div { padding:12px 7px; }
  .firmware-path { padding:14px 12px; font-size:.62rem; }
}
