/*
==========================================================================
SPROUT HEADER AND FOOTER · sprout-chrome.css
Loaded by inc/sprout-chrome.php only when the Sprout header is on.
Custom components (owner decision, 8 Nov 2026): header #sph (prefix sph-), footer #spf (prefix spf-).
Layout follows hosting.com: floating bar, panel joined to it, slide-across phone menu.
Selectors start with the element id so they beat sprout.css base rules and Ohio's element styles.
Dark mode: Ohio's own switch and Auto mode set body.dark-scheme; these styles follow it.
Mockup: dev/header-footer-mockup.html loads this same file.
==========================================================================
*/
#sph.sp{background:transparent}
#sph.sp,#spf.sp{overflow:visible}
#sph.sp{font-size:16px;line-height:1.5}
#sph ul,#sph li{list-style:none;margin:0;padding:0}
#sph li::marker{content:none}
/* While the Sprout header is on, hide Ohio's header parts (remove once Ohio's header is switched off in Theme Settings) */
body.sph-on #masthead,body.sph-on .subheader,body.sph-on .header-cap,body.sph-on .site-footer{display:none!important}
/* Ohio pulls Elementor pages 16px wider each side (.elementor margin: var(--clb-grid-gutter-negative)); stop the sideways scroll that causes */
html:has(body.sph-on),body.sph-on{overflow-x:clip}

/* ======================================================================
   TOKENS (header/footer; dark values apply only inside them for now)
   ====================================================================== */
:root{
  --sp-heading:var(--sp-purple-dark);
  --sp-raised:#ffffff;        /* header bar, cards */
  --sp-panel:#f4eff6;         /* open menu panel behind the cards */
  --sp-footer:var(--sp-purple-dark);
  --sp-hover:var(--sp-lilac);
  --sp-shadow-bar:0 8px 30px #3b1f4914;
  --sp-shadow-pop:0 30px 60px #3b1f4926;
  --sp-icon-bg:#f6f1f8;
}
body.dark-scheme :is(#sph,#spf){
  --sp-cream:#1b1220; --sp-lilac:#2a1e33; --sp-mist:#20162a; --sp-card:#241a2b;
  --sp-lime-tint:#25361c; --sp-mustard-tint:#3a2e12; --sp-pink-tint:#3d1d25;
  --sp-ink:#f4eef7; --sp-body:#ddd0e4; --sp-muted:#c4b5cd;
  --sp-line:#3f3148; --sp-line-soft:#382b41; --sp-line-strong:#5e4c6a;
  --sp-heading:#ffffff; --sp-raised:#271c30; --sp-panel:#1f1527; --sp-footer:#110a15; --sp-hover:#33253d;
  --sp-shadow-bar:0 8px 30px #00000059; --sp-shadow-pop:0 30px 60px #00000080; --sp-icon-bg:#33253d;
  color-scheme:dark;
}

/* ======================================================================
   SPROUT HEADER (custom component, moves into ohio-child)
   ====================================================================== */
#sph{position:sticky;top:12px;z-index:90;margin:12px 16px 0}
#sph .sph-box{position:relative;max-width:1400px;margin:0 auto;background:var(--sp-raised);border-radius:20px;box-shadow:var(--sp-shadow-bar);transition:border-radius .2s,background-color .35s}
#sph .sph-bar{display:flex;align-items:stretch;gap:24px;height:76px;padding:0 14px 0 26px}
#sph .sph-logo{display:flex;align-items:center;flex-shrink:0}
#sph .sph-logo img{height:44px;width:auto}
#sph .sph-logo-light{display:none}
body.dark-scheme #sph .sph-logo-dark{display:none}
body.dark-scheme #sph .sph-logo-light{display:block}

/* Desktop menu */
#sph .sph-nav{flex:1;display:flex;justify-content:center}
#sph .sph-scroll{display:flex}
#sph .sph-menu{display:flex;gap:2px;height:100%}
#sph .sph-item{position:static;display:flex;align-items:stretch}
#sph .sph-top{position:relative;display:flex;align-items:center;gap:7px;padding:0 15px;color:var(--sp-heading);font:700 16px/1.2 Arial,sans-serif;text-decoration:none;white-space:nowrap;cursor:pointer;isolation:isolate}
#sph .sph-top::before{content:"";position:absolute;inset:14px 0 0;z-index:-1;border-radius:12px 12px 0 0;background:var(--sp-panel);opacity:0;transition:opacity .2s}
#sph .sph-top>span{position:relative}
#sph .sph-top:hover>span{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px;text-decoration-color:var(--sp-lime)}
#sph .sph-item.is-open>.sph-top::before{opacity:1}
#sph .sph-chev{display:grid;width:12px;height:12px;transition:transform .35s var(--sp-ease)}
#sph .sph-chev svg{width:12px;height:12px}
#sph .sph-item.is-open .sph-chev{transform:rotate(180deg)}
#sph .sph-count{display:none}

/* Panel joined to the bar */
#sph .sph-box.has-open{border-radius:20px 20px 0 0}
#sph .sph-panel{position:absolute;left:0;right:0;top:100%;display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr)) minmax(0,1.05fr);gap:16px 18px;align-items:start;padding:22px 26px 28px;background:var(--sp-panel);border-radius:0 0 20px 20px;box-shadow:var(--sp-shadow-pop);
  visibility:hidden;clip-path:inset(0 -80px 100% -80px);transition:clip-path .35s var(--sp-ease),visibility 0s linear .35s}
#sph .sph-item.is-open>.sph-panel{visibility:visible;clip-path:inset(0 -80px -80px -80px);transition:clip-path .35s var(--sp-ease),visibility 0s}
#sph .sph-panel>.sph-col{min-width:0}
#sph .sph-panel>.sph-col.is-span-2{grid-column:span 2}
#sph .sph-col-title{display:block;margin:0 0 12px;color:var(--sp-heading);font:700 15px/1.3 Arial,sans-serif;text-decoration:none;pointer-events:none}
#sph .sph-list{display:grid;gap:10px;grid-auto-rows:1fr}
/* Item cards */
#sph .sph-list .sph-link{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) 18px;gap:14px;align-items:center;padding:14px 16px;border-radius:12px;background:var(--sp-raised);color:var(--sp-heading);text-decoration:none;transition:background-color .2s,transform .25s var(--sp-ease)}
#sph .sph-list .sph-link>span{font:500 16px/1.3 var(--sp-font-title)}
#sph .sph-desc{display:block;margin-top:3px;font:400 14px/1.45 Arial,sans-serif;color:var(--sp-muted)}
#sph .sph-list .sph-link::before{content:"";width:40px;height:40px}
#sph .sph-list .sph-link::after{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:var(--ic-arrow) center/18px no-repeat;mask:var(--ic-arrow) center/18px no-repeat;transition:transform .25s var(--sp-ease)}
@media (hover:hover){
  #sph .sph-list .sph-link:hover{transform:translateY(-1px);box-shadow:0 8px 20px #3b1f4912}
  #sph .sph-list .sph-link:hover::after{transform:translateX(3px)}
}
/* Icon drawn inside the square, from the item's CSS class */
#sph .sph-list li[class*="sp-ic-"]>.sph-link::before{background:var(--sp-purple);-webkit-mask:var(--ic) center/22px no-repeat;mask:var(--ic) center/22px no-repeat}
#sph .sp-track-spark>.sph-link::before{background:#4d8f2a!important}
body.dark-scheme #sph .sph-list li[class*="sp-ic-"]>.sph-link::before{background:#d9b8e8}
body.dark-scheme #sph .sp-track-spark>.sph-link::before{background:var(--sp-lime)!important}
#sph .sp-track-adult>.sph-link::before{background:#8a5d00!important}
body.dark-scheme #sph .sp-track-adult>.sph-link::before{background:var(--sp-mustard)!important}
/* Icon square backgrounds (a wrapper box behind the mask) */
#sph .sph-list .sph-link{isolation:isolate}
#sph .sph-list .sph-link>i.sp-ic-box{position:absolute;left:16px;top:50%;width:40px;height:40px;margin-top:-20px;border-radius:10px;background:var(--sp-icon-bg);border:1px solid var(--sp-line-soft);z-index:-1}
#sph .sp-tag{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:var(--sp-lime-tint);color:var(--sp-lime-dark);font:700 12px/1.4 Arial,sans-serif;vertical-align:2px}
body.dark-scheme #sph .sp-tag{color:var(--sp-lime)}
/* Promo card (second-level item with class sph-promo) */
#sph .sph-promo{position:relative;display:flex;flex-direction:column;align-self:stretch;min-height:250px;border-radius:14px;overflow:hidden;background:var(--sp-purple-dark);color:#fff}
#sph .sph-promo::before{content:"";flex:1;min-height:120px;background:radial-gradient(circle at 78% 30%,#fec12466 0 18%,transparent 19%),radial-gradient(circle at 30% 80%,#70bf4459 0 22%,transparent 23%),radial-gradient(circle at 12% 18%,#ee4a6247 0 12%,transparent 13%),linear-gradient(135deg,#603075,#3b1f49)}
#sph .sph-promo>.sph-link{position:static;display:block;margin:0!important;padding:18px 54px 0 20px;color:#fff!important;font:700 16px/1.3 Arial,sans-serif!important;pointer-events:auto!important;text-decoration:none}
#sph .sph-promo>.sph-link::after{content:"";position:absolute;inset:0}
#sph .sph-promo .sph-promo-text{margin:4px 0 0;padding:0 54px 18px 20px;font-size:15px;line-height:1.5;color:var(--sp-on-dark-body)}
#sph .sph-promo .sph-promo-arrow{position:absolute;right:18px;bottom:22px;width:22px;height:22px;background:#fff;-webkit-mask:var(--ic-arrow) center/22px no-repeat;mask:var(--ic-arrow) center/22px no-repeat;transition:transform .25s var(--sp-ease)}
@media (hover:hover){ #sph .sph-promo:hover .sph-promo-arrow{transform:translateX(4px)} }
#sph .sph-promo.is-wa{background:#0f5132}
#sph .sph-promo.is-wa::before{background:radial-gradient(circle at 75% 35%,#ffffff2e 0 20%,transparent 21%),radial-gradient(circle at 25% 75%,#70bf4466 0 24%,transparent 25%),linear-gradient(135deg,#1d9b4f,#0f5132)}
/* Items come in one after another */
#sph .sph-item.is-open .sph-panel>li{animation:sp-in .45s var(--sp-ease) both;animation-delay:calc(var(--i,0) * 60ms + 40ms)}

/* Right side: Sign in, Find a class, menu button */
#sph .sph-end{display:flex;align-items:center;gap:10px;flex-shrink:0}
#sph .sph-icon-btn{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--sp-line);border-radius:12px;background:var(--sp-raised);color:var(--sp-heading);cursor:pointer;text-decoration:none}
#sph .sph-icon-btn svg{width:22px;height:22px}
#sph .sph-signin{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;font-weight:700;font-size:15px;color:var(--sp-heading);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--sp-line-strong)}
#sph .sph-cta{display:inline-flex;align-items:center;min-height:46px;padding:0 20px;border-radius:10px;background:var(--sp-lime);color:var(--sp-purple-dark)!important;font-weight:700;font-size:15px;text-decoration:none;transition:background-color .25s}
#sph .sph-cta:hover{background:#5fa838}
#sph .sph-burger{display:none;background:var(--sp-purple-dark);border-color:var(--sp-purple-dark);color:#fff}
#sph .sph-intro,#sph .sph-foot,#sph .sph-back{display:none}

/* ======================================================================
   Phones and tablets (up to 1240px)
   ====================================================================== */
@media (max-width:1360px){ #sph .sph-top{padding:0 10px} #sph .sph-bar{gap:16px} #sph .sph-end{gap:8px} }
@media (max-width:1240px){
  #sph{margin:10px 12px 0;top:10px}
  #sph .sph-bar{height:64px;gap:10px;padding:0 10px 0 18px}
  #sph .sph-logo{margin-right:auto}
  #sph .sph-logo img{height:36px}
  #sph .sph-signin{display:none}
  #sph .sph-cta{min-height:44px;padding:0 14px;font-size:14px}
  #sph .sph-burger{display:grid}
  #sph .sph-nav{position:fixed;left:0;right:0;top:86px;bottom:0;z-index:95;display:flex;flex-direction:column;background:var(--sp-cream);
    visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .35s var(--sp-ease),visibility 0s linear .35s}
  body.sph-open #sph .sph-nav{visibility:visible;clip-path:inset(0);transition:clip-path .35s var(--sp-ease),visibility 0s}
  body.sph-open{overflow:hidden}
  body.sph-open #sph .sph-cta{display:none}
  /* Fill the gap above the open menu so the page does not show between the bar and the menu */
  body.sph-open #sph::before{content:"";position:fixed;left:0;right:0;top:0;height:86px;background:var(--sp-cream);z-index:-1}
  #sph .sph-scroll{position:relative;flex:1;display:block;overflow-x:clip;overflow-y:auto;padding:0 22px 24px}
  #sph .sph-intro{display:block;margin:14px 0 6px;max-width:30ch;color:var(--sp-muted);font-size:15px;line-height:1.5}
  #sph .sph-menu{display:block;height:auto;transition:transform .35s var(--sp-ease),opacity .2s}
  #sph .sph-scroll.is-deep .sph-menu>li>.sph-top{visibility:hidden}
  #sph .sph-scroll.is-deep .sph-intro{visibility:hidden}
  #sph .sph-item{display:block}
  #sph .sph-top{min-height:58px;padding:0;border-bottom:1px solid var(--sp-line);font:700 18px/1.2 Arial,sans-serif}
  #sph .sph-top::before{display:none}
  #sph .sph-top:hover>span{text-decoration:none}
  #sph .sph-count{display:inline;margin-left:6px;color:var(--sp-muted);font-weight:400}
  #sph .sph-chev-wrap,#sph .sph-top::after{margin-left:auto}
  #sph .sph-top::after{content:"";width:16px;height:16px;background:var(--sp-muted);-webkit-mask:var(--ic-chev) center/16px no-repeat;mask:var(--ic-chev) center/16px no-repeat}
  #sph .sph-chev{display:none}
  /* Groups slide across */
  #sph .sph-panel{position:absolute;left:0;right:0;top:0;min-height:100%;display:block;padding:8px 22px 24px;background:var(--sp-cream);border-radius:0;box-shadow:none;clip-path:none;transform:translateX(100%);transition:transform .35s var(--sp-ease),visibility 0s linear .35s}
  #sph .sph-item.is-open>.sph-panel{transform:none;clip-path:none;transition:transform .35s var(--sp-ease),visibility 0s}
  #sph .sph-back{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;margin:0 0 6px;padding:0;border:0;background:none;color:var(--sp-heading);font:700 17px/1.2 Arial,sans-serif;cursor:pointer}
  #sph .sph-back::before{content:"";width:16px;height:16px;background:currentColor;-webkit-mask:var(--ic-chev) center/16px no-repeat;mask:var(--ic-chev) center/16px no-repeat;transform:rotate(180deg)}
  #sph .sph-panel>.sph-col{margin-bottom:20px}
  #sph .sph-col-title{margin:0 0 8px;color:var(--sp-muted);font-weight:400;font-size:15px}
  #sph .sph-list{display:block;padding:4px 16px;border-radius:12px;background:var(--sp-panel)}
  #sph .sph-list .sph-link{grid-template-columns:minmax(0,1fr) 16px;gap:10px;padding:13px 0;border-radius:0;background:none;border-bottom:1px solid var(--sp-line-soft);box-shadow:none!important;transform:none!important}
  #sph .sph-list li:last-child>.sph-link{border-bottom:0!important}
  #sph .sph-list .sph-link::before,#sph i.sp-ic-box{display:none}
  #sph .sph-list .sph-link::after{-webkit-mask-image:var(--ic-chev);mask-image:var(--ic-chev);width:16px;height:16px;-webkit-mask-size:16px;mask-size:16px;background:var(--sp-muted)}
  #sph .sph-list .sph-link>span{font:700 16px/1.3 Arial,sans-serif}
  #sph .sph-desc{font-size:14px}
  #sph .sph-promo{display:none}
  #sph .sph-item.is-open .sph-panel>li{animation-name:sp-in}
  /* Next step pinned at the bottom */
  #sph .sph-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 22px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--sp-line);background:var(--sp-mint)}
  body.dark-scheme #sph .sph-foot{background:var(--sp-mist)}
  #sph .sph-foot .sp-btn{min-height:50px;padding:10px 12px;font-size:15px;width:100%}
  #sph .sph-foot .sph-call{grid-column:1/-1;justify-self:center;font-size:14px;color:var(--sp-body)}
  #sph .sph-foot .sph-call a{font-weight:700;color:var(--sp-heading)}
}
@media (max-width:400px){ #sph .sph-cta{padding:0 10px} #sph .sph-bar{padding-left:14px} }

@media (prefers-reduced-motion:reduce){
  #sph *,#sph *::before,#sph *::after{animation:none!important;transition:none!important}
}

/* Icons (stroke icons drawn with CSS masks; no uploads) */
:root{
  --ic-arrow:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M4 12h15M13 6l6 6-6 6'/></svg>");
  --ic-chev:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 5l7 7-7 7'/></svg>");
}
.sp-ic-mic>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><rect x='9' y='3' width='6' height='11' rx='3'/><path d='M5 11a7 7 0 0 0 14 0M12 18v3'/></svg>")}
.sp-ic-sun>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='12' cy='12' r='4'/><path d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/></svg>")}
.sp-ic-user>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='12' cy='8' r='4'/><path d='M4 21a8 8 0 0 1 16 0'/></svg>")}
.sp-ic-globe>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'><circle cx='12' cy='12' r='9'/><path d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/></svg>")}
.sp-ic-trophy>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M8 21h8M12 16v5M7 4h10v5a5 5 0 0 1-10 0zM7 6H4a3 3 0 0 0 3 4M17 6h3a3 3 0 0 1-3 4'/></svg>")}
.sp-ic-grid>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'><rect x='3' y='3' width='7' height='7' rx='1.5'/><rect x='14' y='3' width='7' height='7' rx='1.5'/><rect x='3' y='14' width='7' height='7' rx='1.5'/><rect x='14' y='14' width='7' height='7' rx='1.5'/></svg>")}
.sp-ic-star>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'><path d='M12 3l2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9z'/></svg>")}
.sp-ic-flag>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M5 21V4h11l-2 4 2 4H5'/></svg>")}
.sp-ic-people>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='9' cy='8' r='3.5'/><path d='M2 20a7 7 0 0 1 14 0M16 4.5a3.5 3.5 0 0 1 0 7M18 14a6 6 0 0 1 4 6'/></svg>")}
.sp-ic-app>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><rect x='6' y='2' width='12' height='20' rx='2.5'/><path d='M11 18h2'/></svg>")}
.sp-ic-book>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'><path d='M3 5h6a3 3 0 0 1 3 3v12a2 2 0 0 0-2-2H3zM21 5h-6a3 3 0 0 0-3 3v12a2 2 0 0 1 2-2h7z'/></svg>")}
.sp-ic-chart>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><path d='M4 20V11M10 20V5M16 20v-6M2 20h20'/></svg>")}
.sp-ic-pin>a{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'><path d='M12 21s-7-6.3-7-12a7 7 0 0 1 14 0c0 5.7-7 12-7 12z'/><circle cx='12' cy='9' r='2.5'/></svg>")}

/* ======================================================================
   SPROUT FOOTER (custom component, moves into ohio-child; Ohio footer switched off)
   ====================================================================== */
#spf{margin:0 16px 16px;border-radius:24px;background:var(--sp-footer);color:var(--sp-on-dark-body);transition:background-color .35s}
#spf .sp-wrap{padding:0 clamp(20px,4vw,48px)}
#spf .spf-ask{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 32px;padding:40px 0;border-bottom:1px solid #ffffff1f}
#spf .spf-ask p{margin:0;font:500 clamp(22px,2.4vw,30px)/1.3 var(--sp-font-title);color:#fff;max-width:24ch}
#spf .spf-ask .sp-actions{margin:0}
#spf .spf-ask .sp-btn-ghost{color:#fff;border-color:#ffffff59}
#spf .spf-cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:40px;padding:44px 0 36px}
#spf h2{margin:0 0 14px;font:500 18px/1.3 var(--sp-font-title);letter-spacing:0;color:#fff}
#spf ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
#spf li a{display:inline-flex;min-height:36px;align-items:center;font-size:15px;color:var(--sp-on-dark-body);text-decoration:none}
#spf li a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
#spf .spf-brand img{height:46px;width:auto}
#spf .spf-brand p{margin:14px 0 18px;font-size:15px;line-height:1.6;max-width:34ch}
#spf .spf-contact{display:grid;gap:6px;font-size:15px}
#spf .spf-contact a{font-weight:700;text-decoration:none;color:#fff}
#spf .spf-venue{margin:0 0 14px;font-size:15px;line-height:1.55}
#spf .spf-venue b{display:block;color:#fff}
#spf .spf-social{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
#spf .spf-social a{display:inline-flex;align-items:center;min-height:36px;padding:6px 12px;border:1px solid #ffffff38;border-radius:999px;font-size:13px;font-weight:700;text-decoration:none;color:#fff}
#spf .spf-social a:hover{background:#ffffff14}
#spf .spf-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;padding:20px 0 26px;border-top:1px solid #ffffff1f;font-size:14px;color:var(--sp-on-dark-muted)}
#spf .spf-bottom nav{display:flex;flex-wrap:wrap;gap:6px 20px}
#spf .spf-bottom a{color:var(--sp-on-dark-body)}
@media (max-width:900px){ #spf .spf-cols{grid-template-columns:1fr 1fr;gap:32px} #spf .spf-brand{grid-column:1/-1} }
@media (max-width:560px){ #spf{margin:0 10px 10px} #spf .spf-cols{grid-template-columns:1fr} #spf .spf-ask .sp-actions,#spf .spf-ask .sp-btn{width:100%} }



/* Menu button stays clear on the dark bar */
body.dark-scheme #sph .sph-burger{background:#fff;border-color:#fff;color:var(--sp-purple-dark)}

/* ---------- Floating header (owner, 8 Nov 2026) ----------
   On pages that start with a known hero, the header floats over it: the header gives back its own height
   (negative bottom margin) and the hero gets a transparent top border of the same height, so the hero's
   own background shows behind the bar. Known heroes: Ohio's page title block, the first section of a
   .sp or .sprout-page widget, and a registration plugin's first section. Any other page keeps the header
   in its own band, so nothing can end up hidden under it. */
body.sph-on{--sph-h:88px}
@media (max-width:1240px){ body.sph-on{--sph-h:74px} }
body.sph-on:has(#content>.page-headline:first-child,#content>.elementor>.e-con:first-child>.elementor-widget:first-child>.elementor-widget-container>:is(.sp,.sprout-page)>section:first-of-type,#content>.elementor>.e-con:first-child>.elementor-widget:first-child>.elementor-widget-container>.elementor-shortcode>[id^="sprout-"]>section:first-of-type) #sph{margin-bottom:calc(-1 * var(--sph-h))}
body.sph-on :is(#content>.page-headline:first-child,#content>.elementor>.e-con:first-child>.elementor-widget:first-child>.elementor-widget-container>:is(.sp,.sprout-page)>section:first-of-type,#content>.elementor>.e-con:first-child>.elementor-widget:first-child>.elementor-widget-container>.elementor-shortcode>[id^="sprout-"]>section:first-of-type){border-top:var(--sph-h) solid transparent!important;background-origin:border-box!important}
