/* =====================================================
   Toptenverse Public Theme v2 — Corporate, premium, animated
   ===================================================== */

:root {
    --tv-navy:        #0f172a;
    --tv-navy-900:    #1e293b;
    --tv-slate-50:    #f8fafc;
    --tv-slate-100:   #f1f5f9;
    --tv-slate-200:   #e2e8f0;
    --tv-slate-400:   #94a3b8;
    --tv-slate-500:   #64748b;
    --tv-slate-600:   #475569;
    --tv-slate-800:   #1e293b;
    --tv-slate-900:   #0f172a;

    --tv-primary:     #2563eb;
    --tv-primary-600: #1d4ed8;
    --tv-primary-700: #1e40af;
    --tv-primary-50:  #eff6ff;
    --tv-accent:      #f97316;
    --tv-accent-600:  #ea580c;
    --tv-cyan:        #06b6d4;
    --tv-cyan-500:    #0ea5e9;

    --tv-radius:      1rem;
    --tv-radius-lg:   1.25rem;
    --tv-radius-xl:   1.5rem;
    --tv-radius-full: 9999px;

    --tv-shadow:      0 4px 6px -1px rgba(0,0,0,0.05), 0 2px 4px -1px rgba(0,0,0,0.03);
    --tv-shadow-md:   0 10px 15px -3px rgba(0,0,0,0.07), 0 4px 6px -2px rgba(0,0,0,0.03);
    --tv-shadow-lg:   0 20px 25px -5px rgba(0,0,0,0.08), 0 10px 10px -5px rgba(0,0,0,0.02);
    --tv-shadow-xl:   0 25px 50px -12px rgba(0,0,0,0.15);
    --tv-glow:        0 0 0 0.25rem rgba(37,99,235,0.18);
    --tv-glow-accent: 0 0 0 0.25rem rgba(249,115,22,0.18);

    --tv-transition:  0.35s cubic-bezier(0.4,0,0.2,1);
    --tv-transition-fast: 0.2s cubic-bezier(0.4,0,0.2,1);
    --tv-transition-slow: 0.6s cubic-bezier(0.22,1,0.36,1);
}

/* Base */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: var(--tv-slate-50);
    color: var(--tv-slate-800);
    overflow-x: hidden;
    line-height: 1.6;
}
::selection { background: var(--tv-primary); color: #fff; }



/* Navbar */
.navbar {
    background: rgba(255,255,255,0.82) !important;
    backdrop-filter: blur(16px) saturate(160%);
    -webkit-backdrop-filter: blur(16px) saturate(160%);
    border-bottom: 1px solid rgba(226,232,240,0.8) !important;
    padding: 0.85rem 0;
    transition: padding var(--tv-transition), box-shadow var(--tv-transition), background var(--tv-transition);
    z-index: 1030;
}
.navbar.sticky-shadow {
    padding: 0.6rem 0;
    box-shadow: 0 10px 30px -5px rgba(15,23,42,0.08);
    background: rgba(255,255,255,0.96) !important;
}
.navbar-brand {
    font-weight: 900;
    font-size: 1.65rem;
    letter-spacing: -0.04em;
    background: linear-gradient(135deg, var(--tv-primary) 0%, var(--tv-cyan-500) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: transform var(--tv-transition-fast);
    position: relative;
}
.navbar-brand::after {
    content: '';
    position: absolute;
    left: 0; bottom: 0; width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-accent));
    transform: scaleX(0); transform-origin: left;
    transition: transform var(--tv-transition-fast);
    border-radius: 2px;
}
.navbar-brand:hover { transform: translateY(-2px); }
.navbar-brand:hover::after { transform: scaleX(1); }

body .navbar .navbar-nav .nav-link {
    position: relative;
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--tv-slate-600);
    padding: 0.55rem 0.85rem !important;
    margin: 0 0.1rem;
    border-radius: var(--tv-radius);
    transition: color var(--tv-transition-fast), background var(--tv-transition-fast), transform var(--tv-transition-fast);
}

body .navbar .navbar-nav .nav-link:hover,
body .navbar .navbar-nav .nav-link:focus {
    color: var(--tv-primary) !important;
    background: var(--tv-primary-50);
    transform: translateY(-1px);
}

.navbar .nav-link::after {
    content: '';
    position: absolute; left: 50%; bottom: 0.25rem;
    width: 0; height: 2px;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-accent));
    border-radius: 2px;
    transform: translateX(-50%);
    transition: width var(--tv-transition-fast);
}
.navbar .nav-link:hover::after { width: 55%; }

.navbar .btn-primary {
    background: linear-gradient(135deg, var(--tv-primary) 0%, var(--tv-primary-600) 100%);
    border: none;
    border-radius: var(--tv-radius);
    font-weight: 600;
    padding: 0.45rem 0.9rem;
    box-shadow: 0 4px 10px rgba(37,99,235,0.25);
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.navbar .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(37,99,235,0.35);
}

.navbar form input[type="search"] {
    border: 1.5px solid var(--tv-slate-200);
    border-radius: var(--tv-radius) 0 0 var(--tv-radius);
    padding-left: 1rem;
    transition: border-color var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.navbar form input[type="search"]:focus {
    border-color: var(--tv-primary);
    box-shadow: var(--tv-glow);
}
.navbar form button {
    border-radius: 0 var(--tv-radius) var(--tv-radius) 0;
}

/* Hero */
.hero {
    position: relative;
    padding: 5rem 0 4.5rem;
    text-align: center;
    color: #fff;
    overflow: hidden;
    background: linear-gradient(135deg, var(--tv-navy) 0%, #1e3a8a 50%, #2563eb 100%);
}
.hero .container { position: relative; z-index: 2; }
.hero h1 {
    font-weight: 900;
    font-size: 2.8rem;
    letter-spacing: -0.05em;
    margin-bottom: 1rem;
    line-height: 1.1;
    text-shadow: 0 8px 30px rgba(0,0,0,0.2);
}
.hero p.lead,
.hero .text-muted,
.hero .lead.text-muted {
    font-size: 1.15rem;
    font-weight: 400;
    color: rgba(255,255,255,0.85) !important;
    max-width: 620px;
    margin: 0 auto;
}

/* Compact hero for auth / entity pages */
.hero.hero-sm {
    padding: 2.5rem 0 2rem;
}
.hero.hero-sm h1 {
    font-size: 2.2rem;
    margin-bottom: 0.5rem;
}
.hero.hero-sm p.lead,
.hero.hero-sm .text-muted {
    font-size: 1.05rem;
    color: rgba(255,255,255,0.8) !important;
}
.hero.hero-sm.text-start,
.hero.hero-sm.text-start h1,
.hero.hero-sm.text-start p.lead,
.hero.hero-sm.text-start .text-muted {
    text-align: left !important;
    margin-left: 0;
}

/* Search / filter heading */
h2 { font-weight: 800; color: var(--tv-slate-900); letter-spacing: -0.03em; }

/* Article cards */
.article-card {
    border: none;
    border-radius: var(--tv-radius-xl);
    background: #fff;
    box-shadow: var(--tv-shadow);
    overflow: hidden;
    transition: transform var(--tv-transition), box-shadow var(--tv-transition);
}
.article-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--tv-shadow-lg);
}
.article-card .card-body { padding: 1.5rem; position: relative; }
.article-card .category-badge {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.35em 0.85em;
    border-radius: var(--tv-radius-full);
    color: #fff;
    margin-bottom: 0.6rem;
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}
.article-card .category-badge:hover { transform: scale(1.05) rotate(-1deg); }
.article-card .card-title a {
    color: var(--tv-slate-900);
    font-weight: 800;
    font-size: 1.15rem;
    line-height: 1.35;
    text-decoration: none;
    transition: color var(--tv-transition-fast);
    display: inline-block;
}
.article-card .card-title a:hover { color: var(--tv-primary); }
.article-card .card-text { color: var(--tv-slate-600); font-size: 0.95rem; }
.article-card .text-muted small { color: var(--tv-slate-500); font-weight: 500; }

/* Rank number */
.rank-number {
    width: 42px; height: 42px;
    display: inline-flex;
    align-items: center; justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--tv-primary), var(--tv-accent));
    color: #fff;
    font-weight: 900;
    font-size: 0.95rem;
    box-shadow: 0 4px 12px rgba(37,99,235,0.28);
    transition: transform var(--tv-transition-fast);
}
.rank-number:hover { transform: scale(1.12) rotate(5deg); }

/* Ad slot */
.ad-slot {
    min-height: 100px;
    background: linear-gradient(135deg, #fff 0%, var(--tv-slate-50) 100%);
    border: 2px dashed var(--tv-slate-200);
    border-radius: var(--tv-radius-lg);
    color: var(--tv-slate-400);
    font-size: 0.85rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color var(--tv-transition-fast), background var(--tv-transition-fast), transform var(--tv-transition-fast);
}
.ad-slot:hover {
    border-color: var(--tv-primary);
    background: var(--tv-primary-50);
    color: var(--tv-primary);
    transform: translateY(-3px);
}

/* List groups (trending / categories) */
.list-group {
    border-radius: var(--tv-radius-lg);
    box-shadow: var(--tv-shadow);
    background: #fff;
    overflow: hidden;
    border: 1px solid var(--tv-slate-100);
}
.list-group-item {
    border: none;
    border-bottom: 1px solid var(--tv-slate-100);
    padding: 0.9rem 1.1rem;
    color: var(--tv-slate-700);
    font-weight: 500;
    transition: background var(--tv-transition-fast), padding var(--tv-transition-fast);
    display: flex; align-items: center; gap: 0.75rem;
}
.list-group-item:last-child { border-bottom: none; }
.list-group-item:hover {
    background: var(--tv-slate-50);
    color: var(--tv-primary);
    padding-left: 1.35rem;
}
.list-group-item .badge {
    background: var(--tv-slate-100);
    color: var(--tv-slate-600);
    border: 1px solid var(--tv-slate-200);
    font-weight: 700;
    transition: transform var(--tv-transition-fast), background var(--tv-transition-fast);
}
.list-group-item:hover .badge { background: var(--tv-primary-50); color: var(--tv-primary); transform: scale(1.08); }

/* Sidebar headings */
aside h5, .col-lg-4 h5 {
    font-weight: 800;
    color: var(--tv-slate-900);
    margin-bottom: 1rem;
    font-size: 1.1rem;
}

/* Category badge list on navbar */
.navbar .nav-link[href*="/category/"] { font-weight: 600; }

/* Empty state */
.alert-info {
    background: linear-gradient(135deg, #e0f2fe 0%, #dbeafe 100%);
    border: 1px solid #bae6fd;
    color: var(--tv-primary-700);
    border-radius: var(--tv-radius-lg);
    padding: 1.5rem;
    font-weight: 500;
    box-shadow: var(--tv-shadow);
    position: relative;
    overflow: hidden;
}
.alert-info::before {
    content: '';
    position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
    background: linear-gradient(180deg, var(--tv-primary), var(--tv-cyan));
}

/* Pagination */
.pagination {}
.pagination .page-link {
    border: 1.5px solid var(--tv-slate-200);
    color: var(--tv-slate-600);
    border-radius: 0.6rem;
    margin: 0 0.2rem;
    font-weight: 600;
    min-width: 2.5rem; height: 2.5rem;
    display: flex; align-items: center; justify-content: center;
    transition: all var(--tv-transition-fast);
}
.pagination .page-link:hover,
.pagination .page-item.active .page-link {
    background: linear-gradient(135deg, var(--tv-primary), var(--tv-primary-600));
    color: #fff;
    border-color: transparent;
    box-shadow: 0 4px 10px rgba(37,99,235,0.25);
    transform: translateY(-2px);
}

/* Footer */
footer {
    background: var(--tv-navy);
    color: var(--tv-slate-400);
    padding: 4rem 0 3rem;
    margin-top: 5rem;
    position: relative;
    overflow: hidden;
}
footer::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-cyan), var(--tv-accent), var(--tv-primary));
}
footer h5 {
    color: #fff;
    font-weight: 800;
    font-size: 1.4rem;
    margin-bottom: 0.5rem;
    letter-spacing: -0.02em;
}
footer a {
    color: var(--tv-slate-400);
    text-decoration: none;
    transition: color var(--tv-transition-fast), transform var(--tv-transition-fast);
    display: inline-block;
}
footer a:hover {
    color: var(--tv-cyan);
    transform: translateX(3px);
}
footer .form-control {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.12);
    color: #fff;
    border-radius: var(--tv-radius) 0 0 var(--tv-radius);
}
footer .form-control:focus {
    background: rgba(255,255,255,0.12);
    border-color: var(--tv-primary);
    color: #fff;
    box-shadow: none;
}
footer .btn-primary {
    border-radius: 0 var(--tv-radius) var(--tv-radius) 0;
    background: linear-gradient(135deg, var(--tv-primary), var(--tv-accent));
    border: none;
    font-weight: 700;
}
footer .text-muted { color: var(--tv-slate-500) !important; }

/* Buttons global */
.btn-primary {
    background: linear-gradient(135deg, var(--tv-primary) 0%, var(--tv-primary-600) 100%);
    border: none;
    color: #fff;
    border-radius: 0.65rem;
    font-weight: 600;
    padding: 0.55rem 1.2rem;
    box-shadow: 0 4px 12px rgba(37,99,235,0.25);
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast), background var(--tv-transition-fast);
    position: relative;
    overflow: hidden;
}
.btn-primary::after {
    content: '';
    position: absolute; top: 0; left: -100%; width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
    transition: left 0.5s ease;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(37,99,235,0.35);
    color: #fff;
}
.btn-primary:hover::after { left: 100%; }

.btn-outline-primary {
    border: 1.5px solid var(--tv-primary);
    color: var(--tv-primary);
    border-radius: 0.65rem;
    font-weight: 600;
    transition: all var(--tv-transition-fast);
}
.btn-outline-primary:hover {
    background: var(--tv-primary);
    color: #fff;
    box-shadow: 0 4px 12px rgba(37,99,235,0.2);
    transform: translateY(-2px);
}

.btn-outline-success,
.btn-outline-warning,
.btn-outline-dark {
    font-weight: 600;
    border-radius: 0.65rem;
    transition: all var(--tv-transition-fast);
}
.btn-outline-success:hover,
.btn-outline-warning:hover,
.btn-outline-dark:hover { transform: translateY(-2px); }

/* Category floating badges (optional) */
.category-pill {
    display: inline-block;
    padding: 0.35rem 0.9rem;
    border-radius: var(--tv-radius-full);
    color: #fff;
    font-weight: 700;
    font-size: 0.82rem;
    box-shadow: 0 3px 10px rgba(0,0,0,0.15);
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.category-pill:hover { transform: translateY(-2px) scale(1.05); }



/* =====================================================
   v2.1 — Full-width corporate header, scroll nav & ticker
   ===================================================== */

/* Header */
.tv-header {
    position: sticky;
    top: 0;
    z-index: 1040;
    width: 100%;
    background: rgba(255,255,255,0.88);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border-bottom: 1px solid rgba(226,232,240,0.85);
    box-shadow: 0 8px 30px -5px rgba(15,23,42,0.06);
    transition: padding var(--tv-transition), box-shadow var(--tv-transition), background var(--tv-transition);
}
.tv-header.sticky-shadow {
    background: rgba(255,255,255,0.96);
    box-shadow: 0 12px 40px -8px rgba(15,23,42,0.12);
}
[data-bs-theme="dark"] .tv-header {
    background: rgba(15,23,42,0.88);
    border-color: rgba(51,65,85,0.8);
}
[data-bs-theme="dark"] .tv-header.sticky-shadow { background: rgba(15,23,42,0.96); }

.tv-header-grid {
    display: flex;
    align-items: center;
    width: 100%;
    height: 68px;
    padding: 0 1rem;
    gap: 0.75rem;
}

.tv-header-left {
    flex: 0 0 calc(15% - 0.5rem);
    max-width: calc(15% - 0.5rem);
    min-width: 0;
    display: flex;
    align-items: center;
}
.tv-logo {
    font-size: 1.7rem;
    font-weight: 900;
    letter-spacing: -0.04em;
    text-decoration: none;
    background: linear-gradient(135deg, var(--tv-primary) 0%, var(--tv-cyan-500) 50%, var(--tv-accent) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    position: relative;
    transition: transform var(--tv-transition-fast), filter var(--tv-transition-fast);
    filter: drop-shadow(0 2px 6px rgba(37,99,235,0.15));
}
.tv-logo::after {
    content: '';
    position: absolute;
    left: 0; bottom: -2px;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-cyan), var(--tv-accent));
    transform: scaleX(0); transform-origin: left;
    transition: transform var(--tv-transition-fast);
    border-radius: 2px;
}
.tv-logo:hover {
    transform: translateY(-2px) scale(1.02);
    filter: drop-shadow(0 6px 14px rgba(37,99,235,0.25));
}
.tv-logo:hover::after { transform: scaleX(1); }

.tv-header-center {
    flex: 0 0 calc(60% - 0.5rem);
    max-width: calc(60% - 0.5rem);
    min-width: 0;
    display: flex;
    align-items: center;
    position: relative;
    height: 100%;
}
.tv-nav-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--tv-slate-600);
    box-shadow: 0 2px 8px rgba(15,23,42,0.12);
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--tv-transition-fast), transform var(--tv-transition-fast), color var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-header:hover .tv-nav-arrow { opacity: 1; }
.tv-nav-arrow:hover {
    color: var(--tv-primary);
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 4px 14px rgba(37,99,235,0.25);
}
.tv-nav-arrow:disabled { opacity: 0.2 !important; cursor: default; }
.tv-nav-prev { left: 0; }
.tv-nav-next { right: 0; }

.tv-nav-rail {
    flex: 1;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    cursor: grab;
    padding: 0 1.6rem;
    mask-image: linear-gradient(90deg, transparent 0%, #000 4%, #000 96%, transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 4%, #000 96%, transparent 100%);
}
.tv-nav-rail::-webkit-scrollbar { display: none; }
.tv-nav-rail.grabbing { cursor: grabbing; scroll-behavior: auto; }

.tv-nav-list {
    display: inline-flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.2rem;
}
.tv-nav-list li a {
    display: block;
    white-space: nowrap;
    padding: 0.55rem 0.9rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--tv-slate-600);
    text-decoration: none;
    border-radius: var(--tv-radius);
    transition: color var(--tv-transition-fast), background var(--tv-transition-fast), transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
    position: relative;
}
.tv-nav-list li a:hover,
.tv-nav-list li a.active {
    color: var(--tv-primary);
    background: var(--tv-primary-50);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(37,99,235,0.12);
}
.tv-nav-list li a::after {
    content: '';
    position: absolute;
    left: 50%; bottom: 0.15rem;
    width: 0; height: 2px;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-accent));
    border-radius: 2px;
    transform: translateX(-50%);
    transition: width var(--tv-transition-fast);
}
.tv-nav-list li a:hover::after,
.tv-nav-list li a.active::after { width: 55%; }

.tv-header-right {
    flex: 0 0 calc(25% - 0.5rem);
    max-width: calc(25% - 0.5rem);
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.4rem;
}
.tv-search {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1;
    max-width: 130px;
    min-width: 0;
}
.tv-search input {
    width: 100%;
    border: 1.5px solid var(--tv-slate-200);
    border-radius: var(--tv-radius-full);
    padding: 0.4rem 2rem 0.4rem 0.85rem;
    font-size: 0.78rem;
    background: var(--tv-slate-50);
    transition: border-color var(--tv-transition-fast), box-shadow var(--tv-transition-fast), background var(--tv-transition-fast);
}
.tv-search input:focus {
    outline: none;
    border-color: var(--tv-primary);
    background: #fff;
    box-shadow: var(--tv-glow);
}
.tv-search button {
    position: absolute;
    right: 0.25rem;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: linear-gradient(135deg, var(--tv-primary), var(--tv-primary-600));
    color: #fff;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-search button:hover {
    transform: translateY(-50%) scale(1.08);
    box-shadow: 0 4px 10px rgba(37,99,235,0.3);
}

.tv-user { display: flex; align-items: center; gap: 0.35rem; }
.tv-user .btn { border-radius: var(--tv-radius-full); font-weight: 600; font-size: 0.72rem; padding: 0.32rem 0.55rem; }
.tv-user .btn-outline-primary { border-width: 1.5px; }
.tv-user-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--tv-slate-100);
    color: var(--tv-slate-600);
    text-decoration: none;
    transition: all var(--tv-transition-fast);
}
.tv-user-btn:hover {
    background: var(--tv-primary-50);
    color: var(--tv-primary);
    transform: translateY(-2px);
}
.tv-btn-glow { box-shadow: 0 4px 14px rgba(37,99,235,0.35); }

/* News ticker */
.tv-ticker-bar {
    display: flex;
    align-items: center;
    width: 100%;
    height: 44px;
    background: linear-gradient(90deg, var(--tv-navy) 0%, var(--tv-navy-900) 100%);
    color: #fff;
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.tv-ticker-label {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 1.25rem;
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    background: linear-gradient(135deg, var(--tv-primary), var(--tv-accent));
    height: 100%;
    z-index: 2;
    box-shadow: 4px 0 15px rgba(0,0,0,0.25);
}
.tv-ticker-label i {}

.tv-ticker-track {
    flex: 1;
    overflow: hidden;
    position: relative;
    height: 100%;
    mask-image: linear-gradient(90deg, transparent 0%, #000 3%, #000 97%, transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 3%, #000 97%, transparent 100%);
}
.tv-ticker-items {
    display: flex;
    align-items: center;
    height: 100%;
    width: max-content;
    gap: 2.5rem;
    padding-left: 2.5rem;
}
.tv-ticker-items a {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    color: rgba(255,255,255,0.88);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    white-space: nowrap;
    transition: color var(--tv-transition-fast), transform var(--tv-transition-fast);
}
.tv-ticker-items a:hover { color: #fff; transform: translateX(4px); }
.tv-ticker-items a::before {
    content: 'Top 10';
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.15em 0.5em;
    border-radius: var(--tv-radius-full);
    background: var(--tv-primary);
    color: #fff;
}



/* Full-width sections */
.tv-section {
    width: 100%;
    padding: 3.5rem 0;
    position: relative;
    overflow: hidden;
}
.tv-section:nth-of-type(odd) { background: #fff; }
.tv-section:nth-of-type(even) { background: var(--tv-slate-50); }
.tv-section-featured {
    background:
        radial-gradient(ellipse at 10% 0%, rgba(37,99,235,0.06) 0%, transparent 40%),
        radial-gradient(ellipse at 90% 100%, rgba(249,115,22,0.05) 0%, transparent 40%),
        #fff !important;
}
.tv-section-entities {
    background:
        radial-gradient(ellipse at 90% 0%, rgba(6,182,212,0.06) 0%, transparent 40%),
        radial-gradient(ellipse at 10% 100%, rgba(37,99,235,0.05) 0%, transparent 40%),
        var(--tv-slate-50) !important;
}
.tv-section-types {
    background:
        radial-gradient(ellipse at 50% 0%, rgba(249,115,22,0.05) 0%, transparent 40%),
        #fff !important;
}
.tv-section-inner {
    padding-left: 2rem;
    padding-right: 2rem;
    max-width: 1600px;
    margin: 0 auto;
}
.tv-section-overline {
    display: block;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--tv-primary);
    margin-bottom: 0.25rem;
}
.tv-section-title {
    font-weight: 900;
    font-size: 1.75rem;
    color: var(--tv-slate-900);
    letter-spacing: -0.03em;
    margin: 0;
}

/* Horizontal rails */
.tv-rail-wrapper {
    position: relative;
    width: 100%;
}
.tv-rail {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    cursor: grab;
    padding: 0.5rem 0;
    mask-image: linear-gradient(90deg, transparent 0%, #000 2%, #000 98%, transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 2%, #000 98%, transparent 100%);
}
.tv-rail::-webkit-scrollbar { display: none; }
.tv-rail.grabbing { cursor: grabbing; scroll-behavior: auto; }
.tv-rail-track {
    display: inline-flex;
    align-items: stretch;
    gap: 1.25rem;
    padding: 0 1rem;
    width: max-content;
}

.tv-rail-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--tv-slate-600);
    box-shadow: 0 4px 14px rgba(15,23,42,0.12);
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--tv-transition-fast), transform var(--tv-transition-fast), color var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-rail-wrapper:hover .tv-rail-arrow { opacity: 1; }
.tv-rail-arrow:hover {
    color: var(--tv-primary);
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 6px 18px rgba(37,99,235,0.22);
}
.tv-rail-arrow:disabled { opacity: 0.2 !important; cursor: default; }
.tv-rail-prev { left: -10px; }
.tv-rail-next { right: -10px; }

/* Featured ranking cards */
.tv-featured-card {
    display: flex;
    flex-direction: column;
    width: 320px;
    background: #fff;
    border-radius: var(--tv-radius-xl);
    box-shadow: var(--tv-shadow);
    text-decoration: none;
    overflow: hidden;
    transition: transform var(--tv-transition), box-shadow var(--tv-transition);
    border: 1px solid var(--tv-slate-100);
}
.tv-featured-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--tv-shadow-xl);
}
.tv-featured-card-top {
    height: 8px;
    width: 100%;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-accent));
}
.tv-featured-card-body { padding: 1.4rem; flex: 1; }
.tv-featured-badge {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.35em 0.75em;
    border-radius: var(--tv-radius-full);
    background: var(--tv-slate-100);
    color: var(--tv-slate-600);
    margin-bottom: 0.75rem;
}
.tv-featured-title {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--tv-slate-900);
    line-height: 1.35;
    margin-bottom: 0.5rem;
}
.tv-featured-desc {
    font-size: 0.88rem;
    color: var(--tv-slate-500);
    line-height: 1.55;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.tv-featured-card-foot {
    padding: 0.9rem 1.4rem;
    border-top: 1px solid var(--tv-slate-100);
    background: var(--tv-slate-50);
}
.tv-featured-cta {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--tv-primary);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    transition: gap var(--tv-transition-fast);
}
.tv-featured-card:hover .tv-featured-cta { gap: 0.65rem; }

/* Latest entity cards */
.tv-entity-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 280px;
    padding: 1.1rem 1.3rem;
    background: #fff;
    border-radius: var(--tv-radius-lg);
    box-shadow: var(--tv-shadow);
    text-decoration: none;
    border: 1px solid var(--tv-slate-100);
    transition: transform var(--tv-transition), box-shadow var(--tv-transition);
}
.tv-entity-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--tv-shadow-lg);
}
.tv-entity-avatar {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    font-weight: 900;
    color: #fff;
    background: linear-gradient(135deg, var(--tv-primary), var(--tv-cyan));
    box-shadow: 0 4px 12px rgba(37,99,235,0.25);
}
.tv-entity-body { min-width: 0; }
.tv-entity-name {
    font-size: 0.98rem;
    font-weight: 800;
    color: var(--tv-slate-900);
    margin: 0 0 0.25rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tv-entity-summary {
    font-size: 0.8rem;
    color: var(--tv-slate-500);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Type pills */
.tv-type-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.7rem 1.2rem;
    background: #fff;
    border: 1.5px solid var(--tv-slate-200);
    border-radius: var(--tv-radius-full);
    color: var(--tv-slate-700);
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: all var(--tv-transition-fast);
    box-shadow: var(--tv-shadow);
}
.tv-type-pill:hover {
    border-color: var(--tv-primary);
    color: var(--tv-primary);
    background: var(--tv-primary-50);
    transform: translateY(-4px) scale(1.03);
    box-shadow: 0 8px 20px rgba(37,99,235,0.14);
}
.tv-types-track { gap: 0.9rem; padding: 0.25rem 0.5rem; }

/* Hero article (first story) */
.tv-hero-article {
    border: none;
    border-radius: var(--tv-radius-xl);
    background: #fff;
    box-shadow: var(--tv-shadow-md);
    overflow: hidden;
    transition: transform var(--tv-transition), box-shadow var(--tv-transition);
    border: 1px solid var(--tv-slate-100);
}
.tv-hero-article:hover {
    transform: translateY(-8px);
    box-shadow: var(--tv-shadow-xl);
}
.tv-hero-article .card-img-top {
    height: 220px;
    object-fit: cover;
    transition: transform 0.7s cubic-bezier(0.22,1,0.36,1);
}
.tv-hero-article:hover .card-img-top { transform: scale(1.05); }
.tv-hero-article .card-body { padding: 1.25rem; }
.tv-hero-article h3 {
    font-weight: 800;
    font-size: 1.2rem;
    color: var(--tv-slate-900);
    line-height: 1.35;
    letter-spacing: -0.02em;
}
.tv-hero-article h3 a:hover { color: var(--tv-primary); }
.tv-hero-article .card-text {
    font-size: 0.9rem;
    color: var(--tv-slate-600);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

/* Featured article ribbon */
.tv-featured-article {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(37,99,235,0.18) !important;
    box-shadow: 0 10px 25px -5px rgba(37,99,235,0.12);
}
.tv-featured-article:hover {
    box-shadow: 0 16px 35px -8px rgba(37,99,235,0.18);
}
.tv-featured-article::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-accent));
    z-index: 2;
}
.tv-featured-ribbon {
    position: absolute;
    top: 12px; right: -34px;
    transform: rotate(45deg);
    width: 130px;
    text-align: center;
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #fff;
    background: linear-gradient(135deg, var(--tv-primary), var(--tv-accent));
    padding: 0.25rem 0;
    z-index: 3;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* Community / sidebar panels */
.tv-section-community {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
}
.tv-side-panel {
    background: #fff;
    border-radius: var(--tv-radius-xl);
    box-shadow: var(--tv-shadow);
    padding: 1.25rem;
    border: 1px solid var(--tv-slate-100);
    transition: transform var(--tv-transition), box-shadow var(--tv-transition);
}
.tv-side-panel:hover {
    transform: translateY(-4px);
    box-shadow: var(--tv-shadow-md);
}
.tv-side-title {
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--tv-slate-900);
    margin-bottom: 1rem;
    letter-spacing: -0.02em;
}
.tv-side-list {
    border-radius: var(--tv-radius-lg);
    overflow: hidden;
}
.tv-side-list .list-group-item {
    border-left: 0; border-right: 0;
    padding: 0.8rem 0;
}
.tv-side-list .list-group-item:first-child { border-top: 0; }
.tv-side-list .list-group-item:last-child { border-bottom: 0; }

/* Section titles */
    font-weight: 900;
    font-size: 1.6rem;
    color: var(--tv-slate-900);
    letter-spacing: -0.03em;
    position: relative;
    display: inline-block;
    margin-bottom: 1.5rem;
}
.section-title::after {
    content: '';
    position: absolute;
    left: 0; bottom: -6px;
    width: 50px; height: 4px;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-accent));
}

/* Responsive */
@media (max-width: 1200px) {
    .tv-header-left { flex: 0 0 calc(18% - 0.5rem); max-width: calc(18% - 0.5rem); }
    .tv-header-center { flex: 0 0 calc(57% - 0.5rem); max-width: calc(57% - 0.5rem); }
    .tv-header-right { flex: 0 0 calc(25% - 0.5rem); max-width: calc(25% - 0.5rem); }
}
@media (max-width: 992px) {
    .tv-header-grid { height: auto; flex-wrap: wrap; padding: 0.6rem 1rem; gap: 0.5rem; }
    .tv-header-left { flex: 0 0 calc(50% - 0.25rem); max-width: calc(50% - 0.25rem); order: 1; }
    .tv-header-right { flex: 0 0 calc(50% - 0.25rem); max-width: calc(50% - 0.25rem); order: 2; justify-content: flex-end; }
    .tv-header-center { flex: 0 0 100%; max-width: 100%; order: 3; margin-top: 0.25rem; }
    .tv-nav-arrow { opacity: 1; width: 28px; height: 28px; }
    .tv-search { max-width: 180px; }
    .hero h1 { font-size: 2.8rem; }
    .hero { padding: 5.5rem 0 6.5rem; }
}
@media (max-width: 768px) {
    .tv-logo { font-size: 1.35rem; }
    .tv-search { max-width: 140px; }
    .tv-user .btn { font-size: 0.75rem; padding: 0.35rem 0.65rem; }
    .hero h1 { font-size: 2.1rem; }
    .hero p.lead { font-size: 1.05rem; }
    footer { padding: 3rem 0 2rem; }
}
@media (max-width: 480px) {
    .tv-header-left { flex: 0 0 calc(40% - 0.25rem); max-width: calc(40% - 0.25rem); }
    .tv-header-right { flex: 0 0 calc(60% - 0.25rem); max-width: calc(60% - 0.25rem); }
    .tv-search input { padding-right: 2rem; }
}

/* =====================================================
   Article page design — crystal clear, user friendly
   ===================================================== */

/* Article hero */
.tv-article-hero {
    position: relative;
    width: 100%;
    min-height: 360px;
    padding: 6rem 0 3rem;
    background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 50%, #2563eb 100%);
    color: #fff;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
}
.tv-article-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 15% 30%, rgba(255,255,255,0.1) 0%, transparent 25%),
        radial-gradient(circle at 85% 70%, rgba(255,255,255,0.06) 0%, transparent 25%);
}
.tv-article-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15,23,42,0.2) 0%, rgba(15,23,42,0.6) 70%, rgba(15,23,42,0.85) 100%);
    z-index: 1;
}
.tv-article-hero-content {
    position: relative;
    z-index: 2;
}
.tv-article-breadcrumb {
    --bs-breadcrumb-divider: '>';
    background: rgba(255,255,255,0.12);
    backdrop-filter: blur(8px);
    border-radius: var(--tv-radius-full);
    padding: 0.4rem 0.9rem;
    display: inline-flex;
    margin-bottom: 1rem;
}
.tv-article-breadcrumb a,
.tv-article-breadcrumb .active {
    color: rgba(255,255,255,0.9);
    text-decoration: none;
    font-size: 0.82rem;
    font-weight: 500;
}
.tv-article-breadcrumb a:hover { color: #fff; text-decoration: underline; }
.tv-article-title {
    font-weight: 900;
    font-size: 2.8rem;
    line-height: 1.1;
    letter-spacing: -0.04em;
    max-width: 820px;
    text-shadow: 0 4px 20px rgba(0,0,0,0.35);
    margin-bottom: 1rem;
}
.tv-article-meta {
    color: rgba(255,255,255,0.82);
    font-size: 0.95rem;
    margin: 0;
}
.tv-article-meta a { color: rgba(255,255,255,0.7); text-decoration: underline; }
.tv-article-meta a:hover { color: #fff; }
@media (max-width: 768px) {
    .tv-article-hero { min-height: 320px; padding: 5rem 0 2.5rem; }
    .tv-article-title { font-size: 1.9rem; }
    .tv-article-breadcrumb { font-size: 0.75rem; }
}

/* Article content typography */
.article-content {
    color: var(--tv-slate-700);
    font-size: 1.08rem;
    line-height: 1.85;
}
.article-content h2,
.article-content h3,
.article-content h4 {
    color: var(--tv-slate-900);
    font-weight: 800;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    letter-spacing: -0.02em;
}
.article-content h2 { font-size: 1.85rem; }
.article-content h3 { font-size: 1.45rem; }
.article-content p { margin-bottom: 1.35rem; }
.article-content ul,
.article-content ol {
    padding-left: 1.5rem;
    margin-bottom: 1.5rem;
}
.article-content li { margin-bottom: 0.5rem; }
.article-content strong { color: var(--tv-slate-900); }
.article-content a {
    color: var(--tv-primary);
    text-decoration: none;
    border-bottom: 1px solid rgba(37,99,235,0.25);
    transition: color var(--tv-transition-fast), border-color var(--tv-transition-fast);
}
.article-content a:hover {
    color: var(--tv-primary-700);
    border-bottom-color: var(--tv-primary);
}
.article-content blockquote {
    border-left: 4px solid var(--tv-primary);
    background: var(--tv-primary-50);
    padding: 1.25rem 1.5rem;
    border-radius: 0 var(--tv-radius) var(--tv-radius) 0;
    font-style: italic;
    color: var(--tv-slate-700);
    margin: 2rem 0;
}
.article-content img {
    max-width: 100%;
    border-radius: var(--tv-radius-lg);
    box-shadow: var(--tv-shadow);
    margin: 1.5rem 0;
}
.article-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    background: #fff;
    border-radius: var(--tv-radius);
    overflow: hidden;
    box-shadow: var(--tv-shadow);
}
.article-content th,
.article-content td {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--tv-slate-100);
    text-align: left;
}
.article-content th {
    background: var(--tv-slate-50);
    font-weight: 800;
    color: var(--tv-slate-900);
}

/* Rank section / cards */
.tv-rank-section { padding-top: 1rem; }
.tv-rank-card {
    background: #fff;
    border: 1px solid var(--tv-slate-100);
    border-radius: var(--tv-radius-xl);
    box-shadow: var(--tv-shadow);
    margin-bottom: 1.5rem;
    overflow: hidden;
    transition: transform var(--tv-transition), box-shadow var(--tv-transition);
    scroll-margin-top: 100px;
}
.tv-rank-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--tv-shadow-lg);
}
.tv-rank-card-header {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem;
    background: linear-gradient(135deg, var(--tv-slate-50) 0%, #fff 100%);
    border-bottom: 1px solid var(--tv-slate-100);
}
.tv-rank-number {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--tv-primary), var(--tv-accent));
    color: #fff;
    font-size: 1.3rem;
    font-weight: 900;
    box-shadow: 0 6px 16px rgba(37,99,235,0.25);
}
.tv-rank-title-block { min-width: 0; }
.tv-rank-name {
    font-size: 1.35rem;
    font-weight: 900;
    color: var(--tv-slate-900);
    letter-spacing: -0.02em;
    margin: 0 0 0.35rem;
}
.tv-rank-meta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
}
.tv-rank-rating {
    background: #fef3c7;
    color: #92400e;
    padding: 0.25rem 0.65rem;
    border-radius: var(--tv-radius-full);
    font-weight: 800;
}
.tv-rank-bestfor {
    background: #e0f2fe;
    color: #075985;
    padding: 0.25rem 0.65rem;
    border-radius: var(--tv-radius-full);
    font-weight: 700;
}
.tv-rank-card-body { padding: 1.5rem; }
.tv-rank-image {
    width: 100%;
    height: 240px;
    border-radius: var(--tv-radius-lg);
    overflow: hidden;
    margin-bottom: 1.25rem;
    box-shadow: var(--tv-shadow);
}
.tv-rank-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}
.tv-rank-card:hover .tv-rank-image img { transform: scale(1.05); }
.tv-rank-desc {
    font-size: 1.02rem;
    color: var(--tv-slate-700);
    line-height: 1.7;
    margin-bottom: 1rem;
}
.tv-rank-pricing {
    display: inline-flex;
    align-items: center;
    background: var(--tv-slate-50);
    border: 1px solid var(--tv-slate-200);
    color: var(--tv-slate-700);
    padding: 0.45rem 0.85rem;
    border-radius: var(--tv-radius-full);
    font-size: 0.88rem;
    margin-bottom: 1.25rem;
}
.tv-rank-list { margin-bottom: 0.5rem; }
.tv-rank-list-title {
    font-weight: 800;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.65rem;
    display: flex;
    align-items: center;
}
.tv-rank-pros .tv-rank-list-title { color: #166534; }
.tv-rank-cons .tv-rank-list-title { color: #b91c1c; }
.tv-rank-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.tv-rank-list li {
    position: relative;
    padding-left: 1.5rem;
    margin-bottom: 0.5rem;
    font-size: 0.92rem;
    color: var(--tv-slate-700);
    line-height: 1.5;
}
.tv-rank-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.45rem;
    width: 7px;
    height: 7px;
    border-radius: 50%;
}
.tv-rank-pros li::before { background: #22c55e; }
.tv-rank-cons li::before { background: #ef4444; }
.tv-rank-verdict {
    background: linear-gradient(135deg, #eff6ff 0%, #f0f9ff 100%);
    border: 1px solid #bfdbfe;
    border-radius: var(--tv-radius);
    padding: 1rem 1.25rem;
    margin: 1.25rem 0 1rem;
    color: var(--tv-slate-800);
    font-weight: 500;
    font-size: 0.95rem;
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}
.tv-rank-cta {
    border-radius: var(--tv-radius-full);
    font-weight: 700;
    padding: 0.6rem 1.4rem;
    box-shadow: 0 6px 18px rgba(37,99,235,0.28);
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-rank-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(37,99,235,0.38);
}

/* Article tags */
.tv-article-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.tv-tag {
    display: inline-block;
    padding: 0.35rem 0.9rem;
    background: var(--tv-slate-100);
    color: var(--tv-slate-700);
    border-radius: var(--tv-radius-full);
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    transition: all var(--tv-transition-fast);
}
.tv-tag:hover {
    background: var(--tv-primary-50);
    color: var(--tv-primary);
    transform: translateY(-2px);
}

/* Share bar */
.tv-share-bar .btn {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: none;
    color: #fff;
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-share-bar .btn:hover { transform: translateY(-3px); }
.btn-facebook { background: #1877f2; }
.btn-twitter { background: #000; }
.btn-linkedin { background: #0a66c2; }
.btn-whatsapp { background: #25d366; }

@media (max-width: 768px) {
    .tv-rank-card-header { padding: 1rem; }
    .tv-rank-name { font-size: 1.1rem; }
    .tv-rank-number { flex: 0 0 42px; width: 42px; height: 42px; font-size: 1.1rem; }
    .tv-rank-image { height: 180px; }
}

/* =====================================================
   Geo / location ranking pages — fast, image-free, premium
   ===================================================== */

.tv-geo-hero {
    position: relative;
    width: 100%;
    padding: 2.75rem 0 4.5rem;
    background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 55%, #2563eb 100%);
    color: #fff;
    overflow: hidden;
    clip-path: polygon(0 0, 100% 0, 100% 94%, 0 100%);
}
.tv-geo-hero-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.75rem;
}
.tv-geo-hero-center {
    text-align: center;
    max-width: 760px;
    margin: 0 auto;
    padding-bottom: 0.5rem;
}
@media (max-width: 640px) {
    .tv-geo-hero-top { justify-content: flex-start; }
}
.tv-geo-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(rgba(255,255,255,0.08) 1.5px, transparent 1.5px),
        radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 28px 28px, 56px 56px;
    background-position: 0 0, 14px 14px;
    opacity: 0.7;
}
.tv-geo-hero::after {
    content: '';
    position: absolute;
    top: -120px;
    right: -120px;
    width: 420px;
    height: 420px;
    background: rgba(255,255,255,0.06);
    border-radius: 50%;
    filter: blur(70px);
    pointer-events: none;
}
.tv-geo-hero-content {
    position: relative;
    z-index: 1;
}
.tv-geo-breadcrumb {
    --bs-breadcrumb-divider: '/';
    background: none;
    border: none;
    padding: 0;
    display: inline-flex;
    margin: 0;
}
.tv-geo-breadcrumb a,
.tv-geo-breadcrumb .active {
    color: #fff;
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 600;
}
.tv-geo-breadcrumb .breadcrumb-item::before {
    color: rgba(255,255,255,0.55);
}
.tv-geo-breadcrumb a:hover { color: #fff; text-decoration: underline; }
.tv-geo-scope {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.9rem;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: var(--tv-radius-full);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    backdrop-filter: blur(4px);
    white-space: nowrap;
}
.tv-geo-meta {
    color: rgba(255,255,255,0.85);
    font-size: 0.92rem;
    margin: 0 0 0.5rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.5;
}
.tv-geo-title {
    font-size: 2.1rem;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: -0.03em;
    margin: 0;
    text-shadow: 0 6px 25px rgba(0,0,0,0.25);
}

.tv-geo-hero-country { background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 55%, #2563eb 100%); }
.tv-geo-hero-region { background: linear-gradient(135deg, #4c1d95 0%, #7c3aed 55%, #a78bfa 100%); }
.tv-geo-hero-city { background: linear-gradient(135deg, #0f5a55 0%, #0d9488 55%, #14b8a6 100%); }
.tv-geo-hero-local_area { background: linear-gradient(135deg, #7c2d12 0%, #ea580c 55%, #fb923c 100%); }

.tv-empty-box {
    text-align: center;
    padding: 4.5rem 2rem;
    background: linear-gradient(135deg, #fff 0%, var(--tv-slate-50) 100%);
    border: 2px dashed var(--tv-slate-200);
    border-radius: var(--tv-radius-xl);
    color: var(--tv-slate-600);
}
.tv-empty-box i {
    font-size: 3.5rem;
    color: var(--tv-slate-300);
    margin-bottom: 1.25rem;
}

@keyframes tvRankIn { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }

/* Stat strip below hero */
.tv-stat-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    background: #fff;
    border-radius: var(--tv-radius-xl);
    box-shadow: 0 16px 40px rgba(15,23,42,0.1);
    padding: 1.35rem 2rem;
    margin-top: -2.75rem;
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 3;
    flex-wrap: wrap;
}
.tv-stat-box { display: flex; align-items: center; gap: 0.75rem; text-align: left; }
.tv-stat-icon {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    color: #fff;
}
.tv-stat-icon-blue { background: linear-gradient(135deg, var(--tv-primary), #4f46e5); }
.tv-stat-icon-amber { background: linear-gradient(135deg, #f59e0b, #d97706); }
.tv-stat-icon-green { background: linear-gradient(135deg, #22c55e, #16a34a); }
.tv-stat-icon-purple { background: linear-gradient(135deg, #8b5cf6, #7c3aed); }
.tv-stat-value {
    display: block;
    font-size: 1.35rem;
    font-weight: 900;
    color: var(--tv-slate-900);
    letter-spacing: -0.03em;
    line-height: 1.2;
    max-width: 160px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tv-stat-value small { font-size: 0.85rem; color: var(--tv-slate-400); font-weight: 700; }
.tv-stat-label {
    display: block;
    font-size: 0.72rem;
    color: var(--tv-slate-500);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-top: 0.1rem;
}
.tv-stat-divider { width: 1px; height: 36px; background: var(--tv-slate-100); }
@media (max-width: 640px) {
    .tv-stat-strip { margin-top: -1.5rem; gap: 0.9rem; padding: 1.1rem; justify-content: flex-start; }
    .tv-stat-divider { display: none; }
    .tv-stat-value { max-width: 110px; }
}

/* =====================================================
   Geo listing cards v3 — clean 3-column row layout
   ===================================================== */
.tv-glist { display: flex; flex-direction: column; gap: 1.1rem; }
.tv-gcard {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    background: #fff;
    border: 1px solid var(--tv-slate-100);
    border-radius: var(--tv-radius-xl);
    box-shadow: var(--tv-shadow);
    padding: 1.4rem 1.6rem;
    opacity: 0;
    animation: tvRankIn 0.45s ease forwards;
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast), border-color var(--tv-transition-fast);
}
.tv-gcard:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 36px rgba(15,23,42,0.1);
    border-color: var(--tv-primary-100, #dbeafe);
}
.tv-gcard-num {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--tv-primary), #4f46e5);
    color: #fff;
    font-size: 1rem;
    font-weight: 900;
    box-shadow: 0 6px 14px rgba(37,99,235,0.28);
}
.tv-gcard.tv-medal-gold .tv-gcard-num {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    box-shadow: 0 6px 14px rgba(217,119,6,0.35);
}
.tv-gcard.tv-medal-silver .tv-gcard-num { background: linear-gradient(135deg, #94a3b8, #64748b); box-shadow: 0 6px 14px rgba(100,116,139,0.3); }
.tv-gcard.tv-medal-bronze .tv-gcard-num { background: linear-gradient(135deg, #c2703d, #9a5327); box-shadow: 0 6px 14px rgba(154,83,39,0.3); }
.tv-gcard.tv-medal-gold { border-color: #fde68a; background: linear-gradient(180deg, #fffbeb 0%, #fff 12%); }

.tv-gcard-main { flex: 1; min-width: 0; }
.tv-gcard-name {
    font-size: 1.2rem;
    font-weight: 800;
    margin: 0 0 0.4rem;
    letter-spacing: -0.02em;
}
.tv-gcard-name a { color: var(--tv-slate-900); text-decoration: none; }
.tv-gcard-name a:hover { color: var(--tv-primary); }
.tv-gcard-desc {
    color: var(--tv-slate-600);
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 0.65rem;
}
.tv-gcard-meta { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.tv-gtag {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.7rem;
    border-radius: var(--tv-radius-full);
    font-size: 0.78rem;
    font-weight: 600;
}
.tv-gtag-blue { background: #e0f2fe; color: #075985; }
.tv-gtag-green { background: #f0fdf4; color: #15803d; }
.tv-gtag-purple { background: #ede9fe; color: #5b21b6; }

.tv-gcard-action {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.6rem;
    padding-left: 1rem;
    border-left: 1px solid var(--tv-slate-100);
    min-width: 150px;
}
.tv-gscore-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.75rem;
    border-radius: var(--tv-radius-full);
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}
.tv-gscore-high { background: #f0fdf4; color: #15803d; }
.tv-gscore-mid { background: #eff6ff; color: #1d4ed8; }
.tv-gscore-low { background: #fef2f2; color: #b91c1c; }
.tv-gcta {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border-radius: var(--tv-radius-full);
    font-weight: 800;
    font-size: 0.85rem;
    padding: 0.55rem 1.2rem;
    background: linear-gradient(135deg, var(--tv-primary), #4f46e5);
    color: #fff;
    border: none;
    box-shadow: 0 6px 16px rgba(37,99,235,0.3);
    text-decoration: none;
    white-space: nowrap;
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-gcta:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(37,99,235,0.4);
    color: #fff;
}
@media (prefers-reduced-motion: reduce) {
    .tv-gcard { animation: none; opacity: 1; }
}
@media (max-width: 640px) {
    .tv-gcard { flex-direction: column; }
    .tv-gcard-action {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        border-left: none;
        border-top: 1px solid var(--tv-slate-100);
        padding-left: 0;
        padding-top: 0.9rem;
        margin-top: 0.4rem;
        min-width: 0;
    }
}

/* Sidebar filter pills */
.tv-filter-pill {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    border-radius: var(--tv-radius);
    border: 1.5px solid var(--tv-slate-200);
    color: var(--tv-slate-700);
    font-weight: 700;
    font-size: 0.88rem;
    text-decoration: none;
    transition: all var(--tv-transition-fast);
}
.tv-filter-pill:hover {
    border-color: var(--tv-primary);
    color: var(--tv-primary);
    background: var(--tv-primary-50);
}
.tv-filter-pill.active {
    background: linear-gradient(135deg, var(--tv-primary), #4f46e5);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 16px rgba(37,99,235,0.28);
}
.tv-why-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.tv-why-list li {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.88rem;
    color: var(--tv-slate-600);
    font-weight: 500;
}
.tv-why-list i { color: #16a34a; font-size: 1rem; }

/* Explore filter v2 — labeled fields */
.tv-explore {
    background: #fff;
    border: 1px solid var(--tv-slate-100);
    border-radius: var(--tv-radius-xl);
    box-shadow: 0 12px 35px rgba(15,23,42,0.08);
    padding: 1.25rem 1.5rem;
    margin: 1.5rem 0;
}
.tv-explore-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 800;
    color: var(--tv-slate-800);
    font-size: 0.95rem;
    margin-bottom: 1rem;
}
.tv-explore-title i { color: var(--tv-primary); }
.tv-explore-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.85rem;
}
.tv-explore-field {
    flex: 1 1 150px;
    min-width: 140px;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.tv-explore-field-btn { flex: 0 0 auto; }
.tv-explore-field-label {
    font-size: 0.72rem;
    font-weight: 800;
    color: var(--tv-slate-500);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}
.tv-explore-field-label i { color: var(--tv-primary); font-size: 0.85rem; }
.tv-explore-select {
    width: 100%;
    border-radius: var(--tv-radius);
    border: 1.5px solid var(--tv-slate-200);
    font-size: 0.9rem;
    padding: 0.6rem 0.9rem;
    background: #f8fafc;
    transition: border-color var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-explore-select:focus {
    border-color: var(--tv-primary);
    box-shadow: 0 0 0 4px rgba(37,99,235,0.12);
    background: #fff;
    outline: none;
}
.tv-explore-select:disabled {
    background: var(--tv-slate-50);
    color: var(--tv-slate-400);
}
.tv-explore-btn {
    width: 100%;
    border-radius: var(--tv-radius);
    font-weight: 800;
    font-size: 0.9rem;
    padding: 0.62rem 1.4rem;
    background: linear-gradient(135deg, var(--tv-primary), #4f46e5);
    border: none;
    box-shadow: 0 6px 18px rgba(37,99,235,0.28);
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
    white-space: nowrap;
}
.tv-explore-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(37,99,235,0.38);
}
@media (max-width: 768px) {
    .tv-explore-inner { flex-direction: column; align-items: stretch; }
    .tv-explore-field { width: 100%; }
    .tv-geo-title { font-size: 1.65rem; }
    .tv-gcard-name { font-size: 1.1rem; }
}

/* =====================================================
   Home launchpad — no images, CSS-only beauty
   ===================================================== */

.tv-home-hero {
    position: relative;
    width: 100%;
    padding: 6rem 0 5rem;
    background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 55%, #2563eb 100%);
    color: #fff;
    overflow: hidden;
    text-align: center;
}
.tv-home-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(rgba(255,255,255,0.08) 1.5px, transparent 1.5px),
        radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 28px 28px, 56px 56px;
    background-position: 0 0, 14px 14px;
    opacity: 0.7;
}
.tv-home-hero::after {
    content: '';
    position: absolute;
    top: -120px;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;
    height: 600px;
    background: rgba(255,255,255,0.05);
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
}
.tv-home-hero-content {
    position: relative;
    z-index: 1;
}
.tv-home-hero .tv-explore {
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(8px);
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 22px;
    padding: 1.1rem 1.5rem;
}
.tv-home-title {
    font-size: 3.2rem;
    font-weight: 900;
    letter-spacing: -0.045em;
    line-height: 1.08;
    max-width: 850px;
    margin: 0 auto 1.1rem;
    text-shadow: 0 6px 25px rgba(0,0,0,0.25);
}
.tv-home-tagline {
    font-size: 1.15rem;
    color: rgba(255,255,255,0.88);
    max-width: 660px;
    margin: 0 auto 2.2rem;
    line-height: 1.65;
    font-weight: 500;
}
@media (max-width: 768px) {
    .tv-home-hero { padding: 4rem 0 3.5rem; }
    .tv-home-title { font-size: 2.1rem; }
    .tv-home-tagline { font-size: 1rem; }
}

.tv-category-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.85rem;
    padding: 1.6rem 1rem;
    background: #fff;
    border: 1px solid var(--tv-slate-100);
    border-radius: var(--tv-radius-xl);
    box-shadow: var(--tv-shadow);
    color: var(--tv-slate-800);
    text-decoration: none;
    font-weight: 800;
    font-size: 0.95rem;
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast), border-color var(--tv-transition-fast), color var(--tv-transition-fast);
    height: 100%;
    text-align: center;
}
.tv-category-tile:hover {
    transform: translateY(-7px);
    box-shadow: var(--tv-shadow-lg);
    border-color: var(--tv-primary);
    color: var(--tv-primary);
}
.tv-category-tile-icon {
    width: 60px;
    height: 60px;
    border-radius: 18px;
    background: linear-gradient(135deg, #eff6ff 0%, #e0f2fe 100%);
    color: var(--tv-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.7rem;
    box-shadow: 0 8px 20px rgba(37,99,235,0.12);
    transition: transform var(--tv-transition-fast);
}
.tv-category-tile:hover .tv-category-tile-icon { transform: scale(1.08) rotate(-3deg); }

/* Featured cards — no images */
.tv-section-featured .tv-featured-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--tv-slate-100);
    border-radius: var(--tv-radius-xl);
    box-shadow: var(--tv-shadow);
    overflow: hidden;
    text-decoration: none;
    color: var(--tv-slate-800);
    height: 100%;
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-section-featured .tv-featured-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(15,23,42,0.12);
}
.tv-section-featured .tv-featured-card-top {
    height: 5px;
    width: 100%;
    background: linear-gradient(90deg, var(--tv-primary), var(--tv-accent));
}
.tv-section-featured .tv-featured-card-body { padding: 1.35rem; flex: 1; }
.tv-section-featured .tv-featured-badge {
    display: inline-block;
    padding: 0.25rem 0.7rem;
    background: #eff6ff;
    color: #1d4ed8;
    border-radius: var(--tv-radius-full);
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.6rem;
}
.tv-section-featured .tv-featured-title {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--tv-slate-900);
    margin-bottom: 0.5rem;
}
.tv-section-featured .tv-featured-desc {
    font-size: 0.9rem;
    color: var(--tv-slate-600);
    line-height: 1.55;
    margin: 0;
}
.tv-section-featured .tv-featured-card-foot {
    padding: 0.9rem 1.35rem;
    border-top: 1px solid var(--tv-slate-100);
    font-weight: 800;
    font-size: 0.85rem;
    color: var(--tv-primary);
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

/* Entity cards — no images */
.tv-entity-card {
    display: flex;
    align-items: center;
    gap: 1.1rem;
    padding: 1.25rem;
    background: #fff;
    border: 1px solid var(--tv-slate-100);
    border-radius: var(--tv-radius-xl);
    box-shadow: var(--tv-shadow);
    text-decoration: none;
    color: var(--tv-slate-800);
    height: 100%;
    transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast);
}
.tv-entity-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(15,23,42,0.12);
    color: var(--tv-slate-800);
}
.tv-entity-avatar {
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--tv-primary), #4f46e5);
    color: #fff;
    font-size: 1.3rem;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 22px rgba(37,99,235,0.25);
}
.tv-entity-name { font-weight: 800; margin: 0 0 0.25rem; color: var(--tv-slate-900); }
.tv-entity-summary { font-size: 0.85rem; color: var(--tv-slate-600); margin: 0; line-height: 1.5; }

/* Article cards — no images, clean */
.article-card { border: 1px solid var(--tv-slate-100); box-shadow: var(--tv-shadow); border-radius: var(--tv-radius-xl); overflow: hidden; background: #fff; transition: transform var(--tv-transition-fast), box-shadow var(--tv-transition-fast); }
.article-card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(15,23,42,0.12); }
.article-card .card-body { padding: 1.35rem; }
.tv-featured-article { border-top: 4px solid var(--tv-primary); position: relative; }
.tv-featured-ribbon {
    position: absolute;
    top: 1rem;
    right: -2.6rem;
    background: linear-gradient(135deg, var(--tv-primary), #4f46e5);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 900;
    padding: 0.25rem 2.8rem;
    transform: rotate(35deg);
    box-shadow: var(--tv-shadow);
}

/* Specialty filter bar */
.tv-specialty-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin: 1rem 0 0;
    padding: 0.75rem 1rem;
    background: #fff;
    border: 1px solid var(--tv-slate-100);
    border-radius: var(--tv-radius);
    box-shadow: var(--tv-shadow);
}
.tv-specialty-label {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--tv-slate-500);
    margin-right: 0.25rem;
}
.tv-specialty-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.35rem 0.85rem;
    border-radius: var(--tv-radius-full);
    background: #f1f5f9;
    color: var(--tv-slate-700);
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid transparent;
    transition: all var(--tv-transition-fast);
}
.tv-specialty-pill:hover, .tv-specialty-pill.active {
    background: var(--tv-primary);
    color: #fff;
    border-color: var(--tv-primary);
}