/* ===== ESTILO GLOBAL - FONDO NEGRO TODA LA WEB ===== */ html,body{ overflow-x:hidden !important} body,html,.site,.site-content{ background:#0a0a0a !important; color:#e0e0e0 !important} /* Header y menú fijo arriba */ .site-header{ position:relative} .main-navigation{ position:sticky; top:0; z-index:9999; width:100% !important; max-width:100% !important; margin:0 !important; padding:0 !important} .admin-bar .main-navigation{ top:32px} .site-header,.navigation-search,.top-bar{ background:#0a0a0a !important; border-bottom:1px solid #1a1a1a !important} .main-navigation,.main-navigation .main-nav{ background:#d21212 !important} .site-header a,.site-title a{ color:#fff !important} .main-navigation a{ color:#fff !important} .main-navigation a:hover{ color:#ffd !important; background:rgba(0,0,0,0.2) !important} /* Footer oscuro */ .site-footer,.footer-widgets{ background:#0a0a0a !important; border-top:1px solid #1a1a1a !important; color:#888 !important} .site-footer a{ color:#ccc !important} /* Menú y footer a ancho completo en toda la web */ .main-navigation,.site-footer,.site-info{ max-width:100% !important; width:100% !important; box-sizing:border-box} .main-navigation .inside-navigation,.inside-site-info{ max-width:100% !important; width:100% !important; padding-left:20px !important; padding-right:20px !important} /* Links generales */ a{ color:#e63946 !important} a:hover{ color:#ff4d5a !important} /* Contenido de posts */ .inside-article{ background:#111 !important; border:1px solid #1a1a1a !important} /* Asegurar que el contenido de posts y páginas sea legible */ .entry-content{ background:#111 !important; color:#e0e0e0 !important} body.page .entry-content{ max-width:none !important; width:100% !important} article,article .entry-content{ background:#111 !important; color:#e0e0e0 !important} body.single article,body.page article{ background:transparent !important} body.single .site-main article .inside-article,body.page .site-main article .inside-article{ background:#111 !important; color:#e0e0e0 !important; border:1px solid #1a1a1a !important} .entry-title a{ color:#fff !important} .entry-meta,.entry-meta a{ color:#888 !important} /* Título sobre imagen destacada en posts,páginas,categorías,etiquetas */ body.single .featured-image.page-header-image-single{ position:relative; max-height:500px; overflow:hidden; margin:0 0 0 0 !important; padding:0 !important; max-width:1400px !important} body.single .featured-image.page-header-image-single img{ width:100%; height:500px; object-fit:cover; display:block} body.single .entry-header{ position:relative; margin-top:-70px; margin-left:-40px; margin-right:-40px; z-index:10; width:calc(100% + 80px); box-sizing:border-box; padding:20px 0; background:linear-gradient(transparent,rgba(0,0,0,0.85))} body.single h1.entry-title{ color:#fff !important; background:none !important; text-shadow:2px 2px 4px rgba(0,0,0,0.9),0 0 15px rgba(0,0,0,0.7); padding:0 30px !important; border-radius:0 !important; font-size:32px; font-weight:700} body.single .entry-header .entry-meta{ display:none !important} /* Páginas - imagen y título */ body.page .featured-image.page-header-image{ position:relative; max-height:500px; overflow:hidden; max-width:1400px !important; margin:0 auto -1px auto !important; padding:0 !important} body.page .featured-image.page-header-image img{ width:100%; height:500px; object-fit:cover; display:block} body.page .featured-image.page-header-image .entry-header{ position:absolute; bottom:0; left:-40px; right:-40px; z-index:10; box-sizing:border-box; padding:20px 0; background:linear-gradient(transparent,rgba(0,0,0,0.85)); margin:0; width:calc(100% + 80px)} body.page .featured-image.page-header-image .entry-header h1.entry-title{ padding:0 30px !important} body.page h1.entry-title{ color:#fff !important; background:none !important; text-shadow:2px 2px 4px rgba(0,0,0,0.9),0 0 15px rgba(0,0,0,0.7); padding:0 !important; border-radius:0 !important; font-size:32px; font-weight:700} body.page .inside-article{ margin-top:0 !important; border-top:none !important} /* Páginas - sidebar invisible,contenido ocupa todo el ancho disponible */ body.page #secondary,body.page .sidebar,body.page #right-sidebar,body.page .post-sidebar{ display:none !important} body.page #primary,body.page .site-main,body.page .content-area{ max-width:1400px !important; width:100% !important} body.page .featured-image.page-header-image{ max-width:1400px !important; width:100% !important; margin-left:auto !important; margin-right:auto !important} body.page.featured-image-active #page,body.page.featured-image-active .site-content,body.page.featured-image-active #primary,body.page.featured-image-active .site-main,body.page.featured-image-active .inside-article,body.page.featured-image-active article{ margin-top:0 !important; padding-top:0 !important} body.page .post-layout{ max-width:1400px !important; width:100% !important; margin-left:auto !important; margin-right:auto !important; display:block !important} body.page .inside-article{ width:100% !important; max-width:none !important} body.page article{ width:100% !important; max-width:none !important} body.page .inside-article .entry-header{ position:relative; margin-top:-70px; margin-left:-40px; margin-right:-40px; margin-bottom:0; z-index:10; width:calc(100% + 80px); box-sizing:border-box; padding:30px 0 15px; background:linear-gradient(transparent,rgba(0,0,0,0.7))} body.page .inside-article h1.entry-title{ color:#fff !important; background:none !important; text-shadow:1px 1px 3px rgba(0,0,0,0.6); padding:0 30px !important; border-radius:0 !important; font-size:32px; font-weight:700; margin-bottom:0} /* ===== MAGAZINE HOMEPAGE ===== */ .magazine-home{ background:#0a0a0a; color:#fff; max-width:1400px; margin:0 auto; padding:40px 40px 0} /* Hero - Post principal */ .magazine-hero{ position:relative; width:100%; height:70vh; min-height:400px; overflow:hidden; border-radius:4px; margin-bottom:20px} .magazine-hero a{ display:block; width:100%; height:100%; text-decoration:none !important; color:#fff !important} .magazine-hero img{ width:100%; height:100%; object-fit:cover; transition:transform 0.6s ease} .magazine-hero:hover img{ transform:scale(1.03)} .magazine-hero .hero-overlay{ position:absolute; bottom:0; left:0; right:0; padding:60px 40px 40px; background:linear-gradient(transparent,rgba(0,0,0,0.85))} .magazine-hero .hero-category{ display:inline-block; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:#e63946; margin-bottom:12px} .magazine-hero .hero-title{ font-size:clamp(28px,4vw,52px); font-weight:700; line-height:1.1; margin:0; text-transform:uppercase; letter-spacing:-0.5px} /* Grid de posts */ .magazine-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:15px; padding:0; max-width:100%; margin-bottom:20px} .magazine-grid.featured-grid{ grid-template-columns:repeat(4,1fr); gap:15px; padding:0; margin-bottom:40px; max-width:100%} .magazine-grid.featured-grid .magazine-grid-item{ aspect-ratio:2/3} .magazine-grid-item{ position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:4px} .magazine-grid-item a{ display:block; width:100%; height:100%; text-decoration:none !important; color:#fff !important} .magazine-grid-item img{ width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease,filter 0.5s ease} .magazine-grid-item:hover img{ transform:scale(1.05); filter:brightness(0.7)} .magazine-grid-item .item-overlay{ position:absolute; bottom:0; left:0; right:0; padding:30px 20px 20px; background:linear-gradient(transparent,rgba(0,0,0,0.9))} .magazine-grid-item .item-category{ display:block; font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:#e63946; margin-bottom:8px} .magazine-grid-item .item-title{ font-size:15px; font-weight:600; line-height:1.3; margin:0; text-transform:uppercase; letter-spacing:0.5px; text-shadow:2px 2px 4px rgba(0,0,0,0.9),0 0 15px rgba(0,0,0,0.7)} /* Sección de categoría */ .magazine-section{ padding:60px 20px; border-top:1px solid #1a1a1a} .magazine-section-title{ font-size:13px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:#e63946; margin-bottom:30px; text-align:center} .magazine-section-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:15px; max-width:1200px; margin:0 auto} .magazine-section-item{ position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:4px} .magazine-section-item a{ display:block; width:100%; height:100%; text-decoration:none !important; color:#fff !important} .magazine-section-item img{ width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease} .magazine-section-item:hover img{ transform:scale(1.05)} .magazine-section-item .section-item-overlay{ position:absolute; bottom:0; left:0; right:0; padding:25px 15px 15px; background:linear-gradient(transparent,rgba(0,0,0,0.9))} .magazine-section-item .section-item-title{ font-size:13px; font-weight:600; line-height:1.3; margin:0; text-transform:uppercase; letter-spacing:0.5px; text-shadow:2px 2px 4px rgba(0,0,0,0.9),0 0 15px rgba(0,0,0,0.7)} /* Texto SEO introductorio */ .magazine-intro{ max-width:900px; margin:0 auto 40px; padding:0 20px; font-size:15px; line-height:1.8; color:#ccc; text-align:justify} .magazine-intro h2,.magazine-intro h3{ color:#fff !important; text-align:center; margin:30px 0 15px; font-size:22px} .magazine-intro p{ margin-bottom:15px} .magazine-intro a{ color:#d21212 !important; text-decoration:underline} .magazine-intro a:hover{ color:#ff3333 !important} .magazine-intro-links{ text-align:center; font-weight:600} /* Descripción SEO por sección */ .magazine-section-desc{ max-width:800px; margin:0 auto 25px; font-size:14px; line-height:1.7; color:#999; text-align:center} /* Ocultar sidebar y full-width en home */ body.home #right-sidebar,body.home .sidebar,body.home #secondary{ display:none !important} body.home .site-content .content-area,body.home .site-content #primary,body.home .inside-article{ max-width:100% !important; width:100% !important; padding:0 !important; margin:0 !important; background:transparent !important; border:none !important} body.home .entry-content{ padding:0 !important; margin:0 !important; max-width:100% !important} body.home .inside-page{ padding:0 !important} /* Responsive */ body.home .featured-image,body.home .page-featured-image,body.home .post-image,body.home .entry-header,body.home .page-header,body.home .page-header-image,body.home article > .inside-article > .featured-image{ display:none !important} /* Contenedor principal sin restricción de ancho */ body.home .site-content,body.home .grid-container{ max-width:100% !important; width:100% !important; padding:0 !important} /* Forzar imágenes a llenar su contenedor */ .magazine-section-item img,.magazine-grid-item img{ width:100% !important; height:100% !important; object-fit:cover !important} /* Responsive */ @media (max-width:1024px){ .magazine-grid.featured-grid { grid-template-columns:repeat(3,1fr)} } @media (max-width:768px){ .magazine-grid { grid-template-columns:repeat(2,1fr)} .magazine-grid.featured-grid{ grid-template-columns:repeat(2,1fr)} .magazine-section-grid{ grid-template-columns:repeat(2,1fr); gap:8px} .magazine-hero{ height:60vh} .magazine-hero .hero-overlay{ padding:40px 20px 20px} .magazine-section{ padding:40px 10px} } @media (max-width:480px){ .magazine-grid { grid-template-columns:1fr} .magazine-grid.featured-grid{ grid-template-columns:1fr} .magazine-grid-item{ aspect-ratio:16/9} .magazine-grid.featured-grid .magazine-grid-item{ aspect-ratio:16/9} .magazine-section-grid{ grid-template-columns:1fr} }