/* responsive.css — Desktop/Tablet width fix for cmsprep.in
   Loaded on ALL pages EXCEPT the homepage (index.html).
   The homepage has its own layout system and must not be modified. */

/* === .page-wrap (base: 740px) — used by 157 pages === */
@media (min-width: 1024px) {
  .page-wrap {
    max-width: 960px;
  }
}

@media (min-width: 1280px) {
  .page-wrap {
    max-width: 1100px;
  }
}

@media (min-width: 1440px) {
  .page-wrap {
    max-width: 1200px;
  }
}

/* === .wrap (base: 680px) — quick-links subpages === */
@media (min-width: 1024px) {
  .wrap {
    max-width: 960px !important;
  }
}

@media (min-width: 1280px) {
  .wrap {
    max-width: 1100px !important;
  }
}

@media (min-width: 1440px) {
  .wrap {
    max-width: 1200px !important;
  }
}

/* === Expand hub-grid to use more columns on wider screens === */
@media (min-width: 1024px) {
  .hub-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (min-width: 1280px) {
  .hub-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

/* === Expand exam-grid on wider screens === */
@media (min-width: 1024px) {
  .exam-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (min-width: 1280px) {
  .exam-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

/* === Expand toc-list grid on wider screens === */
@media (min-width: 1024px) {
  .toc-list {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* === Expand cta-group on wider screens === */
@media (min-width: 768px) {
  .cta-group {
    flex-direction: row !important;
    flex-wrap: wrap;
  }
}

/* === Expand pros-cons grid on wider screens === */
@media (min-width: 768px) {
  .pros-cons {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* === Expand related-grid on wider screens === */
@media (min-width: 768px) {
  .related-grid {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* === Ensure header and breadcrumb span full width (they already do, but ensure) === */
.app-header,
.hdr,
.breadcrumb,
.bc {
  max-width: 100% !important;
}