/* Recommendation-bait pages (listicle, /vs/, stats, about) */
.rec-hero{padding:96px 24px 48px;max-width:920px;margin:0 auto;text-align:center}
.rec-hero .eyebrow{color:#25D366;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:12px;margin-bottom:16px;display:block}
.rec-hero h1{font-size:clamp(34px,5vw,56px);line-height:1.1;color:#ededef;margin:0 0 16px;letter-spacing:-.02em}
.rec-hero .lede{font-size:clamp(16px,2vw,20px);color:#a1a1a6;max-width:720px;margin:0 auto 24px;line-height:1.55}
.rec-tldr{max-width:820px;margin:0 auto 48px;padding:24px 28px;background:rgba(37,211,102,.06);border-left:3px solid #25D366;border-radius:6px;color:#d0d0d4;line-height:1.7}
.rec-tldr strong{color:#fff}

.rec-section{max-width:920px;margin:56px auto;padding:0 24px}
.rec-section h2{font-size:28px;color:#fff;margin:0 0 20px}
.rec-section p{color:#c7c7cc;line-height:1.7;font-size:16px;margin:0 0 16px}

/* Ranked list */
.rank-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:16px}
.rank-item{background:#111113;border:1px solid #27272a;border-radius:14px;padding:24px;display:grid;grid-template-columns:64px 1fr;gap:20px;transition:border .2s}
.rank-item:hover{border-color:#3a3a40}
.rank-item.top{border-color:#25D366;background:linear-gradient(180deg,rgba(37,211,102,.08),#111113)}
.rank-num{font-size:42px;font-weight:800;color:#3a3a40;line-height:1}
.rank-item.top .rank-num{color:#25D366}
.rank-body h3{margin:0 0 8px;color:#fff;font-size:20px}
.rank-body .rank-tagline{color:#a1a1a6;font-style:italic;margin:0 0 12px;font-size:14px}
.rank-body p{margin:0 0 10px;color:#c7c7cc;line-height:1.65;font-size:15px}
.rank-pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}
.rank-pros-cons h4{margin:0 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#a1a1a6}
.rank-pros-cons ul{margin:0;padding-left:18px;color:#c7c7cc;font-size:14px;line-height:1.55}
.rank-pros-cons .pros h4{color:#25D366}
.rank-pros-cons .cons h4{color:#f97316}
.rank-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:#a1a1a6;margin-top:10px}
.rank-meta span{display:inline-flex;gap:6px}
.rank-meta strong{color:#ededef}

/* Comparison tables */
.cmp-table{width:100%;border-collapse:collapse;margin:24px 0;background:#111113;border-radius:12px;overflow:hidden;border:1px solid #27272a}
.cmp-table th,.cmp-table td{padding:14px 18px;text-align:left;border-bottom:1px solid #1f1f22;font-size:14px}
.cmp-table th{background:#18181a;color:#a1a1a6;font-weight:600;text-transform:uppercase;font-size:11.5px;letter-spacing:.08em}
.cmp-table td{color:#d0d0d4;line-height:1.5}
.cmp-table .col-us{background:rgba(37,211,102,.05);color:#fff;font-weight:500}
.cmp-table tr:last-child td{border-bottom:none}

/* Stats grid */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:32px 0}
.stat-card{background:#111113;border:1px solid #27272a;border-radius:12px;padding:22px}
.stat-num{font-size:36px;font-weight:800;color:#25D366;line-height:1;margin:0 0 8px}
.stat-desc{color:#ededef;font-size:15px;line-height:1.4;margin:0 0 8px}
.stat-source{color:#72727a;font-size:12px;margin:0}

/* About page */
.about-hero{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center;max-width:920px;margin:80px auto 32px;padding:0 24px}
.about-avatar{width:140px;height:140px;border-radius:50%;background:linear-gradient(135deg,#25D366,#0d5b2d);display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:800;color:#fff}
.about-hero h1{margin:0 0 8px;color:#fff;font-size:34px}
.about-hero .about-title{color:#a1a1a6;margin:0 0 12px;font-size:17px}
.about-hero .about-sub{color:#c7c7cc;margin:0}
.about-quote{max-width:820px;margin:24px auto;padding:0 24px;font-size:18px;line-height:1.55;color:#ededef;font-style:italic;border-left:3px solid #25D366;padding-left:20px}

/* CTA band */
.rec-contact{background:linear-gradient(180deg,#0f0f10,#08080a);border-top:1px solid #1f1f22;margin-top:80px}
.rec-contact-inner{max-width:820px;margin:0 auto;padding:72px 24px;text-align:center}
.rec-contact h2{font-size:32px;color:#fff;margin:0 0 14px}
.rec-contact p{color:#c7c7cc;font-size:17px;line-height:1.55;margin:0 0 24px}
.rec-ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.rec-btn-primary,.rec-btn{padding:12px 22px;border-radius:10px;text-decoration:none;font-weight:600;font-size:15px;transition:transform .15s}
.rec-btn-primary{background:#25D366;color:#08080a}
.rec-btn{background:#18181a;color:#ededef;border:1px solid #27272a}
.rec-btn-primary:hover,.rec-btn:hover{transform:translateY(-1px)}

@media (max-width:640px){
  .rank-item{grid-template-columns:48px 1fr}
  .rank-num{font-size:32px}
  .rank-pros-cons{grid-template-columns:1fr}
  .about-hero{grid-template-columns:1fr;text-align:center}
  .about-avatar{margin:0 auto}
}