/* One compact engineering drawing, with depth only on request. */
.hero .hero-copy { align-self: start; }
.hero-blueprint { margin-block: 14px; }
.blueprint-figure { margin: 0; }
.blueprint-drawing { display: block; width: 100%; height: 94px; overflow: visible; }
.blueprint-drawing path { vector-effect: non-scaling-stroke; }
.blueprint-ground { color: var(--line); stroke-width: .7; }
.blueprint-layer { color: var(--muted); stroke-width: 1; }
.blueprint-face { fill: var(--bg); }
.blueprint-fine { stroke-width: .8; }
.blueprint-accent { color: var(--accent); }
.blueprint-routes { stroke-width: 1.1; }
.blueprint-ownership { color: var(--accent); opacity: 0; stroke-width: 1; stroke-dasharray: 3 5; }
.blueprint-figure figcaption { margin-top: 4px; color: var(--subtle); font-family: var(--font-mono); font-size: 8px; line-height: 1.7; text-align: center; }
.blueprint-disclosure { margin-top: 4px; border-block: 1px solid var(--soft-line); }
.blueprint-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 38px; padding-block: 9px; color: var(--muted); font-family: var(--font-mono); font-size: 10px; line-height: 1.6; list-style: none; cursor: pointer; }
.blueprint-disclosure > summary::-webkit-details-marker { display: none; }
.blueprint-disclosure > summary::marker { content: ''; }
.blueprint-disclosure > summary:hover { color: var(--accent); }
.blueprint-disclosure > summary:active { color: var(--text); }
.blueprint-disclosure > summary:focus-visible { outline-offset: 3px; }
.blueprint-disclosure > summary svg { width: 11px; height: 11px; flex: 0 0 auto; }
.blueprint-disclosure[open] > summary { color: var(--accent); }
.blueprint-disclosure[open] > summary svg { transform: rotate(45deg); }
.blueprint-explorer { padding-bottom: 17px; }
.blueprint-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1px 0 17px; border-bottom: 1px solid var(--line); }
.blueprint-controls button { position: relative; min-width: 0; min-height: 44px; padding: 9px 3px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--muted); font-family: var(--font-mono); font-size: 10px; line-height: 1.7; text-align: left; cursor: pointer; }
.blueprint-controls button:hover { color: var(--accent); background: var(--wash); }
.blueprint-controls button:active { background: var(--surface-alt); }
.blueprint-controls button[aria-pressed="true"] { color: var(--accent); border-bottom-color: currentColor; }
.blueprint-controls button:focus-visible { z-index: 1; outline-offset: 2px; }
.blueprint-panel + .blueprint-panel { margin-top: 20px; }
[data-blueprint-ready] .blueprint-panel { margin-top: 0; }
.blueprint-panel h2 { margin-bottom: 9px; font-size: 1.05rem; line-height: 1.3; letter-spacing: -.02em; text-align: left; text-wrap: initial; }
.blueprint-panel p { color: var(--muted); font-size: 12px; line-height: 1.8; }
.blueprint-panel a { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; margin-top: 7px; font-size: 11px; line-height: 1.6; }
[data-active-layer] .blueprint-layer { opacity: .3; }
[data-active-layer="field"] .blueprint-field,
[data-active-layer="infrastructure"] .blueprint-infrastructure,
[data-active-layer="integration"] .blueprint-integration,
[data-active-layer="integration"] .blueprint-routes,
[data-active-layer="ownership"] .blueprint-layer { color: var(--accent); opacity: 1; stroke-width: 1.3; }
[data-active-layer="ownership"] .blueprint-ownership { opacity: 1; }
.hero[data-blueprint-active="exploring"] .motion-toggle:disabled { opacity: 1; cursor: default; }
.hero[data-blueprint-active="exploring"] .motion-toggle:disabled:hover { background: transparent; color: var(--subtle); }

@media (min-width: 761px) and (max-width: 1100px) {
  .blueprint-drawing { height: 86px; }
  .blueprint-figure figcaption { font-size: 7px; }
  .blueprint-panel p { font-size: 11px; }
}
@media (max-width: 760px) {
  .blueprint-drawing { height: 112px; }
  .blueprint-figure figcaption { font-size: 9px; }
  .blueprint-disclosure > summary { min-height: 44px; font-size: 11px; }
  .blueprint-controls button { font-size: 11px; }
  .blueprint-panel p { font-size: 13px; }
  .blueprint-panel a { font-size: 12px; }
}
@media (max-width: 400px) {
  .blueprint-drawing { height: 92px; }
  .blueprint-figure figcaption { font-size: 8px; }
}
@media (prefers-reduced-motion: no-preference) {
  .blueprint-disclosure > summary svg { transition: transform 180ms ease; }
  .is-constructing .blueprint-draw { stroke-dasharray: 1; animation: blueprint-construct 1000ms cubic-bezier(.2, .6, .3, 1) both; }
  .is-constructing .blueprint-infrastructure .blueprint-draw { animation-delay: 200ms; }
  .is-constructing .blueprint-integration .blueprint-draw { animation-delay: 400ms; }
  .is-constructing .blueprint-routes .blueprint-draw { animation-delay: 650ms; }
  @keyframes blueprint-construct { from { stroke-dashoffset: 1; opacity: .18; } to { stroke-dashoffset: 0; opacity: 1; } }
}
@media (prefers-reduced-motion: reduce) {
  .hero-blueprint *, .hero-blueprint *::before, .hero-blueprint *::after { animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
  .blueprint-ground { color: GrayText; }
  .blueprint-layer, .blueprint-accent, .blueprint-ownership { color: CanvasText; }
  .blueprint-face { fill: Canvas; }
  [data-active-layer] .blueprint-layer { opacity: 1; }
  [data-active-layer="field"] .blueprint-field,
  [data-active-layer="infrastructure"] .blueprint-infrastructure,
  [data-active-layer="integration"] .blueprint-integration,
  [data-active-layer="integration"] .blueprint-routes,
  [data-active-layer="ownership"] .blueprint-layer { color: Highlight; stroke-width: 2; }
  .blueprint-controls button[aria-pressed="true"] { color: Highlight; border-bottom: 3px solid Highlight; }
  .blueprint-disclosure, .blueprint-controls { border-color: CanvasText; }
}
@media print {
  .blueprint-disclosure { display: none; }
  .blueprint-drawing { height: 90px; }
}
