/* ─────────────────────────────────────────
   RESPONSIVE STYLES — SMALL SCREENS (≤700px)
   ───────────────────────────────────────── */

@media (max-width: 700px) {
  /* ----- Base container & typography ----- */
  .container {
    padding: 0 1rem;
    width: 100%;
  }
  body {
    font-size: var(--fs-huge);
  }
  header h1 {
    font-size: var(--fs-3xl);
    line-height: 1.2;
  }
  header h1 span {
    display: block;
  }
  header::before {
    font-size: var(--fs-5xl);
  }
  .home-btn {
    bottom: 0.5rem;
    right: 0.5rem;
    padding: 0.4rem 0.8rem;
    font-size: var(--fs-xs);
  }

  /* Section labels */
  .section-label h3 {
    font-size: var(--fs-lg);
  }
  .section-label .num {
    font-size: var(--fs-xs);
    padding: 0.3rem 0.6rem;
  }
  .hero-tagline span,
  footer p {
    font-size: var(--fs-xs);
  }

  /* ----- Grid & layout adjustments ----- */
  .core-banner,
  .def-contrast,
  .failure-block,
  .maturity-compare,
  .instinct-compare,
  .br-compare,
  .barrier-compare,
  .authority-compare,
  .trans-compare,
  .mis-compare,
  .ndx-compare,
  .compare-grid,
  .speech-compare,
  .core-contrast {
    display: grid;
    grid-template-columns: 1fr;
  }

  .cb-arrow,
  .nf-arrow,
  .pp-arrow,
  .conf-arrow,
  .tbf-arrow,
  .fm-triad-arrow,
  .reg-arrow,
  .comp-arrow-col,
  .cycle-arrow {
    transform: rotate(90deg);
  }

  /* Smaller grids (2 columns) */
  .socrates-grid,
  .domains-grid,
  .traits-grid,
  .pillars-grid,
  .four-q-grid {
    grid-template-columns: 1fr 1fr;
  }

  /* Medium/complex grids => 1 column */
  .example-three-col,
  .etc-col,
  .narrowing-flow,
  .safety-callout,
  .dialogue-head,
  .dl-line,
  .arg-step,
  .hierarchy-row,
  .hp-item,
  .not-grid,
  .not-item,
  .phrase-item,
  .xref-block,
  .reminder-pills,
  .checklist-row,
  .sequence-block,
  .culture-block,
  .errors-grid,
  .warehouse-mappings,
  .tq-grid,
  .paeds-grid,
  .bridge-steps,
  .domain-diff-grid,
  .pharma-row,
  .comp-pair,
  .analogy-grid,
  .comparison-grid,
  .pancyto-grid,
  .pearl-grid,
  .three-skills,
  .ladder-item,
  .confidence-spectrum,
  .balance-intro,
  .balance-table,
  .presentation-compare,
  .pb-three,
  .flow-block,
  .relevance-block,
  .exam-grid,
  .mismatch-grid,
  .checklist-steps,
  .tier-diagnostic .purposes-grid,
  .tier-management .purposes-grid,
  .tab-compare,
  .checklist-grid,
  .safety-grid,
  .sequence-flow,
  .distinction-row,
  .before-after,
  .structure-row,
  .impact-grid,
  .why-block,
  .step-if-grid,
  .ex-outcomes,
  .mistakes-grid,
  .values-strip,
  .algo-steps,
  .pipeline-stages,
  .trans-three-col,
  .defend-grid,
  .registers-flow,
  .red-flags-grid,
  .priority-flow,
  .summary-grid,
  .summary-question,
  .midnight-calls,
  .dx-spectrum,
  .comp-grid,
  .smoke-mappings,
  .tier-flow,
  .wb-systems,
  .states-grid,
  .ex-states-row,
  .prob-tiers,
  .misconception-block,
  .fw-step,
  .circle-stages,
  .closure-row,
  .osce-grid,
  .why-rules-grid,
  .rule-structure-table tbody tr,
  .tb-flow,
  .cr-content,
  .cr-xref,
  .sr-content,
  .ssr-content,
  .step-content,
  .level-content,
  .principle-row,
  .wc-card,
  .tt-card,
  .tl-item,
  .habits-grid,
  .pb-corollary,
  .contrast-grid,
  .levels-grid,
  .twoq-filter,
  .wheeze-cards,
  .tt-grid {
    grid-template-columns: 1fr;
  }

  /* Border adjustments */
  .soc-item:nth-child(2n),
  .dc-col:first-child,
  .etc-col,
  .mat-col:first-child,
  .instinct-col:first-child,
  .br-col:first-child,
  .barrier-col:first-child,
  .auth-col:first-child,
  .trans-col:first-child,
  .mis-col:first-child,
  .ndx-col:first-child,
  .cmp-col:first-child,
  .speech-col:first-child,
  .pres-col:first-child,
  .wm-col:first-child,
  .tq-card,
  .analogy-col:first-child,
  .flow-step,
  .pb-half:first-child,
  .tlcb-col:first-child,
  .tab-col:first-child,
  .safety-item,
  .seq-step,
  .tier-col:first-child,
  .wc-card,
  .tt-card,
  .etcol,
  .prob-tier {
    border-right: none;
  }

  .soc-item:nth-child(n + 7),
  .etc-col:last-child,
  .mat-col:last-child,
  .tq-card:last-child,
  .wc-card:last-child,
  .tt-card:last-child,
  .etcol:last-child,
  .prob-tier:last-child,
  .safety-item:last-child,
  .seq-step:last-child {
    border-bottom: none;
  }

  .dc-col:first-child,
  .mat-col:first-child,
  .instinct-col:first-child,
  .br-col:first-child,
  .barrier-col:first-child,
  .auth-col:first-child,
  .wm-col:first-child,
  .pb-half:first-child,
  .tlcb-col:first-child,
  .tab-col:first-child {
    border-bottom: 1px solid var(--border);
  }
}