/**
 * Wider layout - uses more left/right space while staying professional and responsive.
 * Overrides default 940px/1140px constraints with 1280px/1320px.
 */

/* Desktop: wider main content and section containers */
.w-layout-blockcontainer,
.w-container,
.w-layout-blockcontainer.container-5.w-container {
  max-width: 1280px !important;
}

.container {
  max-width: 1320px !important;
}

.container-2,
.container-3 {
  max-width: 1280px !important;
}

/* Stories grid and section containers */
.local-stories-grid,
.stories-news-section .container {
  max-width: 1280px !important;
}

.festive-featured-story {
  max-width: 1280px !important;
}

/* Tablet (991px and below): still wider than old 728px */
@media screen and (max-width: 991px) and (min-width: 768px) {
  .w-layout-blockcontainer,
  .w-container,
  .w-layout-blockcontainer.container-5.w-container {
    max-width: 1100px !important;
  }

  .container {
    max-width: 1140px !important;
  }

  .container-2,
  .container-3 {
    max-width: 1100px !important;
  }

  .local-stories-grid,
  .stories-news-section .container {
    max-width: 95% !important;
  }
}

/* Small tablet and mobile (767px and below): full width, keep side padding */
@media screen and (max-width: 767px) {
  .w-layout-blockcontainer,
  .w-container,
  .w-layout-blockcontainer.container-5.w-container {
    max-width: none !important;
    width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box !important;
  }

  .container {
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box !important;
  }

  .container-2,
  .container-3 {
    max-width: none !important;
  }

  .local-stories-grid,
  .stories-news-section .container {
    max-width: 100% !important;
  }
}

/* Very small screens: slightly reduce horizontal padding */
@media screen and (max-width: 479px) {
  .w-layout-blockcontainer,
  .w-container,
  .w-layout-blockcontainer.container-5.w-container,
  .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}