/* Real Eagle PCB geometry: adapted SparkFun USB-to-RS-485 layout. */
.pcb-substrate { fill: #142f39; stroke: #7eb1b6; stroke-width: .12; }
.pcb-track-front, .pcb-track-back { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.pcb-track-front { stroke: #50ced1; }
.pcb-track-back { stroke: #799cce; }
.pcb-track-back-layer { opacity: .45; }
.pcb-land, .pcb-via { fill: #ecdbb7; }
.pcb-drill { fill: #0d1720; }
.pcb-silk-line { fill: none; stroke: #e4eef1; stroke-linecap: round; }
.pcb-chip-body { fill: #172029; stroke: #e4eef1; stroke-width: .12; }
.pcb-legend { fill: #e4eef1; font-family: 'IBM Plex Mono', monospace; }
.pcb-chip-caption { fill: #e4eef1; font: 12px 'IBM Plex Mono', monospace; text-anchor: middle; }
.pcb-board-label { fill: #e4eef1; font-family: 'IBM Plex Mono', monospace; text-anchor: middle; }
.pcb-connector-label { fill: #e4eef1; font: 16px 'IBM Plex Mono', monospace; text-anchor: middle; }
.pcb-sheet-title { fill: var(--ink); font: 500 22px 'IBM Plex Mono', monospace; }
.pcb-sheet-note { fill: var(--muted); font: 16px 'IBM Plex Mono', monospace; }
.pcb-dimension { fill: var(--ink); font: 18px 'IBM Plex Mono', monospace; text-anchor: middle; }
.pcb-layer-key text { fill: var(--ink); font: 18px 'IBM Plex Sans', sans-serif; }
.concept-footer small .artwork-licence { font-size: inherit; color: inherit; text-decoration: underline; text-underline-offset: 3px; }
/* Six review pages. Geometry is authored from dimensions, with theme-aware materials. */
.ar-drawing-hero { padding-block: 32px 46px; }
.ar-type-review { padding-top: 22px; font-size: 16px; color: var(--accent); text-decoration: underline; text-underline-offset: 5px; }
.ar-drawing-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 48px; align-items: center; padding-top: 34px; }
.v4 .pn-copy h1 { font-size: clamp(60px, 6.4vw, 90px); }
.v4 .technical-study { padding: 16px 20px; }
.v4 .technical-svg { max-height: none; }
.ar-landscape-hero { padding-block: 44px 36px; }
.v4 .landscape-study { border: 1px solid var(--line); background: var(--panel); padding: 18px 24px 22px; }
.layout-svg { display: block; width: 100%; max-height: 660px; margin-block: 12px; }
.v4 .factory-explorer { border: 0; padding: 0; background: transparent; margin-top: 15px; }
.v4 .factory-explorer .diagram-tabs { margin-top: 0; }
.v4 .factory-explorer .diagram-copy { padding-top: 14px; min-height: 90px; }
.v4 .drawing-actions { font-size: 10px; }
.v4 .study-heading { line-height: 1.6; }
.ar-edge { fill: none; stroke: var(--ink); stroke-width: 1.4; stroke-linejoin: round; }
.ar-fine { fill: none; stroke: var(--muted); stroke-width: .7; }
.ar-hidden { fill: none; stroke: var(--muted); stroke-width: .7; stroke-dasharray: 5 3; }
.ar-axis { fill: none; stroke: var(--muted); stroke-width: .6; stroke-dasharray: 10 3 1 3; }
.ar-dim { fill: none; stroke: var(--muted); stroke-width: .8; }
.ar-arrow { fill: var(--muted); }
.ar-text { fill: var(--ink); font: 11px ui-monospace, Consolas, monospace; }
.ar-note { fill: var(--muted); font: 9px ui-monospace, Consolas, monospace; }
.ar-title { fill: var(--ink); font: 600 15px ui-monospace, Consolas, monospace; }
.ar-paper { fill: var(--panel); stroke: var(--ink); stroke-width: 1; }
.ar-steel { fill: var(--metal-light); stroke: var(--muted); stroke-width: .8; stroke-linejoin: round; }
.ar-side { fill: var(--metal-mid); stroke: var(--muted); stroke-width: .8; stroke-linejoin: round; }
.ar-shadow { fill: var(--metal-dark); stroke: var(--muted); stroke-width: .8; stroke-linejoin: round; }
.ar-dark { fill: var(--chip); stroke: var(--muted); stroke-width: .8; }
.ar-teal { fill: var(--drawing-accent); stroke: var(--ink); stroke-width: .8; }
.ar-aqua { fill: #50ced1; stroke: var(--drawing-accent); stroke-width: .8; }
.ar-soft { fill: var(--tint); stroke: var(--accent); stroke-width: .8; }
.ar-floor { fill: var(--surface); stroke: var(--line); stroke-width: 1; }
.ar-wall { fill: var(--metal-light); stroke: var(--muted); stroke-width: .8; }
.ar-signal { fill: none; stroke: #50ced1; stroke-width: 1.2; }
.ar-iron { fill: none; stroke: var(--ink); stroke-width: 3; stroke-linecap: round; }
.ar-duct { fill: none; stroke: var(--metal-dark); stroke-width: 8; stroke-linecap: round; stroke-linejoin: round; }
.ar-carton { fill: #dbcfb8; stroke: #817664; stroke-width: .8; }
.ar-carton-side { fill: #b8a98e; stroke: #817664; stroke-width: .8; }
.ar-selection { fill: none; stroke: var(--accent); stroke-width: 2; stroke-dasharray: 7 5; opacity: 0; transition: opacity .25s; }
.is-current .ar-selection { opacity: 1; }
.ar-selection-label { fill: var(--accent); font: 600 12px ui-monospace, Consolas, monospace; }
.v4 .graphic-ready [data-scene-stage] { opacity: 1; }
.production-photo { margin: 0; padding-top: 14px; }
.production-photo img { display: block; width: 100%; height: clamp(340px, 41vw, 610px); object-fit: cover; object-position: center 47%; }
.production-photo figcaption { padding-top: 12px; color: var(--muted); font: 10px/1.7 ui-monospace, Consolas, monospace; }
.production-photo figcaption a { text-decoration: underline; text-underline-offset: 3px; }
/* Each drawing gets a different hierarchy as well as a different subject. */
.art-mixed .ar-drawing-grid { grid-template-columns: .85fr 1.15fr; gap: 42px; }
.art-mixed .pn-copy h1 { font-size: clamp(60px, 5.9vw, 82px); }
.manufacturing-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.manufacturing-tabs button { padding: 18px 10px; text-align: left; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--ink); }
.manufacturing-tabs button:last-child { border-right: 0; }
.manufacturing-tabs button:nth-child(2) { border-right: 0; }
.manufacturing-tabs button:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
.manufacturing-tabs button > span { display: block; font: 9px/1.6 ui-monospace, Consolas, monospace; color: var(--muted); }
.manufacturing-tabs button > strong { display: block; margin-top: 6px; font: 600 12px/1.4 'Manrope', sans-serif; }
.manufacturing-tabs button[aria-selected="true"] { background: var(--tint); box-shadow: inset 0 -3px var(--accent); }
.manufacturing-tabs button[aria-selected="true"] > span { color: var(--accent); }
.manufacturing-panel > .technical-svg { margin-top: 12px; }
.manufacturing-caption { padding: 17px 0 4px; }
.manufacturing-caption .c-kicker { font-size: 9px; margin-bottom: 10px !important; }
.v4 .manufacturing-caption h2 { font: 600 20px/1.35 'Manrope', sans-serif; text-transform: none; letter-spacing: -.02em; }
.manufacturing-caption > p:not(.c-kicker) { margin-top: 12px; font-size: 12px; color: var(--muted); max-width: 600px; }
.manufacturing-caption ol { display: flex; flex-wrap: wrap; padding: 0; margin: 18px 0 0; list-style: none; gap: 8px 14px; font: 9px/1.6 ui-monospace, Consolas, monospace; color: var(--accent); }
.manufacturing-caption li:not(:last-child)::after { content: '→'; padding-left: 14px; }
.ar-combined-link { display: grid; gap: 12px; border: 1px solid var(--accent); padding: 24px; background: var(--tint); margin-top: 32px; max-width: 850px; }
.ar-combined-link > span:first-child { color: var(--accent); font: 10px ui-monospace, Consolas, monospace; }
.ar-combined-link > strong { font: 600 22px/1.35 'Manrope', sans-serif; }
.ar-combined-link > span:last-child { font-size: 13px; color: var(--muted); }
.art-plate .technical-study { background: var(--surface); }
.art-plate .ar-drawing-grid { grid-template-columns: .68fr 1.32fr; gap: 30px; }
.art-plate .pn-copy h1 { font-size: clamp(60px, 6vw, 85px); }
.art-exploded .ar-drawing-grid { display: block; }
.art-exploded .pn-copy { display: grid; grid-template-columns: 1.15fr 1fr; column-gap: 80px; padding-block: 10px 38px; align-items: center; }
.art-exploded .pn-copy h1 { grid-row: span 3; font-size: clamp(65px, 6.5vw, 88px); }
.art-exploded .pn-copy > p:not(.hero-footnote) { margin: 0 0 20px; }
.art-exploded .pn-copy .c-button { justify-self: start; }
.art-exploded .pn-copy .hero-footnote { margin-top: 16px; }
.art-exploded .technical-study { display: grid; grid-template-columns: 1.8fr 1fr; gap: 0 30px; }
.art-exploded .study-heading { grid-column: 1 / -1; }
.art-exploded .technical-svg { grid-row: span 3; }
.art-exploded .drawing-actions { grid-column: 1; grid-row: 5; }
.art-exploded .diagram-tabs { grid-column: 2; grid-row: 2; align-self: end; }
.art-exploded .diagram-copy { grid-column: 2; grid-row: 3; align-self: start; }
.art-plan .ar-landscape-hero { padding-top: 35px; }
.art-plan .layout-svg { max-height: 600px; }
.art-cell .landscape-study { background: var(--surface); }
.art-cell .layout-svg { max-height: 700px; }
.art-photo .landscape-study { border-inline: 0; padding-inline: 0; background: transparent; }
.art-photo .pn-landscape-copy h1 { font-size: clamp(74px, 8.5vw, 120px); }
/* Review board previews are the same actual artwork as the pages. */
.ar-board { padding-block: 50px 40px; }
.ar-board h1 { font-size: clamp(65px, 8vw, 116px); line-height: .94; }
.ar-board > p:not(.c-kicker) { max-width: 740px; margin-top: 28px; font-size: 16px; }
.ar-board-family { padding-block: 35px 50px; }
.ar-board-family > header { display: flex; justify-content: space-between; gap: 30px; border-top: 1px solid var(--line); padding-top: 25px; margin-bottom: 24px; }
.ar-board-family > header h2 { font-size: 36px; }
.ar-board-family > header p { max-width: 480px; font-size: 13px; color: var(--muted); }
.ar-board-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.ar-card { border: 1px solid var(--line); background: var(--panel); display: flex; flex-direction: column; transition: border-color .2s, transform .2s; }
.ar-card:hover { border-color: var(--accent); transform: translateY(-4px); }
.ar-card-art { position: relative; overflow: hidden; background: #fff; padding: 12px; border-bottom: 1px solid var(--line); }
.ar-card-art img { width: 100%; height: 240px; object-fit: contain; display: block; }
.ar-card.photo .ar-card-art { padding: 0; }
.ar-card.photo img { object-fit: cover; }
.ar-card-copy { padding: 22px; flex: 1; display: flex; flex-direction: column; }
.ar-card-copy > span { font: 10px ui-monospace, Consolas, monospace; color: var(--accent); }
.ar-card-copy h3 { font: 600 23px/1.25 'Manrope', sans-serif; text-transform: none; margin-top: 12px; }
.ar-card-copy p { font-size: 12px; color: var(--muted); margin-block: 14px 24px; }
.ar-card-copy b { font: 600 12px 'Manrope', sans-serif; margin-top: auto; }
@media (max-width: 1000px) {
    .ar-drawing-grid, .art-plate .ar-drawing-grid { grid-template-columns: .8fr 1.2fr; gap: 25px; }
    .v4 .pn-copy h1 { font-size: 61px; }
    .art-exploded .pn-copy { gap: 30px; }
    .art-exploded .technical-study { grid-template-columns: 1.5fr 1fr; gap: 0 20px; }
    .ar-board-grid { gap: 14px; }
    .ar-card-art img { height: 180px; }
    .ar-card-copy { padding: 17px; }
}
@media (max-width: 760px) {
    .ar-drawing-grid, .art-plate .ar-drawing-grid, .art-mixed .ar-drawing-grid { grid-template-columns: 1fr; gap: 28px; }
    .v4 .pn-copy h1 { font-size: 74px; }
    .v4 .pn-copy > p:not(.c-kicker):not(.hero-footnote) { margin-block: 24px; }
    .art-exploded .pn-copy { display: block; }
    .art-exploded .technical-study { display: block; }
    .ar-board-grid { grid-template-columns: 1fr; gap: 24px; }
    .ar-card-art img { height: 280px; }
    .ar-board-family > header { display: block; }
    .ar-board-family > header p { margin-top: 18px; }
}
@media (max-width: 640px) {
    .ar-drawing-hero, .ar-landscape-hero { padding-top: 24px; }
    .v4 .pn-copy h1 { font-size: clamp(55px, 17vw, 74px); }
    .v4 .technical-study { padding: 12px; }
    .manufacturing-tabs button { padding: 14px 7px; }
    .manufacturing-tabs button > span { font-size: 8px; }
    .manufacturing-tabs button > strong { font-size: 10px; }
    .manufacturing-panel > .engineering-sheet .ed-isometric, .manufacturing-panel > .engineering-sheet [data-scene-stage="parts"], .manufacturing-panel > .engineering-sheet .ed-leader-line, .manufacturing-panel > .engineering-sheet .ed-hole-notes { display: none; }
    .v4 .landscape-study { padding: 12px; }
    .v4 .study-heading { font-size: 8px; gap: 12px; }
    .v4 .layout-svg { min-height: 270px; }
    .v4 .ar-electronics-cell { min-height: 230px; }
    .v4 .drawing-actions { flex-wrap: wrap; }
    .art-photo .pn-landscape-copy h1 { font-size: clamp(53px, 16vw, 74px); }
    .production-photo img { height: 390px; object-position: 48% center; }
    .v4 .factory-explorer .diagram-tabs { grid-template-columns: repeat(2, 1fr); }
    .v4 .factory-explorer .diagram-tabs button { min-height: 44px; border-bottom: 1px solid var(--line); }
    .v4 .factory-explorer .diagram-tabs button:nth-child(2) { border-right: 0; }
    .ar-board { padding-top: 34px; }
    .ar-board h1 { font-size: 66px; }
    .ar-card-art img { height: 250px; }
}
@media (prefers-reduced-motion: reduce) { .ar-card, .ar-selection { transition: none; } .ar-card:hover { transform: none; } }