/* NEWDAWN Today — exact mobile trio treatment */
@media (max-width: 767px) {
  .ndtm-trio{
    display:flex!important;
    flex-wrap:nowrap!important;
    grid-template-columns:none!important;
    gap:14px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding:0 20px 12px!important;
    margin-left:-20px!important;
    margin-right:-20px!important;
  }
  .ndtm-trio::-webkit-scrollbar{display:none!important}

  .ndtm-trio>.ndtm-trio-card{
    flex:0 0 84vw!important;
    width:84vw!important;
    min-width:84vw!important;
    max-width:84vw!important;
    min-height:430px!important;
    height:auto!important;
    grid-column:auto!important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
    overflow:hidden!important;
  }

  /* The last card gets breathing room after it. */
  .ndtm-trio>.ndtm-trio-card:last-child{
    margin-right:4vw!important;
  }

  /* Correct both CSS-background artwork and real image artwork. */
  .ndtm-trio-card .ndtm-trio-bg{
    background-size:cover!important;
    background-position:50% 30%!important;
  }
  .ndtm-trio-card img.ndtm-trio-img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:50% 30%!important;
  }

  /* Undo narrow-column typography caused by the desktop 3-up layout. */
  .ndtm-trio-card h1,
  .ndtm-trio-card h2,
  .ndtm-trio-card h3{
    overflow:visible!important;
    text-overflow:clip!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none!important;
  }

  .ndtm-trio-card p{
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
}