/* Match the interview article's independent sidebar scroll on books / portraits. */
@media(min-width:851px){
  .tkp-shared-detail-layout>.tkp-shared-square-rail,
  .tkp-shared-archive-layout>.tkp-shared-square-rail{
    position:sticky;
    top:101px;
    height:calc(100dvh - 118px);
    min-height:260px;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior-y:contain;
    scrollbar-width:thin;
    scrollbar-color:#ccc4b8 transparent;
    border-left:1px solid #e3ded5;
    padding:0 10px 14px 18px;
    align-self:start;
  }
  body.admin-bar .tkp-shared-detail-layout>.tkp-shared-square-rail,
  body.admin-bar .tkp-shared-archive-layout>.tkp-shared-square-rail{
    top:133px;
    height:calc(100dvh - 150px);
  }
  .tkp-shared-detail-layout>.tkp-shared-square-rail:focus-visible,
  .tkp-shared-archive-layout>.tkp-shared-square-rail:focus-visible{
    outline:2px solid #294e43;
    outline-offset:-3px;
  }
}
@media(max-width:850px){
  .tkp-shared-detail-layout>.tkp-shared-square-rail,
  .tkp-shared-archive-layout>.tkp-shared-square-rail{
    position:static;
    height:auto;
    min-height:0;
    max-height:none;
    overflow:visible;
    border-left:0;
    border-top:1px solid #e3ded5;
    padding:24px 0 0;
  }
}
@media print{
  .tkp-shared-detail-layout>.tkp-shared-square-rail,
  .tkp-shared-archive-layout>.tkp-shared-square-rail{position:static;height:auto;overflow:visible}
}

/* Business column: keep its legacy content and recommended links, but
   make the 2-column article layout independent of fixed legacy pixel widths. */
@media screen and (min-width: 901px) {
  body#businesscolumn .single {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 300px);
    gap: 32px;
    width: 100%;
    align-items: start;
  }
  body#businesscolumn .single > .single-main {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    flex: initial;
  }
  body#businesscolumn .businesscolumnSingle,
  body#businesscolumn .businesscolumnSingle_inner,
  body#businesscolumn .businesscolumnSingle_inner_content {
    min-width: 0;
    max-width: 100%;
  }
  body#businesscolumn .businesscolumnSingle_inner_content_body {
    overflow-wrap: anywhere;
  }
  /* The original full-bleed hero margin escaped the resized article column. */
  body#businesscolumn .businesscolumnSingle_inner_head {
    margin-left: 0;
    margin-right: 0;
  }
  body#businesscolumn .businesscolumnSingle_inner_content_body img,
  body#businesscolumn .businesscolumnSingle_inner_head img {
    display: block;
    max-width: 100%;
    height: auto;
  }
  body#businesscolumn .single > .single-aside {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
    position: sticky;
    top: 101px;
    height: calc(100vh - 118px);
    height: calc(100dvh - 118px);
    min-height: 240px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-width: thin;
    scrollbar-color: #d4ccbf transparent;
    padding: 0 9px 14px 14px;
    border-left: 1px solid #e3ded5;
  }
  /* Unlike the previous release, the first ad must scroll out of view
     when the visitor scrolls this rail, just like on interview pages. */
  body#businesscolumn .single > .single-aside > .tkp-shared-square--top {
    position: static;
    margin: 0 0 26px;
  }
  body#businesscolumn .single > .single-aside::-webkit-scrollbar { display:block; width:6px; }
  body#businesscolumn .single > .single-aside::-webkit-scrollbar-thumb { background:#d4ccbf; border-radius:6px; }
  body#businesscolumn .single > .single-aside:focus-visible { outline:2px solid #8a6b49; outline-offset:-2px; }
  body#businesscolumn.admin-bar .single > .single-aside {
    top: 133px;
    height: calc(100vh - 150px);
    height: calc(100dvh - 150px);
  }
}
@media screen and (max-width: 900px) {
  body#businesscolumn .single { display: block; }
  body#businesscolumn .single > .single-main { width: 100%; min-width: 0; max-width: 100%; margin: 0; }
  body#businesscolumn .businesscolumnSingle_inner_head { margin-left: 0; margin-right: 0; }
  body#businesscolumn .single > .single-aside {
    position: static;
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    margin-top: 40px;
    padding: 24px 0 0;
    border-left: 0;
    border-top: 1px solid #e3ded5;
  }
}
/* The business-column list should not force 2 tiny content cards beside the rail.
   Switch to the same single-column mobile flow at tablet sizes. */
@media screen and (min-width: 901px) {
  .tkp-shared-archive-layout {
    min-width: 0;
    grid-template-columns: minmax(0,1fr) minmax(250px,290px);
    gap: clamp(22px,3vw,42px);
  }
  .tkp-shared-archive-layout > .tkp-shared-archive-main { min-width: 0; }
  .tkp-shared-archive-layout > .tkp-shared-archive-main .index_section_inner {
    max-width: 100%;
    min-width: 0;
  }
  .tkp-shared-archive-layout > .tkp-shared-square-rail {
    overscroll-behavior-y: contain;
  }
  .tkp-shared-archive-layout > .tkp-shared-square-rail > .tkp-shared-square--top {
    position: static;
  }
}
@media screen and (min-width: 901px) and (max-width: 1100px) {
  .tkp-shared-archive-layout > .tkp-shared-archive-main .bizColumnList_item { width: 100%; }
}
@media screen and (max-width: 900px) {
  .tkp-shared-archive-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 25px;
    width: 100%;
  }
  .tkp-shared-archive-layout > .tkp-shared-archive-main,
  .tkp-shared-archive-layout > .tkp-shared-square-rail { min-width: 0; }
  .tkp-shared-archive-layout > .tkp-shared-square-rail {
    position: static;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    border-left: 0;
    border-top: 1px solid #e3ded5;
    padding: 24px 0 0;
  }
}
@media print {
  body#businesscolumn .single > .single-aside,
  .tkp-shared-archive-layout > .tkp-shared-square-rail {
    position: static;
    height: auto;
    min-height: 0;
    overflow: visible;
  }
}