/**
 * Red House B2B — sidebar stack (mobile/tablet)
 * Version: 1.1.0
 *
 * Two templates share the same visual (content + right rail):
 *
 *  A) Classic Divi sidebar
 *     body.et_right_sidebar
 *     #content-area > #left-area + #sidebar
 *     Used by: blog/news singles, category archives
 *     (https://redhouseb2b.com/why-your-ai-strategy-is-a-high-speed-race-to-nowhere/
 *      https://redhouseb2b.com/category/blog/)
 *
 *  B) Divi Specialty Section "fake sidebar"
 *     .et_section_specialty > .et_pb_column_0 (3/4) + .et_pb_column_1 (1/4)
 *     Page CSS locks those at 67% / 26% !important with no breakpoint.
 *     Used by: written case studies / Project CPT
 *     (https://redhouseb2b.com/case-studies/written/moving-prospects-through-buying-cycle/)
 *
 * This file stacks both, then shares widget/search polish.
 */

/* -----------------------------------------------------------
   A) Classic #left-area + #sidebar
   Divi usually stacks these at 980px already. These rules
   make that explicit and tighten the stacked sidebar.
   ----------------------------------------------------------- */
@media only screen and (max-width: 980px) {
  .et_right_sidebar #content-area,
  .et_left_sidebar #content-area {
    width: 100% !important;
  }

  .et_right_sidebar #left-area,
  .et_left_sidebar #left-area,
  .et_right_sidebar #sidebar,
  .et_left_sidebar #sidebar {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    clear: both !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .et_right_sidebar #sidebar,
  .et_left_sidebar #sidebar {
    margin-top: 36px !important;
  }
}

/* -----------------------------------------------------------
   B) Specialty Section columns (the actual broken layout)
   Beat .et_pb_column_0 { width:67%!important } etc.
   ----------------------------------------------------------- */
@media only screen and (max-width: 980px) {
  .et_section_specialty > .et_pb_row > .et_pb_column_0,
  .et_section_specialty > .et_pb_row > .et_pb_column_1,
  .et_section_specialty > .et_pb_row > .et_pb_column {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
    display: block !important;
    clear: both !important;
  }

  .et_section_specialty > .et_pb_row {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
  }

  .et_section_specialty > .et_pb_row > .et_pb_column_0.et_pb_specialty_column {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .et_section_specialty > .et_pb_row > .et_pb_column_1 {
    margin-top: 36px !important;
    padding: 0 20px !important;
  }

  /* Case-study banner + "View All" collision */
  .et_section_specialty .et_pb_image_0,
  .et_section_specialty .et_pb_image_0 .et_pb_image_wrap,
  .et_section_specialty .et_pb_image_0 img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    text-align: left !important;
  }

  .et_section_specialty .et_pb_text_0,
  .et_section_specialty .et_pb_text_0 .et_pb_text_inner,
  .et_section_specialty .et_pb_text_0 .et_pb_text_inner p {
    text-align: left !important;
    margin-bottom: 12px !important;
  }

  .et_section_specialty .et_pb_text_1 .et_pb_text_inner,
  .et_section_specialty .et_pb_text_1 .et_pb_text_inner p,
  .et_section_specialty .et_pb_text_1 .et_pb_text_inner li {
    overflow-wrap: break-word;
    word-wrap: break-word;
  }
}

/* -----------------------------------------------------------
   Shared: sidebar chrome + search widget
   Covers #sidebar (classic) and .et_pb_sidebar_0 (builder)
   ----------------------------------------------------------- */
@media only screen and (max-width: 980px) {
  #sidebar,
  .et_pb_sidebar_0 {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  #sidebar .et_pb_widget,
  .et_pb_sidebar_0 .et_pb_widget {
    width: 100% !important;
    margin-bottom: 28px !important;
    overflow: hidden;
    border: 1px solid #e6e6e6;
    padding: 20px 22px;
    box-sizing: border-box;
  }

  #sidebar .widgettitle,
  .et_pb_sidebar_0 .widgettitle {
    font-size: 18px !important;
    line-height: 1.3 !important;
    margin-bottom: 12px !important;
  }

  #sidebar li,
  #sidebar a,
  .et_pb_sidebar_0 li,
  .et_pb_sidebar_0 a {
    overflow-wrap: anywhere;
    word-break: normal;
    white-space: normal !important;
    line-height: 1.45;
  }

  .et_pb_sidebar_0 .sub-menu {
    margin: 6px 0 12px 14px !important;
    padding: 0 !important;
  }

  #sidebar .widget_search form > div,
  #sidebar #searchform,
  .et_pb_sidebar_0 .widget_search form > div,
  .et_pb_sidebar_0 #searchform {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  #sidebar #s,
  #sidebar input[type="text"],
  .et_pb_sidebar_0 #s,
  .et_pb_sidebar_0 input[type="text"] {
    flex: 1 1 160px;
    width: auto !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  #sidebar #searchsubmit,
  .et_pb_sidebar_0 #searchsubmit {
    flex: 0 0 auto;
  }
}

@media only screen and (max-width: 767px) {
  .et_section_specialty.et_pb_section_0 {
    padding-top: 24px !important;
    padding-bottom: 32px !important;
  }

  .et_section_specialty .et_pb_text_1 h2 {
    font-size: 28px !important;
    line-height: 1.2 !important;
  }

  .et_section_specialty .et_pb_text_1 h5 {
    font-size: 14px !important;
    letter-spacing: 0.04em;
  }

  .et_right_sidebar #main-content .container,
  .et_left_sidebar #main-content .container {
    width: 100% !important;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }
}