/* Compact phone preview; the full SOP remains available on demand. */
.arrow-up-icon { display: inline-block; width: 1em; height: 1em; flex: none; vertical-align: -.12em; }
.sop-mobile-expand { display: none; }

@media (max-width: 620px) {
  .observe { padding-top: 56px; padding-bottom: 64px; }
  .observe-intro { margin-bottom: 24px; }
  .observe .source-stack { margin-bottom: 10px; }
  .observe .source-stack > button { min-height: 60px; padding: 6px 9px; row-gap: 2px; column-gap: 4px; }
  .observe .source-stack > button:hover,
  .observe .source-stack > button:focus-visible,
  .observe .source-stack > button[aria-pressed="true"] { padding-left: 9px; }
  .observe .source-stack b { font-size: clamp(14px, 3.4vw, 16px); line-height: 1.1; }
  .observe .source-stack .micro { font-size: 8px; letter-spacing: .1em; }
  .observe .capture-stage { height: 320px; min-height: 320px; }
  .observe .glasses-pip { width: min(55%, 220px); }

  .understand { padding-top: 60px; padding-bottom: 68px; }
  .understand-intro { margin-bottom: 24px; }
  .sop-build-page {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 12px 13px;
    box-shadow: none;
  }
  .sop-build-page:not(.is-mobile-expanded) .sop-build-context,
  .sop-build-page:not(.is-mobile-expanded) .sop-build-detail-slot,
  .sop-build-page:not(.is-mobile-expanded) .sop-build-operator-slot,
  .sop-build-page:not(.is-mobile-expanded) .sop-build-foot-slot {
    display: none;
  }
  .sop-build-page[hidden] { display: none; }
  .sop-build-page > .sop-build-sequence,
  .sop-build-page > .sop-build-context,
  .sop-build-page > .sop-appear { width: 100%; align-self: stretch; }
  .sop-build-media-slot { order: 1; }
  .sop-build-context { order: 2; }
  .sop-build-detail-slot { order: 3; }
  .sop-build-operator-slot { order: 4; }
  .sop-build-foot-slot { order: 5; }
  .sop-build-title h3 { font-size: 25px; }
  .sop-build-step { font-size: 13px; }
  .sop-build-context-row { padding: 6px 0; }
  .sop-build-context-row p, .sop-build-detail p { font-size: 13px; }
  .sop-build-cad { height: 158px; }
  .sop-build-stock-evidence { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 7px; }
  .sop-build-stock-evidence figure,
  .sop-build-stock-evidence .sop-build-video { height: 156px; }
  .sop-build-evidence figcaption { font-size: 8px; letter-spacing: .06em; }
  .sop-build-evidence figcaption span { display: none; }
  .sop-mobile-expand {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 38px;
    margin: 0;
    padding: 0 13px;
    border: 0;
    border-top: 1px solid #d4dbd7;
    background: #faf9f4;
    color: #37535b;
    cursor: pointer;
    font: 700 10px/1 "Arial Narrow", Arial, sans-serif;
    letter-spacing: .12em;
    text-transform: uppercase;
  }
  .sop-mobile-expand span:last-child { font: 400 20px/1 Arial, sans-serif; }
  .sop-mobile-expand:focus-visible { outline: 2px solid #d3a052; outline-offset: 2px; }
  .sop-build-controls { margin-top: 10px; }
}