/* SR1 Racing — modern skin (loads after styles.css). Remove the to revert. */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,600;0,800;1,700;1,800;1,900&family=Barlow:wght@400;500;600;700&display=swap');
:root{--red:#e10600;--red2:#ff2a1f;--bg:#0b0b0c;--panel:#141416;--panel2:#1b1b1e;--line:#2a2a2f;--txt:#ececec;--mute:#9a9aa2;--gold:#ffc83d}
html{scroll-behavior:smooth}
body{margin:0!important;background:var(--bg)!important;color:var(--txt);font-family:'Barlow',system-ui,sans-serif;
background-image:radial-gradient(1200px 500px at 50% -200px,rgba(225,6,0,.18),transparent 70%),
repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 2px,transparent 2px 8px)!important;background-attachment:fixed!important}
a:link,a:visited{color:#fff}
a:hover{color:var(--red2);text-decoration:none!important}
/* ---------- header / nav ---------- */
header{position:sticky!important;top:0;z-index:50!important;border-radius:0!important;background:rgba(8,8,9,.86)!important;
backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:3px solid var(--red);
display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 28px;box-sizing:border-box;
box-shadow:0 10px 30px rgba(0,0,0,.55)}
header::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:var(--red)}
img.logo{width:auto!important;height:58px!important;padding:0!important;display:block;filter:drop-shadow(0 2px 8px rgba(225,6,0,.35))}
nav,nav.site-nav{padding:0!important;font-size:inherit!important;letter-spacing:0!important;display:block!important}
nav ul{background:transparent!important;overflow:visible!important;display:flex;flex-wrap:wrap;gap:2px;justify-content:flex-end}
nav li{float:none!important;position:relative}
nav li a,nav .dropbtn{font-family:'Barlow Condensed',sans-serif!important;font-style:italic;font-weight:800;font-size:19px;letter-spacing:1.5px;
text-transform:uppercase;padding:18px 14px!important;color:#fff!important;position:relative;background:transparent!important;transition:color .15s}
nav li a::after,nav .dropbtn::after{content:"";position:absolute;left:12px;right:12px;bottom:10px;height:3px;background:var(--red);
transform:skewX(-20deg) scaleX(0);transform-origin:left;transition:transform .2s ease}
nav li a:hover,nav .dropdown:hover .dropbtn{color:#fff!important;background:transparent!important}
nav li a:hover::after,nav .dropdown:hover .dropbtn::after{transform:skewX(-20deg) scaleX(1)}
nav .dropdown-content{background:#111114!important;border:1px solid var(--line);border-top:3px solid var(--red);border-radius:0 0 8px 8px;
min-width:230px!important;box-shadow:0 18px 40px rgba(0,0,0,.6)!important;padding:6px 0;right:0}
nav .dropdown-content a{color:#fff!important;font-size:16px;padding:11px 18px!important;text-align:left!important;display:block}
nav .dropdown-content a::after{display:none}
nav .dropdown-content a:hover{background:rgba(225,6,0,.15)!important;color:#fff!important;padding-left:24px!important}
/* ---------- typography ---------- */
h1,h2,h3{font-family:'Barlow Condensed',sans-serif!important;color:#fff!important;text-transform:uppercase}
h1{font-size:clamp(34px,5vw,56px)!important;font-style:italic;font-weight:900;letter-spacing:.5px;line-height:1;margin:28px 0 14px}
h1::before{content:"";display:inline-block;width:.42em;height:.75em;margin-right:.25em;background:var(--red);transform:skewX(-20deg);vertical-align:-.04em}
h2{font-size:clamp(26px,3.4vw,36px)!important;font-style:italic;font-weight:800;padding-left:14px!important;border-left:5px solid var(--red);
line-height:1.05;margin:34px 0 14px}
h3{font-weight:700;font-size:21px;letter-spacing:.4px}
p,li,td{font-family:'Barlow',sans-serif}
p{font-size:17px!important;line-height:1.65;padding-left:0!important;color:#dcdcdf}
main{display:block;padding:10px 0 60px}
.content{width:min(1100px,92%)!important;margin:0 auto}
/* ---------- buttons ---------- */
.btn,button.btn,a.btn,.button,input[type=submit]{display:inline-block;font-family:'Barlow Condensed',sans-serif!important;font-style:italic;font-weight:800;
text-transform:uppercase;letter-spacing:1.2px;font-size:17px!important;color:#fff!important;background:var(--red)!important;border:0!important;
padding:11px 26px!important;border-radius:3px!important;transform:skewX(-12deg);cursor:pointer;box-shadow:0 6px 18px rgba(225,6,0,.35);transition:all .15s}
.btn:hover,.button:hover,input[type=submit]:hover{background:var(--red2)!important;box-shadow:0 8px 26px rgba(225,6,0,.6);transform:skewX(-12deg) translateY(-1px)}
.btn.ghost{background:transparent!important;border:2px solid var(--red)!important;box-shadow:none}
/* ---------- tables ---------- */
table.st,.rules table,.schedule-table{border-collapse:separate!important;border-spacing:0;width:100%;background:var(--panel);border:1px solid var(--line);
border-radius:10px;overflow:hidden;font-size:15px}
table.st th,.rules th{background:linear-gradient(90deg,#b80500,var(--red))!important;color:#fff!important;font-family:'Barlow Condensed',sans-serif;
font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:15px;padding:10px 12px!important;border:0!important}
table.st td,.rules td{border:0!important;border-bottom:1px solid var(--line)!important;padding:9px 12px!important;color:var(--txt)}
table.st tr:nth-child(even) td{background:rgba(255,255,255,.025)!important}
table.st tr:hover td{background:rgba(225,6,0,.08)!important}
/* ---------- cards / my pages ---------- */
.wrap,.rules{max-width:1100px!important;width:92%;margin:0 auto}
.card{background:var(--panel)!important;border:1px solid var(--line)!important;border-left:4px solid var(--red)!important;border-radius:10px!important;
transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(0,0,0,.5),0 0 0 1px rgba(225,6,0,.35)}
.rules p{font-size:16px!important}
/* ---------- footer strip ---------- */
body::after{content:"SR1 RACING \2022 SPEC UTV SHORT COURSE";display:block;text-align:center;font-family:'Barlow Condensed',sans-serif;font-style:italic;
font-weight:800;letter-spacing:4px;color:#3a3a40;padding:26px 0 30px;border-top:1px solid #1d1d21;margin-top:30px}
/* ---------- mobile ---------- */
@media (max-width:900px){
header{flex-direction:column;padding:8px 10px 0}
img.logo{height:44px!important}
nav ul{flex-wrap:nowrap;overflow-x:auto!important;justify-content:flex-start;width:100vw;padding:0 8px;-webkit-overflow-scrolling:touch}
nav li a,nav .dropbtn{font-size:16px;padding:12px 10px!important;white-space:nowrap}
nav .dropdown-content{position:fixed!important;left:8px;right:8px;top:auto}
}
@media print{header,body::after{display:none}body{background:#fff!important}}
/* link lists / tables inside page content: readable hover */
main li a:hover, .content li a:hover, main td a:hover{color:#fff!important;background:var(--red)!important;text-decoration:none!important}
main ul li a, .content ul li a{transition:background .15s,color .15s}
/* ---------- mobile menu (sr1-nav.js) ---------- */
.navtoggle{display:none}
@media (max-width:900px){
header{flex-direction:row!important;flex-wrap:wrap;align-items:center;padding:8px 14px!important}
img.logo{height:40px!important}
.navtoggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:46px;height:42px;padding:0 10px;margin-left:auto;background:transparent;border:1px solid #3a3a40;border-radius:4px;cursor:pointer}
.navtoggle span{display:block;height:3px;background:#fff;border-radius:2px;transition:transform .2s,opacity .2s}
header.open .navtoggle span:nth-child(1){transform:translateY(8px) rotate(45deg)}
header.open .navtoggle span:nth-child(2){opacity:0}
header.open .navtoggle span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
header nav,header nav.site-nav{display:none!important;width:100%;order:3}
header.open nav,header.open nav.site-nav{display:block!important;max-height:calc(100vh - 70px);overflow-y:auto;padding:6px 0 12px!important}
header nav ul{flex-direction:column!important;flex-wrap:nowrap!important;overflow:visible!important;width:auto!important;padding:0!important;gap:0!important;margin:0!important}
header nav li{width:100%;border-bottom:1px solid #222}
header nav li a,header nav .dropbtn{display:block!important;font-size:20px!important;padding:12px 6px!important;text-align:left}
header nav li a::after,header nav .dropbtn::after{display:none!important}
header nav .dropdown-content{display:block!important;position:static!important;left:auto;right:auto;top:auto;min-width:0!important;background:transparent!important;box-shadow:none!important;border:0!important;padding:0 0 8px 14px!important}
header nav .dropdown-content a{font-size:16px!important;padding:8px 6px!important;color:#bbb!important;border:0!important}
header nav .dropbtn{color:#888!important;pointer-events:none}
}
/* ---------- mobile overflow fixes ---------- */
@media (max-width:900px){
html,body{overflow-x:hidden}
main img,main iframe,main video{max-width:100%!important}
main iframe{height:auto!important;aspect-ratio:16/9}
main table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
main table:has(iframe),main table:has(iframe) tbody,main table:has(iframe) tr,main table:has(iframe) td{display:block!important;width:100%!important;overflow:visible}
main table:has(iframe) td{padding:6px 0!important}
}
/* ---------- mobile overflow 2 (pages without ) ---------- */
@media (max-width:900px){
img,iframe,video{max-width:100%!important}
iframe{height:auto!important;aspect-ratio:16/9}
table[width],td[width],th[width]{width:auto!important}
table{max-width:100%}
table:has(iframe),table:has(iframe) tbody,table:has(iframe) tr,table:has(iframe) td{display:block!important;width:100%!important;max-width:100%!important;box-sizing:border-box}
table:has(iframe) blockquote{margin:0!important}
table:not(:has(iframe)){display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tiles table,.sr1-tiles table{display:table}
}