/* Oklahoma Sports & Fitness shared header — used by the main site and the event calendar.
   Colors: red RGB(165,30,35), dark gray RGB(70,70,70), light gray RGB(202,202,202) */
.oh-top,.oh-nav{font-family:"Barlow",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.5}
.oh-top *,.oh-top *::before,.oh-top *::after,.oh-nav *,.oh-nav *::before,.oh-nav *::after{box-sizing:border-box}
.oh-wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.oh-top :focus-visible,.oh-nav :focus-visible{outline:3px solid #f0b400;outline-offset:2px}

/* banner row: leaderboard + side banner, same proportions on every screen */
.oh-adbar{background:#cacaca;padding:10px 0}
/* full desktop (1160px inside the page): leaderboard exactly 728 x 100, side banner fills the rest (424 x 100) */
.oh-adgrid{display:grid;grid-template-columns:728fr 424fr;gap:8px}
.oh-ad{display:block;overflow:hidden;background:#bdbdbd;border-radius:6px}
/* both banners get their own fixed shape, so their heights always match (728:100 and 424:100 in a 728:424 split) */
.oh-leaderboard{aspect-ratio:728/100}.oh-adgrid .oh-side{aspect-ratio:424/100;height:auto}
.oh-adgrid{align-items:start}
.oh-ad img{display:block;width:100%;height:100%;object-fit:cover;max-width:none}
.oh-ad.oh-empty{background:transparent}

/* event calendar: two banners side by side (890 x 174 each) */
.oh-calads{background:#cacaca;padding:12px 0}
.oh-calgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.oh-calads .oh-ad{aspect-ratio:890/174}
@media (max-width:700px){.oh-calads{padding:8px 0}.oh-calgrid{grid-template-columns:1fr;gap:8px}.oh-calads .oh-wrap{padding:0 8px}}

/* logo + art + social */
.oh-masthead{background:#fff}
.oh-mast{display:flex;align-items:center;gap:28px;padding-top:20px;padding-bottom:20px}
.oh-logo{flex:0 0 auto;width:min(540px,45%);display:block}
.oh-logo img{display:block;width:100%;height:auto}
.oh-art{flex:1;min-width:0;aspect-ratio:4/1;border-radius:999px;overflow:hidden;background:#464646}
.oh-art img{display:block;width:100%;height:100%;object-fit:cover}
.oh-social{display:flex;gap:10px}
.oh-social a{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;color:#fff;transition:transform .15s}
.oh-social a:hover{transform:scale(1.08);color:#fff}
.oh-social svg{width:58%;height:58%}
.oh-fb{background:#1877f2}
.oh-ig{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.oh-social.oh-side{flex-direction:column;flex:none}
.oh-social.oh-inbar{display:none}

/* main menu */
.oh-nav{background:#464646;position:sticky;top:0;z-index:60;box-shadow:0 2px 0 #a51e23}
.oh-navbar{display:flex;align-items:center}
.oh-menu{list-style:none;margin:0;padding:0;display:flex;align-items:stretch;flex:1}
.oh-menu>li{position:relative;display:flex;margin:0}
.oh-menu>li>a,.oh-menu>li>button{font:700 1.12rem/1 Arial,"Helvetica Neue",Helvetica,sans-serif;letter-spacing:.01em;color:#fff;text-decoration:none;background:none;border:0;border-radius:0;padding:17px 18px 15px;margin:0;cursor:pointer;display:flex;align-items:center;gap:8px;border-bottom:4px solid transparent;width:auto;min-height:0;box-shadow:none}
.oh-menu>li>a:hover,.oh-menu>li>button:hover,.oh-menu>li.oh-open>button{background:rgba(255,255,255,.08);color:#fff}
.oh-menu>li>a[aria-current],.oh-menu>li.oh-on>button{border-bottom-color:#a51e23}
.oh-menu button svg{width:12px;height:8px;transition:transform .2s}
.oh-menu li.oh-open>button svg{transform:rotate(180deg)}
.oh-menu>li.oh-last{margin-left:auto}
.oh-menu>li>a.oh-subscribe{background:#a51e23;border-radius:999px;margin:8px 0;padding:10px 26px;border:0}
.oh-menu>li>a.oh-subscribe:hover{background:#7e161a}
.oh-sub{list-style:none;margin:0;padding:8px 0;position:absolute;top:100%;left:0;min-width:250px;background:#fff;border-top:4px solid #a51e23;box-shadow:0 18px 40px rgba(0,0,0,.22);display:none;border-radius:0 0 12px 12px;z-index:5}
.oh-hassub.oh-open .oh-sub{display:block}
@media (hover:hover) and (min-width:861px){.oh-hassub:hover .oh-sub,.oh-hassub:focus-within .oh-sub{display:block}}
.oh-sub li{margin:0}
.oh-sub a{display:block;padding:10px 20px;color:#1e1e1e;text-decoration:none;font:700 1rem/1.2 Arial,"Helvetica Neue",Helvetica,sans-serif}
.oh-sub a:hover,.oh-sub a[aria-current]{background:#f6e3e4;color:#7e161a}
.oh-menubtn{display:none}
/* tighter menu on narrower desktops so all six items fit on one line */
@media (min-width:861px) and (max-width:1120px){
  .oh-menu>li>a,.oh-menu>li>button{font-size:1rem;padding-left:11px;padding-right:11px;gap:6px}
  .oh-menu>li>a.oh-subscribe{padding:10px 18px}
}

@media (max-width:860px){
  .oh-menubtn{display:flex;align-items:center;gap:12px;background:none;border:0;color:#fff;font:700 1.15rem/1 Arial,"Helvetica Neue",Helvetica,sans-serif;padding:14px 0;cursor:pointer;width:auto;margin:0}
  .oh-bars{display:grid;gap:5px}.oh-bars i{display:block;width:28px;height:3px;border-radius:2px;background:#fff;transition:.2s}
  .oh-menubtn[aria-expanded="true"] .oh-bars i:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .oh-menubtn[aria-expanded="true"] .oh-bars i:nth-child(2){opacity:0}
  .oh-menubtn[aria-expanded="true"] .oh-bars i:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .oh-navbar{flex-wrap:wrap;justify-content:space-between}
  .oh-menu{display:none;flex-basis:100%;order:3;flex-direction:column;padding:4px 0 16px}
  .oh-menu.oh-open{display:flex}
  .oh-menu>li{flex-direction:column}
  .oh-menu>li>a,.oh-menu>li>button{padding:14px 4px;border-bottom:1px solid rgba(255,255,255,.12);width:100%;justify-content:space-between}
  .oh-menu>li>a[aria-current],.oh-menu>li.oh-on>button{border-bottom-color:rgba(255,255,255,.12);box-shadow:inset 4px 0 0 #a51e23;padding-left:14px}
  .oh-menu>li.oh-last{margin-left:0}
  .oh-menu>li>a.oh-subscribe{justify-content:center;margin:16px 0 0;padding:14px}
  .oh-sub{position:static;box-shadow:none;border:0;border-radius:12px;background:rgba(255,255,255,.07);margin:6px 0}
  .oh-sub a{color:#fff;padding:12px 18px}.oh-sub a:hover,.oh-sub a[aria-current]{background:rgba(255,255,255,.1);color:#fff}
  .oh-social.oh-side{display:none}
  .oh-social.oh-inbar{display:flex}.oh-social.oh-inbar a{width:40px;height:40px}
  .oh-mast{flex-direction:column;gap:14px;padding-top:16px;padding-bottom:16px}
  .oh-logo{width:min(520px,100%)}
  .oh-art{width:100%;flex:none}
}
@media (max-width:700px){
  .oh-adbar{padding:6px 0}.oh-adbar .oh-wrap{padding:0 8px}
  .oh-adgrid{gap:4px}.oh-ad{border-radius:3px}
}
@media (prefers-reduced-motion:reduce){.oh-top *,.oh-nav *{transition:none!important}}
@media print{.oh-top,.oh-nav{display:none}}