:root{
  --bg:#0b101d; --panel:#121a2e; --ink:#e6ebff; --muted:#9aa4b2;
  --line:#1e2a44; --accent:#4ea1ff; --accent2:#62d29e; --warn:#ffb200;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:24px}
.header{background:var(--bg);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:16px;padding:12px 16px}
.nav .brand{font-weight:800;letter-spacing:.3px}
.nav a{color:var(--muted)} .nav a:hover{color:#fff;text-decoration:none}
.spacer{flex:1}
.hero{padding:48px 16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(78,161,255,.08),transparent)}
.hero h1{font-size:2rem;margin:.2rem 0 .4rem}
.hero p{color:var(--muted);max-width:820px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:16px 0}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.badge{border:1px solid var(--line);border-radius:999px;padding:.15rem .6rem;font-size:.8rem;background:#0f1629;color:var(--muted)}
.button{display:inline-block;border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:#0f1629;color:#e6ebff}
.button:hover{background:#121c34}
.footer{border-top:1px solid var(--line);color:var(--muted);padding:16px}
.section{padding:24px 16px}
.h2{margin:.2rem 0 .6rem}
.list{margin:0;padding-left:1.1rem}
.kv{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:.45rem 0}
code,pre{background:#0f1629;border:1px solid var(--line);border-radius:8px}
pre{padding:12px;overflow:auto}
.notice{border-left:4px solid var(--accent);padding:12px;background:#0f1629;border-radius:8px}
.small{font-size:.9rem;color:var(--muted)}
.figure{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#000}
.figure img{display:block;width:100%;height:auto;opacity:.9}
.callout{border:1px dashed var(--line);padding:12px;border-radius:12px;background:#0f1629}
/* ===== Optional shims if not already in theme.css ===== */

/* Header layout only — colors/spacing should already be defined in your theme */
.site-header .site-header__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.site-header__badge { margin-top: .5rem; }

.button--pill {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  text-decoration: none;
}

/* If your theme already defines .badge, remove this */
.badge {
  display: inline-block;
  font-size: .85rem;
  padding: 3px 10px;
  border-radius: 999px;
}
/* ===== Hero & Heading spacing refinement ===== */

/* Reduce top spacing before the hero title */
.hero .container h1 {
  margin-top: 1.5rem; /* was likely ~3rem; this halves it visually */
}

/* Optional: slightly closer paragraph to title */
.hero .container p {
  margin-top: 0.75rem;
}

/* ===== Top-right CTA polish ===== */

.site-header__cta {
  flex-shrink: 0;
}

.button--pill {
  background: #0a84ff;              /* bright accent */
  color: #fff;
  font-weight: 500;
  padding: 6px 16px;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: background .25s, box-shadow .25s;
}

/* === HEADER SPACING & BORDER TUNING === */

/* Reduce header height by ~50% */
.site-header .container {
  padding-top: 6px;       /* was ~12px */
  padding-bottom: 6px;
}

/* Strengthen and slightly lighten the divider line */
.site-header {
  border-bottom: 2px solid rgba(120, 160, 255, 0.25); /* soft blue glow, visible on dark bg */
  background-color: #0b101a;                          /* match original deep navy tone */
}

/* Optional subtle contrast boost for nav text */
nav.nav a {
  color: #c7d4ef;
}
nav.nav a:hover {
  color: #fff;
}

/* --- CTA button alignment --- */
.site-header__cta {
  flex-shrink: 0;
  margin-left: auto;
}

/* Keep “Confidential enquiries” button bright but refined */
.button--pill {
  background: linear-gradient(180deg, #0a84ff, #0675e5);
  border: 1.5px solid rgba(255,255,255,0.25);
  color: #fff;
  font-weight: 500;
  padding: 6px 18px;
  border-radius: 999px;
  transition: background .25s, border-color .25s, box-shadow .25s;
}

.button--pill:hover {
  border-color: rgba(255,255,255,0.5);
  background: linear-gradient(180deg, #1491ff, #0a6bd9);
  box-shadow: 0 0 8px rgba(10,132,255,0.4);
}
/* === HEADER SPACING & BORDER (final tune) === */
.site-header {
  background-color: #0b101a;
  border-bottom: 2px solid rgba(150, 180, 255, 0.35); /* brighter, thicker */
  box-shadow: inset 0 -1px 0 rgba(255,255,255,0.05);
}
.site-header .container {
  padding-top: 4px;   /* reduced from 6px → ~50% tighter */
  padding-bottom: 4px;
}

/* === Hero top spacing (reduce by 50% again) === */
.hero {
  padding-top: 12px;  /* was 24px */
}
.hero .container h1 {
  margin-top: 0.25rem;   /* small visual lead-in */
}
.hero .container p {
  margin-top: 0.5rem;    /* closer paragraph */
}

/* === CTA button: more contrast & definition === */
.button--pill {
  display: inline-block;
  padding: 6px 20px;
  border-radius: 999px;
  color: #fff;
  font-weight: 600;
  background: linear-gradient(180deg, #1993ff, #046fe2);
  border: 2px solid rgba(255,255,255,0.45);  /* thicker, brighter edge */
  box-shadow: 0 0 6px rgba(25,147,255,0.35);
  transition: background .25s, border-color .25s, box-shadow .25s;
}
.button--pill:hover {
  background: linear-gradient(180deg, #3aa4ff, #0a7ef3);
  border-color: rgba(255,255,255,0.7);
  box-shadow: 0 0 10px rgba(25,147,255,0.5);
}
/* === Final hero + button tuning === */


/* Restore button background to original dark style */
.button--pill {
  background: #0f1629;             /* same base tone as original buttons */
  color: var(--ink);
  border: 1.5px solid var(--line);
  font-weight: 500;
  box-shadow: none;
  transition: background .25s, color .25s, border-color .25s;
}
.button--pill:hover {
  background: #121c34;             /* slightly lighter hover tone */
  color: #e6ebff;
  border-color: rgba(255,255,255,0.25);
}
/* === Final hero spacing + inverted button states === */

/* Cut remaining space above hero title by 50% */
.hero {
  padding-top: 0px; /* tighter by half */
}
.hero .container h1 {
  margin-top: 0rem;
}
.hero .container p {
  margin-top: 0rem;
}

/* Invert button states */
.button--pill {
  background: #121c34;                /* previously hover background */
  color: #e6ebff;                     /* lighter ink for contrast */
  border: 1.5px solid rgba(255,255,255,0.25);
  transition: background .25s, color .25s, border-color .25s;
}

.button--pill:hover {
  background: #0f1629;                /* previously default background */
  color: var(--ink);
  border-color: var(--line);
}

/* === GLOBAL SPACING COMPRESSION (≈ –50 %) === */

/* Core container spacing */
.container {
  padding: 12px;                 /* was 24px */
}

/* Section padding */
.section {
  padding: 12px 8px;             /* was 24px 16px */
}

/* Hero section padding */
.hero {
  padding: 4px 8px 12px 8px;     /* tighter top and bottom */
}
.hero .container h1 {
  margin-top: 0.1rem;
  margin-bottom: 0.3rem;
}
.hero .container p {
  margin-top: 0.3rem;
  margin-bottom: 0.8rem;
}

/* Grid and card gaps */
.grid {
  gap: 7px;                      /* was 14px */
  margin: 8px 0;                 /* was 16px 0 */
}
.card {
  padding: 8px;                  /* was 16px */
  border-radius: 8px;            /* slightly smaller corners for proportion */
}

/* Footer and header containers */
.site-header .container {
  padding-top: 3px;
  padding-bottom: 3px;
}
.footer {
  padding: 8px 12px;             /* was 16px */
  font-size: 0.9rem;
}

/* Lists and key-value rows */
.list {
  padding-left: 0.9rem;
}
.kv {
  padding: 0.25rem 0;            /* was 0.45rem 0 */
}

/* Buttons inside cards */
.button {
  padding: 6px 10px;             /* was 10px 14px */
}

/* Notice & callouts */
.notice,
.callout {
  padding: 6px 8px;              /* was 12px */
}

/* Reduce code/pre padding */
pre {
  padding: 6px;
}

/* Tighten badge visual weight slightly */
.badge {
  padding: 2px 8px;
  font-size: 0.78rem;
}
/* Inline separator — for • or · used between links */
.sep {
  color: rgba(255, 255, 255, 0.35);   /* soft white-grey to match dark theme */
  margin: 0 0.4em;                    /* balanced spacing before/after */
  font-size: 0.9em;                   /* slightly smaller than surrounding text */
  line-height: 1;
  user-select: none;                  /* prevent accidental copy */
}

.sep::selection {
  background: transparent;            /* bullet doesn't highlight when text is selected */
}