/* Site chrome, every page: the logo lockup and the hide-and-peek nav. */
.sx-lock{display:inline-flex;align-items:center;gap:9px;text-decoration:none;line-height:1}
.sx-lock img{height:28px;width:auto;display:block}
.sx-lock span{font:700 10px/1 Arial,Helvetica,sans-serif;letter-spacing:.42em;color:#fff;padding-top:2px}
.sx-lock:hover img{filter:drop-shadow(0 0 8px rgba(188,255,0,.45))}
.sx-flogo img{display:block;height:auto}
@media (max-width:600px){.sx-lock img{height:24px}.sx-lock span{font-size:9px}}

/* hide and peek: the bar slides away on the way down, back on the way up */
.navwrap{position:sticky!important;top:var(--wp-admin--admin-bar--height,0px);z-index:60}
.wp-site-blocks > header.wp-block-template-part,
.wp-site-blocks > .wp-block-template-part:has(> .sx-bar){position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:60;background:rgba(5,5,5,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.navwrap,.wp-site-blocks > header.wp-block-template-part,.wp-site-blocks > .wp-block-template-part:has(> .sx-bar){transition:transform .32s cubic-bezier(.2,.7,.2,1)}
html.nav-away .navwrap,html.nav-away .wp-site-blocks > header.wp-block-template-part,html.nav-away .wp-site-blocks > .wp-block-template-part:has(> .sx-bar){transform:translateY(calc(-100% - 2px))}
/* the trade-page jump chips ride just under the bar, and take the top when it hides */
.slp .slp-jump{top:var(--navh,0px);transition:top .32s cubic-bezier(.2,.7,.2,1)}
html.nav-away .slp .slp-jump{top:0}
@media (prefers-reduced-motion:reduce){.navwrap,.wp-site-blocks > header.wp-block-template-part,.slp .slp-jump{transition:none}}

/* ---------- the sideways timeline: scroll down, it moves left to right ---------- */
.hs{background:#050505;color:#ebebeb;position:relative;border-top:1px solid #1d1d1d;border-bottom:1px solid #1d1d1d}
.hs-pin{padding:clamp(40px,6vw,72px) 0 clamp(32px,5vw,56px);overflow:hidden}
.hs-head{width:100%;box-sizing:border-box;max-width:1180px;margin:0 auto;padding-inline:clamp(16px,5vw,56px);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 24px}
.hs-kick{font:700 12px/1 "Bricolage Grotesque",system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#bcff00;margin:0}
.hs-h{font-family:"Anybody","Bricolage Grotesque",sans-serif;font-weight:900;font-stretch:70%;text-transform:uppercase;font-size:clamp(32px,5vw,64px);line-height:.92;margin:10px 0 0;color:#fff}
.hs-hint{font-size:13px;color:#8f8f8f;margin:0;display:flex;align-items:center;gap:8px}
.hs-hint b{color:#bcff00;font-weight:700}
.hs-view{margin-top:clamp(24px,4vw,40px);overflow-x:auto;scrollbar-width:none;padding-inline:clamp(16px,5vw,56px)}
.hs-view::-webkit-scrollbar{display:none}
.hs-track{list-style:none;margin:0;padding:0;display:flex;gap:clamp(14px,2vw,22px);width:max-content;will-change:transform}
.hs-step{width:min(78vw,400px);flex:none;border:1px solid #262626;background:#0d0d0d;padding:clamp(20px,2.4vw,28px);position:relative;display:flex;flex-direction:column;gap:10px;min-height:260px}
.hs-step::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--c,#bcff00)}
.hs-n{font-family:"Anybody",sans-serif;font-weight:900;font-stretch:62%;font-size:clamp(64px,8vw,96px);line-height:.8;color:transparent;-webkit-text-stroke:1.5px var(--c,#bcff00)}
.hs-step h3{font-family:"Anybody","Bricolage Grotesque",sans-serif;font-weight:900;font-stretch:72%;text-transform:uppercase;font-size:clamp(22px,2.4vw,28px);line-height:1;margin:6px 0 0;color:#fff}
.hs-step p{margin:0;color:#bdbdc4;font-size:15.5px;line-height:1.55}
.hs-step.end{background:#bcff00;border-color:#bcff00;color:#050505;justify-content:center}
.hs-step.end h3,.hs-step.end p{color:#050505}
.hs-step.end a{align-self:flex-start;margin-top:8px;background:#050505;color:#bcff00;font:700 13px/1 "Bricolage Grotesque",sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:14px 18px;text-decoration:none}
.hs-bar{width:100%;box-sizing:border-box;max-width:1180px;margin:clamp(22px,3vw,34px) auto 0;padding-inline:clamp(16px,5vw,56px)}
.hs-bar span{display:block;height:3px;background:#1f1f1f;position:relative}
.hs-bar i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#bcff00,#ff0acd)}
/* pinned mode, switched on by chrome.js when there is room to travel */
.hs.hs-on .hs-pin{position:sticky;top:0;min-height:100vh;display:flex;flex-direction:column;justify-content:center}
.hs.hs-on .hs-view{overflow:visible}
@media (prefers-reduced-motion:reduce){.hs.hs-on .hs-pin{position:static;min-height:0}}

/* trade icons on the "Written for your trade" links */
.sp-r.has-ic{display:flex;align-items:center;gap:12px}
.sp-r.has-ic b{flex:1}
.sp-r .slp-ic{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:#050505;color:var(--c,#bcff00);flex:none}
.sp-r .slp-ic svg{width:18px;height:18px;display:block;filter:drop-shadow(0 0 2px var(--c,#bcff00))}

/* homepage "split second" deck: pins while you scroll, one card per scroll chunk */
#problem.deck-pin{padding-top:0!important;padding-bottom:0!important;position:relative}
#problem.deck-pin .deck-wrap{position:sticky;top:0;min-height:100vh;align-content:center;align-items:center}
#problem.deck-pin .deck-ui{flex-wrap:wrap}
#problem.deck-pin .deck-ui::after{content:"Keep scrolling";flex-basis:100%;margin:4px 0 0;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#8f8f8f}
#problem.deck-compact .deck-copy .lede{display:none}
#problem.deck-compact .deck{height:min(420px,56vh)}
#problem.deck-compact .deck-wrap{gap:18px}
/* WordPress wraps the two arrows in a <p> with a <br>; keep them side by side */
.deck-ui>p{display:flex;gap:10px;margin:0}
.deck-ui br{display:none}

/* ---------- v1.2.9: hard edges on every button (4px max) ---------- */
.btn,.audit-float,.call-float,.sp-close,.deck-arrow,.pp-close,.wp-close,.ar-lb-nav,.ar-sk-b,.ar-lb-x,.ar-sk-x,
.burger,.menu-x,.menu-list a,.flip-cta,.ix-cta,.sx-search .wp-block-search__button,.sx-search .wp-block-search__inside-wrapper,
.slp .slp-jump a,.slp .slp-dots-tabs button,.slp .slp-btn,.vs-mute,.mf .pk,.mf .mute,.mf .rb-tabs button,.mf .btn,.hs-step.end a{border-radius:4px!important}

/* service page buttons: one big primary, two compact secondaries on phones */
.cs-cta .sm{display:none}
@media (max-width:600px){
  .cs-cta{display:grid!important;grid-template-columns:1fr 1fr;gap:10px!important}
  .cs-cta .btn{width:100%;padding:15px 8px!important;font-size:11.5px!important;letter-spacing:.12em!important;white-space:nowrap}
  .cs-cta .btn:first-child{grid-column:1/-1;padding:19px 12px!important;font-size:13px!important}
  .cs-cta .lg{display:none}
  .cs-cta .sm{display:inline}
}

/* "Everything else I do" as icon cards */
.sp-rgrid.svp-svc{grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:10px}
.sp-r.svc-card{flex-direction:column;align-items:flex-start;gap:16px;padding:18px 16px;position:relative;min-height:128px}
.sp-r.svc-card .slp-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:6px;background:#050505;color:var(--c);box-shadow:inset 0 0 0 1px #222}
.sp-r.svc-card .slp-ic svg{width:24px;height:24px;display:block;filter:drop-shadow(0 0 4px var(--c))}
.sp-r.svc-card b{flex:none;font-size:15px;font-weight:700;margin-top:auto}
.sp-r.svc-card > i{position:absolute;top:16px;right:16px;color:var(--c);font-style:normal;transition:transform .25s}
.sp-r.svc-card:hover{box-shadow:inset 0 0 0 1px var(--c),0 22px 44px -26px var(--c);transform:translateY(-3px)}
.sp-r.svc-card:hover > i{transform:translateX(3px)}
@media (max-width:600px){.sp-rgrid.svp-svc{grid-template-columns:1fr 1fr}.sp-r.svc-card{min-height:118px;padding:16px 14px}.sp-r.svc-card b{font-size:14px}}

/* in-page "Run the free audit" buttons go purple, so they never blend into the lime floating audit button */
.btn.solid[data-audit]{background:#b026ff;border-color:#b026ff;color:#fff;box-shadow:0 0 0 0 rgba(188,255,0,0),0 10px 30px -12px rgba(176,38,255,.8);transition:color .3s,border-color .3s,transform .18s,box-shadow .3s}
.btn.solid[data-audit]::before{background:#bcff00}
.btn.solid[data-audit]:hover{color:#050505;border-color:#bcff00;box-shadow:0 0 22px rgba(188,255,0,.55)}
html.glow-off .glow{opacity:0!important}
/* v1.3.5: link tiles and service cards lift with a hard offset shadow in their own color, same as the trade finder */
.sp-r{border-radius:4px;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,background .2s}
.sp-r:hover,.sp-r:focus-visible{transform:translate(-3px,-3px);box-shadow:inset 0 0 0 2px var(--c,#bcff00),4px 4px 0 var(--c,#bcff00);outline:none}
.sp-r:hover i{transform:translateX(3px);color:var(--c,#bcff00)}
.sp-r .slp-ic{border-radius:4px!important;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.sp-r:hover .slp-ic{transform:rotate(-8deg) scale(1.1)}
.sp-r.svc-card .slp-ic{border-radius:4px}
.sp-r.svc-card:hover,.sp-r.svc-card:focus-visible{transform:translate(-4px,-4px);box-shadow:inset 0 0 0 2px var(--c),6px 6px 0 var(--c)}
.sp-r:active{transform:translate(0,0);box-shadow:inset 0 0 0 2px var(--c,#bcff00),2px 2px 0 var(--c,#bcff00)}
@media (prefers-reduced-motion:reduce){.sp-r,.sp-r .slp-ic{transition:none}}
.sp-rgrid .sp-r:hover,.sp-rgrid .sp-r:focus-visible{transform:translate(-3px,-3px);box-shadow:inset 0 0 0 2px var(--c,#bcff00),4px 4px 0 var(--c,#bcff00)}
.sp-rgrid .sp-r.svc-card:hover,.sp-rgrid .sp-r.svc-card:focus-visible{transform:translate(-4px,-4px);box-shadow:inset 0 0 0 2px var(--c),6px 6px 0 var(--c)}