/*
Theme Name: PW247 The Final Master + Mobile Menu
Theme URI: https://prowrestling247.com/
Author: PW247 Engineering
Description: DEFINITIVE BROADCAST INFRASTRUCTURE. Tactile Mobile Drop-Down Drawer. Condensed Header and Footer. Dynamic Status Badges. Header menu reordered. Scanline effect isolated to The Vaults. Fixed PJAX navigation engine. Custom Copyright. Omni-Responsive.
Version: 300.0
License: GNU General Public License v2 or later
Text Domain: pw247
*/
:root { --y: #ffcc00; --r: #cc0000; --glass: rgba(5,5,5,0.5); }
* { box-sizing: border-box; }
body { background: #000 !important; color: #fff !important; font-family: 'Arial Black', sans-serif !important; margin: 0; padding-top: 110px !important; padding-bottom: 110px !important; overflow-x: hidden; }
a { text-decoration: none; color: inherit; transition: 0.2s; }

.card-container { perspective: 1000px; height: 100%; min-height: 420px; }
.card-inner { position: relative; width: 100%; height: 100%; min-height: 420px; transition: transform 0.6s; transform-style: preserve-3d; cursor: pointer; }
.card-container:hover .card-inner { transform: rotateY(180deg); }
.card-front, .card-back { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; overflow: hidden; border: 1px solid #1a1a1a; border-radius: 4px; }
.card-front { background: #111; }
.card-front img { width: 100%; height: 100%; object-fit: cover; }

.card-front-overlay { position: absolute; bottom: 0; left: 0; width: 100%; background: linear-gradient(0deg, rgba(0,0,0,0.95) 0%, rgba(204,0,0,0.4) 60%, transparent 100%); padding: 30px 15px 15px; border-bottom: 3px solid var(--y); z-index: 5; pointer-events: none; }
.card-front-title { color: #fff; font-size: 15px; text-transform: uppercase; font-style: italic; line-height: 1.2; font-family: 'Arial Black', sans-serif; text-shadow: 2px 2px 0px #000; }
.card-front-title span { color: var(--y); }

.card-back { background: #000; transform: rotateY(180deg); display: flex; flex-direction: column; padding: 25px; border: 2px solid var(--y); box-shadow: inset 0 0 15px rgba(255,204,0,0.2); }
.card-title-box { background: #000; border: 1px solid var(--y); outline: 1px solid #fff; padding: 12px; margin-bottom: 15px; position: relative; z-index:2; }
.card-title-box h3 { color: #fff; margin: 0; font-size: 15px; text-transform: uppercase; font-style: italic; line-height: 1.2; }
.card-gradient { background: linear-gradient(135deg, var(--r) 0%, #000 100%); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; opacity: 0.4; }
.card-excerpt { font-size: 12px; line-height: 1.5; color: #eee; font-family: sans-serif; overflow: hidden; position:relative; z-index:2; }

.card-more { margin-top: auto; text-align: right; position:relative; z-index: 100; }
.card-more a { color: var(--y); font-weight: 900; font-size: 24px; letter-spacing: -2px; display:inline-block; padding:10px; cursor:pointer; }
.card-more a:hover { color: #fff; }

.tc-header { background: rgba(0, 0, 0, 0.5); border: 1px solid var(--y); padding: 25px; display: flex; gap: 25px; align-items: center; margin-bottom: 0; }
.tc-thumb { width: 150px; height: 150px; flex-shrink: 0; border: 2px solid var(--y); overflow: hidden; background: #000; }
.tc-thumb img { width: 100%; height: 100%; object-fit: cover; }
.tc-meta-area { flex: 1; }
.tc-title { color: #fff; font-size: 28px; text-transform: uppercase; font-style: italic; margin: 0 0 10px 0; line-height: 1.1; }
.tc-title span { color: var(--y); }
.tc-meta { font-size: 13px; color: #ccc; font-weight: 900; letter-spacing: 1px; }

.tc-content-wrap { padding: 4px; background: rgba(255, 204, 0, 0.5); margin-top: 5px; } 
.tc-content-inner { padding: 2px; background: rgba(0, 0, 0, 0.5); } 
.tc-content { background: linear-gradient(180deg, rgba(0,0,0,0.25) 0%, rgba(204,0,0,0.25) 50%, rgba(255,204,0,0.25) 100%); backdrop-filter: blur(10px); color: #fff; padding: 40px; font-family: 'Arial', sans-serif; line-height: 1.8; font-size: 16px; text-shadow: 1px 1px 3px rgba(0,0,0,0.9); }

.pw247-embed-player { background: linear-gradient(135deg, #000 0%, #3a0000 50%, var(--y) 100%); border: 2px solid var(--y); padding: 15px; margin: 25px 0; display: flex; align-items: center; gap: 20px; box-shadow: 0 0 15px rgba(255,204,0,0.3); font-family: 'Arial Black', sans-serif; }
.pw247-audio-thumb { width: 80px; height: 80px; flex-shrink: 0; border: 2px solid var(--y); background: #000; box-shadow: 0 0 10px #000; overflow: hidden; display: flex; justify-content: center; align-items: center; }
.pw247-audio-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pw247-audio-info { flex-grow: 1; display: flex; flex-direction: column; gap: 10px; overflow: hidden; }
.pw247-audio-title-bar { color: #fff; font-size: 16px; font-weight: 900; font-style: italic; text-transform: uppercase; text-shadow: 2px 2px 4px rgba(0,0,0,0.8); border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 5px; }
.pw247-audio-title-bar span { color: var(--y); }
.pw247-audio-controls { display: flex; align-items: center; gap: 15px; width: 100%; }
.pw247-embed-play-btn { background: rgba(0,0,0,0.5); border: 1px solid var(--y); color: #fff; padding: 8px 20px; font-weight: 900; cursor: pointer; clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%); transition: 0.2s; text-transform: uppercase; }
.pw247-embed-play-btn:hover { background: var(--y); color: #000; }
.pw247-time-display { color: #fff; font-size: 12px; font-weight: 900; letter-spacing: 1px; flex-shrink: 0; min-width: 45px; text-align: center; text-shadow: 1px 1px 2px #000; }
.pw247-progress-bar { flex-grow: 1; height: 10px; background: rgba(0,0,0,0.5); border: 1px solid #222; position: relative; cursor: pointer; }
.pw247-progress-fill { height: 100%; background: linear-gradient(90deg, var(--r), var(--y)); width: 0%; pointer-events: none; }

.pw247-video-container { border: 2px solid var(--y); background: linear-gradient(135deg, #000 0%, #3a0000 50%, var(--y) 100%); padding: 10px; margin: 25px 0; position: relative; box-shadow: 0 0 15px rgba(255,204,0,0.3); }
.pw247-video-wrapper { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background:#000; border:1px solid #000; }
.pw247-video-wrapper iframe, .pw247-video-wrapper video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.pw247-video-bar { background: rgba(0,0,0,0.8); height: 30px; display: flex; align-items: center; justify-content: space-between; padding: 0 15px; font-size: 11px; font-weight: 900; letter-spacing: 2px; color: #fff; margin-top: 10px; border:1px solid #222; }

/* Grid Rules & Main Event */
.pw247-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; margin-bottom: 40px; }
.pw247-grid .card-container { grid-column: span 1; grid-row: span 1; height: 420px; }
.pw247-grid .card-container:first-child { grid-column: span 2; grid-row: span 2; height: 100%; min-height: 870px; }
.pw247-grid .card-container:first-child .card-front-title { font-size: 32px; padding-bottom: 15px; }
.pw247-grid .card-container:first-child:hover .card-inner { transform: rotateY(180deg); }
.pw247-grid .card-container:first-child .card-excerpt { font-size: 16px; line-height: 1.8; }

@media (max-width: 1200px) { 
    .pw247-grid { grid-template-columns: repeat(3, 1fr); } 
    .pw247-grid .card-container:first-child { grid-column: span 2; grid-row: span 2; min-height: 870px; }
}

@media (max-width: 992px) { 
    .pw247-grid { grid-template-columns: repeat(2, 1fr); } 
    .tc-header { flex-direction: column; text-align: center; gap: 15px; } 
    .tc-thumb { margin: 0 auto; } 
    .pw247-grid .card-container:first-child { grid-column: span 2; grid-row: span 1; min-height: 500px; height: 500px; }
    .pw247-grid .card-container:first-child .card-front-title { font-size: 24px; }
}

@media (max-width: 768px) {
    .pw247-grid { grid-template-columns: 1fr; }
    body { padding-top: 0 !important; padding-bottom: 240px !important; }
    #pw-h { position: relative !important; height: auto !important; padding-bottom: 0; }
    .t-move { font-size: 12px; }
    .l-row { flex-direction: column; height: auto !important; padding: 15px !important; gap: 10px; text-align: center; }
    .logo-container { flex-direction: column; justify-content: center; width: 100%; }
    .logo-container img { max-width: 100% !important; height: auto !important; max-height: 80px; }
    
    /* MOBILE MENU TOGGLE FIX */
    .mobile-menu-toggle { display: block !important; margin-top: 15px; }
    .net-bug { display: none !important; } 
    #n-row { display: none; position: absolute; top: 100%; left: 0; width: 100%; height: auto !important; max-height: 60vh; overflow-y: auto; background: #000; border-bottom: 3px solid var(--y); padding: 0 !important; z-index: 100000; box-shadow: 0 15px 30px rgba(0,0,0,0.9); }
    #n-row.is-open { display: block !important; }
    #n-row > div { display: none; }
    .u-list { flex-direction: column; width: 100%; padding: 0 !important; }
    .u-list > li { width: 100%; border-bottom: 1px solid #1a1a1a; display: block; }
    .u-list > li > a { display: block; padding: 15px 20px; font-size: 14px !important; }
    .u-list li:hover .s-menu { display: block !important; }
    .s-menu { position: static; display: block !important; width: 100%; background: #0a0a0a; border: none; border-left: 4px solid var(--r); box-shadow: none; }
    .s-menu a { padding: 12px 20px 12px 30px !important; color: #aaa !important; border-bottom: 1px solid #111; }
    .s-menu a:hover { color: #fff !important; }

    #pw-f { height: auto !important; padding: 15px 0 0 0 !important; }
    .f-ctrl { display: flex !important; flex-direction: column; gap: 15px; padding: 15px !important; align-items: center; justify-content: center; }
    .prime-logo { display: none; } 
    .f-ded { height: auto !important; padding: 12px !important; line-height: 1.5; white-space: normal; }
    .pw247-embed-player { flex-direction: column; text-align: center; }
    .pw247-audio-info { align-items: center; }
    .pw247-audio-controls { flex-wrap: wrap; justify-content: center; gap: 12px; }
    .pw247-time-display { width: 100%; order: 3; margin-top: 5px; } 
    .pw247-progress-bar { min-width: 200px; }
    
    .pw247-grid .card-container { height: 420px; }
    .pw247-grid .card-container:first-child { grid-column: span 1; grid-row: span 1; min-height: 420px; height: 420px; }
    .pw247-grid .card-container:first-child .card-front-title { font-size: 18px; }
}

.hof-hero { padding: 60px 20px 40px; background: radial-gradient(circle, rgba(255,204,0,0.15) 0%, transparent 70%); border-bottom: 2px solid var(--y); margin-bottom: 40px; text-align: center; position:relative; }
.hof-hero::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg, transparent, var(--y), transparent); }
.hof-hero h1 { font-family: 'Arial Black', sans-serif; font-size: 52px; font-style: italic; text-transform: uppercase; color: #fff; text-shadow: 0 5px 15px rgba(0,0,0,0.8); margin:0; line-height:1.1; }
.hof-hero h1 span { color: var(--y); }

.hof-card .card-front-overlay { background: linear-gradient(0deg, rgba(0,0,0,0.95) 0%, rgba(255,215,0,0.3) 60%, transparent 100%); border-bottom: 3px solid #fff; }
.hof-card .card-back { border: 2px solid #fff; box-shadow: inset 0 0 20px rgba(255,215,0,0.2); }
.hof-card .card-title-box { border: 1px solid #fff; }
.hof-card .card-more a { color: #fff; }
.hof-card .card-gradient { background: linear-gradient(135deg, var(--y) 0%, #000 100%); opacity:0.3; }

/* Ring Walk */
@keyframes ringWalk { 0% { opacity: 0; transform: translateY(60px) scale(0.95); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
.pw247-grid .card-container { animation: ringWalk 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) forwards; opacity: 0; }
.pw247-grid .card-container:nth-child(1) { animation-delay: 0.05s; } .pw247-grid .card-container:nth-child(2) { animation-delay: 0.15s; } .pw247-grid .card-container:nth-child(3) { animation-delay: 0.25s; } .pw247-grid .card-container:nth-child(4) { animation-delay: 0.35s; } .pw247-grid .card-container:nth-child(5) { animation-delay: 0.45s; } .pw247-grid .card-container:nth-child(6) { animation-delay: 0.55s; } .pw247-grid .card-container:nth-child(7) { animation-delay: 0.65s; } .pw247-grid .card-container:nth-child(8) { animation-delay: 0.75s; } .pw247-grid .card-container:nth-child(9) { animation-delay: 0.85s; } .pw247-grid .card-container:nth-child(10) { animation-delay: 0.95s; } .pw247-grid .card-container:nth-child(11) { animation-delay: 1.05s; } .pw247-grid .card-container:nth-child(12) { animation-delay: 1.15s; }

/* Vault Atmosphere */
body.pw-vault-active::after { content: ""; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; pointer-events: none; z-index: 9999998; background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.04), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.04)); background-size: 100% 4px, 3px 100%; box-shadow: inset 0 0 150px rgba(0,0,0,0.95); opacity: 0.7; }

/* Dynamic Status Badges */
.card-status-badge { position: absolute; top: 15px; left: 15px; padding: 6px 12px; font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: 1.5px; z-index: 10; font-family: 'Arial Black', sans-serif; border-radius: 2px; box-shadow: 0 4px 10px rgba(0,0,0,0.5); }
.badge-on-air { background: linear-gradient(135deg, #ff0000 0%, #880000 100%); color: #fff; border: 1px solid #ff4444; animation: onAirPulse 2s infinite; }
@keyframes onAirPulse { 0% { box-shadow: 0 0 0 0 rgba(255, 0, 0, 0.7); } 70% { box-shadow: 0 0 0 10px rgba(255, 0, 0, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 0, 0, 0); } }
.badge-vault { background: linear-gradient(135deg, var(--y) 0%, #cc9900 100%); color: #000; border: 1px solid #ffe680; box-shadow: 0 0 15px rgba(255, 204, 0, 0.3); }