.blog-image{width:100%;height:170px;object-fit:cover;border-radius:10px;border:1px solid var(--line);margin-bottom:12px}
.article-meta{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;margin:0 0 18px}
.article-hero{width:100%;max-height:440px;object-fit:cover;border:1px solid var(--line);border-radius:14px;margin-bottom:22px}
.article-content{font-size:17px;color:#3d4e67;line-height:1.85;max-width:860px}
.content-page{max-width:1000px;margin:auto}
.ranked-list{display:grid;gap:15px}
.ranked-item{display:grid;grid-template-columns:54px 1fr;gap:16px;border:1px solid var(--line);border-radius:14px;padding:18px;background:#fff}
.rank-number{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:850}
.ranked-item h3{color:var(--navy);margin:0 0 7px;font-size:23px}
.ranked-item p{color:var(--muted);margin:7px 0}
.ranked-image{width:90px;height:58px;object-fit:contain;border:1px solid var(--line);border-radius:8px;margin:5px 10px 6px 0;float:left}
.rank-highlights{padding:10px 12px;background:#fff9e9;border-left:3px solid var(--gold);color:#5b4c2f;margin:14px 0;font-size:14px;white-space:pre-line}
.btn-outline.dark{border-color:#0b2a5e;color:#0b2a5e}
@media(max-width:650px){.article-content{font-size:16px}.ranked-item{grid-template-columns:42px 1fr;padding:14px}.ranked-item h3{font-size:20px}.ranked-image{float:none;display:block;margin:8px 0;width:100px}}