/* Responsive behaviour */
@media (max-width: 1240px) {
  .hero__grid { grid-template-columns: minmax(320px, .78fr) minmax(0, 1.22fr); gap: 34px; }
  .stage-toolbar { max-width: 300px; }
  .nav { gap: 0; }
  .nav a { padding: 8px 8px; }
  .foot__in { grid-template-columns: 1.4fr .7fr .7fr 1fr; }
}

@media (max-width: 1080px) {
  .hero__grid { grid-template-columns: 1fr; padding-top: 30px; }
  .hero__copy { padding-top: 12px; max-width: 760px; }
  .hero h1 { font-size: clamp(3.2rem, 9vw, 6.4rem); }
  .hero__lead { max-width: 620px; }
  .hero__stats { max-width: 620px; }
  .stage-card { margin-top: 8px; }
  .stage-viewport { height: clamp(360px, 50vw, 520px); }
  .bench-layout { grid-template-columns: 1fr; }
  .bench-panel { height: auto; max-height: 760px; }
  .panel-body { max-height: 520px; }
  .pinout-layout { grid-template-columns: 1fr; }
  .protocol-side { grid-template-columns: 1fr 1fr; align-items: start; }
  .side-label, .level-warning { grid-column: 1 / -1; }
  .protocol-cards { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 900px) {
  .gallery-head { flex-direction: column; align-items: flex-start; gap: 12px; }
  .gallery-tools { justify-content: flex-start; width: 100%; }
  .gallery-grid { grid-template-columns: 1fr; }
  .gallery-canvas-wrap { height: 340px; }
  .gallery-info { min-height: 0; }
  .gallery-rail { padding-bottom: 5px; }
  .resource-groups { grid-template-columns: 1fr; }
  .gallery-filters { overflow: visible; flex-wrap: wrap; width: 100%; padding-bottom: 3px; gap: 4px; }
  .gallery-filters .filter-chip { flex: none; }
  .site-head {
    height: auto; min-height: 62px; flex-wrap: wrap; row-gap: 4px;
    align-items: center; padding-top: 7px; padding-bottom: 5px;
  }
  .hero { padding-top: 104px; }
  section[id] { scroll-margin-top: 116px; }
  .nav {
    display: flex; order: 3; flex: 0 0 100%; width: 100%; margin-left: 0;
    padding-top: 5px; border-top: 1px solid rgba(220, 240, 228, .12);
    overflow-x: auto; scrollbar-width: none; gap: 0; padding-right: 24px;
    -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 22px), transparent 100%);
    mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 22px), transparent 100%);
  }
  .nav::-webkit-scrollbar { display: none; }
  .nav a { white-space: nowrap; padding: 6px 8px; font-size: 9px; }
  .head-cta { margin-left: auto; }
  .section-head { grid-template-columns: 1fr; gap: 18px; }
  .section-lead { justify-self: start; max-width: 620px; }
  .mission-card { grid-template-columns: 1fr; }
  .mission-check { padding-left: 0; border-left: 0; border-top: 1px dashed var(--line); padding-top: 14px; }
  .rules-strip { grid-template-columns: 1fr; }
  .rules-strip > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .rules-strip > div:last-child { border-bottom: 0; }
  .calc-grid { grid-template-columns: 1fr; }
  .calc-card--wide { grid-column: auto; display: block; }
  .closing__in { grid-template-columns: 1fr; }
  .closing__cols { grid-template-columns: 1fr; }
  .foot__in { grid-template-columns: 1fr 1fr; }
  .foot__brand { grid-column: 1 / -1; }
  .foot__end { text-align: left; }
  .modal-grid { grid-template-columns: 1fr; }
  .modal-hero { grid-template-columns: 1fr 160px; }
  .modal-specs { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 740px) {
  .hero__grid { padding-top: 24px; gap: 24px; }
  .hero h1 { font-size: clamp(2.9rem, 13vw, 4.6rem); line-height: .9; }
  .hero__stats { grid-template-columns: 1fr 1fr; border-top: 0; }
  .hero__stats > div { border-top: 1px solid rgba(218, 237, 226, .16); }
  .hero__note { margin-top: 20px; }
  .stage-head { flex-direction: column; padding: 13px 13px 10px; }
  .stage-head__title > p:last-child { max-width: none; }
  .stage-toolbar { justify-content: flex-start; max-width: none; width: 100%; }
  .stage-viewport { height: 360px; }
  .stage-chips { top: 9px; left: 9px; }
  .stage-part-card { left: 9px; bottom: 40px; width: min(260px, 66%); }
  .stage-hint { display: none; }
  .stage-foot { grid-template-columns: 1fr; gap: 7px; padding: 9px 12px; }
  .stage-parts { padding-bottom: 2px; }
  .marker__label { display: none; }
  .stage-markers.labels-off .marker__label { display: none; }
  .bench-scene { height: 400px; }
  .bench-hud--top { max-width: calc(100% - 90px); }
  .bench-legend { display: none; }
  .mission-card { padding: 16px; gap: 16px; }
  .mission-controls { flex-direction: column; }
  .panel-selects { grid-template-columns: 1fr; }
  .bench-panel { max-height: none; }
  .panel-body { max-height: none; }
  .catalog-tools { flex-direction: column; align-items: stretch; }
  .catalog-tools .search-field { width: 100%; }
  .catalog-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
  .gallery-block { padding: 14px; }
  .gallery-title h3 { font-size: 1.7rem; }
  .gallery-canvas-wrap { height: 290px; }
  .gallery-info { padding: 12px; }
  .gallery-specs { grid-template-columns: 1fr 1fr; }
  .gallery-rail { gap: 4px; }
  .gallery-item { width: 108px; }
  .gallery-thumb { height: 60px; }
  .tray-head { flex-direction: column; gap: 7px; }
  .tray-actions { width: 100%; justify-content: space-between; }
  .tray-item { width: 148px; }
  .filter-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
  .filter-chips::-webkit-scrollbar { display: none; }
  .filter-chip { flex: none; }
  .pinout-summary { grid-template-columns: 1fr 1fr; }
  .pinout-bar { flex-direction: column; align-items: stretch; }
  .pinout-bar .search-field { width: 100%; }
  .protocol-side { grid-template-columns: 1fr; }
  .protocol-cards { grid-template-columns: 1fr; }
  .calc-fields { grid-template-columns: 1fr; }
  .calc-fields--loads, .calc-fields--battery { grid-template-columns: 1fr 1fr; }
  .closing h2 { font-size: clamp(2.2rem, 10vw, 3.3rem); }
  .ticker__track { animation-duration: 26s; }
  .modal { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
  .modal__body { max-height: calc(100dvh - 16px); }
  .modal-hero { grid-template-columns: 1fr; padding: 18px; }
  .modal-hero__icon { min-height: 76px; }
  .modal-hero__icon svg { width: 38px; height: 38px; }
  .modal-grid { padding: 16px 18px 20px; gap: 18px; }
  .modal-specs { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 520px) {
  :root { --pad: 16px; }
  .site-head { gap: 12px; }
  .head-cta { padding: 9px 11px; font-size: 9px; }
  .head-cta svg { display: none; }
  .brand__mark { width: 30px; height: 30px; }
  .brand__type { font-size: 15px; }
  .hero__actions .btn { flex: 1; white-space: nowrap; font-size: 10px; padding: 12px 10px; }
  .eyebrow { font-size: 9px; letter-spacing: .08em; }
  .hero__lead { font-size: 13.5px; }
  .stage-toolbar .tool-btn span { display: none; }
  .stage-toolbar .tool-btn { padding: 6px 8px; }
  .stage-viewport { height: 320px; }
  .stage-card::before, .stage-card::after { width: 10px; height: 10px; }
  .stage-parts { max-width: 100%; }
  .rail-btn { width: 120px; }
  .bench-scene { height: 360px; }
  .bench-hud--top strong { font-size: 14px; }
  .bench-hud--status { font-size: 8px; max-width: calc(100% - 18px); right: 9px; bottom: 52px; }
  .bench-actions { right: 9px; bottom: 9px; }
  .bench-run { height: 33px; padding: 0 11px; font-size: 9px; }
  .icon-btn { width: 33px; height: 33px; }
  .pin-cards { grid-template-columns: 1fr 1fr; }
  .pin-card span { font-size: 7.5px; }
  .calc-result { grid-template-columns: 1fr 1fr; }
  .calc-result > div:last-child { grid-column: 1 / -1; }
  .calc-fields--loads, .calc-fields--battery { grid-template-columns: 1fr; }
  .foot__in { grid-template-columns: 1fr 1fr; gap: 24px 18px; }
  .foot__end { grid-column: 1 / -1; }
  .modal-specs { grid-template-columns: 1fr; }
  .modal-pins strong { min-width: 56px; }
  .section-head h2 { font-size: clamp(2rem, 10vw, 2.8rem); }
}

@media (hover: none) {
  .cat-card:hover { transform: none; }
  .stage-hint { display: none; }
}

/* Mobile comparison: sticky board column + swipe hint */
.table-scroll-hint { display: none; }
@media (max-width: 740px) {
  .table-scroll-hint {
    display: flex; align-items: center; gap: 7px; margin: 0 0 9px;
    color: #5f6558; font-size: 12px; letter-spacing: .05em;
  }
  .table-scroll-hint svg { width: 12px; height: 12px; }
  .compare-table th:first-child,
  .compare-table td:first-child { position: sticky; left: 0; }
  .compare-table thead th:first-child { z-index: 3; background: var(--ink); }
  .compare-table tbody td:first-child {
    z-index: 2; background: var(--paper-3); box-shadow: 1px 0 0 #e2d9c7;
  }
  .compare-table tbody tr:hover td:first-child,
  .compare-table tbody tr.is-active td:first-child { background: #f6f0e3; }
}

/* About section */
@media (max-width: 900px) {
  .about-grid { grid-template-columns: 1fr; }
  .about-credit { min-height: 0; max-width: 560px; }
}

@media (max-width: 900px) {
  .bench-demos { flex-direction: column; align-items: stretch; gap: 8px; }
  .bench-demos__head { max-width: none; }
  .demo-rail { width: 100%; }
}
