/* ========================================
   RESPONSIVE / MOBILE
   ======================================== */
@media (max-width: 900px) {
  .nav-links { display: none; }
  .nav-mob { display: block; }
  /* Make full nav bar tappable on mobile so hamburger works */
  .nav, .nav-inner { pointer-events: auto; }
  /* Logo must be visible immediately on mobile — intro may not run the same way */
  #c2-nav-logo { opacity: 1 !important; }
  /* Give the nav a subtle background on mobile so logo/hamburger are readable */
  .nav { background: rgba(7, 14, 41, 0.75); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
  .nav.mo .nav-links {
    display: flex; flex-direction: column; position: absolute;
    top: 60px; left: 0; right: 0;
    background: rgba(7, 14, 41, 0.98); padding: 20px; gap: 4px;
  }
  .pg, .tg, .ns { grid-template-columns: 1fr 1fr; }
  .ag, .dg, .ng { grid-template-columns: 1fr; }
  .gg { grid-template-columns: 1fr; }
  .softr-cards-grid { grid-template-columns: 1fr !important; }
  .usel { flex-direction: column; }
  .mc { flex-direction: column; align-items: center; }
  .mnav {
    width: 100%; display: flex; overflow-x: auto; gap: 4px;
    padding-bottom: 8px; justify-content: center;
  }
  .mnav-i { white-space: nowrap; flex-shrink: 0; }
  .mframe { width: 100%; max-width: 600px; min-height: 420px; }
  .mbody { padding: 20px; }
  .img-band { height: 300px; }
  .img-band--final { height: 360px; }
  .ibc { padding: 32px 40px; }
  .sec, .sec-dark, .sec-mint, .sec-lav, .jsec { padding-left: 40px !important; padding-right: 40px !important; }
  #institutional, #next { padding-left: 40px !important; padding-right: 40px !important; }
  .ibc h2 { font-size: 28px; }
  .ppanel .pblock div[style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
  .proto-input-row { grid-template-columns: 1fr; }
  .proto-chips { gap: 5px; }
  .proto-chip { font-size: 10px; padding: 4px 10px; }
  .proto-stat-row { grid-template-columns: repeat(3, 1fr); gap: 6px; }

  /* Mission section */
  #mission-section { padding-top: 80px !important; padding-bottom: 80px !important; }
  #mission-content { padding: 0 32px !important; }
  #mission-content h2 { font-size: clamp(32px, 6vw, 42px) !important; }
  #mission-stats-row { flex-wrap: wrap; }
  .mission-stat { padding: 20px 24px !important; flex: 1 1 30%; min-width: 80px; }

  /* Architecture: collapse outer panel grids on tablet */
  .ppanel > div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  .ptabs { justify-content: flex-start; max-width: 100%; }

  /* Dual flow mobile: toggle mode */
  .dualflow-header { display: none; }
  .dualflow-row { grid-template-columns: 1fr !important; }
  .dualflow-center { display: none; }
  .dualflow-row::before { display: none; }
  .dualflow-cell.dc-converge { grid-column: 1; margin: 0; }
  .dualflow-cell { display: none; }
  .dualflow-cell.dc-converge { display: block; }
  .dualflow-cell.df-mob-show { display: block !important; }
  .dualflow-mob-toggle { display: flex !important; }
}

@media (max-width: 600px) {
  .sec, .sec-dark, .sec-mint, .sec-lav, .jsec { padding-left: 20px !important; padding-right: 20px !important; }
  /* Mission section */
  #mission-section { padding-top: 60px !important; padding-bottom: 60px !important; min-height: auto !important; }
  #mission-content { padding: 0 20px !important; }
  #mission-content h2 { font-size: clamp(26px, 8vw, 34px) !important; line-height: 1.18 !important; }
  #mission-content > p { font-size: 15px !important; line-height: 1.72 !important; }
  #mission-stats-row { flex-wrap: wrap; gap: 0; }
  .mission-stat { padding: 18px 16px !important; flex: 1 1 33%; min-width: 0; text-align: center; }
  .mission-stat > div:first-child { font-size: 36px !important; }
  /* Architecture */
  .ppanel > div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  .ppanel .pblock div[style*="grid-template-columns:1fr 1fr 1fr"] { grid-template-columns: 1fr 1fr !important; }
  .ptab { padding: 9px 14px !important; font-size: 11px !important; }
  #mission-section > div:last-child { padding: 0 20px !important; }
  #institutional, #next { padding-left: 20px !important; padding-right: 20px !important; }
  .pg, .tg, .ns { grid-template-columns: 1fr; }
  .sec, .sec-dark, .sec-mint, .sec-lav, .jsec { padding: 60px 20px; }
  .img-band { height: 240px; }
  .img-band--final { height: 300px; }
  .ibc { padding: 24px 28px; }
  .ibc h2 { font-size: 24px; }
  .ibc p { font-size: 14px; }
  .hero-title { font-size: 32px !important; }
  .hero-sub { font-size: 15px; }
  .st { font-size: 28px !important; }
  .proto-stat-row { grid-template-columns: 1fr 1fr; }
  .proto-stat { padding: 8px; }
  .proto-stat-val { font-size: 16px; }
  .mcard-v { font-size: 20px; }
  .mcg { grid-template-columns: 1fr 1fr; }
  .ptabs { gap: 2px; padding: 3px; }
  .tg { grid-template-columns: 1fr; }
  .proto-mini-profile { padding: 16px; }
  .proto-avatar-lg { width: 40px; height: 40px; font-size: 16px; }
}