/* /assets/css/hc-layout.css (V30.3 - FULL WIDTH LAYOUT FIX)
   Fixes: main body and side panels not filling full width
*/

.hc-page{
  width:100%;
  margin:0;
  padding: 14px;
}

.hc-grid{
  width:100%;
  max-width: 1600px;   /* big screens look premium */
  margin: 0 auto;
  display:grid;
  grid-template-columns: 300px minmax(520px, 1fr) 340px; /* left, center, right */
  gap:16px;
  align-items:start;
}

/* Make the grid expand on very large monitors */
@media (min-width: 1700px){
  .hc-grid{ max-width: 1800px; }
}

/* Tighter on smaller screens */
@media (max-width: 1200px){
  .hc-grid{
    grid-template-columns: 280px minmax(460px, 1fr) 320px;
  }
}

@media (max-width: 980px){
  .hc-grid{
    grid-template-columns: 1fr;
  }
  .hc-left, .hc-right{
    order: 2;
  }
  .hc-center{
    order: 1;
  }
}

.hc-left, .hc-center, .hc-right{
  width:100%;
}