/* ============================================================================
   The Sermons page: the featured message and the archive table.
   ============================================================================ */

.sermon-card{display:grid;grid-template-columns:1fr 1fr;background:var(--cream);overflow:hidden}
.sermon-card__art{position:relative;display:grid;place-items:center;min-height:380px;background:var(--bark);overflow:hidden}
.sermon-card__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62;transition:transform .7s var(--ease)}
.sermon-card__art:hover .sermon-card__photo{transform:scale(1.06)}
.sermon-card__play{
  position:relative;width:96px;height:96px;border-radius:50%;
  border:2px solid #fff;background:rgba(255,255,255,.18);
  display:grid;place-items:center;color:#fff;font-size:30px;transition:.25s var(--ease);
}
.sermon-card__art:hover .sermon-card__play{background:#fff;color:var(--maroon)}
.sermon-card__body{padding:56px 48px;display:flex;flex-direction:column;justify-content:center}
.sermon-card__series{
  font-family:var(--label);font-size:11px;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tan);
}
.sermon-card__title{margin-top:16px;font-family:var(--display);font-size:52px;line-height:.94;text-transform:uppercase;color:var(--ink)}
.sermon-card__meta{margin-top:14px;font-size:15.5px;color:var(--muted)}
.sermon-card__actions{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}

.sermon-tools{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}
.sermon-tools select,.sermon-tools input{
  padding:14px 16px;border:1px solid rgba(27,23,23,.18);background:#fff;
  font-family:var(--sans);font-size:15px;color:var(--ink);
}
.sermon-tools input{flex:1;min-width:260px}
.stable{width:100%;border-collapse:collapse;font-size:16px}
.stable thead th{
  text-align:left;padding:16px;font-family:var(--label);font-size:10.5px;
  font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tan);
  border-bottom:2px solid var(--line-dark);
}
.stable tbody tr{border-bottom:1px solid var(--line-dark)}
.stable td{padding:20px 16px;vertical-align:top;color:var(--body)}
.stable .tc a{font-family:var(--serif);font-size:19px;font-weight:700;color:var(--ink)}
.stable .tc a:hover{color:var(--maroon)}
.stable .ps{color:var(--maroon);font-weight:600}
.stable .dt{color:var(--muted);white-space:nowrap}
.archive-more{text-align:center;margin-top:44px}