:root {
  --bg: #070707;
  --bg-soft: #0c0c0e;
  --panel: #111114;
  --panel-2: #17171b;
  --line: rgba(255,255,255,.09);
  --line-strong: rgba(255,255,255,.16);
  --text: #f5f5f7;
  --muted: #8e8e99;
  --red: #f20d2f;
  --red-dark: #a9001e;
  --red-soft: rgba(242,13,47,.12);
  --green: #43f38b;
  --max: 1240px;
  --header: 74px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--red); color: #fff; }

.noise {
  position: fixed; inset: 0; z-index: 1000; pointer-events: none; opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
}
.container { width: min(var(--max), calc(100% - 48px)); margin: 0 auto; }
.container-wide { width: min(1400px, calc(100% - 48px)); }

.site-header {
  position: fixed; top: 0; left: 0; right: 0; height: var(--header); z-index: 900;
  display: flex; align-items: center; gap: 34px; padding: 0 max(24px, calc((100vw - var(--max))/2));
  border-bottom: 1px solid transparent; transition: background .25s, border-color .25s, height .25s;
}
.site-header.scrolled { background: rgba(7,7,7,.92); backdrop-filter: blur(18px); border-color: var(--line); height: 64px; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand-mark { width: 38px; height: 38px; }
.brand-copy { display: grid; line-height: 1; }
.brand-copy strong { font: 900 15px/1 Montserrat, sans-serif; letter-spacing: .02em; }
.brand-copy small { margin-top: 5px; color: var(--muted); font: 700 8px/1 Montserrat, sans-serif; letter-spacing: .26em; }
.desktop-nav { display: flex; gap: 4px; margin-left: auto; }
.desktop-nav a { padding: 10px 12px; color: #aaaab3; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; transition: color .2s; }
.desktop-nav a:hover, .desktop-nav a.active { color: #fff; }
.header-cta { display: inline-flex; align-items: center; gap: 8px; padding: 9px 15px; border: 1px solid rgba(242,13,47,.45); background: rgba(242,13,47,.08); color: #fff; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 0 rgba(242,13,47,.6); animation: pulse 1.8s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 9px rgba(242,13,47,0); } 100% { box-shadow: 0 0 0 0 rgba(242,13,47,0); } }
.menu-toggle { display: none; margin-left: auto; width: 42px; height: 42px; border: 1px solid var(--line); background: #0d0d0f; color: white; }
.menu-toggle span { display: block; width: 18px; height: 1px; margin: 5px auto; background: currentColor; }
.mobile-menu { display: none; position: fixed; z-index: 850; inset: 64px 0 auto; padding: 20px 24px 28px; background: rgba(7,7,7,.98); border-bottom: 1px solid var(--line); }
.mobile-menu.open { display: grid; }
.mobile-menu a { padding: 15px 0; border-bottom: 1px solid var(--line); font: 800 15px Montserrat, sans-serif; text-transform: uppercase; }

.hero { min-height: 100svh; position: relative; display: flex; align-items: center; overflow: hidden; padding: 120px 0 80px; background: radial-gradient(circle at 15% 35%, #181013 0, #080809 38%, #050505 75%); }
.hero::after { content: "HEADSHOT"; position: absolute; right: -30px; bottom: -44px; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.035); font: 900 clamp(100px, 18vw, 290px)/.8 Montserrat, sans-serif; letter-spacing: -.08em; white-space: nowrap; }
.hero-grid { position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 70px 70px; mask-image: linear-gradient(to right, black, transparent 72%); }
.hero-red-glow { position: absolute; width: 700px; height: 700px; right: -240px; top: 0; background: radial-gradient(circle, rgba(242,13,47,.3), transparent 66%); filter: blur(15px); }
.hero-operators { position: absolute; right: max(-80px, calc((100vw - 1450px)/2)); bottom: -3%; width: min(62vw, 850px); height: 98%; object-fit: contain; object-position: right bottom; opacity: .9; filter: drop-shadow(-35px 30px 50px rgba(0,0,0,.65)); }
.hero-content { position: relative; z-index: 2; }
.eyebrow, .section-kicker { display: inline-flex; align-items: center; gap: 10px; color: #b9b9c1; font-size: 11px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.hero-title { margin: 25px 0 10px; max-width: 780px; font-family: Montserrat, sans-serif; font-weight: 900; line-height: .79; letter-spacing: -.06em; }
.hero-title span { display: block; font-size: clamp(62px, 10vw, 145px); }
.hero-title strong { display: block; color: var(--red); font-size: clamp(76px, 13vw, 190px); text-shadow: 0 0 80px rgba(242,13,47,.28); }
.hero-lead { margin: 28px 0 8px; font: 800 clamp(18px, 2.1vw, 27px) Montserrat, sans-serif; text-transform: uppercase; letter-spacing: -.02em; }
.hero-copy { max-width: 580px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.75; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.btn { display: inline-flex; justify-content: center; align-items: center; min-height: 46px; padding: 0 22px; border: 1px solid transparent; font: 800 12px Montserrat, sans-serif; letter-spacing: .09em; text-transform: uppercase; transition: transform .2s, background .2s, border-color .2s; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--red); color: white; box-shadow: 0 14px 34px rgba(242,13,47,.2); }
.btn-primary:hover { background: #ff2342; }
.btn-secondary { border-color: var(--line-strong); background: rgba(255,255,255,.025); }
.btn-secondary:hover { border-color: rgba(242,13,47,.55); }
.btn-full { width: 100%; }
.hero-stats { display: grid; grid-template-columns: repeat(4, minmax(120px, 175px)); gap: 1px; margin-top: 48px; width: max-content; max-width: 100%; background: var(--line); border: 1px solid var(--line); }
.hero-stats article { padding: 15px 18px; background: rgba(8,8,9,.72); backdrop-filter: blur(10px); }
.hero-stats strong { display: block; font: 900 20px Montserrat, sans-serif; }
.hero-stats span { display: block; margin-top: 5px; color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.scroll-cue { position: absolute; z-index: 3; bottom: 24px; right: 34px; display: flex; align-items: center; gap: 12px; color: #797981; font-size: 9px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; transform: rotate(90deg); transform-origin: right center; }
.scroll-cue i { width: 52px; height: 1px; background: linear-gradient(to right, var(--red), transparent); }

.section { position: relative; padding: 120px 0; border-top: 1px solid var(--line); }
.section-dark { background: var(--bg-soft); }
.section-heading { display: grid; grid-template-columns: 1.35fr .65fr; align-items: end; gap: 80px; margin-bottom: 58px; }
.section-heading-row { grid-template-columns: 1fr auto; }
.section-heading h2, .prize-heading h2 { margin: 12px 0 0; font: 900 clamp(42px, 6vw, 82px)/.93 Montserrat, sans-serif; letter-spacing: -.055em; text-transform: uppercase; }
.section-heading p, .prize-heading p { max-width: 500px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; }
.section-heading code { color: #d6d6db; background: #151519; padding: 3px 6px; border: 1px solid var(--line); }
.section-kicker { color: var(--red); }
.format-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.feature-card { min-height: 310px; position: relative; padding: 34px; background: #101012; border: 1px solid var(--line); overflow: hidden; }
.feature-card::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent); transform: scaleX(0); transition: transform .3s; }
.feature-card:hover::after { transform: scaleX(1); }
.feature-card-accent { background: linear-gradient(150deg, rgba(242,13,47,.18), #111114 70%); border-color: rgba(242,13,47,.35); }
.feature-index { position: absolute; right: 20px; top: 18px; color: #38383f; font: 900 40px Montserrat, sans-serif; }
.feature-icon { width: 78px; height: 78px; display: grid; place-items: center; border: 1px solid rgba(242,13,47,.35); background: var(--red-soft); color: var(--red); font: 900 20px Montserrat, sans-serif; }
.feature-card h3 { margin: 54px 0 13px; font: 800 20px Montserrat, sans-serif; text-transform: uppercase; }
.feature-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.schedule-strip { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; align-items: center; gap: 18px; margin-top: 18px; padding: 25px 28px; background: #080809; border: 1px solid var(--line); }
.schedule-strip > span { width: 36px; height: 1px; background: var(--red); position: relative; }
.schedule-strip > span::after { content: ""; position: absolute; right: 0; top: -2px; width: 5px; height: 5px; border-top: 1px solid var(--red); border-right: 1px solid var(--red); transform: rotate(45deg); }
.schedule-strip small, .schedule-strip strong { display: block; }
.schedule-strip small { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .12em; }
.schedule-strip strong { margin-top: 6px; font-size: 12px; text-transform: uppercase; }

.stream-section { background: radial-gradient(circle at 85% 15%, rgba(242,13,47,.11), transparent 28%), #070707; }
.stream-status { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: center; }
.stream-status .live-dot { grid-row: 1 / 3; }
.stream-status strong { font-size: 13px; text-transform: uppercase; }
.stream-status small { color: var(--muted); font-size: 10px; }
.stream-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 16px; }
.stream-frame { background: #050505; border: 1px solid var(--line-strong); box-shadow: 0 40px 100px rgba(0,0,0,.45); }
.stream-topbar { height: 44px; display: grid; grid-template-columns: 90px 1fr 90px; align-items: center; padding: 0 16px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 9px; letter-spacing: .1em; }
.stream-topbar span { color: var(--red); font-weight: 900; }
.stream-topbar span i { display: inline-block; width: 6px; height: 6px; margin-right: 7px; background: var(--red); border-radius: 50%; }
.stream-topbar b { color: #bcbcc4; text-align: center; font-size: 9px; }
.stream-topbar small { text-align: right; }
.twitch-wrap { aspect-ratio: 16/9; position: relative; overflow: hidden; background: #09090b; }
.twitch-wrap iframe { width: 100%; height: 100%; border: 0; position: relative; z-index: 2; }
.stream-placeholder { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 12px; text-align: center; background: radial-gradient(circle, rgba(242,13,47,.12), transparent 45%), repeating-linear-gradient(135deg, transparent 0 20px, rgba(255,255,255,.01) 20px 40px); }
.stream-placeholder img { width: 74px; opacity: .8; }
.stream-placeholder strong { font: 800 16px Montserrat, sans-serif; text-transform: uppercase; }
.stream-placeholder span { color: var(--muted); font-size: 11px; }
.stream-sidebar { padding: 26px; background: #111114; border: 1px solid var(--line); }
.next-match { margin: 22px 0 25px; padding: 22px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.next-match > small { color: var(--red); font-size: 9px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.match-team { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 18px; }
.match-team b { font: 800 16px Montserrat, sans-serif; text-transform: uppercase; }
.match-team span { width: 34px; height: 34px; display: grid; place-items: center; background: #1c1c20; border: 1px solid var(--line); color: #babac2; font-size: 10px; font-weight: 900; }
.next-match em { display: block; margin: 10px 0; color: #4e4e56; font: 900 11px Montserrat, sans-serif; }
.next-match time { display: block; margin-top: 22px; color: var(--muted); font-size: 10px; }

.teams-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.team-card { position: relative; min-height: 250px; padding: 28px; background: #111114; border: 1px solid var(--line); overflow: hidden; transition: transform .25s, border-color .25s; }
.team-card:hover { transform: translateY(-5px); border-color: rgba(242,13,47,.35); }
.team-card::before { content: attr(data-abbr); position: absolute; right: -8px; bottom: -18px; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.055); font: 900 90px Montserrat, sans-serif; }
.team-top { display: flex; justify-content: space-between; align-items: flex-start; }
.team-logo { width: 54px; height: 54px; display: grid; place-items: center; background: var(--red-soft); border: 1px solid rgba(242,13,47,.32); color: var(--red); font: 900 15px Montserrat, sans-serif; }
.seed-badge { padding: 5px 8px; border: 1px solid var(--line); color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.seed-badge.seeded { color: var(--red); border-color: rgba(242,13,47,.35); }
.team-card h3 { margin: 24px 0 15px; font: 900 22px Montserrat, sans-serif; text-transform: uppercase; }
.roster { display: flex; flex-wrap: wrap; gap: 6px; position: relative; z-index: 1; }
.roster span { padding: 6px 8px; background: #09090a; border: 1px solid var(--line); color: #9999a3; font-size: 9px; font-weight: 700; }

.bracket-section { background: #080809; overflow: hidden; }
.bracket-legend { display: flex; flex-wrap: wrap; gap: 18px; color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.bracket-legend span { display: flex; align-items: center; gap: 7px; }
.bracket-legend i { width: 7px; height: 7px; border-radius: 50%; }
.seed-dot { background: white; }.match-dot { background: #5b5b63; }.final-dot { background: var(--red); }
.bracket-scroll { overflow-x: auto; padding: 8px 0 22px; scrollbar-color: var(--red) #161619; }
.bracket { min-width: 1020px; height: 570px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 105px; position: relative; padding: 0 20px; }
.round { position: relative; display: flex; flex-direction: column; }
.round-title { height: 62px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); margin-bottom: 22px; }
.round-title span { font: 800 13px Montserrat, sans-serif; text-transform: uppercase; }
.round-title small { color: var(--red); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.match-card { width: 100%; position: relative; background: #111114; border: 1px solid var(--line-strong); }
.match-card::after { content: ""; position: absolute; left: 100%; top: 50%; width: 53px; height: 1px; background: rgba(242,13,47,.5); }
.match-code { padding: 9px 12px; border-bottom: 1px solid var(--line); color: #696970; font-size: 8px; font-weight: 800; letter-spacing: .12em; }
.bracket-team { min-height: 43px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border-bottom: 1px solid var(--line); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.bracket-team:last-child { border-bottom: 0; }
.bracket-team span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bracket-team b { margin-left: auto; color: #5c5c64; }
.bracket-team small { padding: 3px 5px; background: var(--red); color: white; font-size: 7px; }
.match-a { margin-top: 28px; }
.match-b { margin-top: 148px; }
.round-semis .match-c { margin-top: 87px; }
.round-semis .match-d { margin-top: 143px; }
.round-final .final-card { margin-top: 212px; border-color: rgba(242,13,47,.5); box-shadow: 0 0 55px rgba(242,13,47,.08); }
.round-final .final-card::after { display: none; }
.round-first .match-a::before, .round-first .match-b::before { content: ""; position: absolute; left: calc(100% + 52px); top: 50%; width: 1px; height: 227px; background: rgba(242,13,47,.5); }
.round-first .match-b::before { top: auto; bottom: 50%; }
.round-semis .match-c::before, .round-semis .match-d::before { content: ""; position: absolute; left: calc(100% + 52px); top: 50%; width: 1px; height: 217px; background: rgba(242,13,47,.5); }
.round-semis .match-d::before { top: auto; bottom: 50%; }
.trophy-mark { position: absolute; left: 50%; bottom: -36px; transform: translateX(-50%); padding: 6px 12px; background: var(--red); color: white; font: 900 8px Montserrat, sans-serif; letter-spacing: .16em; }
.third-place { display: grid; grid-template-columns: 1fr 1.5fr auto; align-items: center; gap: 35px; padding: 28px 32px; background: #111114; border: 1px solid var(--line); }
.third-place h3 { margin: 8px 0 0; font: 800 18px Montserrat, sans-serif; text-transform: uppercase; }
.third-match { display: flex; justify-content: center; align-items: center; gap: 20px; color: #c4c4ca; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.third-match em, .third-match strong { color: var(--red); font: 900 10px Montserrat, sans-serif; }
.third-place > strong { color: #d79c62; font: 900 18px Montserrat, sans-serif; }

.prizes-section { min-height: 760px; display: flex; align-items: center; background: radial-gradient(circle at 50% 50%, rgba(242,13,47,.13), transparent 35%), #050505; }
.prize-heading { text-align: center; }
.prize-heading h2 { font-size: clamp(58px, 9vw, 125px); }
.prize-heading h2 span { color: var(--red); }
.prize-heading p { margin: 22px auto 0; }
.podium { height: 330px; display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: 12px; max-width: 850px; margin: 65px auto 0; }
.podium-place { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding: 25px 15px 0; background: linear-gradient(to top, rgba(255,255,255,.045), rgba(255,255,255,.012)); border: 1px solid var(--line); }
.podium-place.second { height: 225px; }.podium-place.first { height: 310px; border-color: rgba(242,13,47,.45); background: linear-gradient(to top, rgba(242,13,47,.17), rgba(242,13,47,.02)); }.podium-place.third { height: 185px; }
.medal { position: absolute; top: 18px; color: #33333a; font: 900 52px Montserrat, sans-serif; }
.first .medal { color: rgba(242,13,47,.28); }
.crown { position: absolute; top: -42px; color: var(--red); font-size: 32px; transform: rotate(45deg); text-shadow: 0 0 25px rgba(242,13,47,.65); }
.podium-place small { position: relative; z-index: 1; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.podium-place strong { position: relative; z-index: 1; margin: 10px 0 24px; font: 900 clamp(25px, 3vw, 42px) Montserrat, sans-serif; }
.podium-place strong i { color: var(--red); font-size: .38em; font-style: normal; letter-spacing: .1em; }
.podium-place div { width: 1px; height: 40px; background: linear-gradient(var(--red), transparent); }

footer { border-top: 1px solid var(--line); background: #050505; }
.footer-inner { min-height: 120px; display: flex; align-items: center; gap: 32px; }
.footer-inner p { margin: 0 auto; color: #5e5e66; font-size: 10px; }
.footer-inner > a { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: none; }

@media (max-width: 1000px) {
  .desktop-nav, .header-cta { display: none; }
  .menu-toggle { display: block; }
  .hero-operators { right: -220px; width: 850px; opacity: .48; }
  .hero-content { padding-top: 50px; }
  .hero-copy { max-width: 510px; }
  .section-heading, .section-heading-row { grid-template-columns: 1fr; gap: 22px; align-items: start; }
  .format-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 245px; }
  .feature-card h3 { margin-top: 38px; }
  .schedule-strip { grid-template-columns: 1fr 1fr; }
  .schedule-strip > span { display: none; }
  .stream-layout { grid-template-columns: 1fr; }
  .teams-grid { grid-template-columns: repeat(2, 1fr); }
  .third-place { grid-template-columns: 1fr; text-align: center; }
}

@media (max-width: 700px) {
  :root { --header: 64px; }
  .container, .container-wide { width: min(100% - 28px, var(--max)); }
  .site-header { padding: 0 14px; }
  .brand-mark { width: 34px; height: 34px; }
  .hero { padding: 100px 0 72px; align-items: flex-start; }
  .hero-operators { right: -340px; bottom: 0; width: 780px; height: 82%; opacity: .32; }
  .hero-title { margin-top: 24px; }
  .hero-title span { font-size: clamp(50px, 15vw, 82px); }
  .hero-title strong { font-size: clamp(67px, 20vw, 108px); }
  .hero-lead { margin-top: 22px; font-size: 15px; }
  .hero-copy { font-size: 13px; line-height: 1.65; max-width: 93%; }
  .hero-actions .btn { width: 100%; }
  .hero-stats { width: 100%; grid-template-columns: 1fr 1fr; }
  .hero-stats article { padding: 13px; }
  .scroll-cue { display: none; }
  .section { padding: 82px 0; }
  .section-heading { margin-bottom: 38px; }
  .section-heading h2, .prize-heading h2 { font-size: 40px; }
  .format-grid { gap: 9px; }
  .feature-card { min-height: 230px; padding: 25px; }
  .feature-icon { width: 62px; height: 62px; }
  .feature-card h3 { margin-top: 32px; }
  .schedule-strip { grid-template-columns: 1fr; gap: 20px; padding: 22px; }
  .stream-topbar { grid-template-columns: 70px 1fr; }
  .stream-topbar small { display: none; }
  .stream-placeholder span { padding: 0 20px; }
  .teams-grid { grid-template-columns: 1fr; }
  .team-card { min-height: 220px; }
  .bracket-legend { display: none; }
  .third-match { flex-direction: column; gap: 9px; }
  .podium { gap: 5px; margin-top: 50px; }
  .podium-place.second { height: 190px; }.podium-place.first { height: 260px; }.podium-place.third { height: 160px; }
  .medal { font-size: 36px; }
  .podium-place strong { font-size: 21px; }
  .footer-inner { padding: 28px 0; flex-direction: column; text-align: center; gap: 18px; }
  .footer-inner p { margin: 0; }
}

/* =========================================================
   HEADSHOT CUP — DATA & LAYOUT UPDATE
   ========================================================= */
.btn-ghost {
  border-color: rgba(242,13,47,.36);
  background: rgba(242,13,47,.055);
  color: #d8d8de;
}
.btn-ghost:hover { border-color: var(--red); background: rgba(242,13,47,.11); }
.hero-stats { grid-template-columns: repeat(5, minmax(112px, 152px)); }

.event-bar {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr) auto;
  align-items: center;
  gap: 28px;
  margin-top: 18px;
  padding: 18px;
  background: linear-gradient(110deg, rgba(242,13,47,.1), rgba(255,255,255,.018) 45%, #09090a);
  border: 1px solid var(--line);
  border-left: 2px solid var(--red);
}
.event-bar > img {
  width: 118px;
  aspect-ratio: 1;
  object-fit: cover;
  border: 1px solid rgba(242,13,47,.35);
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
}
.event-bar-copy { min-width: 0; }
.event-bar-copy strong,
.event-bar-copy small { display: block; }
.event-bar-copy strong {
  margin-top: 10px;
  font: 800 17px/1.35 Montserrat, sans-serif;
  text-transform: uppercase;
}
.event-bar-copy small { margin-top: 7px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.event-bar-actions { display: grid; gap: 8px; min-width: 220px; }

.stream-placeholder { transition: opacity .35s ease; pointer-events: none; }
.stream-placeholder img {
  width: 128px;
  aspect-ratio: 1;
  object-fit: cover;
  border: 1px solid rgba(242,13,47,.4);
  box-shadow: 0 18px 48px rgba(0,0,0,.48);
  opacity: .92;
}
.stream-secondary-link { margin-top: 9px; }
.match-team b,
.team-card h3,
.bracket-team { text-transform: none; }
.team-card h3 { line-height: 1.08; overflow-wrap: anywhere; }

/* Precision bracket layout */
.bracket-scroll {
  padding: 8px 0 28px;
  scrollbar-width: thin;
}
.bracket {
  min-width: 1200px;
  width: 1200px;
  height: 610px;
  display: block;
  position: relative;
  padding: 0;
  margin: 0 auto;
}
.bracket-lines {
  position: absolute;
  inset: 0;
  width: 1200px;
  height: 610px;
  overflow: visible;
  pointer-events: none;
  z-index: 0;
}
.bracket-lines path {
  fill: none;
  stroke: rgba(242,13,47,.56);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}
.bracket-lines circle { fill: var(--red); filter: drop-shadow(0 0 7px rgba(242,13,47,.8)); }
.round-label {
  position: absolute;
  top: 0;
  width: 320px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-top-color: rgba(242,13,47,.5);
  background: linear-gradient(180deg, rgba(242,13,47,.075), rgba(255,255,255,.012));
  z-index: 2;
}
.round-label span { font: 800 13px Montserrat, sans-serif; text-transform: uppercase; }
.round-label small { color: var(--red); font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.round-label-first { left: 0; }
.round-label-semis { left: 440px; }
.round-label-final { left: 880px; }

.bracket .match-card {
  position: absolute;
  width: 320px;
  margin: 0;
  z-index: 2;
  background: linear-gradient(145deg, #141418, #0e0e11);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 48px rgba(0,0,0,.28);
}
.bracket .match-card::before,
.bracket .match-card::after { display: none !important; }
.bracket .match-card:hover { border-color: rgba(242,13,47,.42); }
.bracket .match-a { left: 0; top: 105px; }
.bracket .match-b { left: 0; top: 390px; }
.bracket .match-c { left: 440px; top: 185px; }
.bracket .match-d { left: 440px; top: 330px; }
.bracket .final-card {
  left: 880px;
  top: 225px;
  border-color: rgba(242,13,47,.52);
  background: linear-gradient(145deg, rgba(242,13,47,.13), #111114 48%, #0c0c0e);
  box-shadow: 0 0 70px rgba(242,13,47,.09), 0 24px 60px rgba(0,0,0,.4);
}
.bracket .match-code {
  min-height: 32px;
  display: flex;
  align-items: center;
  color: #777780;
  background: rgba(0,0,0,.16);
}
.bracket .bracket-team { min-height: 45px; font-size: 11px; }
.bracket .bracket-team.seeded { background: linear-gradient(90deg, rgba(242,13,47,.1), transparent 70%); }
.bracket .bracket-team.winner,
.bracket .bracket-team.advanced {
  background: linear-gradient(90deg, rgba(34,197,94,.18), transparent 72%);
  color: #f5fff8;
}
.bracket .bracket-team.winner b {
  color: #45e07a;
  font-size: 14px;
}
.bracket .bracket-team.eliminated {
  color: #777780;
  text-decoration: line-through;
}
.bracket .bracket-team.eliminated b { color: #888891; }
.bracket .live-code {
  color: var(--red);
  border-bottom-color: rgba(242,13,47,.45);
}
.bracket .live-code::before {
  content: "";
  width: 7px;
  height: 7px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 0 rgba(242,13,47,.6);
  animation: pulse 1.8s infinite;
}
.final-awards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  padding: 1px 0 0;
  background: var(--line);
  border-top: 1px solid var(--line);
}
.final-awards > span {
  min-width: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "icon place" "icon value";
  column-gap: 8px;
  align-items: center;
  padding: 11px 12px;
  background: #0d0d10;
}
.final-awards i { grid-area: icon; font-style: normal; font-size: 20px; }
.final-awards strong { grid-area: place; color: #8e8e99; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.final-awards b { grid-area: value; margin: 3px 0 0; color: #fff; font: 900 13px Montserrat, sans-serif; }
.trophy-mark { bottom: -29px; }

.third-place {
  border-color: rgba(255,255,255,.13);
  border-left: 2px solid #c78a51;
  background: linear-gradient(100deg, rgba(199,138,81,.08), #111114 40%);
}
.third-place > strong {
  display: grid;
  gap: 5px;
  min-width: 110px;
  color: #f3c18d;
  text-align: right;
}
.third-place > strong span { color: #a8a8b0; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }

.footer-inner {
  min-height: 142px;
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  gap: 34px;
}
.footer-inner p { margin: 0; text-align: center; }
.setka-partner {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 9px 12px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.018);
  transition: border-color .2s, transform .2s, background .2s;
}
.setka-partner:hover { transform: translateY(-2px); border-color: rgba(242,13,47,.4); background: rgba(242,13,47,.04); }
.setka-partner > span {
  max-width: 86px;
  color: #6f6f78;
  font-size: 8px;
  font-weight: 800;
  line-height: 1.45;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.setka-partner img { width: 126px; height: auto; }
.footer-links { display: flex; align-items: center; gap: 18px; }
.footer-links a { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.footer-links a:hover { color: #fff; }

@media (max-width: 1180px) {
  .event-bar { grid-template-columns: 100px minmax(0, 1fr); }
  .event-bar > img { width: 100px; }
  .event-bar-actions { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
  .footer-inner { grid-template-columns: auto 1fr auto; }
  .setka-partner { grid-column: 1 / -1; justify-self: center; grid-row: 2; }
  .footer-inner p { grid-column: 2; grid-row: 1; }
  .footer-links { grid-column: 3; grid-row: 1; }
}

@media (max-width: 700px) {
  .hero-stats { grid-template-columns: 1fr 1fr; width: 100%; }
  .hero-stats article:last-child { grid-column: 1 / -1; }
  .event-bar { grid-template-columns: 76px minmax(0, 1fr); gap: 15px; padding: 14px; }
  .event-bar > img { width: 76px; }
  .event-bar-copy strong { font-size: 13px; }
  .event-bar-copy small { font-size: 10px; }
  .event-bar-actions { grid-template-columns: 1fr; }
  .event-bar-actions .btn { width: 100%; }
  .third-place > strong { text-align: center; }
  .footer-inner { display: flex; min-height: 0; }
  .setka-partner { order: 2; flex-direction: column; gap: 5px; }
  .setka-partner > span { max-width: none; }
  .footer-inner p { order: 3; }
  .footer-links { order: 4; }
}

/* Champion announcement */
.champion-section {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 72% 32%, rgba(242,13,47,.2), transparent 32%), linear-gradient(135deg, #080809, #111114 58%, #080809);
}
.champion-section::before {
  content: "WINNERS";
  position: absolute;
  right: -24px;
  top: 18px;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,.055);
  font: 900 clamp(78px, 14vw, 190px)/1 Montserrat, sans-serif;
  letter-spacing: -.07em;
}
.champion-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 34px;
  align-items: center;
  padding: clamp(28px, 4vw, 54px);
  border: 1px solid rgba(242,13,47,.34);
  background: linear-gradient(115deg, rgba(242,13,47,.12), rgba(255,255,255,.024) 46%, rgba(0,0,0,.28));
  box-shadow: 0 36px 110px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
}
.champion-copy h2 {
  max-width: 780px;
  margin: 18px 0 18px;
  font: 900 clamp(42px, 6vw, 86px)/.92 Montserrat, sans-serif;
  letter-spacing: -.06em;
  text-transform: uppercase;
}
.champion-copy p {
  max-width: 720px;
  margin: 0;
  color: #c5c5cc;
  font-size: 16px;
  line-height: 1.8;
}
.champion-copy strong { color: #fff; }
.champion-score {
  padding: 18px;
  background: #08080a;
  border: 1px solid var(--line-strong);
  box-shadow: 0 22px 70px rgba(0,0,0,.35);
}
.score-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 14px;
  min-height: 70px;
  padding: 0 18px;
  background: #121216;
  border: 1px solid var(--line);
}
.score-row span { font: 900 18px Montserrat, sans-serif; }
.score-row strong { color: #777780; font: 900 42px Montserrat, sans-serif; }
.score-row-winner {
  border-color: rgba(242,13,47,.55);
  background: linear-gradient(90deg, rgba(242,13,47,.24), #121216 75%);
}
.score-row-winner strong { color: var(--red); text-shadow: 0 0 24px rgba(242,13,47,.45); }
.score-divider {
  margin: 10px 0;
  color: var(--red);
  text-align: center;
  font: 900 9px Montserrat, sans-serif;
  letter-spacing: .16em;
}
.champion-prize {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-top: 12px;
  padding: 16px 18px;
  border: 1px solid rgba(243,193,141,.28);
  background: linear-gradient(90deg, rgba(243,193,141,.13), rgba(255,255,255,.02));
}
.champion-prize small {
  color: #a8a8b0;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.champion-prize b { color: #f3c18d; font: 900 22px Montserrat, sans-serif; }
.champion-team span {
  border-color: rgba(242,13,47,.45);
  background: rgba(242,13,47,.14);
  color: #fff;
}
.champion-line small { background: transparent; padding: 0; font-size: 13px; }
.podium-place.first small { color: #fff; }

@media (max-width: 900px) {
  .champion-card { grid-template-columns: 1fr; }
  .champion-score { max-width: 480px; width: 100%; }
}

@media (max-width: 700px) {
  .champion-card { padding: 24px 16px; }
  .champion-copy p { font-size: 13px; }
  .score-row { min-height: 62px; padding: 0 13px; }
  .score-row span { font-size: 14px; }
  .score-row strong { font-size: 34px; }
  .champion-prize { align-items: flex-start; flex-direction: column; }
}
