/* Ablaze Systems site-wide header. ONE source of truth for logo + nav sizing.
   Injected into every page by scripts/apply_site_header.py. Edit here, not per page.
   Namespaced .sh-* so page-level CSS (nav{}, header{}, .logo{}) can't touch it. */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap');
.sh-bar{position:sticky;top:0;z-index:900;width:100%;background:rgba(11,10,9,.86);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);
  border-bottom:1px solid rgba(255,255,255,.08);font-family:'Space Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.sh-bar *{box-sizing:border-box}
.sh-in{max-width:1180px;margin:0 auto;padding:0 26px;height:76px;display:flex;align-items:center;gap:30px}
.sh-brand{display:flex;align-items:center;flex:none;line-height:0;text-decoration:none}
.sh-logo{height:64px!important;width:auto!important;max-width:none!important;display:block;margin:0!important;border:0!important;border-radius:0!important}
.sh-links{display:flex;align-items:center;gap:30px;margin-left:auto}
.sh-links a{color:#b9b2a9!important;font-size:15px;font-weight:500;text-decoration:none!important;transition:color .15s;white-space:nowrap}
.sh-links a:hover,.sh-links a.on{color:#f6f3ef!important}
.sh-cta{flex:none;background:#ff6a00;color:#0b0a09!important;font-size:15px;font-weight:600;line-height:1;
  padding:13px 20px;border-radius:10px;text-decoration:none!important;white-space:nowrap;transition:background .15s}
.sh-cta:hover{background:#ff9138}
.sh-menu{display:none;flex:none;background:none;border:0;color:#f6f3ef;font-size:26px;line-height:1;padding:6px;cursor:pointer}
@media(max-width:900px){
  .sh-in{height:68px;padding:0 16px;gap:12px}
  .sh-logo{height:52px!important}
  .sh-links{display:none;position:absolute;top:100%;left:0;right:0;margin:0;flex-direction:column;align-items:stretch;gap:0;
    background:rgba(11,10,9,.97);border-bottom:1px solid rgba(255,255,255,.08);padding:6px 0}
  .sh-links a{padding:14px 20px;font-size:17px}
  .sh-bar.sh-open .sh-links{display:flex}
  .sh-cta{margin-left:auto;font-size:14px;padding:11px 14px}
  .sh-menu{display:block}
}
@media(max-width:360px){.sh-logo{height:44px!important}.sh-cta{padding:10px 11px;font-size:13px}}
/* Scrollytelling stages pin at top:0 and would slide under the sticky header. Pin them below it. */
.edu-stage,.pile-sticky,.curve-sticky{top:76px!important}
.pile-sticky,.curve-sticky{height:calc(100vh - 76px)!important}
@media(min-width:901px){.edu-stage{height:calc(100vh - 76px)!important}}
@media(max-width:900px){.edu-stage,.pile-sticky,.curve-sticky{top:68px!important}.pile-sticky,.curve-sticky{height:calc(100vh - 68px)!important}}