/* V42 / The American Dispatch: category hero typography aligned to homepage.
   Dedicated to the 12 category lead cards; the homepage and article layouts stay unchanged. */
#main.dispatch-category-main .hero .hero-main.desk-live-hero,
#main.dispatch-category-main .hero .hero-main.desk-editorial-hero{
  height:clamp(440px,38vw,510px);
  min-height:440px!important;
  max-height:540px;
  align-items:flex-end;
  overflow:hidden;
  background:#142035;
  isolation:isolate
}
#main.dispatch-category-main .hero .hero-main.desk-live-hero > img,
#main.dispatch-category-main .hero .hero-main.desk-editorial-hero > img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover!important;
  object-position:50% 34%;
  filter:none;
  transform:none;
  transition:transform .35s ease
}
#main.dispatch-category-main .hero .hero-main.desk-live-hero::after,
#main.dispatch-category-main .hero .hero-main.desk-editorial-hero::after{
  content:"";
  pointer-events:none;
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(to top,
    rgba(6,12,22,.95) 0%,
    rgba(6,12,22,.79) 18%,
    rgba(6,12,22,.36) 43%,
    rgba(6,12,22,.10) 63%,
    rgba(6,12,22,0) 82%);
}
#main.dispatch-category-main .hero .desk-live-hero .hero-copy,
#main.dispatch-category-main .hero .desk-editorial-hero .hero-copy{
  box-sizing:border-box;
  position:relative;
  z-index:2;
  align-self:flex-end;
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:24px 29px 22px!important;
  color:#fff
}
#main.dispatch-category-main .hero .desk-live-hero .hero-copy .eyebrow,
#main.dispatch-category-main .hero .desk-editorial-hero .hero-copy .eyebrow{
  margin:0 0 8px!important;
  font-size:9px;
  line-height:1.35;
  letter-spacing:.13em;
  color:#ffb4bc
}
#main.dispatch-category-main .hero .desk-live-hero .hero-copy h2,
#main.dispatch-category-main .hero .desk-editorial-hero .hero-copy h2{
  font:900 clamp(38px,3vw,49px)/1.04 Georgia,"Times New Roman",serif!important;
  letter-spacing:-.038em!important;
  max-width:min(100%,29ch)!important;
  text-wrap:balance;
  overflow-wrap:normal;
  word-break:normal;
  margin:0 0 9px!important;
  color:#fff;
  text-shadow:0 2px 12px #07111a55
}
#main.dispatch-category-main .hero .desk-live-hero .hero-copy h2.desk-hero-long{font-size:clamp(34px,2.6vw,43px)!important;line-height:1.05!important;max-width:min(100%,31ch)!important}
#main.dispatch-category-main .hero .desk-live-hero .hero-copy p,
#main.dispatch-category-main .hero .desk-editorial-hero .hero-copy p{
  font:14px/1.45 system-ui,Arial,sans-serif;
  max-width:68ch;
  color:#e6ebf1;
  margin:0 0 12px!important;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  overflow:hidden
}
#main.dispatch-category-main .hero .desk-live-hero .hero-copy .meta,
#main.dispatch-category-main .hero .desk-editorial-hero .hero-copy .meta{
  font-size:9px;
  letter-spacing:.14em;
  line-height:1.5;
  color:#f2f3f6
}
#main.dispatch-category-main .hero .hero-main.desk-live-hero:hover > img{
  transform:scale(1.015)
}
/* Supporting desk imagery: consistent crops and unchanged source photographs. */
#main.dispatch-category-main .visual-rail .card-img{
  aspect-ratio:16/10;
  height:auto;
  overflow:hidden;
  background:#e6e3da
}
#main.dispatch-category-main .visual-rail .card-img img,
#main.dispatch-category-main .latest-item img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 35%
}
@media(max-width:980px){
  #main.dispatch-category-main .hero .hero-main.desk-live-hero,
  #main.dispatch-category-main .hero .hero-main.desk-editorial-hero{
    height:clamp(420px,54vw,480px);
    min-height:420px!important
  }
  #main.dispatch-category-main .hero .desk-live-hero .hero-copy h2,
  #main.dispatch-category-main .hero .desk-editorial-hero .hero-copy h2{
    font-size:clamp(34px,4vw,42px)!important;
    line-height:1.05!important;
    max-width:min(100%,28ch)!important
  }
}
@media(max-width:600px){
  #main.dispatch-category-main .hero .hero-main.desk-live-hero,
  #main.dispatch-category-main .hero .hero-main.desk-editorial-hero{
    height:clamp(410px,108vw,465px);
    min-height:410px!important;
    max-height:none
  }
  #main.dispatch-category-main .hero .desk-live-hero .hero-copy,
  #main.dispatch-category-main .hero .desk-editorial-hero .hero-copy{
    padding:19px 17px 18px!important
  }
  #main.dispatch-category-main .hero .desk-live-hero .hero-copy h2,
  #main.dispatch-category-main .hero .desk-editorial-hero .hero-copy h2{
    font-size:clamp(30px,7vw,36px)!important;
    line-height:1.06!important;
    max-width:100%!important;
    letter-spacing:-.03em!important
  }
  #main.dispatch-category-main .hero .desk-live-hero .hero-copy h2.desk-hero-long{
    font-size:clamp(28px,6.4vw,33px)!important;
    line-height:1.06!important;
    max-width:100%!important
  }
  #main.dispatch-category-main .hero .desk-live-hero .hero-copy p,
  #main.dispatch-category-main .hero .desk-editorial-hero .hero-copy p{
    font-size:12px;
    line-height:1.4;
    margin-bottom:9px!important
  }
}
@media(prefers-reduced-motion:reduce){
  #main.dispatch-category-main .hero .hero-main.desk-live-hero > img{transition:none}
}