/* =========================================================================
   CYBER-NEON · DIRECAO A
   Tokens:
     --bg     #070b12   --bg-2  #0d1420   --bg-3  #111a29
     --border #1b2a3d   --text  #e6f1ff   --text-2 #7d8fa8
     --accent #00e5a0   --accent-2 #00c2ff
   ========================================================================= */
:root {
    --cn-bg:       #070b12;
    --cn-bg-2:     #0d1420;
    --cn-bg-3:     #111a29;
    --cn-border:   #1b2a3d;
    --cn-text:     #e6f1ff;
    --cn-text-2:   #7d8fa8;
    --cn-accent:   #00e5a0;
    --cn-accent-2: #00c2ff;
    --cn-danger:   #ff3b6b;
    --cn-warn:     #ffc857;
}

/* =========================================================================
   1. BASE
   ========================================================================= */
html, body {
    background-color: var(--cn-bg) !important;
    color: var(--cn-text) !important;
}
body {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Space Grotesk', 'Inter', system-ui, sans-serif !important;
    letter-spacing: -0.02em;
    color: var(--cn-text);
}
a { color: var(--cn-accent); }
a:hover { color: var(--cn-accent-2); }
::selection { background: var(--cn-accent); color: #04120c; }

/* Scrollbar sutil */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--cn-bg); }
::-webkit-scrollbar-thumb { background: var(--cn-border); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: var(--cn-accent); }

/* =========================================================================
   2. HEADER / NAVBAR
   ========================================================================= */
header.site-header {
    background-color: var(--cn-bg-2) !important;
    border-bottom: 1px solid var(--cn-border) !important;
    position: sticky;
    top: 0;
    z-index: 1030;
}
.navbar.navbar-custom {
    background-color: var(--cn-bg-2) !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    font-family: 'Space Grotesk', sans-serif !important;
}

/* Links */
.navbar.navbar-custom .nav-link,
.navbar.navbar-custom .navbar-brand,
.navbar.navbar-custom .navbar-text {
    color: var(--cn-text);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    text-shadow: none;
    transition: color .15s ease;
}
.navbar.navbar-custom a:hover,
.navbar.navbar-custom .nav-link:hover {
    color: var(--cn-accent) !important;
    text-decoration: none !important;
}

/* Item ativo */
.navbar.navbar-custom .nav-link.active {
    color: var(--cn-accent) !important;
    background-color: transparent !important;
    border-radius: 0;
    font-weight: 800 !important;
    position: relative;
}
.navbar.navbar-custom .nav-link.active::after {
    content: "";
    position: absolute;
    bottom: -6px;
    left: 8px;
    right: 8px;
    height: 2px;
    background-color: var(--cn-accent);
    box-shadow: 0 0 8px var(--cn-accent);
    border-radius: 2px;
}

/* Toggler (mobile) */
.navbar-custom .navbar-toggler {
    border: 1px solid var(--cn-border);
    padding: 6px 10px;
}
.navbar-custom .navbar-toggler:focus { box-shadow: 0 0 0 3px rgba(0,229,160,.25); }
.navbar-custom .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%2300e5a0' stroke-width='2.4' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* ============================================================
   MARCA
   ============================================================ */
.navbar-brand.site-brand {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 900;
    font-size: 1.4rem;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    text-decoration: none;
    line-height: 1.2;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0;
    color: var(--cn-text) !important;
}
.navbar-brand.site-brand:hover {
    color: var(--cn-accent) !important;
    opacity: 1;
    text-decoration: none;
}
.navbar-brand.site-brand::after {
    content: "_";
    color: var(--cn-accent);
    animation: cn-blink 1.2s steps(2, start) infinite;
}
@keyframes cn-blink { to { visibility: hidden; } }

/* ============================================================
   BARRA DE BUSCA — FAIXA INFERIOR
   ============================================================ */
.cn-search-bar {
    background-color: var(--cn-bg-2);
    border-top: 1px solid var(--cn-border);
    border-bottom: 1px solid var(--cn-border);
    padding: 12px 0;
}
.cn-search-form {
    max-width: 640px;
    margin: 0 auto;
    width: 100%;
}
.cn-search-input {
    background-color: var(--cn-bg-3) !important;
    color: var(--cn-text) !important;
    border: 1px solid var(--cn-border) !important;
    border-right: none !important;
    border-radius: 6px 0 0 6px !important;
    padding: 10px 16px !important;
    font-size: 0.95rem !important;
    font-family: 'Inter', sans-serif !important;
    min-height: 44px;
}
.cn-search-input::placeholder {
    color: var(--cn-text-2) !important;
    font-weight: 500 !important;
}
.cn-search-input:focus {
    border-color: var(--cn-accent) !important;
    box-shadow: 0 0 0 3px rgba(0,229,160,.18) !important;
    outline: none !important;
    background-color: var(--cn-bg-3) !important;
    color: var(--cn-text) !important;
}
.cn-search-btn {
    background-color: transparent !important;
    color: var(--cn-accent) !important;
    border: 1px solid var(--cn-border) !important;
    border-left: none !important;
    border-radius: 0 6px 6px 0 !important;
    padding: 0 20px !important;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .15s ease;
}
.cn-search-btn:hover {
    background-color: var(--cn-accent) !important;
    color: #04120c !important;
    border-color: var(--cn-accent) !important;
}
.cn-search-btn i { color: inherit !important; }

/* ============================================================
   DROPDOWN HOVER — FILMES / SERIES
   ============================================================ */
.cn-hover-dd {
    position: relative;
}
.cn-hover-dd > .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.cn-hover-dd > .cn-dropdown-list {
    position: absolute;
    top: 100%;
    left: 0;
    margin: 0;
    padding: 10px 0;
    list-style: none;
    background-color: var(--cn-bg-2);
    border: 1px solid var(--cn-border);
    border-top: none;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 12px 40px rgba(0,0,0,.75);
    min-width: 220px;
    max-height: 70vh;
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s;
    z-index: 1040;
}
.cn-hover-dd::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 14px;
    background: transparent;
    z-index: 1039;
}
.cn-hover-dd:hover > .cn-dropdown-list,
.cn-hover-dd:focus-within > .cn-dropdown-list {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.cn-hover-dd > .nav-link .fa-caret-down {
    transition: transform .2s ease;
}
.cn-hover-dd:hover > .nav-link .fa-caret-down,
.cn-hover-dd:focus-within > .nav-link .fa-caret-down {
    transform: rotate(180deg);
}
.cn-dropdown-list li { margin: 0; }
.cn-dropdown-list a {
    display: block;
    padding: 8px 18px;
    color: var(--cn-text) !important;
    font-size: .82rem;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    text-decoration: none;
    transition: background-color .12s ease, color .12s ease;
}
.cn-dropdown-list a:hover {
    background-color: rgba(0,229,160,.12);
    color: var(--cn-accent) !important;
}
.cn-dropdown-list a.cn-see-all {
    color: var(--cn-accent) !important;
    font-weight: 800;
    text-transform: uppercase;
    font-size: .72rem;
    letter-spacing: .08em;
    border-bottom: 1px solid var(--cn-border);
    padding-bottom: 10px;
    margin-bottom: 6px;
}
.cn-dropdown-list a.cn-see-all:hover {
    background-color: rgba(0,229,160,.18);
}

/* =========================================================================
   3. HERO STRIP
   ========================================================================= */
.hero-movie-strip {
    position: relative !important;
    z-index: 1 !important;
    padding: 45px 0 !important;
    border-bottom: 1px solid var(--cn-border) !important;
    background-color: var(--cn-bg-2) !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}
.hero-movie-strip::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(to right, rgba(7,11,18,.98) 35%, rgba(13,20,32,.82) 100%) !important;
    z-index: 1 !important;
}
.hero-movie-strip::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        linear-gradient(to right, rgba(7,11,18,.95) 20%, rgba(7,11,18,0) 80%),
        repeating-linear-gradient(0deg, rgba(0,229,160,.04) 0 1px, transparent 1px 3px);
    z-index: 1 !important;
    pointer-events: none !important;
}
.hero-movie-strip .container {
    position: relative !important;
    z-index: 2 !important;
}
.hero-movie-strip h1,
.hero-movie-strip h1 span {
    color: var(--cn-text) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    text-shadow: 0 2px 20px rgba(0,0,0,.9) !important;
}
.hero-movie-strip .text-muted-strip {
    color: var(--cn-text-2) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    font-size: .78rem !important;
}
.hero-movie-strip .text-value-strip {
    color: var(--cn-text) !important;
    text-shadow: 0 1px 5px rgba(0,0,0,.8) !important;
}
.hero-movie-strip img {
    border: 1px solid var(--cn-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 25px rgba(0,0,0,.9), 0 0 0 1px rgba(0,229,160,.12) !important;
    object-fit: cover !important;
}
.hero-movie-strip .breadcrumb {
    font-weight: 500;
    letter-spacing: .3px;
    text-shadow: 1px 1px 4px rgba(0,0,0,.8);
    position: relative;
    z-index: 2;
}
.hero-movie-strip .breadcrumb-item + .breadcrumb-item::before {
    content: "›";
    color: var(--cn-accent);
    font-size: 1.1rem;
    line-height: 1;
    vertical-align: middle;
}
.hero-movie-strip .breadcrumb-item a {
    color: var(--cn-text-2) !important;
    transition: color .2s ease-in-out;
}
.hero-movie-strip .breadcrumb-item a:hover {
    color: var(--cn-accent) !important;
    text-decoration: underline !important;
}
.hero-movie-strip .breadcrumb-item.active {
    color: var(--cn-text) !important;
    opacity: .9;
    font-weight: 600;
}

/* =========================================================================
   4. CONTEUDO
   ========================================================================= */
.content-white-body {
    background-color: var(--cn-bg-2) !important;
    border: 1px solid var(--cn-border) !important;
    border-top: none !important;
    padding: 40px !important;
    box-shadow: 0 4px 6px rgba(0,0,0,.35) !important;
    color: var(--cn-text) !important;
}
.content-white-body h2,
.content-white-body h3,
.content-white-body h4 {
    color: var(--cn-text) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 700 !important;
    border-left: 3px solid var(--cn-accent) !important;
    padding-left: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: .02em !important;
    font-size: 1.2rem !important;
    margin-top: 30px !important;
    margin-bottom: 20px !important;
}
.content-white-body p,
.synopsis-text,
.content-white-body span,
.content-white-body div:not(.badge) {
    color: var(--cn-text) !important;
}

/* =========================================================================
   5. TABELAS
   ========================================================================= */
.table-technical-clean {
    width: 100% !important;
    border-collapse: collapse !important;
    background-color: var(--cn-bg-2) !important;
    margin-bottom: 25px !important;
    color: var(--cn-text) !important;
}
.table-technical-clean td,
.table-technical-clean th {
    padding: 14px !important;
    border: 1px solid var(--cn-border) !important;
    color: var(--cn-text) !important;
    font-size: .95rem !important;
}
.table-technical-clean tr:nth-child(even) {
    background-color: var(--cn-bg-3) !important;
}
.table-technical-clean td.label-bold {
    font-weight: 700 !important;
    color: var(--cn-accent) !important;
    background-color: rgba(0,229,160,.06) !important;
}

/* =========================================================================
   6. COMPONENTES
   ========================================================================= */
.btn-torrent-rotten {
    background-color: var(--cn-accent) !important;
    color: #04120c !important;
    border: none !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    padding: 16px !important;
    font-size: 1rem !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    text-decoration: none !important;
    transition: all .2s ease !important;
    box-shadow: 0 0 20px rgba(0,229,160,.25) !important;
}
.btn-torrent-rotten:hover {
    background-color: var(--cn-accent-2) !important;
    color: #04120c !important;
    box-shadow: 0 0 28px rgba(0,194,255,.45) !important;
    transform: translateY(-1px);
}

.director-highlight-box {
    border: 1px solid var(--cn-accent) !important;
    background-color: rgba(0,229,160,.05) !important;
    padding: 20px !important;
    border-radius: 6px !important;
}
.director-highlight-box span.name {
    font-size: 1.3rem !important;
    font-weight: 800 !important;
    color: var(--cn-accent) !important;
    font-family: 'Space Grotesk', sans-serif !important;
}

.actor-card-clean {
    background-color: var(--cn-bg-3) !important;
    border: 1px solid var(--cn-border) !important;
    color: var(--cn-text) !important;
    padding: 10px !important;
    font-size: .95rem !important;
    border-radius: 6px !important;
}

.tag-badge-clean {
    background-color: var(--cn-bg-3) !important;
    color: var(--cn-text) !important;
    border: 1px solid var(--cn-border) !important;
    padding: 6px 12px !important;
    font-size: .85rem !important;
    border-radius: 4px !important;
}

/* =========================================================================
   CIRCULO DE NOTA
   ========================================================================= */
.tmdb-rating-circle {
    position: relative !important;
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
    background-color: var(--cn-bg-3) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto !important;
    box-shadow: 0 0 0 2px rgba(0,229,160,.35), 0 4px 14px rgba(0,0,0,.5) !important;
}
.tmdb-rating-inner {
    position: relative !important;
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    background-color: var(--cn-bg-2) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
}
.tmdb-rating-text {
    color: var(--cn-accent) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 800 !important;
    font-size: 1.1rem !important;
}
.tmdb-rating-text span {
    font-size: .55rem !important;
    position: relative !important;
    top: -4px !important;
    left: 1px !important;
    font-weight: 500 !important;
}

/* =========================================================================
   BALOES DE GENERO
   ========================================================================= */
.genre-balloon-link {
    display: inline-block !important;
    background-color: transparent !important;
    color: var(--cn-accent) !important;
    padding: 5px 14px !important;
    font-size: .78rem !important;
    font-weight: 600 !important;
    border-radius: 20px !important;
    border: 1px solid var(--cn-accent) !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    transition: all .2s ease-in-out !important;
    margin-right: 6px !important;
    margin-bottom: 6px !important;
}
.genre-balloon-link:hover {
    background-color: var(--cn-accent) !important;
    color: #04120c !important;
    border-color: var(--cn-accent) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 0 16px rgba(0,229,160,.45) !important;
}

/* =========================================================================
   GRID DE SPECS
   ========================================================================= */
.specs-grid-container {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    margin-top: 15px !important;
}
.spec-card-item {
    background-color: var(--cn-bg-3) !important;
    border: 1px solid var(--cn-border) !important;
    border-radius: 10px !important;
    padding: 14px 18px !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    transition: all .2s ease-in-out !important;
}
.spec-card-item:hover {
    background-color: var(--cn-bg-3) !important;
    border-color: var(--cn-accent) !important;
    box-shadow: 0 0 18px rgba(0,229,160,.2) !important;
    transform: translateY(-1px) !important;
}
.spec-icon-wrapper {
    width: 40px !important;
    height: 40px !important;
    background-color: rgba(0,229,160,.1) !important;
    color: var(--cn-accent) !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.1rem !important;
    flex-shrink: 0 !important;
}
.spec-texts {
    display: flex !important;
    flex-direction: column !important;
    line-height: 1.3 !important;
}
.spec-label {
    font-size: .72rem !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    color: var(--cn-text-2) !important;
    letter-spacing: .08em !important;
}
.spec-value {
    font-size: .95rem !important;
    font-weight: 600 !important;
    color: var(--cn-text) !important;
}
@media (max-width: 767.98px) {
    .specs-grid-container { grid-template-columns: 1fr !important; gap: 10px !important; }
    .spec-card-item { padding: 12px 14px !important; }
}

/* =========================================================================
   ELENCO
   ========================================================================= */
.cast-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
    gap: 12px !important;
    margin-top: 15px !important;
    margin-bottom: 30px !important;
}
.cast-card {
    background-color: var(--cn-bg-3) !important;
    border: 1px solid var(--cn-border) !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    transition: all .2s ease-in-out !important;
}
.cast-card:hover {
    background-color: var(--cn-bg-3) !important;
    border-color: var(--cn-accent) !important;
    box-shadow: 0 0 14px rgba(0,229,160,.2) !important;
    transform: translateY(-1px) !important;
}
.cast-avatar-wrapper {
    width: 45px !important;
    height: 45px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    background-color: var(--cn-bg-2) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    border: 2px solid var(--cn-border) !important;
    box-shadow: 0 0 0 1px rgba(0,229,160,.25) !important;
}
.cast-avatar-wrapper img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.cast-avatar-placeholder { color: var(--cn-text-2) !important; font-size: 1.2rem !important; }
.cast-info { display: flex !important; flex-direction: column !important; line-height: 1.2 !important; }
.cast-name { font-size: .92rem !important; font-weight: 700 !important; color: var(--cn-text) !important; }
.cast-character { font-size: .78rem !important; font-weight: 500 !important; color: var(--cn-text-2) !important; margin-top: 2px !important; }

/* =========================================================================
   BOTOES DE DOWNLOAD
   ========================================================================= */
.btn-download-premium {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 12px 20px !important;
    font-size: .92rem !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: all .2s ease-in-out !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.3) !important;
}
.btn-dl-verde {
    background-color: var(--cn-accent) !important;
    color: #04120c !important;
    border: 1px solid var(--cn-accent) !important;
}
.btn-dl-verde:hover {
    background-color: var(--cn-accent-2) !important;
    border-color: var(--cn-accent-2) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 0 22px rgba(0,194,255,.5) !important;
    color: #04120c !important;
}
.btn-dl-legendado {
    background-color: transparent !important;
    color: var(--cn-accent-2) !important;
    border: 1px solid var(--cn-accent-2) !important;
}
.btn-dl-legendado:hover {
    background-color: var(--cn-accent-2) !important;
    color: #04120c !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 0 22px rgba(0,194,255,.45) !important;
}
.btn-dl-cam {
    background-color: transparent !important;
    color: var(--cn-danger) !important;
    border: 1px dashed var(--cn-danger) !important;
}
.btn-dl-cam:hover {
    background-color: var(--cn-danger) !important;
    color: #ffffff !important;
    border: 1px dashed var(--cn-danger) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 0 22px rgba(255,59,107,.4) !important;
}

/* =========================================================================
   FAIXA ETARIA
   ========================================================================= */
.badge-faixa-etaria {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    font-size: 1.05rem !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,.3) !important;
    box-shadow: 0 2px 5px rgba(0,0,0,.35) !important;
    user-select: none !important;
}
.fe-l, .fe-livre   { background-color: #00a651 !important; }
.fe-10             { background-color: #04b4e4 !important; }
.fe-12             { background-color: #fbc02d !important; }
.fe-14             { background-color: #f57c00 !important; }
.fe-16             { background-color: #e53935 !important; }
.fe-18             { background-color: #000000 !important; }

/* =========================================================================
   META / MIDIA HEADER
   ========================================================================= */
.meta-item .meta-label {
    color: var(--cn-text-2) !important;
    font-size: .75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    display: block !important;
}
.meta-item { margin-bottom: 1.5rem !important; }

.metadata-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, auto);
    gap: 10px;
    width: 100%;
}
.metadata-grid .meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
    background-color: rgba(255,255,255,.03);
    border: 1px solid var(--cn-border);
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 14px;
    color: var(--cn-text);
    min-height: 38px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 0 !important;
}
.meta-icon { font-size: 16px; opacity: .75; color: var(--cn-accent); }

.midia-header-info {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 100%;
}
.midia-tagline {
    font-style: italic;
    color: var(--cn-text-2);
    font-size: 15px;
    text-align: left;
    padding-left: 12px;
    border-left: 3px solid var(--cn-accent);
}
.midia-tagline p { margin: 0; }

/* =========================================================================
   DROPDOWN (Explorar / Usuário)
   ========================================================================= */
.dropdown-menu {
    background-color: var(--cn-bg-2) !important;
    border: 1px solid var(--cn-border) !important;
    box-shadow: 0 12px 40px rgba(0,0,0,.75) !important;
    border-radius: 8px !important;
}
.dropdown-menu .dropdown-item {
    color: var(--cn-text) !important;
    background-color: transparent !important;
    padding: 8px 16px !important;
    border-radius: 4px !important;
    font-size: .88rem !important;
    transition: background-color .15s, color .15s !important;
}
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
    background-color: rgba(0,229,160,.12) !important;
    color: var(--cn-accent) !important;
}
.dropdown-menu .dropdown-header {
    color: var(--cn-accent) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    font-size: .72rem !important;
    padding-bottom: 6px !important;
    border-bottom: 1px solid var(--cn-border) !important;
    margin-bottom: 8px !important;
}
.dropdown-menu .dropdown-header.text-dark {
    color: var(--cn-accent-2) !important;
}
.dropdown-menu .border-end {
    border-color: var(--cn-border) !important;
}

/* =========================================================================
   TOOLTIP
   ========================================================================= */
.movie-img-container { position: relative; overflow: visible !important; }
.movie-tooltip {
    display: none;
    position: absolute;
    z-index: 9999 !important;
    background: var(--cn-bg-2);
    color: var(--cn-text);
    padding: 14px 18px;
    border-radius: 10px;
    box-shadow: 0 12px 40px rgba(0,0,0,.9);
    border: 1px solid var(--cn-accent);
    min-width: 200px;
    max-width: 280px;
    pointer-events: none;
    transition: opacity .15s ease;
    line-height: 1.4;
    font-family: 'Inter', system-ui, sans-serif;
}
.movie-tooltip h5 {
    font-size: 1.05rem;
    font-weight: 700;
    margin-bottom: 6px;
    color: var(--cn-text);
    font-family: 'Space Grotesk', sans-serif;
}
.movie-tooltip .badge { font-size: .7rem; padding: .35em .65em; }
.movie-tooltip .small {
    font-size: .75rem;
    opacity: .85;
    margin-top: 6px;
    border-top: 1px solid var(--cn-border);
    padding-top: 6px;
}
.movie-card { overflow: visible !important; }

.ficha-content { font-size: 1rem; line-height: 1.6; }
.ficha-content p:last-child { margin-bottom: 0; }

/* Login */
.nav-link.text-warning {
    color: var(--cn-warn) !important;
    font-weight: 800 !important;
}
.nav-link.text-warning:hover { color: var(--cn-accent) !important; }

/* =========================================================================
   FOOTER
   ========================================================================= */
.footer .text-muted-custom { color: var(--cn-text-2) !important; }
.footer .text-muted-50 { color: rgba(255,255,255,.55) !important; }
.footer .small { color: var(--cn-text-2) !important; }
.footer p,
.footer div:not(.text-white) { color: var(--cn-text) !important; }
.artist-character { color: var(--cn-text-2) !important; font-weight: 400; }
.artist-character:hover { color: var(--cn-accent) !important; }

/* Bloco Tamanho + Datas */
.specs-tamanho-datas {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
@media (max-width: 767.98px) {
    .specs-tamanho-datas {
        grid-column: auto !important;
        grid-template-columns: 1fr !important;
    }
}

/* Mobile: oculta tooltip */
@media (max-width: 767.98px) {
    .movie-tooltip { display: none !important; }
    .audio-mobile-hide { display: none !important; }
}

/* =========================================================================
   MOBILE — NAVBAR EMPILHADA + BUSCA SEMPRE VISÍVEL
   ========================================================================= */
@media (max-width: 1199.98px) {
    .navbar-custom .navbar-collapse {
        background-color: var(--cn-bg-2);
        border-top: 1px solid var(--cn-border);
        padding: 12px 0 4px;
        margin-top: 12px;
    }
    .navbar-custom .navbar-nav {
        gap: 2px;
    }
    .navbar-custom .nav-link {
        padding: 12px 8px !important;
        min-height: 44px;
        display: flex;
        align-items: center;
    }
    .navbar-custom .nav-link.active::after {
        bottom: 4px;
    }

    .cn-hover-dd > .cn-dropdown-list {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: none;
        border-radius: 0;
        background-color: rgba(0,0,0,.2);
        padding: 0 0 6px 12px;
        max-height: 0;
        overflow: hidden;
        transition: max-height .25s ease;
        display: none;
    }
    .cn-hover-dd > .nav-link {
        justify-content: space-between;
        width: 100%;
    }
    .cn-hover-dd.cn-open > .cn-dropdown-list {
        display: block;
        max-height: 70vh;
        overflow-y: auto;
    }
    .cn-hover-dd::after { display: none; }
}

@media (max-width: 575.98px) {
    .navbar-brand.site-brand { font-size: 1.15rem; }
    .content-white-body { padding: 22px !important; }
    .cn-search-bar { padding: 10px 0; }
    .cn-search-input { font-size: .9rem !important; padding: 10px 14px !important; }
    .cn-search-btn { padding: 0 16px !important; }
}

/* =========================================================================
   CN INDEX — CYBER-NEON
   ========================================================================= */

/* ---------- HEADER DA LISTAGEM ---------- */
.cn-list-header {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 24px;
}
@media (min-width: 576px) {
    .cn-list-header {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: 16px;
    }
}
.cn-list-title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.35rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -.01em;
    color: var(--cn-text);
    margin: 0;
    padding-left: 12px;
    border-left: 3px solid var(--cn-accent);
    line-height: 1.25;
    display: flex;
    align-items: center;
    gap: 8px;
}
.cn-list-title i { color: var(--cn-accent); font-size: 1rem; }

.cn-list-counter {
    font-family: 'Inter', sans-serif;
    font-size: .78rem;
    font-weight: 500;
    color: var(--cn-text-2);
    background-color: var(--cn-bg-2);
    border: 1px solid var(--cn-border);
    padding: 4px 10px;
    border-radius: 4px;
    align-self: flex-start;
    white-space: nowrap;
}
@media (min-width: 576px) {
    .cn-list-counter { align-self: center; }
}

/* ---------- BARRA DE TAG ---------- */
.cn-tag-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    margin-bottom: 24px;
    background-color: var(--cn-bg-2);
    border: 1px solid var(--cn-border);
    border-left: 3px solid var(--cn-accent);
    border-radius: 6px;
    font-size: .82rem;
}
.cn-tag-bar .cn-tag-info {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--cn-text-2);
    font-weight: 500;
}
.cn-tag-bar .cn-tag-info i { color: var(--cn-accent); }
.cn-tag-bar .cn-tag-back {
    margin-left: auto;
    color: var(--cn-accent);
    font-weight: 700;
    font-family: 'Space Grotesk', sans-serif;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-size: .72rem;
    text-decoration: none;
    transition: color .15s ease;
}
.cn-tag-bar .cn-tag-back:hover {
    color: var(--cn-accent-2);
    text-decoration: none;
}

/* ---------- GRID ---------- */
.cn-grid {
    row-gap: 12px;
}

/* =========================================================================
   PAGINAÇÃO — ÚNICA (consolidada)
   ========================================================================= */
.cn-pagination {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 40px 0 0;
}
.cn-pagination .page-item {
    display: inline-block;
    flex: 0 0 auto;
}
.cn-pagination .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 40px;
    height: 40px;
    padding: 0 14px;
    background-color: var(--cn-bg-3);
    color: var(--cn-text);
    border: 1px solid var(--cn-border);
    border-radius: 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.cn-pagination .page-link:hover {
    background-color: var(--cn-bg-2);
    color: var(--cn-accent);
    border-color: var(--cn-accent);
    box-shadow: 0 0 12px rgba(0,229,160,.25);
    text-decoration: none;
    transform: translateY(-1px);
}
.cn-pagination .page-link:focus-visible {
    outline: 2px solid var(--cn-accent);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(0,229,160,.18);
}
.cn-pagination .page-item.active .page-link {
    background-color: var(--cn-accent);
    color: #04120c;
    border-color: var(--cn-accent);
    box-shadow: 0 0 16px rgba(0,229,160,.4), 0 0 0 1px rgba(0,229,160,.35);
    cursor: default;
    transform: none;
}

/* Anterior / Próxima */
.cn-pagination .page-link.cn-page-prev,
.cn-pagination .page-link.cn-page-next {
    padding: 0 18px;
    gap: 8px;
    background-color: rgba(0,229,160,.06);
    border-color: rgba(0,229,160,.35);
    color: var(--cn-accent);
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-size: .75rem;
}
.cn-pagination .page-link.cn-page-prev {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.cn-pagination .page-link.cn-page-next {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.cn-pagination .page-link.cn-page-prev:hover,
.cn-pagination .page-link.cn-page-next:hover {
    background-color: var(--cn-accent);
    border-color: var(--cn-accent);
    color: #04120c;
    box-shadow: 0 0 20px rgba(0,229,160,.55);
    transform: translateY(-1px);
}
.cn-pagination .page-link.cn-page-prev i,
.cn-pagination .page-link.cn-page-next i {
    font-size: .72rem;
}

/* Separador visual */
.cn-pagination .page-item.cn-gap {
    width: 12px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--cn-text-2);
    font-size: .8rem;
    opacity: .5;
}
.cn-pagination .page-item.cn-gap::before {
    content: "";
    width: 2px;
    height: 20px;
    background-color: var(--cn-border);
    border-radius: 2px;
}

@media (max-width: 575.98px) {
    .cn-pagination { gap: 4px; }
    .cn-pagination .page-link {
        min-width: 36px;
        height: 36px;
        font-size: .78rem;
        padding: 0 10px;
        border-radius: 6px;
    }
    .cn-pagination .page-link.cn-page-prev,
    .cn-pagination .page-link.cn-page-next {
        padding: 0 12px;
        gap: 6px;
        font-size: .7rem;
    }
    .cn-pagination .page-item.cn-gap {
        width: 8px;
        height: 36px;
    }
}

/* =========================================================================
   EMPTY STATE — UNIFICADO
   (usado em .cn-empty, .cn-tag-empty, .cn-studio-empty, .cn-artist-empty)
   ========================================================================= */
.cn-empty,
.cn-tag-empty,
.cn-studio-empty,
.cn-artist-empty {
    text-align: center;
    padding: 60px 20px;
    color: var(--cn-text-2);
}
.cn-empty i,
.cn-tag-empty i,
.cn-studio-empty i,
.cn-artist-empty i {
    color: var(--cn-accent);
    font-size: 2.5rem;
    margin-bottom: 12px;
    display: block;
    opacity: .5;
}
.cn-empty p,
.cn-tag-empty p,
.cn-studio-empty p,
.cn-artist-empty p {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .95rem;
    margin: 0;
}
/* Ajuste específico do .cn-empty original (padding maior + filtro glow) */
.cn-empty {
    padding: 80px 20px;
}
.cn-empty i {
    font-size: 3rem;
    margin-bottom: 16px;
    filter: drop-shadow(0 0 20px rgba(0,229,160,.4));
}

/* =========================================================================
   BLOCO SEO
   ========================================================================= */
.cn-seo-block {
    max-width: 900px;
    margin: 48px auto 0;
    padding: 28px 32px;
    background-color: var(--cn-bg-2);
    border: 1px solid var(--cn-border);
    border-left: 3px solid var(--cn-accent);
    border-radius: 6px;
}
.cn-seo-block h2 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.1rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .02em;
    color: var(--cn-text);
    margin: 0 0 16px;
    padding: 0;
    border: none;
}
.cn-seo-block p {
    font-size: .95rem;
    line-height: 1.7;
    color: var(--cn-text);
    margin: 0;
}
.cn-seo-block strong { color: var(--cn-accent); }

/* ---------- KEYWORD HIGHLIGHT ---------- */
.cn-kw {
    color: var(--cn-accent);
    font-weight: 800;
}

@media (max-width: 575.98px) {
    .cn-list-title { font-size: 1.1rem; }
    .cn-seo-block { padding: 20px; margin-top: 32px; }
    .cn-seo-block h2 { font-size: 1rem; }
}

/* =========================================================================
   CN CARD — CYBER-NEON
   ========================================================================= */
.cn-card {
    position: relative;
    background-color: var(--cn-bg-2);
    border: 1px solid var(--cn-border);
    border-radius: 8px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
    isolation: isolate;
}
.cn-card:hover {
    border-color: var(--cn-accent);
    box-shadow: 0 0 0 1px rgba(0,229,160,.25), 0 8px 28px rgba(0,0,0,.6), 0 0 24px rgba(0,229,160,.18);
    transform: translateY(-3px);
}
.cn-card::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--cn-accent), transparent);
    opacity: 0;
    pointer-events: none;
    z-index: 4;
    transition: opacity .25s ease;
}
.cn-card:hover::after { opacity: 1; }

.cn-card-img-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 2 / 3;
    overflow: hidden;
    background-color: var(--cn-bg-3);
    flex-shrink: 0;
}
.cn-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .45s ease;
}
.cn-card:hover .cn-card-img { transform: scale(1.05); }

.cn-card-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 10px 8px 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(to top, rgba(7,11,18,.95) 0%, rgba(7,11,18,.65) 55%, rgba(7,11,18,0) 100%);
    z-index: 2;
    pointer-events: none;
}

.cn-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 8px;
    font-family: 'Inter', system-ui, sans-serif;
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    border-radius: 4px;
    line-height: 1.3;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cn-chip-audio {
    background-color: rgba(13,20,32,.85);
    color: var(--cn-text);
    border: 1px solid var(--cn-border);
}
.cn-chip-quality {
    background-color: var(--cn-accent);
    color: #04120c;
    border: 1px solid var(--cn-accent);
    margin-left: auto;
    box-shadow: 0 0 10px rgba(0,229,160,.35);
}

.cn-badge-imdb {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .7rem;
    font-weight: 800;
    color: #04120c;
    background-color: var(--cn-accent);
    border-radius: 4px;
    box-shadow: 0 0 12px rgba(0,229,160,.45);
    letter-spacing: -.01em;
}
.cn-badge-imdb i { font-size: .65rem; }

.cn-badge-year {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
    padding: 3px 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .7rem;
    font-weight: 700;
    color: var(--cn-text);
    background-color: rgba(13,20,32,.9);
    border: 1px solid var(--cn-border);
    border-radius: 4px;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.cn-card-title-wrap {
    padding: 8px 10px 10px;
    flex-grow: 1;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}
.cn-card-title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--cn-text);
    text-align: center;
    letter-spacing: -.01em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.5em;
    max-height: 2.5em;
}
.cn-card:hover .cn-card-title { color: var(--cn-accent); }

.cn-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
    height: 100%;
}
.cn-card-link:hover { color: inherit; text-decoration: none; }
.cn-card-link:focus-visible {
    outline: 2px solid var(--cn-accent);
    outline-offset: 2px;
    border-radius: 8px;
}

/* =========================================================================
   CN POPOVER (hover do card)
   ========================================================================= */
.cn-popover {
    position: absolute;
    z-index: 9998;
    width: 640px;
    max-width: calc(100vw - 32px);
    background-color: var(--cn-bg-2);
    border: 1px solid var(--cn-accent);
    border-radius: 12px;
    box-shadow:
        0 0 0 1px rgba(0,229,160,.25),
        0 20px 60px rgba(0,0,0,.85),
        0 0 40px rgba(0,229,160,.15);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    pointer-events: none;
    overflow: hidden;
}
.cn-popover.cn-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}
.cn-popover::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -6px;
    height: 6px;
    background: transparent;
    pointer-events: auto;
}
.cn-popover.cn-pop-below::before {
    top: auto;
    bottom: -6px;
}

.cn-pop-loading,
.cn-pop-error {
    padding: 40px 20px;
    text-align: center;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .85rem;
    color: var(--cn-text-2);
}
.cn-pop-error { color: var(--cn-danger); }

.cn-pop-inner {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 18px;
    padding: 16px;
}

.cn-pop-cover {
    position: relative;
    width: 180px;
    height: 270px;
    border-radius: 8px;
    overflow: hidden;
    background-color: var(--cn-bg-3);
    border: 1px solid var(--cn-border);
    flex-shrink: 0;
}
.cn-pop-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.cn-pop-year {
    position: absolute;
    top: 8px;
    right: 8px;
    padding: 3px 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .7rem;
    font-weight: 700;
    color: var(--cn-text);
    background-color: rgba(13,20,32,.9);
    border: 1px solid var(--cn-border);
    border-radius: 4px;
    backdrop-filter: blur(4px);
}

.cn-pop-info {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.cn-pop-title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.15rem;
    font-weight: 900;
    color: var(--cn-text);
    line-height: 1.2;
    margin: 0;
    letter-spacing: -.01em;
}
.cn-pop-original {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .85rem;
    font-style: italic;
    font-weight: 500;
    color: var(--cn-text-2);
    margin: 0;
    line-height: 1.3;
}

.cn-pop-genres {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cn-pop-genre {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    background-color: rgba(0,229,160,.08);
    color: var(--cn-accent);
    border: 1px solid var(--cn-accent);
    border-radius: 20px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    white-space: nowrap;
}

.cn-pop-meta {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.cn-pop-meta li {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-family: 'Inter', sans-serif;
    font-size: .82rem;
    line-height: 1.35;
}
.cn-pop-meta li i {
    color: var(--cn-accent);
    font-size: .8rem;
    width: 14px;
    flex-shrink: 0;
    text-align: center;
}
.cn-pop-meta-label {
    color: var(--cn-text-2);
    font-weight: 600;
}
.cn-pop-meta-value {
    color: var(--cn-text);
    font-weight: 600;
}
.cn-pop-imdb a {
    color: var(--cn-accent);
    text-decoration: none;
    font-weight: 800;
    transition: color .15s ease;
}
.cn-pop-imdb a:hover {
    color: var(--cn-accent-2);
    text-decoration: underline;
}

.cn-pop-synopsis {
    font-family: 'Inter', sans-serif;
    font-size: .82rem;
    line-height: 1.6;
    color: var(--cn-text-2);
    margin: 0;
    text-align: justify;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cn-pop-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid var(--cn-border);
}
.cn-pop-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 6px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    text-decoration: none;
    transition: all .18s ease;
}
.cn-pop-btn i { font-size: .9rem; }

.cn-pop-btn-trailer {
    background-color: transparent;
    color: var(--cn-accent-2);
    border: 1px solid var(--cn-accent-2);
}
.cn-pop-btn-trailer:hover {
    background-color: var(--cn-accent-2);
    color: #04120c;
    text-decoration: none;
    box-shadow: 0 0 18px rgba(0,194,255,.45);
    transform: translateY(-1px);
}

.cn-pop-btn-page {
    background-color: var(--cn-accent);
    color: #04120c;
    border: 1px solid var(--cn-accent);
    margin-left: auto;
}
.cn-pop-btn-page:hover {
    background-color: var(--cn-accent-2);
    border-color: var(--cn-accent-2);
    color: #04120c;
    text-decoration: none;
    box-shadow: 0 0 18px rgba(0,194,255,.45);
    transform: translateY(-1px);
}

@media (max-width: 767.98px) {
    .cn-pop-inner { grid-template-columns: 1fr; }
    .cn-pop-cover { width: 100%; height: 220px; }
    .cn-pop-cover img { object-position: top; }
}

/* =========================================================================
   CN FOOTER — CYBER-NEON
   ========================================================================= */
.footer {
    background-color: var(--cn-bg-2) !important;
    border-top: 1px solid var(--cn-border) !important;
    color: var(--cn-text);
    margin-top: 48px;
}
.footer-seo-content {
    padding-top: 16px !important;
    padding-bottom: 8px !important;
}

.cn-footer-intro {
    max-width: 800px;
}
.cn-footer-heading {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.1rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .02em;
    color: var(--cn-text);
    margin: 0 0 14px;
    padding: 0;
    border: none;
    line-height: 1.35;
}
.cn-footer-heading .cn-footer-kw {
    color: var(--cn-accent);
}
.cn-footer-text {
    font-family: 'Inter', sans-serif;
    font-size: .88rem;
    line-height: 1.7;
    color: var(--cn-text-2);
    margin: 0;
}
.cn-footer-text strong {
    color: var(--cn-text);
    font-weight: 700;
}

.cn-footer-page-block {
    max-width: 800px;
    background-color: rgba(0,0,0,.25);
    border: 1px solid var(--cn-border);
    border-left: 3px solid var(--cn-accent);
    border-radius: 6px;
    padding: 14px 18px;
    text-align: left;
}
.cn-footer-page-label {
    display: inline-flex;
    align-items: center;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--cn-accent);
    margin-bottom: 6px;
}
.cn-footer-page-title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .95rem;
    font-weight: 700;
    line-height: 1.4;
    color: var(--cn-text);
    margin: 0;
}
.cn-footer-page-desc {
    font-family: 'Inter', sans-serif;
    font-size: .82rem;
    line-height: 1.6;
    color: var(--cn-text-2);
    margin: 0;
}

.cn-footer-bottom {
    max-width: 800px;
    padding-top: 20px;
    border-top: 1px solid var(--cn-border);
}
.cn-footer-copy {
    font-family: 'Inter', sans-serif;
    font-size: .82rem;
    color: var(--cn-text-2);
}
.cn-footer-copy strong {
    color: var(--cn-text);
    font-weight: 700;
}
.cn-footer-disclaimer {
    font-family: 'Inter', sans-serif;
    font-size: .76rem;
    line-height: 1.6;
    color: var(--cn-text-2);
    opacity: .85;
}
.cn-footer-disclaimer strong { color: var(--cn-text); }
.cn-footer-disclaimer i { color: var(--cn-warn); }

@media (max-width: 575.98px) {
    .cn-footer-heading { font-size: .95rem; }
    .cn-footer-text { font-size: .82rem; }
    .cn-footer-page-block { padding: 12px 14px; }
    .cn-footer-page-title { font-size: .88rem; }
    .cn-footer-page-desc { font-size: .78rem; }
    .cn-footer-copy { font-size: .76rem; }
    .cn-footer-disclaimer { font-size: .72rem; }
}

/* =========================================================================
   HEROES DE MÍDIA — BASE COMUM
   (cn-tag-hero, cn-studio-hero, cn-artist-hero)
   ========================================================================= */
.cn-tag-hero,
.cn-studio-hero,
.cn-artist-hero {
    position: relative;
    background-color: var(--cn-bg-2);
    border-bottom: 1px solid var(--cn-border);
    padding: 48px 0 42px;
    isolation: isolate;
    overflow: hidden;
}
.cn-tag-hero::before,
.cn-studio-hero::before,
.cn-artist-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 25%, rgba(0,229,160,.06) 0%, transparent 55%),
        radial-gradient(circle at 82% 75%, rgba(0,194,255,.05) 0%, transparent 50%);
    z-index: 1;
    pointer-events: none;
}
.cn-tag-hero::after,
.cn-studio-hero::after,
.cn-artist-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(0deg, rgba(0,229,160,.03) 0 1px, transparent 1px 3px);
    z-index: 1;
    pointer-events: none;
}
.cn-tag-hero .container,
.cn-studio-hero .container,
.cn-artist-hero .container {
    position: relative;
    z-index: 2;
}

/* =========================================================================
   TÍTULOS DE HERO — NOME COMUM
   (cn-tag-name, cn-studio-name, cn-artist-name)
   ========================================================================= */
.cn-tag-name,
.cn-studio-name,
.cn-artist-name {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 900;
    letter-spacing: -.025em;
    color: var(--cn-text);
    font-size: 1.9rem;
    line-height: 1.15;
    margin: 0 0 20px;
    text-shadow: 0 2px 24px rgba(0,0,0,.95);
    word-break: break-word;
}
.cn-artist-name { margin: 0 0 6px; }
@media (min-width: 768px) {
    .cn-tag-name,
    .cn-studio-name,
    .cn-artist-name { font-size: 2.4rem; }
}
@media (min-width: 1200px) {
    .cn-tag-name,
    .cn-studio-name,
    .cn-artist-name { font-size: 2.7rem; }
}

/* =========================================================================
   KICKER COMUM
   (cn-tag-kicker, cn-studio-kicker)
   ========================================================================= */
.cn-tag-kicker,
.cn-studio-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--cn-accent);
    margin-bottom: 14px;
}
.cn-tag-kicker i,
.cn-studio-kicker i { font-size: .85rem; }
.cn-tag-kicker::before,
.cn-studio-kicker::before {
    content: "";
    width: 24px;
    height: 2px;
    background-color: var(--cn-accent);
    box-shadow: 0 0 8px rgba(0,229,160,.6);
}

/* =========================================================================
   BADGE DE INFO COMUM
   (cn-tag-count, cn-studio-badge, cn-artist-badge)
   ========================================================================= */
.cn-tag-count,
.cn-studio-badge,
.cn-artist-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background-color: rgba(13,20,32,.75);
    border: 1px solid var(--cn-border);
    border-radius: 10px;
    font-family: 'Space Grotesk', sans-serif;
    color: var(--cn-text);
    transition: all .2s ease;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    line-height: 1.2;
    min-height: 52px;
}
.cn-studio-badge,
.cn-artist-badge { padding: 10px 14px; }

.cn-tag-count:hover,
.cn-studio-badge:hover,
.cn-artist-badge:hover {
    border-color: var(--cn-accent);
    box-shadow: 0 0 20px rgba(0,229,160,.25);
    transform: translateY(-1px);
}
.cn-tag-count i,
.cn-studio-badge .cn-sb-icon,
.cn-artist-badge .cn-ab-icon {
    font-size: 1.05rem;
    color: var(--cn-accent);
    flex-shrink: 0;
}
.cn-tag-count .cn-tag-count-content,
.cn-studio-badge .cn-sb-content,
.cn-artist-badge .cn-ab-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.cn-tag-count .cn-tag-count-label,
.cn-studio-badge .cn-sb-label,
.cn-artist-badge .cn-ab-label {
    font-family: 'Inter', sans-serif;
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--cn-text-2);
    line-height: 1;
}
.cn-tag-count .cn-tag-count-value,
.cn-studio-badge .cn-sb-value,
.cn-artist-badge .cn-ab-value {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .92rem;
    font-weight: 700;
    color: var(--cn-text);
    line-height: 1.1;
}
.cn-tag-count .cn-tag-count-value { font-size: 1rem; color: var(--cn-accent); }

@media (max-width: 767.98px) {
    .cn-studio-badge,
    .cn-artist-badge { padding: 8px 12px; min-height: 46px; gap: 8px; }
    .cn-studio-badge .cn-sb-value,
    .cn-artist-badge .cn-ab-value { font-size: .85rem; }
    .cn-studio-badge .cn-sb-label,
    .cn-artist-badge .cn-ab-label { font-size: .58rem; }
    .cn-studio-badge .cn-sb-icon,
    .cn-artist-badge .cn-ab-icon { font-size: .95rem; }
}

/* =========================================================================
   PLACEHOLDER COMUM
   (cn-studio-logo-placeholder, cn-artist-photo-placeholder)
   ========================================================================= */
.cn-studio-logo-placeholder,
.cn-artist-photo-placeholder {
    background-color: var(--cn-bg-3);
    border: 1px solid var(--cn-border);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: var(--cn-text-2);
    margin: 0 auto;
    box-shadow: 0 20px 60px rgba(0,0,0,.6);
}
.cn-studio-logo-placeholder {
    width: 100%;
    max-width: 320px;
    height: 180px;
}
.cn-artist-photo-placeholder {
    width: 100%;
    max-width: 320px;
    aspect-ratio: 2 / 3;
}
.cn-studio-logo-placeholder i,
.cn-artist-photo-placeholder i {
    font-size: 3rem;
    color: var(--cn-accent);
    opacity: .35;
}
.cn-studio-logo-placeholder span,
.cn-artist-photo-placeholder span {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--cn-text-2);
}

/* =========================================================================
   CN ETIQUETA — CYBER-NEON
   ========================================================================= */

.cn-tag-keywords {
    background-color: var(--cn-bg-3);
    border: 1px solid var(--cn-border);
    border-left: 3px solid var(--cn-accent);
    border-radius: 8px;
    padding: 16px 20px;
    margin-bottom: 20px;
    font-family: 'Inter', sans-serif;
    font-size: .88rem;
    line-height: 1.7;
    color: var(--cn-text-2);
}
.cn-tag-keywords strong {
    display: block;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--cn-accent);
    margin-bottom: 6px;
}

.cn-section-title .cn-tag-highlight {
    color: var(--cn-accent);
}

.cn-tag-grid {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .cn-tag-hero { padding: 32px 0 30px; }
    .cn-tag-name { font-size: 1.7rem; }
    .cn-tag-keywords { padding: 14px 16px; font-size: .84rem; }
}
@media (max-width: 575.98px) {
    .cn-tag-count { padding: 8px 12px; }
    .cn-tag-count .cn-tag-count-value { font-size: .9rem; }
}

/* =========================================================================
   CN PRODUTORA — CYBER-NEON
   ========================================================================= */

.cn-studio-logo-wrap {
    position: relative;
    display: inline-block;
    max-width: 100%;
}
.cn-studio-logo {
    width: 100%;
    max-width: 320px;
    max-height: 220px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
    background-color: var(--cn-bg-3);
    border: 1px solid var(--cn-border);
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 20px 60px rgba(0,0,0,.9), 0 0 0 1px rgba(0,229,160,.25);
}

.cn-studio-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

.cn-section-title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.15rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .02em;
    color: var(--cn-text);
    margin: 0 0 20px;
    padding-left: 12px;
    border-left: 3px solid var(--cn-accent);
    line-height: 1.3;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.cn-section-title i {
    color: var(--cn-accent);
    font-size: .95rem;
}
.cn-section-title .cn-studio-highlight,
.cn-section-title .cn-tag-highlight {
    color: var(--cn-accent);
}

.cn-studio-bio {
    font-family: 'Inter', sans-serif;
    font-size: .95rem;
    line-height: 1.8;
    color: var(--cn-text);
    text-align: justify;
    margin: 0;
}

.cn-studio-grid {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .cn-studio-hero { padding: 32px 0 30px; }
    .cn-studio-name { font-size: 1.7rem; }
}

/* =========================================================================
   CN ARTISTA — CYBER-NEON
   ========================================================================= */

.cn-artist-photo-wrap {
    position: relative;
    display: inline-block;
    max-width: 100%;
}
.cn-artist-photo {
    width: 100%;
    max-width: 320px;
    aspect-ratio: 2 / 3;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid var(--cn-border);
    box-shadow: 0 20px 60px rgba(0,0,0,.9), 0 0 0 1px rgba(0,229,160,.25);
    display: block;
    margin: 0 auto;
}

.cn-artist-subtitle {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .9rem;
    font-weight: 600;
    color: var(--cn-text-2);
    text-transform: uppercase;
    letter-spacing: .12em;
    margin: 0 0 22px;
}

.cn-artist-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

/* Falecimento */
.cn-artist-badge.cn-ab-death .cn-ab-icon { color: var(--cn-danger); }
.cn-artist-badge.cn-ab-death .cn-ab-value { color: var(--cn-danger); }
.cn-artist-badge.cn-ab-death { border-color: rgba(255,59,107,.45); }

/* Popularidade */
.cn-artist-badge.cn-ab-pop {
    border-color: rgba(0,229,160,.45);
    box-shadow: 0 0 18px rgba(0,229,160,.12);
}
.cn-artist-badge.cn-ab-pop .cn-ab-value {
    color: var(--cn-accent);
}

.cn-artist-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
}
.cn-social-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    background-color: transparent;
    color: var(--cn-text-2);
    border: 1px solid var(--cn-border);
    border-radius: 30px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    text-decoration: none;
    transition: all .2s ease;
}
.cn-social-btn:hover {
    color: var(--cn-accent);
    border-color: var(--cn-accent);
    background-color: rgba(0,229,160,.08);
    text-decoration: none;
    box-shadow: 0 0 16px rgba(0,229,160,.35);
    transform: translateY(-1px);
}
.cn-social-btn i { font-size: .95rem; }

.cn-social-instagram:hover { color: #db2777; border-color: #db2777; background-color: rgba(219,39,119,.08); box-shadow: 0 0 16px rgba(219,39,119,.35); }
.cn-social-twitter:hover { color: #1d9bf0; border-color: #1d9bf0; background-color: rgba(29,155,240,.08); box-shadow: 0 0 16px rgba(29,155,240,.35); }
.cn-social-imdb:hover { color: #f5c518; border-color: #f5c518; background-color: rgba(245,197,24,.08); box-shadow: 0 0 16px rgba(245,197,24,.35); }
.cn-social-wikidata:hover { color: #00b4d8; border-color: #00b4d8; background-color: rgba(0,180,216,.08); box-shadow: 0 0 16px rgba(0,180,216,.35); }

.cn-section {
    background-color: var(--cn-bg-2);
    border: 1px solid var(--cn-border);
    border-radius: 10px;
    padding: 28px 32px;
    margin-bottom: 24px;
}
@media (max-width: 575.98px) {
    .cn-section { padding: 20px; border-radius: 8px; }
}

.cn-artist-bio {
    font-family: 'Inter', sans-serif;
    font-size: .95rem;
    line-height: 1.8;
    color: var(--cn-text);
    text-align: justify;
    margin: 0;
}

.cn-artist-grid {
    margin-bottom: 24px;
}

@media (max-width: 767.98px) {
    .cn-artist-hero { padding: 32px 0 30px; }
    .cn-artist-name { font-size: 1.7rem; }
}
@media (max-width: 575.98px) {
    .cn-artist-badge { padding: 8px 12px; }
    .cn-social-btn { font-size: .72rem; padding: 6px 13px; }
    .cn-pagination .page-link { min-width: 36px; height: 36px; font-size: .78rem; }
}