/* Court Intel site chrome: the header, menus, footer and background shared by every page off the home page
   (Insights, Padel Daily, rankings, events, roadmap, terms, privacy, booking). One source: pages link this file
   and include website/shared/site-header.html and site-footer.html. Selectors are scoped (.sitehead, .sitefoot)
   and carry their own colours so a page's own element styles (button, h2, .card...) cannot leak into them.
   Browsers cache this file for a year: after any change, bump ?v= where it is linked (insights/build.py,
   book/index.php, licensing/legal/build_terms_html.py), rebuild and deploy the pages. Now v=3. */

html { background:#050a18; }
body { position:relative; }
/* background: slow indigo and cyan glows over a faint grid that fades down the page */
body::before { content:''; position:fixed; inset:-20%; z-index:-2; pointer-events:none;
  background:radial-gradient(38% 32% at 18% 12%, rgba(99,102,241,.20), transparent 70%), radial-gradient(34% 30% at 86% 64%, rgba(6,182,212,.14), transparent 70%), radial-gradient(30% 26% at 50% 100%, rgba(99,102,241,.10), transparent 70%);
  animation:ci-drift 26s ease-in-out infinite alternate; }
body::after { content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse 85% 65% at 50% 0%, #000 25%, transparent 75%); mask-image:radial-gradient(ellipse 85% 65% at 50% 0%, #000 25%, transparent 75%); }
@keyframes ci-drift { 0% { transform:translate3d(0,0,0) scale(1) } 100% { transform:translate3d(5%,7%,0) scale(1.1) } }
@media (prefers-reduced-motion:reduce) { body::before { animation:none } }

.sitehead { position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(5,10,24,.88); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-bottom:1px solid #1c2740; font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; line-height:1.5; }
.sitehead * { box-sizing:border-box; }
.sitehead .sh-inner { max-width:1200px; margin:0 auto; padding:14px 2rem; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.sitehead .logo { display:flex; align-items:center; gap:.6rem; text-decoration:none; color:#f0f2f8; margin:0; }
.sitehead .logo-mark { width:48px; height:38px; border:1px solid transparent; border-radius:11px; background:linear-gradient(#0d1117,#0d1117) padding-box,linear-gradient(135deg,#6366f1,#06b6d4) border-box; display:flex; align-items:center; justify-content:flex-start; padding-left:7px; font-family:'Courier New',monospace; font-size:13px; font-weight:700; color:#06b6d4; overflow:hidden; }
.sitehead .logo-mark::before { content:'>'; color:#6366f1; margin-right:3px; }
.sitehead .logo-mark::after { content:''; width:1.5px; height:16px; background:#06b6d4; animation:ci-blink 1s step-end infinite; margin-left:1px; }
@keyframes ci-blink { 0%,100% { opacity:1 } 50% { opacity:0 } }
.sitehead .logo-text { font-family:'JetBrains Mono',monospace; font-weight:100; font-size:1.5rem; letter-spacing:.2em; text-transform:uppercase; }
.sitehead .logo-text span { background:linear-gradient(135deg,#6366f1,#06b6d4); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.sitehead .nav-links { display:flex; gap:1.25rem; list-style:none; align-items:center; margin:0; padding:0; white-space:nowrap; }
.sitehead .nav-links > li { margin:0; padding:0; }
.sitehead .nav-links > li > a { color:#94a3c4; text-decoration:none; font-size:.9rem; font-weight:500; }
.sitehead .nav-links > li > a:hover { color:#f0f2f8; }
.sitehead .nav-links li.nav-narrow { display:none; }
@media (max-width:960px) { .sitehead .nav-links li.nav-wide { display:none; } .sitehead .nav-links li.nav-narrow { display:block; } }
@media (max-width:560px) { .sitehead .nav-links li.nav-demo { display:none; } .sitehead .sh-inner { padding:12px 1rem; } }
@media (max-width:340px) { .sitehead .logo-text { display:none; } }
.sitehead a.nav-cta, .sitehead .nav-links > li > a.nav-cta, .sitehead .nav-links > li > a.nav-cta:hover { background:linear-gradient(135deg,#6366f1,#06b6d4); color:#fff; padding:.55rem 1.3rem; border-radius:8px; font-weight:600; text-decoration:none; font-size:.9rem; }
/* Get a Quote (17 Oct 2026): the quote builder at /quote/, outlined so Book a Demo stays the main button */
.sitehead a.nav-quote, .sitehead .nav-links > li > a.nav-quote { border:1px solid rgba(148,163,196,.45); color:#f0f2f8; padding:.5rem 1.05rem; border-radius:8px; font-weight:600; text-decoration:none; font-size:.9rem; white-space:nowrap; }
.sitehead .nav-links > li > a.nav-quote:hover { border-color:#06b6d4; color:#fff; }
.sitehead .nav-panel-quote { display:block; text-align:center; margin:-.4rem auto 1rem; max-width:520px; }
.sitehead a.nav-trial, .sitehead .nav-links > li > a.nav-trial, .sitehead .nav-links > li > a.nav-trial:hover { background:#facc15; color:#1a1400; font-weight:700; padding:.45rem 1rem; border-radius:8px; text-decoration:none; }
.sitehead .dd { position:relative; }
.sitehead button.dd-btn { background:none; border:0; box-shadow:none; cursor:pointer; color:#94a3c4; font:500 .9rem 'Inter',sans-serif; display:inline-flex; align-items:center; gap:.25rem; padding:.3rem 0; margin:0; border-radius:0; width:auto; }
.sitehead .dd-btn svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; transition:transform .2s; }
.sitehead .dd-btn:hover, .sitehead .dd.open .dd-btn, .sitehead .dd.here .dd-btn { color:#f0f2f8; }
.sitehead .dd.open .dd-btn svg { transform:rotate(180deg); }
.sitehead .dd-menu { position:absolute; top:calc(100% + .7rem); left:50%; transform:translateX(-50%); min-width:260px; background:rgba(13,21,40,.98); border:1px solid rgba(255,255,255,.1); border-radius:12px; padding:.5rem; box-shadow:0 18px 40px rgba(0,0,0,.45); display:none; white-space:normal; line-height:1.4; text-align:left; }
.sitehead .dd-menu::before { content:''; position:absolute; left:0; right:0; top:-.8rem; height:.8rem; }
.sitehead .dd.open .dd-menu { display:block; }
@media (hover:hover) { .sitehead .dd:hover .dd-menu { display:block; } }
.sitehead .dd-menu a { display:block; padding:.6rem .8rem; border-radius:8px; color:#f0f2f8; font-weight:600; font-size:.92rem; text-decoration:none; }
.sitehead .dd-menu a small { display:block; color:#7383a3; font-weight:400; font-size:.78rem; margin-top:2px; }
.sitehead .dd-menu a:hover, .sitehead .dd-menu a[aria-current] { background:rgba(99,102,241,.12); }
.sitehead button.nav-menu-btn { display:inline-flex; align-items:center; gap:.4rem; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); box-shadow:none; color:#f0f2f8; border-radius:8px; padding:.5rem .8rem; margin:0; font:600 .9rem 'Inter',sans-serif; cursor:pointer; width:auto; }
.sitehead .nav-menu-btn svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.sitehead .nav-panel { background:rgba(5,10,24,.98); border-top:1px solid #1c2740; padding:1rem 1.5rem 1.5rem; max-height:calc(100vh - 70px); overflow-y:auto; }
.sitehead .nav-panel[hidden] { display:none; }
.sitehead .nav-panel-demo { display:block; text-align:center; margin:0 auto 1rem; max-width:520px; }
.sitehead .nav-panel-cols { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem 1.5rem; max-width:820px; margin:0 auto; }
@media (max-width:560px) { .sitehead .nav-panel-cols { grid-template-columns:1fr 1fr; } .sitehead .nav-panel-cols > div:last-child { grid-column:1 / -1; } }
.sitehead .nav-panel h4 { font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:#7383a3; margin:0 0 .4rem; font-weight:700; }
.sitehead .nav-panel-cols a { display:block; color:#f0f2f8; text-decoration:none; font-weight:500; padding:.5rem 0; }
.sitehead .nav-panel-cols a.nav-trial { display:inline-block; margin-top:.4rem; padding:.5rem 1rem; }
@media (min-width:961px) { .sitehead .nav-panel { display:none !important; } }

.sitefoot { position:relative; border-top:1px solid #1c2740; padding:56px 16px 26px; color:#7383a3; font:.92rem/1.6 'Inter',-apple-system,sans-serif; text-align:left; background:linear-gradient(180deg,rgba(13,21,40,0),rgba(13,21,40,.55)); }
.sitefoot a { color:#94a3c4; text-decoration:none; }
.sitefoot a:hover { color:#f0f2f8; }
.sitefoot .sf-inner { max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.1fr 2fr; gap:48px; }
.sitefoot .sf-logo { display:inline-flex; align-items:center; gap:.6rem; color:#f0f2f8; }
.sitefoot .sf-mark { width:42px; height:33px; box-sizing:border-box; border:1px solid transparent; border-radius:10px; background:linear-gradient(#0d1117,#0d1117) padding-box,linear-gradient(135deg,#6366f1,#06b6d4) border-box; display:flex; align-items:center; padding-left:6px; font:700 12px 'Courier New',monospace; color:#06b6d4; }
.sitefoot .sf-mark::before { content:'>'; color:#6366f1; margin-right:3px; }
.sitefoot .sf-mark::after { content:''; width:1.5px; height:14px; background:#06b6d4; margin-left:1px; }
.sitefoot .sf-word { font-family:'JetBrains Mono',monospace; font-weight:100; font-size:1.25rem; letter-spacing:.2em; text-transform:uppercase; }
.sitefoot .sf-word span { background:linear-gradient(135deg,#6366f1,#06b6d4); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.sitefoot .sf-brand p { margin:14px 0 0; max-width:300px; color:#94a3c4; }
.sitefoot .sf-cta { display:inline-block; margin-top:18px; padding:9px 18px; border-radius:9px; background:linear-gradient(135deg,#6366f1,#06b6d4); color:#fff; font-weight:600; }
.sitefoot .sf-cta:hover { color:#fff; filter:brightness(1.1); }
.sitefoot .sf-mail { display:flex; align-items:center; gap:8px; }
.sitefoot .sf-mail svg { width:16px; height:16px; color:#06b6d4; flex:none; }
.sitefoot .sf-cols { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.sitefoot .sf-cols h4 { margin:0 0 12px; font:700 .72rem/1 'Inter',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#f0f2f8; }
.sitefoot .sf-cols a { display:block; padding:4px 0; }
.sitefoot .sf-base { max-width:1180px; margin:40px auto 0; padding-top:20px; border-top:1px solid #1c2740; display:flex; justify-content:space-between; gap:8px 24px; flex-wrap:wrap; font-size:.76rem; }
@media (max-width:860px) { .sitefoot .sf-inner { grid-template-columns:1fr; gap:34px; } .sitefoot .sf-cols { grid-template-columns:repeat(2,1fr); } }
@media print { .sitehead, .sitefoot { display:none; } body::before, body::after { display:none; } }
/* 961-1180 px: seven menu items since Build your system (17 Oct 2026); tighter spacing so Book a Demo never runs off the
   edge. At the END of the file on purpose: earlier, the button rules below it won and it did nothing. */
@media (min-width:961px) and (max-width:1180px) { .sitehead .nav-links { gap:.6rem; } .sitehead .nav-links > li > a, .sitehead .dd-btn { font-size:.84rem; }
  .sitehead a.nav-cta, .sitehead .nav-links > li > a.nav-cta, .sitehead .nav-links > li > a.nav-quote, .sitehead .nav-links > li > a.nav-trial { padding:.45rem .75rem; font-size:.84rem; } }