:root{--paper:#fdfcf9;--navy:#061329;--blue:#056cc4;--ink:#40516b;--line:#cbd1d6;--photo:#e8e8e1;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--navy);font:16px/1.65 Inter,Arial,sans-serif}h1,h2,h3,p,figure,dl,dd{margin:0}h1,h2,h3{font-family:Manrope,Arial,sans-serif;letter-spacing:-.055em;line-height:1.1}a{color:inherit;text-underline-offset:6px}button{font:inherit}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid #056cc4;outline-offset:5px}img{display:block}.wrap{width:min(1280px,90%);margin-inline:auto}.skip{position:absolute;left:20px;top:-100px;background:var(--paper);padding:12px;z-index:2}.skip:focus{top:12px}.comparison{padding:10px 5%;background:#e9eef2;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:11px;line-height:1.4}.comparison div{display:flex;gap:24px}.comparison a{min-height:30px;display:flex;align-items:center;text-decoration:none}.comparison [aria-current]{font-weight:600;text-decoration:underline}.site-header{min-height:100px;display:flex;justify-content:space-between;align-items:center;gap:24px}.site-header img{object-fit:contain}.site-header nav{display:flex;gap:32px;font-size:13px;font-weight:500}.site-header nav a{min-height:44px;display:flex;align-items:center;text-decoration:none}.site-header nav a:hover,.site-header nav a[aria-current]{text-decoration:underline}.hero{display:grid;grid-template-columns:.84fr 1.16fr;min-height:585px;max-width:1600px;margin-inline:auto}.hero-copy{padding:25px 7% 48px 11.9%}.back{font-size:12px;display:inline-flex;align-items:center;min-height:44px;text-decoration:none;margin-bottom:30px}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:600;line-height:1.5;margin-bottom:24px}h1{font-size:clamp(52px,5.8vw,84px);font-weight:800}.hero-deck{font-size:22px;line-height:1.45;letter-spacing:-.025em;margin-top:24px}.text-link{font-size:13px;font-weight:600;display:inline-flex;align-items:center;justify-content:space-between;gap:44px;min-height:48px;text-decoration:none;border-bottom:1px solid currentColor}.text-link span{font-size:24px}.hero .text-link{margin-top:28px}.hero-photo{background:var(--blue) url('../work/assets/paper-blue-web.webp') center/cover;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;min-width:0}.hero-photo:before,.contact:before{content:'';position:absolute;inset:0;background:rgba(0,83,183,.78);pointer-events:none}.hero-photo img{position:relative;width:98%;height:auto;margin-block:-12%;filter:drop-shadow(0 18px 12px rgba(0,28,64,.2))}.hero-photo figcaption{position:absolute;bottom:26px;left:32px;font-size:11px;color:var(--paper)}h2{font-size:clamp(34px,3.9vw,54px);font-weight:600}.intro{padding-block:100px 112px;display:grid;grid-template-columns:.43fr 1fr;gap:8%}.intro>div{display:grid;grid-template-columns:1.1fr 1fr;gap:12%;align-items:end}.intro>div>p{color:var(--ink);font-size:17px;max-width:350px}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:40px}.section-heading h2{width:53%}.explorer{padding-bottom:112px}.explorer-grid{display:grid;grid-template-columns:1.18fr 1fr;gap:7%;align-items:start}.detail-figure figcaption{font-size:11px;color:var(--ink);margin-top:16px}.tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:42px}.tabs button{font-size:12px;font-weight:500;padding:0 0 15px;border:0;border-bottom:2px solid transparent;background:none;color:var(--ink);cursor:pointer;min-height:48px}.tabs button[aria-selected=true]{color:var(--blue);border-bottom-color:var(--blue)}.tabs button:hover{color:var(--blue)}.detail-kicker{font-size:10px;letter-spacing:1.2px;color:var(--blue);margin-bottom:16px;font-weight:600}.panel h3{font-size:clamp(28px,3vw,41px);margin-bottom:24px}.panel>p:not(.detail-kicker){color:var(--ink);font-size:15px;max-width:390px;margin-bottom:17px}.panel dl{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:35px;padding-top:22px;border-top:1px solid var(--line)}dt{font-size:11px;color:var(--ink);margin-bottom:7px}.panel dd{font-size:14px;font-weight:600}.panel .view-note{font-size:11px!important;margin-top:22px}.panel:not(:last-child){margin-bottom:50px}.enhanced .panel{margin-bottom:0}.panel[hidden]{display:none}.system{padding-block:62px 82px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:12%}.system>div>p:last-child{max-width:380px;color:var(--ink);margin-top:25px}.system-specs{padding-top:12px;display:grid;gap:29px}.system-specs dd{font:500 35px/1.15 Manrope,Arial,sans-serif;letter-spacing:-.04em}.system-specs>div{padding-left:24px;border-left:2px solid var(--blue)}.contribution{display:grid;grid-template-columns:.43fr 1fr;gap:8%;padding-block:40px 106px}.contribution h2{max-width:620px}.contribution p:not(.eyebrow){max-width:540px;color:var(--ink);margin-top:26px}.contribution ul{padding:0;margin:30px 0 0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 26px;font-size:13px}.contribution li:before{content:'+';margin-right:12px;color:var(--blue)}.contact{position:relative;background:var(--blue) url('../work/assets/paper-blue-web.webp') center/cover;color:var(--paper);padding-block:62px 70px}.contact>.wrap{position:relative}.contact h2{font-size:clamp(46px,5.5vw,76px)}.contact .text-link{margin-top:24px;min-width:190px}.contact a:focus-visible{outline-color:var(--paper)}footer{display:flex;justify-content:space-between;align-items:center;gap:28px;min-height:115px;font-size:11px;color:var(--ink)}footer img{object-fit:contain}footer a{min-height:44px;display:flex;align-items:center}.tabs{display:none}.enhanced .tabs{display:flex}@media(prefers-reduced-motion:no-preference){.enhanced .panel:not([hidden]){animation:enter .25s ease-out}.text-link span{transition:transform .2s}.text-link:hover span{transform:translate(3px,-3px)}@keyframes enter{from{opacity:.3;transform:translateY(5px)}to{opacity:1;transform:none}}}@media(min-width:1600px){.hero-copy{padding-left:80px}}@media(max-width:1023px){.hero{grid-template-columns:1fr 1fr;min-height:530px}.hero-copy{padding-left:10%;padding-right:7%}.hero-photo img{width:110%;margin-left:-5%}.intro{grid-template-columns:1fr;gap:15px;padding-block:70px}.intro>div{gap:8%}.section-heading h2{width:58%}.explorer-grid{gap:5%;grid-template-columns:1fr 1fr}.tabs{gap:12px}.tabs button{font-size:11px}.panel dl{gap:12px}}@media(max-width:767px){.wrap{width:calc(100% - 40px)}.comparison{padding:8px 20px;display:block;font-size:10px}.comparison div{gap:18px;flex-wrap:wrap}.site-header{min-height:84px;gap:15px}.site-header img{width:110px;height:34px}.site-header nav{gap:16px;font-size:11px}.site-header nav a:first-child{display:none}.hero{grid-template-columns:1fr}.hero-copy{padding:0 20px 36px}.back{margin-bottom:20px}.hero .eyebrow{margin-bottom:18px}h1{font-size:clamp(48px,12vw,76px)}.hero-deck{font-size:20px;margin-top:18px}.hero .text-link{margin-top:22px}.hero-photo{min-height:310px}.hero-photo img{width:100%;margin:-18% 0}.hero-photo figcaption{bottom:17px;left:20px;font-size:10px}.intro{padding-block:60px 64px}.intro>div{grid-template-columns:1fr;gap:24px}.intro>div>p{font-size:16px;max-width:430px}.section-heading{display:block;padding-bottom:30px}.section-heading h2{width:auto}.explorer-grid{grid-template-columns:1fr;gap:28px}.detail-figure figcaption{font-size:10px;margin-top:12px}.tabs{gap:22px;margin-bottom:28px}.tabs button{font-size:11px;flex:1}.panel h3{font-size:34px}.panel>p:not(.detail-kicker){max-width:100%}.panel dl{margin-top:24px}.explorer{padding-bottom:65px}.system{padding-block:45px 60px;grid-template-columns:1fr;gap:32px}.system-specs{grid-template-columns:1fr;gap:25px}.system-specs dd{font-size:30px}.contribution{grid-template-columns:1fr;gap:2px;padding-block:12px 60px}.contribution h2{font-size:34px}.contribution ul{grid-template-columns:1fr}.contact{padding-block:45px 52px}footer{padding-block:26px;align-items:flex-start;gap:15px;flex-wrap:wrap}footer p{width:100%;order:2}footer>a:last-child{margin-left:auto}}@media(max-width:359px){.site-header nav{gap:10px;font-size:10px}.site-header img{width:99px}.comparison div{gap:12px}.comparison{font-size:9px}.hero-photo{min-height:255px}.tabs{gap:10px}.tabs button{font-size:10px}.panel h3{font-size:30px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Focused visual QA revision: wider optical window; two-column narrative. */
.intro{display:block}.intro>div{grid-template-columns:1.1fr 1fr;gap:12%;align-items:center}.intro>div>p{max-width:470px}.contribution{display:block}.contribution>div{max-width:900px;margin-left:auto}
@media(max-width:767px){.intro>div{grid-template-columns:1fr;gap:24px}.contribution>div{margin-left:0}}
/* Preserve the entire product silhouette at every viewport width. */
.hero{grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr)}.hero-copy{min-width:0}.hero-photo{align-items:center}.hero-photo img{width:90%;max-width:100%;height:auto;flex:none;object-fit:contain;margin:-8% auto}.tabs button{min-width:0}.site-header nav{flex-shrink:0}
@media(min-width:768px) and (max-width:1023px){.hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:767px){.hero{grid-template-columns:minmax(0,1fr)}.hero-photo img{width:90%;margin:-8% auto}}
/* Interactive portrait board with upright annotation typography. */
.sketch-section{padding:15px 0 95px;max-width:1280px}.component-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:6%;align-items:center}.sketch-figure{margin:0;min-width:0}.sketch-stage{max-width:565px;margin-inline:auto;background:#f4f2e9}.board-canvas{display:block;width:100%;max-height:720px;aspect-ratio:1240/1536}.sketch-figure figcaption{font-size:10px;color:var(--ink);margin-top:12px}.part-callout{display:none;fill:none;stroke:var(--blue);stroke-linecap:round;stroke-linejoin:round}.sketch-stage[data-step="0"] .cameras,.sketch-stage[data-step="1"] .bridge,.sketch-stage[data-step="2"] .compute{display:block}.part-focus{fill:rgba(5,108,196,.065);stroke-width:3}.leader-halo{stroke:var(--paper);stroke-width:13;opacity:.9}.leader{stroke-width:4;stroke-dasharray:1;stroke-dashoffset:0}#part-arrow path{fill:none;stroke:var(--blue);stroke-width:1.8}.callout-label{stroke:none}.callout-label rect{fill:none}.callout-label text{fill:var(--blue);font:600 30px Inter,Arial,sans-serif;letter-spacing:-.4px}.component-copy{min-width:0;padding-right:12px}.component-copy h2{font-size:clamp(36px,3.7vw,52px)}.component-intro{margin-top:22px;max-width:420px;color:var(--ink);font-size:15px}.step-tabs{display:none;gap:22px;border-bottom:1px solid var(--line);margin-top:30px}.sketch-ready .step-tabs{display:flex}.step-tabs button{border:0;border-bottom:2px solid transparent;background:none;color:var(--ink);font:500 12px Inter,Arial,sans-serif;padding:14px 0;min-height:48px;cursor:pointer;white-space:nowrap}.step-tabs button[aria-selected=true]{color:var(--blue);border-bottom-color:var(--blue)}.step-tabs button:hover{color:var(--blue)}.sketch-description{padding-top:27px;min-height:295px}.part-number{font-size:10px;letter-spacing:1.2px;color:var(--blue);margin-bottom:15px}.sketch-description h3{font-size:34px;margin-bottom:18px}.sketch-description article>p:last-of-type{font-size:15px;color:var(--ink);max-width:420px;min-height:75px}.sketch-description dl{display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid var(--line);padding-top:18px;margin-top:20px}.sketch-description dd{font-size:13px;font-weight:500}.sketch-description article[hidden]{display:none}.sketch-section:not(.sketch-ready) article{margin-bottom:30px}
@media(prefers-reduced-motion:no-preference){.sketch-stage.selection-enter .leader{animation:leader-in .65s cubic-bezier(.25,.6,.25,1) both}.sketch-stage.selection-enter .leader-halo{animation:focus-in .35s ease both}.sketch-stage.selection-enter .part-focus{animation:focus-in .4s ease both}.sketch-stage.selection-enter .callout-label{animation:label-in .35s ease .62s both}.sketch-description article:not([hidden]){animation:copy-in .3s ease both}@keyframes leader-in{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes label-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes focus-in{from{opacity:0}to{opacity:1}}@keyframes copy-in{from{opacity:.3;transform:translateY(5px)}to{opacity:1;transform:none}}}
@media(min-width:900px) and (max-height:850px){.board-canvas{max-height:610px}.component-copy h2{font-size:40px}.component-copy .eyebrow{margin-bottom:17px}.component-intro{margin-top:16px}.step-tabs{margin-top:23px}.sketch-description{padding-top:22px}}
@media(max-width:1023px){.component-layout{gap:4%;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.component-copy h2{font-size:35px}.step-tabs{gap:12px}.step-tabs button{font-size:10px}.sketch-description h3{font-size:29px}.sketch-description article>p:last-of-type{font-size:14px}}
@media(max-width:700px){.component-layout{grid-template-columns:1fr;gap:25px}.sketch-stage{max-width:340px}.board-canvas{max-height:420px}.component-copy{padding:0}.component-copy h2{font-size:34px}.component-copy .eyebrow{margin-bottom:14px}.component-intro{margin-top:16px;font-size:14px}.step-tabs{gap:20px;justify-content:space-between;margin-top:20px}.step-tabs button{font-size:11px}.sketch-description{min-height:280px;padding-top:22px}.sketch-description h3{font-size:30px}.sketch-description article>p:last-of-type{min-height:65px}.sketch-section{padding-bottom:50px}}
/* Keep the selected board and its explanation within a compact phone view. */
@media(max-width:700px){.sketch-stage{max-width:260px}.board-canvas{max-height:325px}.component-layout{gap:18px}.component-copy .eyebrow,.component-intro{display:none}.component-copy h2{font-size:27px}.step-tabs{margin-top:12px}.sketch-description{padding-top:16px;min-height:235px}.sketch-description h3{font-size:25px;margin-bottom:12px}.part-number{margin-bottom:10px}.sketch-description article>p:last-of-type{min-height:0;font-size:13px}.sketch-description dl{padding-top:12px;margin-top:14px}.sketch-description dd{font-size:12px}}
/* Shared page edges and balanced hardware scale. */
:root{--page-width:1360px;--page-gutter:5%}
.wrap,.hero{width:min(var(--page-width),calc(100% - 2 * var(--page-gutter)));max-width:var(--page-width);margin-inline:auto}
.hero{grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);min-height:560px}
.hero-copy{padding:25px 9% 48px 0}
.sketch-section{max-width:var(--page-width)}
.component-layout{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:6%}
.sketch-stage{max-width:620px;margin-inline:0}
.board-canvas{max-height:none;height:auto}
.component-copy{padding-right:0}
@media(min-width:1024px){.sketch-stage{max-width:min(620px,calc((100svh - 110px) * .80729))}}
@media(min-width:701px) and (max-width:1023px){.component-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4%}.hero{min-height:500px}}
@media(max-width:767px){:root{--page-gutter:20px}.hero{grid-template-columns:minmax(0,1fr);min-height:0}.hero-copy{padding:0 0 36px}.hero-photo{min-height:300px}}
@media(max-width:700px){.component-layout{grid-template-columns:1fr;gap:18px}.sketch-stage{max-width:280px;margin-inline:auto}.board-canvas{max-height:none}}
