/* Sticky promo bar above the header (inc/promo-bar.php). body.has-oa-bar pushes the
   fixed nav, mobile menu and sticky offsets down by --oa-bar. Selectors carry html/body
   so they win over Elementor + Hello CSS, which load after ours on prod. */
body.has-oa-bar{--oa-bar:44px}
@media (max-width:560px){body.has-oa-bar{--oa-bar:50px}}

.oa-bar{position:fixed;top:0;left:0;right:0;z-index:101;box-sizing:content-box;height:var(--oa-bar);padding:env(safe-area-inset-top,0px) 12px 0;display:flex;align-items:center;justify-content:center;gap:18px;background:var(--ink);color:var(--paper);font:500 13px/1.25 var(--body)}
html .oa-bar p.oa-bar-msg{margin:0;padding:0;display:flex;align-items:baseline;gap:12px;min-width:0;white-space:nowrap;color:inherit;font:inherit}
.oa-bar-msg b{font-weight:800;letter-spacing:.02em;color:#fff}
.oa-bar-msg .oa-bar-s{display:none}
.oa-bar-dates{color:var(--sun);font-weight:700}
.oa-bar-detail{color:rgba(251,247,239,.78)}
.oa-bar-dates::before,.oa-bar-detail::before{content:"·";margin-right:12px;color:rgba(251,247,239,.4);font-weight:400}
html .oa-bar a.oa-bar-cta{flex:none;display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:var(--sun);color:var(--ink);font:800 11.5px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:background .25s,color .25s}
html .oa-bar a.oa-bar-cta:hover,html .oa-bar a.oa-bar-cta:focus-visible{background:#fff;color:var(--ink)}
.oa-bar-cta .arr{width:12px;height:12px}
html .oa-bar button.oa-bar-x{position:absolute;right:max(8px,calc(var(--gutter) - 14px));bottom:calc((var(--oa-bar) - 32px) / 2);width:32px;height:32px;padding:0;margin:0;display:grid;place-items:center;border:0;border-radius:50%;background:none;color:rgba(251,247,239,.7);cursor:pointer;box-shadow:none}
html .oa-bar button.oa-bar-x:hover,html .oa-bar button.oa-bar-x:focus-visible{color:#fff;background:rgba(255,255,255,.1)}
.oa-bar a:focus-visible,.oa-bar button:focus-visible{outline:2px solid var(--sun);outline-offset:2px}

@media (max-width:1100px){.oa-bar-detail{display:none}}
@media (max-width:560px){
  .oa-bar{justify-content:flex-start;gap:10px;padding-right:44px}
  html .oa-bar p.oa-bar-msg{flex-direction:column;align-items:flex-start;gap:1px;flex:1}
  .oa-bar-dates{font-size:12px}
  .oa-bar-dates::before{content:none}
  html .oa-bar a.oa-bar-cta{padding:8px 13px;font-size:11px;letter-spacing:.1em}
  .oa-bar-cta .arr{display:none}
  html .oa-bar button.oa-bar-x{right:6px}
}
@media (max-width:400px){.oa-bar-msg .oa-bar-t{display:none}.oa-bar-msg .oa-bar-s{display:inline}}

/* Everything that sits under the fixed header moves down with it. */
html body.has-oa-bar .nav{top:calc(var(--oa-bar) + env(safe-area-inset-top,0px));padding-top:0}
html body.has-oa-bar .oa-mm{padding-top:calc(110px + var(--oa-bar))}
html body.has-oa-bar .ev-media{top:calc(110px + var(--oa-bar))}
html body.has-oa-bar .gfeat{scroll-margin-top:calc(110px + var(--oa-bar))}
html body.has-oa-bar.oa-legacy main.site-main{padding-top:calc(124px + var(--oa-bar))}
html body.has-oa-bar.oa-legacy:not(.elementor-page) main.site-main{padding-top:calc(140px + var(--oa-bar))}
html body.admin-bar .oa-bar{top:32px}
html body.admin-bar.has-oa-bar .nav{top:calc(32px + var(--oa-bar))}
@media (max-width:782px){
  html body.admin-bar .oa-bar{top:46px}
  html body.admin-bar.has-oa-bar .nav{top:calc(46px + var(--oa-bar))}
}
@media print{.oa-bar{display:none}}
