/* =========================================================
   MTC Esports - theme.css
   ========================================================= */

:root{
	--mtc-wine:#82003a;
	--mtc-pink:#ff3899;
	--mtc-pink-dim:#c44686;
	--mtc-gold:#ffc300;

	--mtc-bg-0:#0d0509;
	--mtc-bg-1:#180a12;
	--mtc-bg-2:#22101a;
	--mtc-border:#3a1826;
	--mtc-text-1:#f5eef1;
	--mtc-text-2:#b58fa0;
	--mtc-text-3:#7a5568;
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
	margin:0;
	background:var(--mtc-bg-0);
	color:var(--mtc-text-1);
	font-family:'Inter', sans-serif;
	-webkit-font-smoothing:antialiased;
	overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
ul{ list-style:none; margin:0; padding:0; }
.display{ font-family:'Rajdhani', sans-serif; text-transform:uppercase; letter-spacing:0.02em; }
.mono{ font-family:'JetBrains Mono', monospace; }

.mtc-skip-link{
	position:absolute; left:-9999px; top:0; background:var(--mtc-pink); color:#2a0416;
	padding:10px 16px; z-index:1000;
}
.mtc-skip-link:focus{ left:10px; top:10px; }

/* ---------- Reveal on scroll ---------- */
.reveal{
	opacity:0;
	transform:translateY(24px);
	transition:opacity .7s ease, transform .7s ease;
}
.reveal.is-visible{
	opacity:1;
	transform:translateY(0);
}

/* ---------- Botones ---------- */
.mtc-btn{
	font-family:'Inter', sans-serif; font-weight:600; font-size:14px;
	padding:11px 22px; border-radius:4px; text-decoration:none; cursor:pointer;
	display:inline-block; border:1px solid transparent; transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.mtc-btn-pink{ background:var(--mtc-pink); color:#2a0416; }
.mtc-btn-pink:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(255,56,153,0.35); }
.mtc-btn-ghost{ border-color:var(--mtc-border); color:var(--mtc-text-1); }
.mtc-btn-ghost:hover{ border-color:var(--mtc-pink); color:var(--mtc-pink); transform:translateY(-2px); }
.mtc-btn-sm{ padding:8px 16px; font-size:13px; }

/* ---------- Nav ---------- */
.mtc-nav-wrap{
	position:sticky; top:0; z-index:100;
	background:rgba(13,5,9,0.92); backdrop-filter:blur(8px);
	border-bottom:1px solid var(--mtc-border);
}
.mtc-nav{
	display:flex; align-items:center; justify-content:space-between;
	padding:14px 32px; max-width:1320px; margin:0 auto;
}
.mtc-logo{ display:flex; align-items:center; gap:12px; text-decoration:none; }
.mtc-logo-img{ height:40px; width:auto; }
.mtc-logo-text{ font-family:'Rajdhani', sans-serif; font-weight:700; font-size:18px; letter-spacing:0.04em; color:var(--mtc-text-1); }
.mtc-logo-text .accent{ color:var(--mtc-pink); }

.mtc-menu{ display:flex; gap:32px; }
.mtc-menu a{
	color:var(--mtc-text-2); text-decoration:none; font-size:14px; font-weight:500;
	transition:color .15s; position:relative;
}
.mtc-menu a::after{
	content:''; position:absolute; left:0; bottom:-6px; width:0; height:2px;
	background:var(--mtc-pink); transition:width .2s ease;
}
.mtc-menu a:hover{ color:var(--mtc-text-1); }
.mtc-menu a:hover::after{ width:100%; }

.mtc-nav-cta{ white-space:nowrap; }
.mtc-nav-toggle{
	display:none; flex-direction:column; justify-content:center; gap:5px;
	width:36px; height:36px; background:transparent; border:1px solid var(--mtc-border);
	border-radius:4px; cursor:pointer;
}
.mtc-nav-toggle span{ display:block; height:2px; width:18px; margin:0 auto; background:var(--mtc-text-1); transition:transform .2s ease, opacity .2s ease; }
.mtc-nav-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.mtc-nav-toggle.is-open span:nth-child(2){ opacity:0; }
.mtc-nav-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ---------- Hero ---------- */
.mtc-hero{
	position:relative; overflow:hidden;
	padding:100px 32px 64px; max-width:1320px; margin:0 auto;
}
.mtc-hero-lion{
	position:absolute; right:-70px; top:-30px; width:480px; opacity:0.08;
	filter:brightness(0) invert(1);
	pointer-events:none;
	animation:mtcFloat 7s ease-in-out infinite;
}
@keyframes mtcFloat{
	0%, 100%{ transform:translateY(0) rotate(0deg); }
	50%{ transform:translateY(-18px) rotate(1.5deg); }
}
.mtc-hero-glow{
	position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; z-index:0;
}
.mtc-glow-1{
	width:420px; height:420px; background:radial-gradient(circle, rgba(130,0,58,0.55), transparent 70%);
	top:-120px; right:10%;
	animation:mtcPulse 8s ease-in-out infinite;
}
.mtc-glow-2{
	width:280px; height:280px; background:radial-gradient(circle, rgba(255,56,153,0.18), transparent 70%);
	bottom:-100px; left:5%;
	animation:mtcPulse 10s ease-in-out infinite reverse;
}
@keyframes mtcPulse{
	0%, 100%{ opacity:0.6; transform:scale(1); }
	50%{ opacity:1; transform:scale(1.12); }
}
.mtc-eyebrow{
	position:relative; font-size:13px; color:var(--mtc-pink); font-weight:600; letter-spacing:0.12em;
	text-transform:uppercase; margin:0 0 18px; display:flex; align-items:center; gap:10px;
}
.mtc-eyebrow::before{ content:''; width:22px; height:1px; background:var(--mtc-pink); }
.mtc-hero-title{
	position:relative; font-size:clamp(38px, 6vw, 62px); line-height:0.98; font-weight:700;
	max-width:760px; margin:0 0 22px;
}
.mtc-hero-sub{ position:relative; font-size:17px; color:var(--mtc-text-2); max-width:520px; line-height:1.6; margin:0 0 34px; }
.mtc-hero-ctas{ position:relative; display:flex; gap:14px; flex-wrap:wrap; }

/* ---------- Ticker ---------- */
.mtc-ticker-wrap{
	border-bottom:1px solid var(--mtc-border); border-top:1px solid var(--mtc-border);
	background:var(--mtc-bg-1); overflow:hidden; white-space:nowrap; padding:14px 0;
}
.mtc-ticker-track{ display:inline-flex; animation:mtcScroll 30s linear infinite; }
.mtc-ticker-wrap:hover .mtc-ticker-track{ animation-play-state:paused; }
.mtc-ticker-item{
	display:inline-flex; align-items:center; gap:10px; padding:0 32px; font-size:13px;
	color:var(--mtc-text-2); border-right:1px solid var(--mtc-border);
}
.mtc-ticker-item b{ color:var(--mtc-text-1); font-weight:500; }
.mtc-dot{ width:6px; height:6px; border-radius:50%; flex-shrink:0; background:var(--mtc-pink); }
.mtc-dot.gold{ background:var(--mtc-gold); }
@keyframes mtcScroll{
	0%{ transform:translateX(0); }
	100%{ transform:translateX(-50%); }
}

/* ---------- Stats strip ---------- */
.mtc-stats-strip{
	display:grid; grid-template-columns:repeat(4, 1fr); max-width:1320px; margin:0 auto;
	border-bottom:1px solid var(--mtc-border);
}
.mtc-stat-card{
	padding:34px 20px; text-align:center; border-right:1px solid var(--mtc-border);
}
.mtc-stat-card:last-child{ border-right:none; }
.mtc-stat-number{
	font-size:38px; font-weight:600; color:var(--mtc-pink);
}
.mtc-stat-label{ font-size:12px; color:var(--mtc-text-3); text-transform:uppercase; letter-spacing:0.06em; margin-top:6px; }

/* ---------- Sections ---------- */
.mtc-section{ padding:76px 32px; max-width:1320px; margin:0 auto; }
.mtc-section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:40px; flex-wrap:wrap; gap:10px; }
.mtc-section-head h2{ font-size:clamp(24px, 3vw, 30px); font-weight:700; margin:0; }
.mtc-section-head p{ color:var(--mtc-text-3); font-size:14px; margin:0; }

/* ---------- Games grid ---------- */
.mtc-games-grid{
	display:grid; grid-template-columns:repeat(4, 1fr); gap:1px;
	background:var(--mtc-border); border:1px solid var(--mtc-border);
}
.mtc-game-card{
	background:var(--mtc-bg-0); padding:30px 26px; position:relative; text-decoration:none;
	transition:background .2s ease, transform .2s ease;
	display:block;
}
.mtc-game-card:hover{ background:var(--mtc-bg-1); transform:translateY(-4px); }
.mtc-accent-line{ position:absolute; top:0; left:0; right:0; height:3px; background:var(--mtc-pink); }
.mtc-accent-line.gold{ background:var(--mtc-gold); }
.mtc-game-icon{ width:34px; height:34px; margin-bottom:20px; stroke:var(--mtc-pink); transition:transform .25s ease; }
.mtc-game-icon.gold{ stroke:var(--mtc-gold); }
.mtc-game-card:hover .mtc-game-icon{ transform:scale(1.15) rotate(-4deg); }
.mtc-game-card h3{ font-size:19px; font-weight:600; margin:0 0 6px; color:var(--mtc-text-1); }
.mtc-game-sub{ font-size:12px; color:var(--mtc-text-3); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:18px; }
.mtc-game-roster{ font-size:13px; color:var(--mtc-text-2); margin-bottom:18px; }
.mtc-game-roster b{ color:var(--mtc-text-1); }
.mtc-game-link{ font-size:13px; font-weight:600; display:flex; align-items:center; gap:6px; color:var(--mtc-pink); }
.mtc-game-link.gold{ color:var(--mtc-gold); }
.mtc-arrow{ transition:transform .2s ease; display:inline-block; }
.mtc-game-card:hover .mtc-arrow{ transform:translateX(5px); }

/* ---------- Sponsors marquee ---------- */
.mtc-sponsors-marquee{ overflow:hidden; border-top:1px solid var(--mtc-border); border-bottom:1px solid var(--mtc-border); padding:30px 0; }
.mtc-sponsors-track{ display:inline-flex; align-items:center; gap:64px; animation:mtcScroll 26s linear infinite; white-space:nowrap; }
.mtc-sponsors-marquee:hover .mtc-sponsors-track{ animation-play-state:paused; }
.mtc-sponsor-logo{
	display:inline-flex; align-items:center; justify-content:center; height:60px; width:160px;
	filter:grayscale(1) brightness(1.6); opacity:0.6; transition:filter .25s ease, opacity .25s ease, transform .25s ease;
}
.mtc-sponsor-logo:hover{ filter:none; opacity:1; transform:scale(1.06); }
.mtc-sponsor-logo img{ max-height:60px; width:auto; margin:0 auto; }
.mtc-sponsor-fallback{ font-family:'Rajdhani', sans-serif; font-weight:700; color:var(--mtc-text-2); font-size:16px; }
.mtc-empty-note{ color:var(--mtc-text-3); font-size:14px; }
.mtc-empty-note a{ color:var(--mtc-pink); }
.mtc-empty-note-full{ grid-column:1 / -1; text-align:center; padding:20px; }

/* ---------- Player cards ---------- */
.mtc-cards-row{ display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; }
.mtc-player-card{
	background:var(--mtc-bg-1); border:1px solid var(--mtc-border); border-radius:8px;
	overflow:hidden; height:230px; cursor:pointer; position:relative; transition:transform .25s ease, border-color .25s ease;
}
.mtc-player-card:hover{ transform:translateY(-4px); border-color:var(--mtc-pink); }
.mtc-player-front{ height:100%; display:flex; flex-direction:column; justify-content:space-between; padding:18px; transition:opacity .2s ease; }
.mtc-player-card:hover .mtc-player-front{ opacity:0.1; }
.mtc-player-back{
	position:absolute; inset:0; padding:18px; opacity:0; transition:opacity .2s ease;
	display:flex; flex-direction:column; justify-content:center; gap:8px;
}
.mtc-player-card:hover .mtc-player-back{ opacity:1; }
.mtc-player-photo{
	width:100%; height:100px; background:var(--mtc-bg-2); border-radius:6px;
	display:flex; align-items:center; justify-content:center; font-size:24px; color:var(--mtc-pink-dim);
	font-family:'Rajdhani', sans-serif; font-weight:700;
}
.mtc-player-name{ font-size:14px; font-weight:600; }
.mtc-player-pos{ font-size:11px; color:var(--mtc-gold); text-transform:uppercase; letter-spacing:0.06em; }
.mtc-stat-row{ display:flex; justify-content:space-between; font-size:12px; color:var(--mtc-text-2); }
.mtc-stat-row b{ color:var(--mtc-text-1); }
.mtc-player-num{ font-size:36px; font-weight:600; color:var(--mtc-pink); }
.mtc-note-small{ margin-top:16px; font-size:12px; color:var(--mtc-text-3); font-style:italic; }

/* ---------- Merch grid ---------- */
.mtc-merch-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; }
.mtc-product-card{
	background:var(--mtc-bg-1); border:1px solid var(--mtc-border); border-radius:10px;
	overflow:hidden; position:relative; transition:transform .25s ease, border-color .25s ease;
}
.mtc-product-card:hover{ transform:translateY(-6px); border-color:var(--mtc-pink); }
.mtc-product-badge{
	position:absolute; top:12px; left:12px; z-index:2; background:var(--mtc-pink); color:#2a0416;
	font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em;
	padding:4px 10px; border-radius:20px;
}
.mtc-product-image{ height:200px; overflow:hidden; background:var(--mtc-bg-2); }
.mtc-product-image img{ height:100%; width:100%; object-fit:cover; transition:transform .35s ease; }
.mtc-product-card:hover .mtc-product-image img{ transform:scale(1.08); }
.mtc-product-fallback{
	height:100%; display:flex; align-items:center; justify-content:center;
	font-family:'Rajdhani', sans-serif; font-weight:700; font-size:28px; color:var(--mtc-text-3);
}
.mtc-product-info{ padding:18px; }
.mtc-product-info h3{ font-size:15px; font-weight:600; margin:0 0 8px; }
.mtc-product-price{ font-size:14px; color:var(--mtc-gold); margin-bottom:14px; }

/* ---------- Posts grid (blog / index.php) ---------- */
.mtc-posts-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; }
.mtc-post-card{ background:var(--mtc-bg-1); border:1px solid var(--mtc-border); border-radius:10px; overflow:hidden; transition:transform .25s ease; }
.mtc-post-card:hover{ transform:translateY(-4px); }
.mtc-post-thumb{ display:block; height:180px; overflow:hidden; background:var(--mtc-bg-2); }
.mtc-post-thumb img{ height:100%; width:100%; object-fit:cover; }
.mtc-post-info{ padding:18px; }
.mtc-post-info h3{ font-size:16px; margin:0 0 10px; }
.mtc-post-info h3 a{ text-decoration:none; color:var(--mtc-text-1); }
.mtc-post-info p{ font-size:13px; color:var(--mtc-text-2); line-height:1.6; margin:0 0 14px; }
.mtc-pagination{ margin-top:40px; display:flex; gap:10px; justify-content:center; }
.mtc-page-body{ color:var(--mtc-text-2); line-height:1.8; max-width:760px; }
.mtc-page-body h2, .mtc-page-body h3{ color:var(--mtc-text-1); font-family:'Rajdhani', sans-serif; }

/* ---------- Footer ---------- */
.mtc-footer{ border-top:1px solid var(--mtc-border); padding:40px 32px; }
.mtc-footer-top{
	max-width:1320px; margin:0 auto; display:flex; align-items:center; justify-content:space-between;
	flex-wrap:wrap; gap:20px; color:var(--mtc-text-3); font-size:13px;
}
.mtc-footer-brand{ display:flex; align-items:center; gap:12px; }
.mtc-logo-footer{ height:28px; opacity:0.85; }
.mtc-footer-social{ display:flex; gap:18px; }
.mtc-social-link{ text-decoration:none; color:var(--mtc-text-2); font-size:13px; transition:color .2s ease; }
.mtc-social-link:hover{ color:var(--mtc-pink); }

/* ---------- Responsive ---------- */
@media (max-width: 980px){
	.mtc-games-grid{ grid-template-columns:repeat(2, 1fr); }
	.mtc-cards-row{ grid-template-columns:repeat(2, 1fr); }
	.mtc-merch-grid{ grid-template-columns:repeat(2, 1fr); }
	.mtc-posts-grid{ grid-template-columns:repeat(2, 1fr); }
	.mtc-stats-strip{ grid-template-columns:repeat(2, 1fr); }
	.mtc-stat-card:nth-child(2){ border-right:none; }
}
@media (max-width: 720px){
	.mtc-nav-toggle{ display:flex; }
	.mtc-nav-links{
		position:absolute; top:100%; left:0; right:0; background:var(--mtc-bg-1);
		border-bottom:1px solid var(--mtc-border);
		max-height:0; overflow:hidden; transition:max-height .25s ease;
	}
	.mtc-nav-links.is-open{ max-height:400px; }
	.mtc-menu{ flex-direction:column; gap:0; padding:10px 32px; }
	.mtc-menu a{ display:block; padding:12px 0; border-bottom:1px solid var(--mtc-border); }
	.mtc-nav-cta{ display:none; }
	.mtc-hero{ padding:70px 20px 40px; }
	.mtc-section{ padding:50px 20px; }
	.mtc-games-grid, .mtc-cards-row, .mtc-merch-grid, .mtc-posts-grid{ grid-template-columns:1fr; }
	.mtc-stats-strip{ grid-template-columns:repeat(2, 1fr); }
	.mtc-stat-card{ padding:22px 12px; }
	.mtc-stat-card:nth-child(2n){ border-right:none; }
}
