/* ==========================================================================
   1. GLOBAL OVERFLOW & WIGGLE PREVENTION
   ========================================================================== */

html, body {
  overflow-x: hidden !important;
  width: 100% !important;
  position: relative;
  margin: 0 !important;
  padding: 0 !important;
}

.siteWrapper,
.siteInnerWrapper,
.pageContainer {
  overflow-x: hidden !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ==========================================================================
   2. NAVIGATION DROPDOWNS
   ========================================================================== */

.navContent ul li ul a {
  white-space: normal !important;
  overflow: visible !important;
}

@media only screen and (min-width: 768px) {
  .navContent ul li ul {
    min-width: 250px !important;
    right: auto !important; 
  }
}

/* ==========================================================================
   3. DESKTOP LAYOUT & CENTERING FIXES
   ========================================================================== */

/* Eliminate right-side blue gap by expanding the primary layout wrapper */
.hasSecondaryContent .primaryAndSecondaryContent,
.primaryContentContainer,
.primaryContent {
  width: 100% !important;
  max-width: 1200px !important;
  float: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Remove default width caps on inner content containers */
.primaryContent .maxWidth--contentTitle,
.primaryContent .maxWidth--content,
.primaryContent .maxWidth--itemContentTitle,
.primaryContent .maxWidth--itemContent {
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Center all block contents, headers, and text */
.primaryContent .blockContent,
.primaryContent .itemsCollectionContent,
.primaryContent .blockText,
.primaryContent .contentTitle,
.primaryContent .blockInnerContent,
.primaryContent .itemContent {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.primaryContent .scEditable--richText p {
  text-align: center !important;
}

/* Center images inside blocks */
.primaryContent .blockImg,
.primaryContent .itemImg {
  display: block !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  height: auto !important;
}

/* ==========================================================================
   4. MOBILE BALANCED SIDE STRIPS (MAX CONTENT SPACE)
   ========================================================================== */

@media only screen and (max-width: 767px) {
  /* Prevent horizontal scrolling on mobile */
  body, 
  .primaryAndSecondaryContainer, 
  .primaryAndSecondaryContent,
  .mainContentContainer,
  .mainContent {
    overflow-x: hidden !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Expand block containers to 98% with equal auto-margins for symmetry */
  .primaryContentContainer,
  .primaryContent,
  .primaryContent .blockContainer,
  .primaryContent .blockContent,
  .primaryContent .blockText {
    width: 98% !important;
    max-width: 98% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* Ensure text fills the full width of the block */
  .primaryContent .maxWidth--contentTitle,
  .primaryContent .maxWidth--content,
  .primaryContent .blockInnerContent,
  .primaryContent .scEditable--richText {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Zero out side margins on text paragraphs and titles */
  .primaryContent .contentTitle,
  .primaryContent .scEditable--richText p {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}