.illustration-sections { padding:56px 0; }
.engineering-feature-list { display:grid; gap:44px; }
.illustration-split { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px; align-items:center; }
.illustration-split+.illustration-split { padding-top:44px; border-top:1px solid var(--line); }
.illustration-copy { min-width:0; padding-top:0; }
.illustration-copy h2 { margin-top:18px; max-width:490px; color:var(--navy); font-size:clamp(32px,3.4vw,46px); line-height:1.15; font-weight:550; }
.illustration-copy>p { max-width:480px; margin:20px 0 0; color:var(--muted); font-size:18px; line-height:1.7; }
.illustration-copy ul { display:grid; gap:10px; margin:20px 0 0; padding:0; max-width:480px; list-style:none; }
.illustration-copy li { position:relative; padding-left:22px; color:var(--ink); font-size:16px; line-height:1.6; }
.illustration-copy li::before { content:''; position:absolute; left:0; top:.7em; width:9px; height:2px; background:var(--blue); }
.illustration-visual { min-width:0; container-type:inline-size; container-name:engineering-preview; }
.illustration-visual .engineering-figure { width:100%; max-width:100%; margin:0; }
.illustration-visual .diagram-desktop { display:none; }
.illustration-visual .diagram-mobile { display:block; }
.illustration-visual .diagram-mobile svg { max-width:440px; }
.illustration-visual .context-animation-controls { grid-template-columns:1fr auto; gap:14px 18px; padding:18px; }
.illustration-visual .context-animation-controls p { grid-column:1/-1; grid-row:2; }
.illustration-visual .product-window-bar { flex-wrap:wrap; gap:10px 16px; padding:12px 16px; }
.illustration-visual .product-view-name { padding-left:14px; }
.illustration-visual .product-workspace-bar { padding:12px 16px; }
.illustration-visual .product-record-count { display:none; }
.illustration-visual .product-content-heading { flex-direction:column; gap:12px; padding:20px 16px; }
.illustration-visual .product-content-heading h4 { font-size:22px; }
.illustration-visual .impact-workspace { grid-template-columns:1fr; }
.illustration-visual .impact-canvas { padding:18px 14px; }
.illustration-visual .impact-canvas-key { flex-wrap:wrap; gap:8px 14px; margin-bottom:20px; }
.illustration-visual .impact-nodes { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px 14px; grid-template-rows:repeat(2,minmax(110px,auto)); }
.illustration-visual .impact-node[data-node] { grid-area:auto; min-height:110px; padding:10px 8px; }
.illustration-visual .impact-node-state { margin-top:6px; }
.illustration-visual .impact-inspector { padding:20px 16px; border-left:0; border-top:1px solid var(--line); }
.illustration-visual .impact-detail-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.illustration-visual .impact-detail-heading h5 { margin:4px 0 0; font-size:18px; }
.illustration-visual .impact-inspector>p { margin:12px 0; line-height:1.55; }
.illustration-visual .impact-detail-bottom { display:grid; grid-template-columns:1.2fr 1fr; gap:16px; align-items:start; }
.illustration-visual .impact-detail-bottom .product-next-action { margin:0; padding:12px; }
.illustration-visual .impact-detail-source { padding:8px 0; }
.illustration-visual .product-next-action { margin:14px 0; }
.illustration-visual .product-window-footer { flex-direction:column; gap:5px; padding:12px 16px; }
.illustration-visual .trace-summary { margin:0 16px 14px; grid-template-columns:repeat(4,minmax(0,1fr)); }
.illustration-visual .trace-summary>div { padding:10px; }
.illustration-visual .trace-summary>div:nth-child(3),.illustration-visual .trace-summary>div:nth-child(4) { border-top:0; border-left:1px solid var(--line); }
.illustration-visual .trace-toolbar { padding:0 16px 16px; gap:12px; }
.illustration-visual .trace-search { flex-basis:100%; max-width:none; min-width:0; }
.illustration-visual .trace-result-count { margin-left:0; }
.illustration-visual .trace-table { min-width:440px; table-layout:fixed; }
.illustration-visual .trace-table th,.illustration-visual .trace-table td { padding:9px 6px; }
.illustration-visual .trace-table th:first-child { width:27%; padding-left:12px; }
.illustration-visual .trace-table th:last-child { width:19%; }
.illustration-visual .trace-table tbody th { width:27%; }
.illustration-visual .trace-record { white-space:normal; overflow-wrap:anywhere; }
.illustration-visual .trace-status { white-space:normal; padding:4px 6px; }
.illustration-visual .trace-select span { font-size:14px; }
.illustration-visual .trace-scroll-hint { display:none; }
.illustration-visual .trace-detail { grid-template-columns:1fr; gap:12px; padding:20px 16px; }
@container engineering-preview (max-width:400px) {
  .illustration-visual .impact-detail-bottom { grid-template-columns:1fr; gap:8px; }
  .illustration-visual .impact-nodes { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 20px; }
  .illustration-visual .impact-node[data-node] { min-height:110px; }
  .illustration-visual .trace-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .illustration-visual .trace-summary>div:nth-child(3) { border-left:0; border-top:1px solid var(--line); }
  .illustration-visual .trace-summary>div:nth-child(4) { border-top:1px solid var(--line); }
}
@container engineering-preview (max-width:440px) {
  .illustration-visual .trace-scroll-hint { display:block; margin:0; padding:0 16px 12px; font-size:12px; color:var(--muted); }
  .illustration-visual .context-animation-controls { grid-template-columns:1fr; }
  .illustration-visual .context-animation-controls p { grid-row:auto; }
  .illustration-visual .context-animation-toggle { justify-self:start; }
  .illustration-visual .product-example-tag { margin-left:0; }
  .illustration-visual .product-project-meta { display:none; }
}
@media(max-width:1200px) { .illustration-split { gap:40px; } }
@media(max-width:1000px) {
  .illustration-sections { padding:44px 0; }
  .engineering-feature-list { gap:36px; }
  .illustration-split { grid-template-columns:1fr; gap:30px; }
  .illustration-split+.illustration-split { padding-top:36px; }
  .illustration-copy { padding-top:0; }
  .illustration-copy>p,.illustration-copy ul { max-width:620px; }
  .illustration-visual { width:100%; max-width:680px; margin-inline:auto; }
}
@media(max-width:560px) {
  .illustration-copy h2 { font-size:32px; }
  .illustration-copy>p { font-size:16px; margin-top:20px; }
  .illustration-copy ul { margin-top:22px; }
}