.cards-hero { background: linear-gradient(135deg, #091a31 0%, #103447 55%, #123a3b 100%); }
.cards-quick-filters { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.5rem; }
.quick-filter { border:1px solid var(--color-border); border-radius:999px; padding:.55rem .8rem; background:rgba(15, 23, 42, .58); color:var(--color-text-muted); font:inherit; cursor:pointer; transition:background .2s, border-color .2s, color .2s; }
.quick-filter:hover,.quick-filter.is-active { border-color:var(--color-accent); color:var(--color-text); background:rgba(56, 189, 248, .12); }
.cards-guide-grid strong { color:#5eead4; }
.credit-card { min-height:410px; gap:.75rem; }
.card-top { display:flex; justify-content:space-between; gap:.75rem; align-items:center; }
.verified-mark { color:#38bdf8; border:1px solid rgba(56,189,248,.32); border-radius:5px; padding:.18rem .35rem; font-size:.7rem; font-weight:700; white-space:nowrap; }
.card-chips { min-height:30px; display:flex; flex-wrap:wrap; gap:.4rem; }
.card-chip { padding:.3rem .45rem; border-radius:6px; background:rgba(56,189,248,.10); color:#bae6fd; font-size:.73rem; font-weight:700; }
.card-chip-primary { background:rgba(74,222,128,.14); color:#86efac; }
.card-main-feature { display:flex; flex-direction:column; justify-content:center; min-height:75px; padding:.8rem .9rem; border-radius:10px; background:linear-gradient(100deg, rgba(34,197,94,.11), rgba(6,182,212,.08)); }
.card-main-feature span,.card-facts { color:var(--color-text-muted); font-size:.78rem; }.card-main-feature strong { margin-top:.22rem; color:#86efac; font-size:1.35rem; }
.card-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:.45rem; }.card-facts span { display:grid; gap:.18rem; padding:.55rem .35rem; border-top:1px solid var(--color-border); }.card-facts b { color:var(--color-text); font-size:.78rem; }
.conditions-details { color:var(--color-text-muted); font-size:.84rem; line-height:1.45; }.conditions-details summary { cursor:pointer; color:var(--color-accent); font-weight:600; }.conditions-details p { margin:.5rem 0 0; }
.partner-note { color:var(--color-text-muted); font-size:.72rem; align-self:center; }
@media (max-width:640px) { .card-facts { grid-template-columns:1fr; }.card-facts span { grid-template-columns:1fr 1fr; }.partner-note { width:100%; } }