/* Card stripes (Oct 2026): every text card carries a thin stripe on top, as narrow as the Big Five band (3px).
   House cards in Times red, You & AI in its teal, the Glossary in its green, What Others Say in its blue.
   The red Talent10 favorites card has no stripe.
   Typographic title images (cream text cards) get the stripe via js/stripes.js, which adds .card-stripe.
   Loaded last in head.hbs; !important because several cards set border:0 in inline styles. */

/* Homepage */
.qz-card{border-top:3px solid #8E1035 !important}
.hp-t10 .t10c-card{border-top:3px solid #8E1035 !important}
.hp-t10 .t10c-card.t10c-red{border-top:0 !important}
.t10x{border-top:3px solid #8E1035 !important}
.hp-others .others-card{border-top:3px solid var(--others,#2C5A85) !important}
.f3-right>section.f3-yai{border-top-width:3px !important}
.f3-left .qbox{border-top-width:3px !important}
.tg-g{border-top-width:3px !important}

/* Typographic title images (text cards on cream) */
img.card-stripe{border-top:3px solid #8E1035 !important;box-sizing:border-box}

/* Signup boxes */
.promo{border-top:3px solid #8E1035 !important}
.closer-inner{border-top:3px solid #8E1035 !important}
.as-signup{border-top:3px solid #8E1035 !important}

/* In articles: Our Take, Talent Takeaway and other cream boxes (set inline at 4px) come down to 3px; You & AI intro gets its teal */
.article-body div[style*="border-top:4px solid"],.article-body div[style*="border-top: 4px solid"]{border-top-width:3px !important}
.article-body .yai-intro{border-top:3px solid #1F4E5F !important}

@media (max-width:820px){
  /* What Others Say on the phone: only the first story is a card, the rest are plain lines */
  .hp-others .others-card:not(:first-child){border-top:1px solid var(--rule-light) !important}
  .hp-others .others-card:nth-child(2){border-top:0 !important}
}