<div class="wrap">
   <div class="card theme-new">
      <div class="card-header">
        <h2>Card Header</h2>
      </div>
      <p>lorem</p>
   </div>
   <div class="card">
    <div class="card-header">
      <h2>Card Header</h2>
    </div>
    <p>lorem</p>
   </div>
   <div class="article theme-new">
    <div class="card-header">
      <h2>Card Header</h2>
    </div>
    <p>lorem</p>
 </div>
</div>

.wrap {
  display: flex;
  gap: 2em;
  padding: 2em;
}
.card {
  container-name: card;
  border-radius: 8px;
  box-shadow: 0 2px 1em #0004;
  padding: 1em;
}
.theme-new {
  --new: true;
}

.article {
  container-name: article;
}

@container card style(--new: true) {
  h2 {
    display: flex;
    align-items: center;
    gap: 0.5em;
  }
  h2:before {
    content: "NEW";
    color: #f66;
    font-size: 0.8em;
  }
}

@container article style(--new: true) {
  p:before {
    content: "NEW";
    color: #f66;
    font-size: 0.8em;
    margin-right: 1em;
  }
}