/* v282 · mobile worship-card refresh
   Keeps the desktop layout untouched. Mobile home cards use live HTML text so
   each week's message can change without rebuilding a baked-in poster image. */

@media (max-width:900px){
  /* Mobile home: keep the approved poster background, but cover its old,
     baked-in sermon card with a live card driven by site-content.js. */
  .mobile-home-editorial .me-worship>.me-sermon{
    background:#fff!important;
    border:1px solid rgba(255,255,255,.92)!important;
    box-shadow:0 14px 28px rgba(27,66,82,.16)!important;
  }
  .mobile-home-editorial .me-worship>.me-sermon>span{
    display:flex!important;
    visibility:visible!important;
    position:absolute!important;
    z-index:3!important;
    inset:0 auto 0 0!important;
    width:62.8%!important;
    box-sizing:border-box!important;
    padding:5.4% 5.2% 4.4%!important;
    justify-content:flex-start!important;
    background:linear-gradient(90deg,#fff 0%,#fff 82%,rgba(255,255,255,.96) 100%)!important;
    color:#173b50!important;
  }
  .mobile-home-editorial .me-worship>.me-sermon>span>*{
    visibility:visible!important;
    position:static!important;
  }
  .mobile-home-editorial .me-worship>.me-sermon>span small{
    display:block!important;
    margin:0!important;
    color:#8b6a46!important;
    font-size:clamp(8px,2.25vw,11px)!important;
    line-height:1.2!important;
    letter-spacing:.14em!important;
    white-space:nowrap!important;
  }
  .mobile-home-editorial .me-worship>.me-sermon>span strong{
    display:block!important;
    margin:12% 0 5%!important;
    color:#173b50!important;
    font-size:clamp(21px,6.9vw,31px)!important;
    line-height:1.13!important;
    letter-spacing:-.10em!important;
    word-break:keep-all!important;
  }
  .mobile-home-editorial .me-worship>.me-sermon>span em{
    display:block!important;
    margin:0!important;
    color:#637c84!important;
    font-size:clamp(9px,2.7vw,13px)!important;
    line-height:1.45!important;
    font-style:normal!important;
    white-space:nowrap!important;
  }
  .mobile-home-editorial .me-worship>.me-sermon>span b{
    display:block!important;
    margin-top:auto!important;
    color:#277f76!important;
    font-size:clamp(10px,3vw,14px)!important;
    line-height:1.2!important;
    white-space:nowrap!important;
  }
  .mobile-home-editorial .me-worship>.me-sermon>img{
    display:block!important;
    visibility:visible!important;
    position:absolute!important;
    z-index:2!important;
    top:0!important;
    right:0!important;
    width:37.2%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:51% 29%!important;
    border-radius:0 42px 42px 0!important;
  }

  /* Mobile archive: use the same four supplied poster tiles as the home. */
  body.md-body .sermon-service-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    margin-top:26px!important;
  }
  body.md-body .sermon-service-grid button{
    position:relative!important;
    min-height:132px!important;
    padding:0!important;
    border:0!important;
    border-radius:17px!important;
    background-position:center!important;
    background-size:cover!important;
    background-repeat:no-repeat!important;
    box-shadow:0 10px 20px rgba(20,59,72,.12)!important;
    color:transparent!important;
    overflow:hidden!important;
  }
  body.md-body .sermon-service-grid button:nth-child(1){background-image:url('assets/worship-service-sunday-gothic-v266.webp')!important}
  body.md-body .sermon-service-grid button:nth-child(2){background-image:url('assets/worship-service-afternoon-gothic-v266.webp')!important}
  body.md-body .sermon-service-grid button:nth-child(3){background-image:url('assets/worship-service-wednesday-gothic-v266.webp')!important}
  body.md-body .sermon-service-grid button:nth-child(4){background-image:url('assets/worship-service-choir-gothic-v266.webp')!important}
  body.md-body .sermon-service-grid button>small,
  body.md-body .sermon-service-grid button>strong,
  body.md-body .sermon-service-grid button>span,
  body.md-body .sermon-service-grid button>b{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
  }
  body.md-body .sermon-service-grid button[aria-selected="true"]{
    background-color:transparent!important;
    box-shadow:0 0 0 2px rgba(215,177,94,.78),0 10px 20px rgba(20,59,72,.15)!important;
  }
}

@media (max-width:560px){
  body.md-body .sermon-service-grid button{min-height:122px!important}
}