/* ── HERO ──────────────────────────────────────────────────────── */
.hero {
position: relative;
min-height: 520px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
background:
    radial-gradient(ellipse at 50% 40%, rgba(201,151,58,0.07) 0%, transparent 55%),
    radial-gradient(ellipse at 50% 90%, rgba(201,151,58,0.04) 0%, transparent 60%),
    linear-gradient(180deg, #07060a 0%, #0f0d13 100%);
border-bottom: 1px solid var(--gold-border);
overflow: hidden;
}

.hero-overlay {
position: absolute;
inset: 0;
background:
    radial-gradient(ellipse at 20% 50%, rgba(201,151,58,0.03) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 50%, rgba(201,151,58,0.02) 0%, transparent 50%);
pointer-events: none;
}

.hero-inner {
position: relative;
z-index: 1;
padding: 100px 24px 80px;
max-width: 700px;
}

.hero-eyebrow {
font-size: 11px;
letter-spacing: 0.2em;
color: var(--gold-dim);
text-transform: uppercase;
margin-bottom: 20px;
font-family: 'Cinzel', serif;
text-shadow: 0 0 12px rgba(201,151,58,0.3);
}

.hero-title {
font-size: clamp(42px, 8vw, 72px);
font-weight: 700;
color: var(--gold-light);
letter-spacing: 0.04em;
margin: 0 0 16px;
line-height: 1.05;
text-shadow: 0 2px 40px rgba(201,151,58,0.35), 0 0 80px rgba(201,151,58,0.1);
font-family: 'Cinzel', serif;
}

.hero-sub {
font-size: 15px;
color: var(--text-muted);
margin-bottom: 40px;
letter-spacing: 0.04em;
line-height: 1.6;
}

.hero-actions {
display: flex;
gap: 12px;
justify-content: center;
flex-wrap: wrap;
}

/* ── STATS STRIP ───────────────────────────────────────────────── */
.stats-strip {
background: rgba(15, 13, 19, 0.95);
border-bottom: 1px solid var(--gold-border);
padding: 32px 24px;
}

.strip-inner {
max-width: 900px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 0;
}

.strip-stat {
display: flex;
flex-direction: column;
align-items: center;
padding: 0 44px;
}

.strip-val {
font-size: 30px;
font-weight: 700;
color: var(--gold-light);
letter-spacing: 0.02em;
font-family: 'Cinzel', serif;
text-shadow: 0 0 20px rgba(201,151,58,0.3);
}

.strip-label {
font-size: 10px;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.14em;
margin-top: 5px;
}

.strip-divider {
width: 1px;
height: 44px;
background: var(--gold-border);
flex-shrink: 0;
}

/* ── SECTIONS ──────────────────────────────────────────────────── */
.section {
padding: 60px 24px;
}

.section-dark {
background: rgba(11, 9, 16, 0.7);
border-top: 1px solid var(--gold-border);
border-bottom: 1px solid var(--gold-border);
}

.section-inner {
max-width: 1100px;
margin: 0 auto;
}

.section-title {
font-size: 11px;
font-weight: 700;
color: var(--gold);
letter-spacing: 0.15em;
text-transform: uppercase;
margin: 0 0 28px;
font-family: 'Cinzel', serif;
}

/* ── MATCH GRID ────────────────────────────────────────────────── */
.match-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 16px;
}

.match-card {
background: var(--bg-surface);
border: 1px solid var(--border-subtle);
border-radius: 4px;
padding: 20px;
text-decoration: none;
display: block;
transition: border-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.match-card:hover {
border-color: var(--gold);
transform: translateY(-2px);
box-shadow: 0 4px 24px rgba(201,151,58,0.12), 0 0 0 1px rgba(201,151,58,0.1);
}

.match-card-date {
font-size: 10px;
color: var(--text-dim);
letter-spacing: 0.1em;
text-transform: uppercase;
margin-bottom: 6px;
font-family: 'Cinzel', serif;
}

.match-card-title {
font-size: 14px;
font-weight: 700;
color: var(--gold-light);
margin-bottom: 18px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.match-card-stats {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
}

.match-stat-item { display: flex; flex-direction: column; }

.match-stat-val {
font-size: 15px;
font-weight: 700;
color: var(--text-primary);
}

.match-stat-lbl {
font-size: 9px;
color: var(--text-dim);
text-transform: uppercase;
letter-spacing: 0.1em;
margin-top: 3px;
}

.match-card-skeleton {
background: var(--bg-elevated);
border: 1px solid var(--border-subtle);
border-radius: 4px;
height: 148px;
animation: shimmer 1.4s infinite;
}

@keyframes shimmer {
0%, 100% { opacity: 0.25; }
50%       { opacity: 0.55; }
}

/* ── TOP PERFORMERS ────────────────────────────────────────────── */
.performers-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 16px;
}

.performer-card {
background: var(--bg-surface);
border: 1px solid var(--border-subtle);
border-radius: 4px;
padding: 28px 24px;
text-align: center;
transition: border-color 0.2s ease, box-shadow 0.2s ease;
position: relative;
overflow: hidden;
}

.performer-card::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0;
height: 1px;
background: linear-gradient(90deg, transparent, var(--gold-border), transparent);
opacity: 0;
transition: opacity 0.2s ease;
}

.performer-card:hover { border-color: var(--gold); box-shadow: 0 4px 24px rgba(201,151,58,0.10); }
.performer-card:hover::before { opacity: 1; }

.perf-label {
font-size: 10px;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.14em;
margin-bottom: 14px;
font-family: 'Cinzel', serif;
}

.perf-name {
font-size: 20px;
font-weight: 700;
color: var(--gold-light);
margin-bottom: 6px;
font-family: 'Cinzel', serif;
}

.perf-val {
font-size: 12px;
color: var(--gold-dim);
letter-spacing: 0.05em;
}

/* ── RECRUITMENT ───────────────────────────────────────────────── */
.recruit-inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 48px;
flex-wrap: wrap;
}

.recruit-text { max-width: 600px; flex: 1; }

.recruit-status {
display: inline-flex;
align-items: center;
gap: 8px;
font-size: 11px;
color: #6fcf6f;
letter-spacing: 0.12em;
text-transform: uppercase;
font-weight: 600;
font-family: 'Cinzel', serif;
}

.status-dot {
width: 8px; height: 8px;
border-radius: 50%;
background: #6fcf6f;
box-shadow: 0 0 8px rgba(111,207,111,0.8);
animation: pulse-dot 2s ease-in-out infinite;
flex-shrink: 0;
}

@keyframes pulse-dot {
0%, 100% { opacity: 1; box-shadow: 0 0 8px rgba(111,207,111,0.8); }
50%       { opacity: 0.5; box-shadow: 0 0 4px rgba(111,207,111,0.3); }
}

.recruit-desc {
font-size: 14px;
color: var(--text-muted);
line-height: 1.75;
margin: 0 0 20px;
}

.recruit-reqs {
list-style: none; padding: 0; margin: 0;
display: flex; flex-direction: column; gap: 10px;
}

.recruit-reqs li {
font-size: 13px;
color: var(--text-muted);
padding-left: 18px;
position: relative;
line-height: 1.5;
}

.recruit-reqs li::before {
content: '◆';
position: absolute; left: 0; top: 1px;
color: var(--gold-dim);
font-size: 7px; line-height: 1.8;
}

.recruit-deco {
font-size: 140px;
color: rgba(201,151,58,0.04);
line-height: 1;
user-select: none;
flex-shrink: 0;
}

/* ── FOOTER ────────────────────────────────────────────────────── */
.footer {
text-align: center;
padding: 40px 24px;
border-top: 1px solid var(--gold-border);
background: rgba(11, 9, 16, 0.9);
}

.footer-brand {
font-size: 14px; font-weight: 700;
color: var(--gold); letter-spacing: 0.1em;
margin-bottom: 6px; font-family: 'Cinzel', serif;
}

.footer-sub {
font-size: 11px; color: var(--text-dim);
letter-spacing: 0.08em; margin-bottom: 16px;
}

.footer-links {
display: flex; justify-content: center;
gap: 24px; margin-bottom: 12px; flex-wrap: wrap;
}

.footer-links a {
font-size: 12px; color: var(--text-muted);
text-decoration: none; transition: color 0.2s ease;
}

.footer-links a:hover { color: var(--gold-light); }

.footer-copy { font-size: 11px; color: var(--text-dim); }

/* ── RESPONSIVE ────────────────────────────────────────────────── */
@media (max-width: 600px) {
.strip-stat { padding: 12px 20px; }
.recruit-deco { display: none; }
.hero-inner { padding: 80px 16px 60px; }
}