/* ============================================================
   RSP SHARED CHROME — canonical utility bar + nav + footer.
   Self-contained (literal RSP palette, no dependency on each
   page's :root). Scoped with .rspx- prefix so it never collides
   with a page's own .nav/.footer CSS. Injected by
   scripts/rsp_render_chrome.py between markers on every page.
   Fonts (Hanken Grotesk / JetBrains Mono) are already loaded per page.
   ============================================================ */
:root{
  --rspx-ink:#141413; --rspx-sub:#5e5d59; --rspx-mute:#8d8b83;
  --rspx-bg:#faf9f5; --rspx-panel:#fff; --rspx-line:#ece9e0; --rspx-border:#e3e0d6;
  --rspx-terra:#cd5e45; --rspx-terra-dark:#a8472f; --rspx-terra-soft:#f7e6df; --rspx-sage:#6b7a5b;
  --rspx-sans:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --rspx-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* The off-canvas mobile drawer is translated 100% off the right edge when closed;
   it must never create horizontal page scroll. `clip` (not `hidden`) kills the
   overflow WITHOUT turning html/body into a scroll container, so the sticky nav survives. */
html,body{overflow-x:clip}

/* ---- Utility bar ---- */
.rspx-bar{background:var(--rspx-ink);color:#fff;font-family:var(--rspx-sans)}
.rspx-bar-inner{max-width:1180px;margin:0 auto;padding:9px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:12.5px}
.rspx-bar-left{display:inline-flex;align-items:center;gap:18px;color:rgba(255,255,255,.66)}
.rspx-bar a{color:#fff;text-decoration:none}
.rspx-bar .rspx-bar-phone{font-family:var(--rspx-mono);letter-spacing:.02em;font-weight:600}
.rspx-bar .rspx-bar-cta{color:var(--rspx-terra-soft);font-weight:600}
@media(max-width:760px){.rspx-bar .rspx-bar-tag{display:none}}

/* ---- Nav ---- */
.rspx-nav{position:sticky;top:0;z-index:60;background:rgba(250,249,245,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--rspx-line);font-family:var(--rspx-sans)}
.rspx-nav-inner{max-width:1180px;margin:0 auto;padding:14px 28px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.rspx-logo{font-weight:700;font-size:18px;line-height:1;letter-spacing:-.02em;display:inline-flex;align-items:center;gap:10px;color:var(--rspx-ink);text-decoration:none}
.rspx-logo img{width:30px;height:30px;border-radius:8px;object-fit:contain;background:var(--rspx-panel);flex:0 0 30px}
.rspx-links{display:flex;align-items:center;gap:6px}
.rspx-links a{text-decoration:none}
.rspx-item{font-size:14.5px;font-weight:500;color:var(--rspx-sub);padding:8px 12px;border-radius:8px;transition:color .18s ease,background .18s ease;white-space:nowrap;background:none;border:none;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:5px}
.rspx-item:hover,.rspx-drop:hover .rspx-item,.rspx-drop:focus-within .rspx-item{color:var(--rspx-ink);background:var(--rspx-panel)}
.rspx-item .rspx-caret{width:9px;height:9px;transition:transform .2s ease}
.rspx-drop:hover .rspx-caret,.rspx-drop:focus-within .rspx-caret{transform:rotate(180deg)}
/* dropdown */
.rspx-drop{position:relative}
.rspx-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:280px;background:var(--rspx-panel);border:1px solid var(--rspx-border);border-radius:14px;box-shadow:0 24px 60px -30px rgba(20,20,19,.28);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:70}
.rspx-drop:hover .rspx-menu,.rspx-drop:focus-within .rspx-menu{opacity:1;visibility:visible;transform:translateY(0)}
.rspx-menu a{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:10px;color:var(--rspx-ink);font-size:14px;font-weight:600;transition:background .15s ease}
.rspx-menu a small{font-weight:400;font-size:12px;color:var(--rspx-mute)}
.rspx-menu a:hover{background:var(--rspx-bg)}
.rspx-menu a:hover small{color:var(--rspx-sub)}
.rspx-right{display:flex;align-items:center;gap:16px}
.rspx-phone{font-weight:600;font-size:14px;color:var(--rspx-ink);text-decoration:none;white-space:nowrap}
.rspx-phone::before{content:'';display:inline-block;width:6px;height:6px;background:var(--rspx-sage);border-radius:50%;margin-right:7px;vertical-align:2px;box-shadow:0 0 0 3px #eef0e7}
.rspx-cta{background:var(--rspx-ink);color:#fff;padding:10px 18px;border-radius:10px;font-size:14px;font-weight:600;text-decoration:none;box-shadow:0 1px 2px rgba(20,20,19,.16);transition:background .18s ease,box-shadow .18s ease;white-space:nowrap}
.rspx-cta:hover{background:var(--rspx-terra);box-shadow:0 6px 16px -6px rgba(205,94,69,.5)}
.rspx-burger{display:none;background:none;border:1px solid var(--rspx-border);border-radius:9px;width:42px;height:40px;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:4px}
.rspx-burger span{display:block;width:18px;height:2px;background:var(--rspx-ink);border-radius:2px;transition:transform .2s ease,opacity .2s ease}
.rspx-nav.rspx-open .rspx-burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.rspx-nav.rspx-open .rspx-burger span:nth-child(2){opacity:0}
.rspx-nav.rspx-open .rspx-burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media(max-width:940px){
  /* backdrop-filter makes .rspx-nav the containing block for the fixed drawer —
     that resolves the drawer's top/bottom/transform against the ~60px bar instead of
     the viewport (broken 108px box) AND pushes it into the page's horizontal overflow.
     Drop the filter on mobile so the drawer is a true full-height viewport slide-in. */
  .rspx-nav{backdrop-filter:none;-webkit-backdrop-filter:none}
  .rspx-burger{display:inline-flex}
  .rspx-links{position:fixed;top:0;right:0;bottom:0;width:min(86vw,360px);background:var(--rspx-panel);border-left:1px solid var(--rspx-border);flex-direction:column;align-items:stretch;gap:2px;padding:80px 18px 28px;transform:translateX(100%);transition:transform .28s cubic-bezier(.2,.7,.2,1);overflow-y:auto;box-shadow:-24px 0 60px -30px rgba(20,20,19,.3);z-index:65}
  .rspx-nav.rspx-open .rspx-links{transform:translateX(0)}
  .rspx-item{font-size:16px;padding:12px 14px;justify-content:space-between}
  .rspx-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;border-left:2px solid var(--rspx-terra-soft);border-radius:0;margin:2px 0 6px 12px;min-width:0;padding:2px 0;display:none}
  .rspx-drop.rspx-open-sub .rspx-menu{display:block}
  .rspx-right .rspx-phone{display:none}
}
.rspx-scrimlock{overflow:hidden}

/* ---- Footer ---- */
.rspx-footcta{background:var(--rspx-ink);color:#fff;font-family:var(--rspx-sans)}
.rspx-footcta-inner{max-width:1180px;margin:0 auto;padding:52px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;border-bottom:1px solid rgba(255,255,255,.12)}
.rspx-footcta h2{font-size:clamp(24px,3vw,34px);font-weight:700;letter-spacing:-.025em;line-height:1.1;max-width:640px}
.rspx-footcta h2 em{font-style:italic;font-family:'Newsreader',Georgia,serif;font-weight:500;color:var(--rspx-terra-soft)}
.rspx-footcta-btn{background:var(--rspx-terra);color:#fff;padding:14px 24px;border-radius:11px;font-size:15px;font-weight:600;text-decoration:none;white-space:nowrap;box-shadow:0 2px 10px -3px rgba(20,20,19,.5);transition:background .18s ease,transform .12s ease}
.rspx-footcta-btn:hover{background:var(--rspx-terra-dark);transform:translateY(-1px)}
.rspx-foot{background:var(--rspx-ink);color:#fff;padding:56px 28px 34px;font-family:var(--rspx-sans)}
.rspx-foot-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.rspx-foot-brand{max-width:300px}
.rspx-foot-brand .rspx-logo{color:#fff}
.rspx-foot-brand .rspx-logo img{background:#fff}
.rspx-foot-brand p{font-size:13px;color:rgba(255,255,255,.55);margin-top:14px;line-height:1.6}
.rspx-foot-social{display:flex;gap:9px;margin-top:18px}
.rspx-foot-social a{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.07);border-radius:9px;color:#fff;transition:background .18s ease,transform .15s ease}
.rspx-foot-social a:hover{background:var(--rspx-terra);transform:translateY(-2px)}
.rspx-foot-social svg{width:15px;height:15px}
.rspx-foot h4{font-family:var(--rspx-mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.5);margin-bottom:15px;font-weight:500}
.rspx-foot ul{list-style:none;margin:0;padding:0}
.rspx-foot li{margin-bottom:9px}
.rspx-foot li a{font-size:13.5px;color:rgba(255,255,255,.8);text-decoration:none;transition:color .18s ease}
.rspx-foot li a:hover{color:var(--rspx-terra-soft)}
.rspx-foot-bottom{max-width:1180px;margin:0 auto;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);font-size:12px;color:rgba(255,255,255,.45);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}
.rspx-foot-bottom a{color:rgba(255,255,255,.55);text-decoration:none}
.rspx-foot-bottom a:hover{color:rgba(255,255,255,.8)}
@media(max-width:900px){.rspx-foot-inner{grid-template-columns:1fr 1fr;gap:30px}.rspx-footcta-inner{padding:40px 24px}}
@media(max-width:560px){.rspx-foot-inner{grid-template-columns:1fr}.rspx-foot,.rspx-footcta-inner{padding-left:20px;padding-right:20px}}
