/* exe + pal: shared brand chrome for every page (header, footer, closing call to action).
   "exe" is the program that runs: IBM Plex Mono, navy, the > prompt, prices and endpoints.
   "pal" is the friend on your side: Plex Sans bold, amber, warm cream, plain sentences.
   Loaded last in <head> so it wins over each page's own header/footer rules.
   Markup is written by scripts/site-chrome.mjs; don't hand-edit header.top or footer.site. */

:root{--xp-night:#0F1E2E;--xp-night-2:#18293B;--xp-rule:#2A3D52;--xp-text:#DCE2E8;--xp-dim:#8596A8;--xp-glow:#F2B544;--xp-pal:#FFF6E3;--xp-pal-rule:#EED9AE;--xp-pal-ink:#3E2A05;--xp-amber:#B96A00}

/* ---------- header: one dark bar on every page, full width ---------- */
header.top.xp-top{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;padding:14px 0;margin:0;border:0;
  background:var(--xp-night);box-shadow:0 0 0 100vmax var(--xp-night);clip-path:inset(0 -100vmax);color:var(--xp-text);position:relative;z-index:5}
.xhero header.top.xp-top,.hero header.top.xp-top,.dark header.top.xp-top{background:transparent;box-shadow:none;clip-path:none;border-bottom:1px solid rgba(133,150,168,.18)}
header.top.xp-top .brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none!important;font-size:20px;line-height:1;color:#fff}
header.top.xp-top .brand .mark{flex:none;display:block}
.xp-wm{display:inline-flex;align-items:baseline;white-space:nowrap}
.xp-wm .exe{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-weight:500;color:#fff;letter-spacing:-.01em}
.xp-wm .pal{font-family:"IBM Plex Sans",system-ui,sans-serif;font-weight:700;color:var(--xp-glow);letter-spacing:-.01em}
.xp-wm .cur{display:inline-block;width:.55em;height:.13em;background:var(--xp-glow);margin-left:3px;animation:xp-blink 1.1s steps(1) infinite}
@keyframes xp-blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.xp-wm .cur{animation:none}}
header.top.xp-top nav{display:flex;gap:4px 20px;align-items:center;flex-wrap:wrap;font-size:15px}
header.top.xp-top nav a{color:var(--xp-text);text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
header.top.xp-top nav a:hover{color:#fff;text-decoration:none}
header.top.xp-top nav a[aria-current=page]{color:#fff;border-bottom-color:var(--xp-glow)}
header.top.xp-top nav a.nav-cta{background:var(--xp-glow);color:var(--xp-night)!important;border:0;border-radius:999px;padding:8px 15px;font-weight:600;font-size:14.5px}
header.top.xp-top nav a.nav-cta:hover{background:#FFC65C}
header.top.xp-top .machine-toggle{color:#C9D3DD;border-color:rgba(201,211,221,.45)}
header.top.xp-top a:focus-visible,header.top.xp-top button:focus-visible{outline:3px solid var(--xp-glow);outline-offset:3px}

/* page-specific links (service pages) sit in a slim strip under the bar */
.xp-sub{display:flex;gap:6px 18px;flex-wrap:wrap;align-items:center;font-size:14px;padding:10px 0;border-bottom:1px solid rgba(133,150,168,.25)}
.xp-sub .lbl{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.06em;text-transform:uppercase;opacity:.7}
.xp-sub a{color:inherit;text-decoration:none}
.xp-sub a:hover{text-decoration:underline}

@media (max-width:760px){
  header.top.xp-top{gap:12px}
  header.top.xp-top nav{width:100%;flex-wrap:nowrap;overflow-x:auto;gap:18px;scrollbar-width:none;padding-bottom:2px}
  header.top.xp-top nav::-webkit-scrollbar{display:none}
  header.top.xp-top nav a{white-space:nowrap}
  header.top.xp-top nav a.nav-cta{position:absolute;top:12px;right:0;padding:7px 13px;font-size:14px}
  header.top.xp-top .machine-toggle{display:none}
  header.top.xp-top nav .hide-sm{display:inline}
}

/* ---------- closing call to action: the "pal" card ---------- */
section.xp-cta{margin:56px 0 0;background:var(--xp-pal);border:1px solid var(--xp-pal-rule);border-radius:20px;padding:34px 36px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 36px;align-items:center;color:var(--xp-pal-ink)}
section.xp-cta .who{display:inline-flex;align-items:center;gap:8px;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:13px;font-weight:700;color:#7A4E00;margin-bottom:8px}
section.xp-cta .who b{background:var(--xp-glow);color:var(--xp-night);border-radius:999px;padding:1px 9px;font-size:12px}
section.xp-cta h2{border:0;padding:0;font-size:clamp(22px,2.6vw,30px);line-height:1.15;letter-spacing:-.015em;margin:0 0 8px;color:var(--xp-night);font-weight:600}
section.xp-cta p{margin:0;color:#5A4520;font-size:16px;max-width:60ch}
section.xp-cta .acts{display:flex;gap:10px;flex-wrap:wrap}
.xp-btn{display:inline-block;padding:12px 20px;border-radius:10px;font-weight:600;font-size:15.5px;text-decoration:none!important;white-space:nowrap;line-height:1.2}
.xp-btn.primary{background:var(--xp-night);color:#fff!important}
.xp-btn.primary:hover{background:#22364B}
.xp-btn.ghost{border:1.5px solid rgba(15,30,46,.35);color:var(--xp-night)!important}
.xp-btn.ghost:hover{border-color:var(--xp-night)}
.xp-btn.amber{background:var(--xp-glow);color:var(--xp-night)!important}
.xp-btn.amber:hover{background:#FFC65C}
.xp-btn.light{border:1.5px solid rgba(220,226,232,.45);color:#fff!important}
.xp-btn.light:hover{border-color:#fff}
@media (max-width:760px){section.xp-cta{grid-template-columns:1fr;padding:26px 22px}section.xp-cta .acts .xp-btn{flex:1 1 auto;text-align:center}}

/* a row of buttons under a page's h1 */
.xp-acts{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 6px}

/* ---------- footer: dark, full width ---------- */
footer.site.xp-foot{margin-top:64px;padding:44px 0 26px;border:0;background:var(--xp-night);box-shadow:0 0 0 100vmax var(--xp-night);clip-path:inset(0 -100vmax);color:var(--xp-dim);font-size:14.5px}
footer.site.xp-foot .grid{display:grid;grid-template-columns:1.4fr repeat(4,minmax(0,1fr));gap:28px}
footer.site.xp-foot .about .xp-wm{font-size:22px}
footer.site.xp-foot .about p{margin:10px 0 12px;color:var(--xp-dim);max-width:34ch;font-size:14.5px;line-height:1.55}
footer.site.xp-foot .about p.motto{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:13px;color:#C9D3DD}
footer.site.xp-foot h3{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#6F8296;margin:0 0 12px}
footer.site.xp-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
footer.site.xp-foot a{color:var(--xp-text);text-decoration:none}
footer.site.xp-foot a:hover{color:#fff;text-decoration:underline}
footer.site.xp-foot .legal{display:flex;justify-content:space-between;gap:10px 24px;flex-wrap:wrap;border-top:1px solid var(--xp-rule);margin-top:34px;padding-top:18px;font-size:13px;color:#6F8296}
footer.site.xp-foot .legal a{color:#AEBBC8}
@media (max-width:900px){footer.site.xp-foot .grid{grid-template-columns:repeat(2,minmax(0,1fr))}footer.site.xp-foot .about{grid-column:1/-1}}
