/* Grid Bout site: Fight Night (direction B). One stylesheet for every page. */
:root{--ground:#0F1013;--panel:#1A1C21;--line:#2E3138;--text:#F4F1EA;--body:#C9C5BC;--muted:#A6A39B;--red:#E5252A;--red-t:#FF4B4F;--blue:#1F6FEB;--blue-t:#6FA8FF;--ylw:#FFD23F;--ink:#0B0C0E}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background-color:var(--ground);background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 1px,transparent 1px 7px);color:var(--body);font:500 17px/1.6 'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif}
a{color:var(--text);text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:#fff;text-decoration-color:var(--ylw)}
a:focus-visible{outline:3px solid var(--ylw);outline-offset:2px}
.top{background:var(--red);clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),0 100%);padding:18px 20px 34px}
.top-in{max-width:760px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.wm{font-size:30px;font-weight:900;font-stretch:66%;font-style:italic;letter-spacing:1px;color:#fff;text-decoration:none;line-height:1}
.wm span{color:var(--ink)}
.top nav{display:flex;gap:4px 16px;flex-wrap:wrap}
.top nav a{color:#fff;text-decoration:none;font-size:14px;font-weight:800;font-stretch:85%;letter-spacing:1.2px;text-transform:uppercase}
.top nav a:hover{text-decoration:underline;text-decoration-color:var(--ink)}
main{max-width:760px;margin:0 auto;padding:28px 20px 56px}
h1,h2,h3{color:var(--text);font-weight:900;font-style:italic;text-transform:uppercase;line-height:1;margin:0}
h1{font-size:clamp(40px,9vw,64px);font-stretch:62%;letter-spacing:.5px;margin:12px 0 10px}
h2{font-size:26px;font-stretch:66%;letter-spacing:.4px;margin:40px 0 12px}
h3{font-size:19px;font-stretch:72%;margin:26px 0 8px}
p,ul,ol{margin:0 0 14px}
ul,ol{padding-left:22px}
li{margin:4px 0}
strong{color:var(--text)}
.meta{color:var(--muted);font-size:14px;font-weight:700;font-stretch:85%;letter-spacing:1px;text-transform:uppercase}
.tag{display:inline-block;background:var(--ink);color:var(--text);font-size:13px;font-weight:900;font-stretch:85%;letter-spacing:1.5px;padding:4px 9px;text-transform:uppercase}
.box{background:var(--panel);padding:18px 20px;margin:18px 0;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}
.box p:last-child,.box ul:last-child,.box ol:last-child{margin-bottom:0}
.tbl{width:100%;border-collapse:collapse;font-size:15px;margin:10px 0 18px}
.tbl th,.tbl td{text-align:left;vertical-align:top;padding:10px 10px 10px 0;border-bottom:2px solid #23262C}
.tbl th{color:var(--muted);font-size:12px;font-weight:800;font-stretch:85%;letter-spacing:1.2px;text-transform:uppercase}
.tbl td:first-child{color:var(--text);font-weight:700;min-width:120px}
.scroll{overflow-x:auto}
.foot{border-top:2px solid #23262C;max-width:760px;margin:0 auto;padding:22px 20px 40px;color:var(--muted);font-size:14px}
.foot nav{display:flex;gap:6px 18px;flex-wrap:wrap;margin-bottom:10px}
/* landing */
.hero{min-height:100vh;display:flex;flex-direction:column}
.hero .slab{background:var(--red);clip-path:polygon(0 0,100% 0,100% 82%,0 100%);padding:56px 20px 110px}
.hero .in{max-width:760px;margin:0 auto}
.hero .big{font-size:clamp(84px,24vw,168px);font-weight:900;font-stretch:62%;font-style:italic;line-height:.86;letter-spacing:1px;color:#fff;margin:0}
.hero .big span{color:var(--ink)}
.hero .line{font-size:clamp(22px,5vw,30px);font-weight:900;font-stretch:66%;font-style:italic;text-transform:uppercase;color:var(--text);line-height:1.1;margin:0 0 28px}
.hero .body{padding:30px 20px 0;flex:1}
.badges{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 26px}
.badge{display:inline-flex;align-items:center;min-height:52px;padding:0 22px;background:var(--text);color:var(--ground);font-size:17px;font-weight:900;font-stretch:72%;font-style:italic;letter-spacing:.8px;text-transform:uppercase;text-decoration:none;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.badge.blue{background:var(--blue);color:#fff}
.badge:hover{color:var(--ground);background:var(--ylw)}
.vs{display:flex;align-items:center;gap:0;margin:8px 0 24px}
.vs i{display:block;width:38px;height:38px;border:4px solid var(--ink)}
.vs i:first-child{background:var(--red)}.vs i:last-child{background:var(--blue)}
.vs b{display:block;width:7px;height:56px;background:var(--text);transform:rotate(12deg);margin:0 10px}
@media (max-width:420px){body{font-size:16px}.tbl{font-size:14px}}