/*
Theme Name: Meu Tema SailorMoon Style
Version: 1.8 - Mobile Polish
... (resto do seu cabeçalho de tema) ...
*/

/* --- ESTRUTURA, CORES E FONTES GERAIS --- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Montserrat', sans-serif; font-size: 16px; line-height: 1.6; color: #f0f0f0; background-color: #0b0c1a; }
.container { width: 90%; max-width: 1200px; margin: 0 auto; }
a { color: #ffd700; text-decoration: none; transition: color 0.3s ease; }
a:hover { color: #ff69b4; }
h1, h2, h3, h4, h5, h6 { font-family: 'Playfair Display', serif; color: #ffd700; margin-bottom: 20px; }

/* --- SEÇÕES SUPERIORES --- */
#top-bar { background-color: #06070d; padding: 10px 0; border-bottom: 1px solid #2a2a3a; }
#top-bar .container { display: flex; justify-content: space-between; align-items: center; }
.site-banner { height: 250px; background-color: #1a1a2e; display: flex; align-items: center; justify-content: center; color: #555; }
.character-spotlight { padding: 60px 0; background-color: #0b0c1a; text-align: center; }
.character-spotlight .spotlight-title { font-size: 2.5rem; color: #ffd700; margin-bottom: 50px; text-transform: uppercase; }
.character-spotlight .character-grid { display: flex; justify-content: center; align-items: flex-start; gap: 30px; flex-wrap: wrap; }
.character-item { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 150px; text-align: center; padding: 15px; background-color: #1a1a2e; border-radius: 10px; box-shadow: 0 4px 15px rgba(0,0,0,0.2); transition: transform 0.3s ease, box-shadow 0.3s ease; }
.character-item:hover { transform: translateY(-5px); box-shadow: 0 8px 20px rgba(0,0,0,0.3); }
.character-image-wrapper { width: 100px; height: 100px; border-radius: 50%; overflow: hidden; border: 3px solid #ff69b4; box-shadow: 0 0 0 3px #ffd700; transition: border-color 0.3s ease, box-shadow 0.3s ease; }
.character-item:hover .character-image-wrapper { border-color: #ffd700; box-shadow: 0 0 0 3px #ff69b4; }
.character-image-wrapper img { width: 100%; height: 100%; object-fit: cover; display: block; }
.character-name { font-size: 1rem; color: #f0f0f0; margin-top: 10px; margin-bottom: 0; text-transform: uppercase; }
.character-button { background-color: transparent; border: 1px solid #ffd700; color: #ffd700; padding: 8px 15px; border-radius: 20px; font-size: 0.8rem; font-weight: bold; text-transform: uppercase; transition: all 0.3s ease; margin-top: auto; }
.character-button:hover { background-color: #ffd700; color: #0b0c1a; }
.see-more { display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; flex-shrink: 0; margin-left: 20px; }
.see-more-btn { background-color: #ffd700; color: #0b0c1a; padding: 10px 20px; border-radius: 25px; font-size: 0.9rem; font-weight: bold; text-transform: uppercase; border: none; cursor: pointer; box-shadow: 0 2px 10px rgba(0,0,0,0.2); transition: background-color 0.3s ease, transform 0.3s ease; }
.see-more-btn:hover { background-color: #ff69b4; transform: translateY(-2px); }

/* --- CABEÇALHO E NAVEGAÇÃO --- */
.sticky-header { 
    background-color: #0b0c1a; 
    position: relative; 
    z-index: 999; 
    transition: all 0.4s ease-in-out; 
}

.header-logo-area { 
    padding: 30px 0; 
    text-align: center; 
}

.header-logo-area .logo .custom-logo-link { 
    display: inline-block; 
    line-height: 0; 
}

.header-logo-area .logo img { 
    max-height: 80px; 
    width: auto; 
}

.header-nav-area { 
    background-color: rgba(17, 17, 30, 0.9); 
    border-top: 1px solid #2a2a3a; 
    border-bottom: 1px solid #2a2a3a; 
    backdrop-filter: blur(10px);
}

.header-nav-area .container { 
    display: flex; 
    align-items: center; 
    justify-content: flex-end; 
}

.hamburger-btn { 
    background: rgba(255, 255, 255, 0.1); 
    border: 2px solid #ffd700; 
    cursor: pointer; 
    display: block; 
    z-index: 1010; 
    padding: 12px; 
    border-radius: 5px;
    width: 50px;
    height: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    transition: all 0.3s ease;
}

.hamburger-btn:hover {
    background: rgba(255, 215, 0, 0.2);
    border-color: #ff69b4;
}

.hamburger-line { 
    background-color: #ffd700; 
    height: 3px; 
    width: 25px; 
    border-radius: 3px; 
    transition: all 0.3s ease-in-out; 
    display: block;
}

.hamburger-btn[aria-expanded="true"] .hamburger-line:nth-child(1) {
    transform: rotate(45deg) translate(6px, 6px);
}

.hamburger-btn[aria-expanded="true"] .hamburger-line:nth-child(2) {
    opacity: 0;
}

.hamburger-btn[aria-expanded="true"] .hamburger-line:nth-child(3) {
    transform: rotate(-45deg) translate(6px, -6px);
}

.main-navigation { 
    display: none; 
}

.main-navigation.is-open { 
    display: block; 
    background-color: rgba(26, 26, 46, 0.98); 
    position: fixed; 
    top: 0; 
    right: 0; 
    width: 280px; 
    height: 100vh; 
    padding: 80px 20px 20px 20px; 
    z-index: 1001; 
    animation: slideIn 0.4s ease-out; 
    backdrop-filter: blur(10px);
    border-left: 2px solid #ffd700;
}

.main-navigation.is-open .main-menu { 
    list-style: none; 
    display: flex; 
    flex-direction: column; 
    gap: 15px; 
    margin: 0;
    padding: 0;
}

.main-navigation.is-open .main-menu a {
    color: #f0f0f0;
    font-size: 1.1rem;
    font-weight: 500;
    padding: 15px 0;
    display: block;
    border-bottom: 1px solid #2a2a3a;
    transition: color 0.3s ease;
}

.main-navigation.is-open .main-menu a:hover {
    color: #ffd700;
}

@keyframes slideIn { 
    from { right: -100%; } 
    to { right: 0; } 
}

@media (min-width: 992px) {
    .header-nav-area .container { 
        justify-content: center; 
    }
    
    .hamburger-btn { 
        display: none; 
    }
    
    .main-navigation { 
        display: block !important; 
        position: static; 
        width: auto; 
        height: auto; 
        background: none; 
        padding: 0; 
    }
    
    .main-navigation .main-menu { 
        display: flex; 
        flex-direction: row; 
        align-items: center; 
        gap: 40px; 
        list-style: none; 
        margin: 0;
        padding: 0;
    }
    
    .main-navigation a { 
        color: #f0f0f0; 
        font-size: 1rem; 
        font-weight: 500; 
        padding: 20px 0; 
        display: block; 
        border-bottom: 2px solid transparent; 
        transition: all 0.3s ease; 
    }
    
    .main-navigation a:hover { 
        color: #ffd700; 
        border-bottom-color: #ffd700; 
    }
    
    .main-navigation .current-menu-item a { 
        color: #ffd700; 
    }
    
    .has-megamenu { 
        position: static; 
    }
    
    .has-megamenu > .sub-menu { 
        display: flex; 
        gap: 30px; 
        background-color: rgba(26, 26, 46, 0.95); 
        border-top: 3px solid #ffd700; 
        box-shadow: 0 5px 15px rgba(0,0,0,0.3); 
        position: absolute; 
        top: 100%; 
        left: 0; 
        width: 100%; 
        padding: 25px 5%; 
        opacity: 0; 
        visibility: hidden; 
        transition: opacity 0.3s ease, visibility 0.3s; 
        pointer-events: none; 
        backdrop-filter: blur(10px);
    }
    
    .has-megamenu:hover > .sub-menu { 
        opacity: 1; 
        visibility: visible; 
        pointer-events: auto; 
    }
    
    .has-megamenu .sub-menu > li { 
        list-style-type: none; 
        flex: 1; 
    }
    
    .has-megamenu .sub-menu > li > a { 
        color: #ffd700 !important; 
        font-family: 'Playfair Display', serif; 
        font-weight: bold; 
        margin-bottom: 15px; 
        border: none !important; 
        padding: 0 0 10px 0; 
        display: block; 
    }
    
    .has-megamenu .sub-menu ul { 
        list-style-type: none; 
    }
    
    .has-megamenu .sub-menu ul a { 
        color: #fff; 
        font-weight: normal; 
        display: block; 
        padding: 8px 0; 
        border: none !important; 
    }
    
    .has-megamenu .sub-menu ul a:hover { 
        color: #ff69b4 !important; 
    }
}

/* HEADER STICKY - CORREÇÃO PRINCIPAL */
.sticky-header.is-sticky { 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    background-color: rgba(11, 12, 26, 0.95);
    backdrop-filter: blur(15px);
    box-shadow: 0 4px 20px rgba(0,0,0,0.5); 
    animation: slideDown 0.5s ease-out; 
    z-index: 999;
}

.sticky-header.is-sticky .header-logo-area, 
.sticky-header.is-sticky .site-banner, 
.sticky-header.is-sticky #top-bar { 
    display: none; 
}

/* IMPORTANTE: Manter o nav visível quando sticky */
.sticky-header.is-sticky .header-nav-area {
    background-color: transparent;
    border: none;
}

.sticky-header.is-sticky .header-nav-area .container {
    padding: 10px 0;
}

.sticky-header.is-sticky + main { 
    padding-top: 70px; 
}

@keyframes slideDown { 
    from { transform: translateY(-100%); } 
    to { transform: translateY(0); } 
}

/* --- CARROSSEL HERO --- */
.hero-carousel { width: 100%; height: 350px; background-color: #1a1a2e; }
.swiper.hero-swiper { width: 100%; height: 100%; }
.swiper-slide { background-size: cover; background-position: center; position: relative; color: #fff; text-align: center; }
.swiper-slide .slide-link { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #fff; text-decoration: none; position: relative; z-index: 2; }
.swiper-slide::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(11, 12, 26, 0.6); z-index: 1; }
.slide-content { max-width: 800px; padding: 20px; }
.slide-content h2 { font-size: 2.5rem; margin-bottom: 10px; text-shadow: 2px 2px 8px rgba(0,0,0,0.7); }
.slide-content p { font-size: 1.1rem; opacity: 0.9; }
.hero-swiper .swiper-button-next, .hero-swiper .swiper-button-prev { color: #ffd700; }
.hero-swiper .swiper-pagination-bullet { background: rgba(255, 255, 255, 0.5); }
.hero-swiper .swiper-pagination-bullet-active { background: #ffd700; }

/* --- LAYOUT DE CONTEÚDO COM SIDEBAR --- */
.main-content-wrapper { display: grid; grid-template-columns: 2fr 1fr; gap: 40px; padding-top: 40px; }
.featured-top-post { margin-bottom: 40px; background-color: #1a1a2e; border-radius: 8px; padding: 20px; }
.featured-top-post .post-thumbnail img { width: 100%; height: auto; border-radius: 5px; }
.featured-top-post .entry-header { margin-top: 20px; }
.featured-top-post .post-category { display: inline-block; background-color: #ffd700; color: #0b0c1a; padding: 5px 12px; border-radius: 4px; font-size: 0.75rem; font-weight: bold; text-transform: uppercase; margin-bottom: 15px; }
.featured-top-post .entry-title { font-size: 2.2rem; }
.featured-top-post .entry-title a { color: #ffd700; }
.featured-top-post .entry-content { color: #ccc; }
.secondary-posts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; border-top: 1px solid #2a2a3a; padding-top: 30px; }
.secondary-post-item { display: flex; gap: 15px; background-color: #1a1a2e; padding: 15px; border-radius: 5px; }
.secondary-post-item .post-thumbnail img { width: 100px; height: 100px; object-fit: cover; border-radius: 5px; }
.secondary-post-item .entry-content { display: flex; flex-direction: column; }
.secondary-post-item .post-category { font-size: 0.7rem; background-color: #ff69b4; color: #fff; padding: 3px 8px; border-radius: 3px; text-transform: uppercase; font-weight: bold; align-self: flex-start; margin-bottom: 8px; }
.secondary-post-item .entry-title { font-size: 1rem; line-height: 1.4; margin-bottom: 5px; }
.secondary-post-item .entry-title a { color: #f0f0f0; }
.secondary-post-item .entry-meta { font-size: 0.8rem; color: #888; margin-top: auto; }

/* SIDEBAR, RODAPÉ, UI, ETC */
.widget-area .widget { margin-bottom: 40px; background-color: #1a1a2e; padding: 20px; border-radius: 5px; }
.widget-area .widget-title { font-size: 1.2rem; padding-bottom: 10px; margin-bottom: 20px; border-bottom: 2px solid #ffd700; text-transform: uppercase; }
.widget-area .widget ul { list-style: none; padding-left: 0; }
.widget-area .widget ul li { margin-bottom: 10px; border-bottom: 1px solid #2a2a3a; padding-bottom: 10px; }
.widget-area .widget ul li:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.site-footer { background: #111; color: #ccc; text-align: center; padding: 20px; margin-top: 40px; border-top: 2px solid #ffd700; }
.search-form-container .search-form { display: flex; border: 1px solid #333; border-radius: 20px; background-color: #1a1a2e; overflow: hidden; }
.search-form-container .search-field { background-color: transparent; border: none; color: #fff; padding: 8px 15px; width: 150px; transition: width 0.3s ease; }
.search-form-container .search-field:focus { outline: none; width: 200px; }
.search-form-container .search-submit { background-color: #ffd700; color: #0b0c1a; border: none; padding: 0 15px; cursor: pointer; }
.social-menu { list-style: none; display: flex; gap: 15px; margin: 0; padding: 0; }
.social-menu a { display: block; width: 24px; height: 24px; background-color: #fff; transition: background-color 0.3s ease; }
.social-menu a:hover { background-color: #ff69b4; }
.screen-reader-text { position: absolute; left: -9999px; }
[href*="twitter.com"]{ -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M22.46,6C21.69,6.35 20.86,6.58 20,6.69C20.88,6.16 21.56,5.32 21.88,4.31C21.05,4.81 20.13,5.16 19.16,5.36C18.37,4.5 17.26,4 16,4C13.65,4 11.73,5.92 11.73,8.29C11.73,8.63 11.77,8.96 11.84,9.27C8.28,9.09 5.11,7.38 2.9,4.79C2.53,5.42 2.33,6.15 2.33,6.94C2.33,8.43 3.11,9.75 4.26,10.54C3.54,10.51 2.88,10.31 2.3,10.03C2.3,10.05 2.3,10.06 2.3,10.08C2.3,12.25 3.84,14.06 5.87,14.45C5.5,14.54 5.12,14.58 4.71,14.58C4.42,14.58 4.14,14.56 3.87,14.51C4.42,16.31 6.04,17.56 8.04,17.6C6.5,18.73 4.61,19.42 2.58,19.42C2.22,19.42 1.87,19.4 1.51,19.34C3.54,20.68 5.91,21.42 8.44,21.42C16.02,21.42 20.34,15.17 20.34,9.73C20.34,9.56 20.33,9.4 20.32,9.23C21.16,8.63 21.88,7.87 22.46,7.01C21.74,7.33 20.97,7.56 20.16,7.66C20.99,7.12 21.63,6.29 21.94,5.27C21.94,5.27 22.46,6 22.46,6Z"/></svg>') no-repeat center; mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M22.46,6C21.69,6.35 20.86,6.58 20,6.69C20.88,6.16 21.56,5.32 21.88,4.31C21.05,4.81 20.13,5.16 19.16,5.36C18.37,4.5 17.26,4 16,4C13.65,4 11.73,5.92 11.73,8.29C11.73,8.63 11.77,8.96 11.84,9.27C8.28,9.09 5.11,7.38 2.9,4.79C2.53,5.42 2.33,6.15 2.33,6.94C2.33,8.43 3.11,9.75 4.26,10.54C3.54,10.51 2.88,10.31 2.3,10.03C2.3,10.05 2.3,10.06 2.3,10.08C2.3,12.25 3.84,14.06 5.87,14.45C5.5,14.54 5.12,14.58 4.71,14.58C4.42,14.58 4.14,14.56 3.87,14.51C4.42,16.31 6.04,17.56 8.04,17.6C6.5,18.73 4.61,19.42 2.58,19.42C2.22,19.42 1.87,19.4 1.51,19.34C3.54,20.68 5.91,21.42 8.44,21.42C16.02,21.42 20.34,15.17 20.34,9.73C20.34,9.56 20.33,9.4 20.32,9.23C21.16,8.63 21.88,7.87 22.46,7.01C21.74,7.33 20.97,7.56 20.16,7.66C20.99,7.12 21.63,6.29 21.94,5.27C21.94,5.27 22.46,6 22.46,6Z"/></svg>') no-repeat center; }
[href*="facebook.com"]{ -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2.04C6.5 2.04 2 6.53 2 12.06C2 17.06 5.66 21.21 10.44 21.96V14.96H7.9V12.06H10.44V9.85C10.44 7.32 11.93 5.96 14.22 5.96C15.31 5.96 16.45 6.15 16.45 6.15V8.62H15.19C13.95 8.62 13.56 9.39 13.56 10.18V12.06H16.34L15.89 14.96H13.56V21.96C18.34 21.21 22 17.06 22 12.06C22 6.53 17.5 2.04 12 2.04Z"/></svg>') no-repeat center; mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2.04C6.5 2.04 2 6.53 2 12.06C2 17.06 5.66 21.21 10.44 21.96V14.96H7.9V12.06H10.44V9.85C10.44 7.32 11.93 5.96 14.22 5.96C15.31 5.96 16.45 6.15 16.45 6.15V8.62H15.19C13.95 8.62 13.56 9.39 13.56 10.18V12.06H16.34L15.89 14.96H13.56V21.96C18.34 21.21 22 17.06 22 12.06C22 6.53 17.5 2.04 12 2.04Z"/></svg>') no-repeat center; }
[href*="instagram.com"]{ -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.8,2H16.2C19.4,2 22,4.6 22,7.8V16.2A5.8,5.8 0 0,1 16.2,22H7.8C4.6,22 2,19.4 2,16.2V7.8A5.8,5.8 0 0,1 7.8,2M7.6,4A3.6,3.6 0 0,0 4,7.6V16.4A3.6,3.6 0 0,0 7.6,20H16.4A3.6,3.6 0 0,0 20,16.4V7.6A3.6,3.6 0 0,0 16.4,4H7.6M17.25,5.5A1.25,1.25 0 0,1 18.5,6.75A1.25,1.25 0 0,1 17.25,8A1.25,1.25 0 0,1 16,6.75A1.25,1.25 0 0,1 17.25,5.5M12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9Z"/></svg>') no-repeat center; mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.8,2H16.2C19.4,2 22,4.6 22,7.8V16.2A5.8,5.8 0 0,1 16.2,22H7.8C4.6,22 2,19.4 2,16.2V7.8A5.8,5.8 0 0,1 7.8,2M7.6,4A3.6,3.6 0 0,0 4,7.6V16.4A3.6,3.6 0 0,0 7.6,20H16.4A3.6,3.6 0 0,0 20,16.4V7.6A3.6,3.6 0 0,0 16.4,4H7.6M17.25,5.5A1.25,1.25 0 0,1 18.5,6.75A1.25,1.25 0 0,1 17.25,8A1.25,1.25 0 0,1 16,6.75A1.25,1.25 0 0,1 17.25,5.5M12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9Z"/></svg>') no-repeat center; }
[href*="youtube.com"]{ -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10,15L15.19,12L10,9V15M21.56,7.17C21.69,7.64 21.78,8.27 21.84,9.07C21.91,9.87 21.94,10.56 21.94,11.16L22,12C22,14.19 21.84,15.8 21.56,16.83C21.31,17.73 20.73,18.31 19.83,18.56C19.36,18.69 18.73,18.78 17.93,18.84C17.13,18.91 16.44,18.94 15.84,18.94L15,19C12.81,19 11.2,18.84 10.17,18.56C9.27,18.31 8.69,17.73 8.44,16.83C8.31,16.36 8.22,15.73 8.16,14.93C8.09,14.13 8.06,13.44 8.06,12.84L8,12C8,9.81 8.16,8.2 8.44,7.17C8.69,6.27 9.27,5.69 10.17,5.44C11.64,5.06 14.87,5 15.5,5L15.84,5.06C16.44,5.06 17.13,5.09 17.93,5.16C18.73,5.22 19.36,5.31 19.83,5.44C20.73,5.69 21.31,6.27 21.56,7.17Z"/></svg>') no-repeat center; mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10,15L15.19,12L10,9V15M21.56,7.17C21.69,7.64 21.78,8.27 21.84,9.07C21.91,9.87 21.94,10.56 21.94,11.16L22,12C22,14.19 21.84,15.8 21.56,16.83C21.31,17.73 20.73,18.31 19.83,18.56C19.36,18.69 18.73,18.78 17.93,18.84C17.13,18.91 16.44,18.94 15.84,18.94L15,19C12.81,19 11.2,18.84 10.17,18.56C9.27,18.31 8.69,17.73 8.44,16.83C8.31,16.36 8.22,15.73 8.16,14.93C8.09,14.13 8.06,13.44 8.06,12.84L8,12C8,9.81 8.16,8.2 8.44,7.17C8.69,6.27 9.27,5.69 10.17,5.44C11.64,5.06 14.87,5 15.5,5L15.84,5.06C16.44,5.06 17.13,5.09 17.93,5.16C18.73,5.22 19.36,5.31 19.83,5.44C20.73,5.69 21.31,6.27 21.56,7.17Z"/></svg>') no-repeat center; }
button, input[type="submit"], input[type="button"] { background: #ffd700; color: #0b0c1a; border: none; padding: 10px 20px; font-weight: bold; cursor: pointer; border-radius: 5px; transition: all 0.3s ease; }
button:hover, input[type="submit"]:hover, input[type="button"]:hover { background: #ff69b4; color: #fff; }

/* ============================================== */
/* --- AJUSTES FINAIS DE RESPONSIVIDADE (MOBILE) --- */
/* ============================================== */
@media (max-width: 768px) {
    #top-bar {
        display: none; /* Oculta a barra de redes sociais para simplificar */
    }
    .header-logo-area {
        padding: 20px 0;
    }
    .header-logo-area .logo img {
        max-height: 60px;
    }
    .hero-carousel {
        height: 250px; /* Altura menor no mobile */
    }
    .slide-content h2 {
        font-size: 1.5rem; /* Título menor no carrossel */
    }
    .slide-content p {
        display: none; /* Esconde o resumo no carrossel para um visual mais limpo */
    }
    .hero-swiper .swiper-button-next,
    .hero-swiper .swiper-button-prev {
        display: none; /* Esconde as setas no mobile */
    }
    .character-spotlight .spotlight-title {
        font-size: 1.8rem;
    }
    .character-spotlight .character-grid {
        gap: 15px;
    }
    .character-item {
        width: calc(50% - 10px); /* 2 colunas de personagens */
        padding: 10px;
    }
    .character-image-wrapper {
        width: 80px;
        height: 80px;
    }
    .see-more {
        display: none; /* Oculta o botão "see more" para simplificar */
    }
}

/* --- CORREÇÕES FINAIS DE ROBUSTEZ E ACESSIBILIDADE --- */

/* Bloqueia a rolagem da página quando o menu mobile está aberto */
body.body-no-scroll {
    overflow: hidden;
}

/* Garante que o painel do menu fique acima de todo o conteúdo */
.main-navigation.is-open {
    z-index: 1001;
    /* "Promove" o elemento a uma nova camada de renderização, corrigindo bugs em navegadores mobile (especialmente iOS) */
    transform: translateZ(0);
}
/* === CORREÇÕES FINAIS PARA MOBILE E STICKY === */

/* Melhor visibilidade do hamburger em todos os backgrounds */
.hamburger-btn {
    position: relative;
}

.hamburger-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 5px;
    z-index: -1;
}

/* Garante que o sticky funcione corretamente */
.sticky-header.is-sticky {
    transform: translateZ(0);
}

/* Overlay para menu mobile */
.main-navigation.is-open::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    z-index: -1;
}

@media (max-width: 768px) {
    /* Garante visibilidade do hamburger em mobile */
    .hamburger-btn {
        background: rgba(255, 215, 0, 0.2) !important;
        border: 2px solid #ffd700 !important;
    }
    
    .hamburger-line {
        background-color: #ffd700 !important;
        box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    }
}

/* ============================================== */
/* --- LAYOUT MOBILE INSPIRADO NO MARVEL.COM --- */
/* ============================================== */

@media (max-width: 768px) {
    /* RESET DO CONTAINER PARA MOBILE */
    .container {
        width: 95%;
        padding: 0 15px;
    }
    
    /* HEADER SIMPLIFICADO */
    #top-bar {
        display: none;
    }
    
    .site-banner {
        height: 120px;
        font-size: 0.8rem;
    }
    
    .header-logo-area {
        padding: 15px 0;
        background-color: #0b0c1a;
    }
    
    .header-logo-area .logo img {
        max-height: 50px;
    }
    
    .header-nav-area {
        padding: 0;
        background-color: rgba(17, 17, 30, 0.95);
    }
    
    /* CARROSSEL HERO MOBILE */
    .hero-carousel {
        height: 200px;
        margin-bottom: 20px;
    }
    
    .slide-content h2 {
        font-size: 1.2rem;
        margin-bottom: 5px;
    }
    
    .slide-content p {
        display: none;
    }
    
    .hero-swiper .swiper-button-next,
    .hero-swiper .swiper-button-prev {
        display: none;
    }
    
    /* SEÇÃO PERSONAGENS MOBILE */
    .character-spotlight {
        padding: 30px 0;
    }
    
    .character-spotlight .spotlight-title {
        font-size: 1.5rem;
        margin-bottom: 25px;
        text-align: center;
    }
    
    .character-spotlight .character-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        justify-items: center;
    }
    
    .character-item {
        width: 100%;
        max-width: 140px;
        padding: 15px 10px;
        background-color: #1a1a2e;
        border-radius: 8px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.3);
    }
    
    .character-image-wrapper {
        width: 70px;
        height: 70px;
        margin: 0 auto 10px;
    }
    
    .character-name {
        font-size: 0.8rem;
        margin-bottom: 8px;
    }
    
    .character-button {
        padding: 6px 12px;
        font-size: 0.7rem;
    }
    
    .see-more {
        display: none;
    }
    
    /* LAYOUT PRINCIPAL MOBILE - ESTILO MARVEL */
    .main-content-wrapper {
        display: block;
        padding-top: 20px;
        gap: 0;
    }
    
    /* POST PRINCIPAL DESTACADO */
    .featured-top-post {
        margin-bottom: 30px;
        background-color: #1a1a2e;
        border-radius: 10px;
        padding: 0;
        overflow: hidden;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    }
    
    .featured-top-post .post-thumbnail {
        margin-bottom: 0;
    }
    
    .featured-top-post .post-thumbnail img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        border-radius: 0;
    }
    
    .featured-top-post .entry-header {
        padding: 15px 20px 10px;
        margin-top: 0;
    }
    
    .featured-top-post .post-category {
        font-size: 0.7rem;
        padding: 4px 8px;
        margin-bottom: 10px;
    }
    
    .featured-top-post .entry-title {
        font-size: 1.3rem;
        line-height: 1.3;
        margin-bottom: 10px;
    }
    
    .featured-top-post .entry-content {
        padding: 0 20px 20px;
        font-size: 0.9rem;
        line-height: 1.5;
        color: #ccc;
    }
    
    /* SEÇÃO "MAIS NOTÍCIAS" - ESTILO MARVEL */
    .secondary-posts-grid {
        display: block;
        border-top: none;
        padding-top: 0;
        gap: 0;
    }
    
    .secondary-posts-grid::before {
        content: "MAIS NOTÍCIAS";
        display: block;
        font-family: 'Playfair Display', serif;
        font-size: 1.4rem;
        color: #ffd700;
        text-transform: uppercase;
        margin-bottom: 20px;
        padding-bottom: 10px;
        border-bottom: 2px solid #ffd700;
    }
    
    .secondary-post-item {
        display: block;
        background-color: #1a1a2e;
        margin-bottom: 15px;
        padding: 0;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    }
    
    .secondary-post-item .post-thumbnail {
        margin-bottom: 0;
    }
    
    .secondary-post-item .post-thumbnail img {
        width: 100%;
        height: 150px;
        object-fit: cover;
        border-radius: 0;
    }
    
    .secondary-post-item .entry-content {
        padding: 15px;
    }
    
    .secondary-post-item .post-category {
        font-size: 0.6rem;
        padding: 3px 6px;
        margin-bottom: 8px;
        display: inline-block;
    }
    
    .secondary-post-item .entry-title {
        font-size: 1rem;
        line-height: 1.4;
        margin-bottom: 8px;
    }
    
    .secondary-post-item .entry-title a {
        color: #f0f0f0;
    }
    
    .secondary-post-item .entry-meta {
        font-size: 0.75rem;
        color: #888;
        margin-top: 5px;
    }
    
    /* SIDEBAR MOBILE */
    .widget-area {
        margin-top: 30px;
        padding-top: 20px;
        border-top: 2px solid #ffd700;
    }
    
    .widget-area::before {
        content: "WIDGETS";
        display: block;
        font-family: 'Playfair Display', serif;
        font-size: 1.2rem;
        color: #ffd700;
        text-transform: uppercase;
        margin-bottom: 20px;
    }
    
    .widget-area .widget {
        margin-bottom: 25px;
        background-color: #1a1a2e;
        padding: 15px;
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    }
    
    .widget-area .widget-title {
        font-size: 1rem;
        margin-bottom: 15px;
        padding-bottom: 8px;
        border-bottom: 1px solid #ffd700;
    }
    
    .widget-area .widget ul li {
        margin-bottom: 8px;
        padding-bottom: 8px;
        font-size: 0.85rem;
    }
    
    /* FOOTER MOBILE */
    .site-footer {
        margin-top: 30px;
        padding: 20px 15px;
        font-size: 0.8rem;
        border-top: 2px solid #ffd700;
    }
    
    /* MELHORIAS GERAIS MOBILE */
    h1, h2, h3, h4, h5, h6 {
        line-height: 1.3;
    }
    
    p {
        line-height: 1.5;
        margin-bottom: 15px;
    }
    
    /* OTIMIZAÇÕES DE TOUCH */
    a, button, .character-button, .hamburger-btn {
        min-height: 44px;
        min-width: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* NAVEGAÇÃO MOBILE MELHORADA */
    .main-navigation.is-open {
        width: 100%;
        background-color: rgba(11, 12, 26, 0.98);
        backdrop-filter: blur(20px);
    }
    
    .main-navigation.is-open .main-menu a {
        padding: 20px 0;
        font-size: 1.2rem;
        text-align: center;
        border-bottom: 1px solid #2a2a3a;
    }
    
    /* LOADING E PERFORMANCE */
    .featured-top-post img,
    .secondary-post-item img {
        transition: transform 0.3s ease;
    }
    
    .featured-top-post:active,
    .secondary-post-item:active {
        transform: scale(0.98);
    }
}

/* MICRO-INTERAÇÕES MOBILE */
@media (max-width: 768px) {
    .character-item:active {
        transform: scale(0.95);
    }
    
    .hamburger-btn:active {
        transform: scale(0.9);
    }
    
    /* SCROLL SUAVE EM MOBILE */
    html {
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }
    
    /* OTIMIZAÇÃO DE FONTES MOBILE */
    body {
        font-size: 14px;
        line-height: 1.5;
    }
}