/* 321 Private Hire — shared header, footer and call bar (2026 redesign).
   All selectors are prefixed t21- so they never collide with Bootstrap or styles.css. */
:root{
  --t21-ink:#121212;--t21-ink-2:#1d1d1a;--t21-ink-fg:#f5f3ea;--t21-ink-muted:#b9b5a6;--t21-line:#2a2a26;
  --t21-accent:#f5b700;--t21-accent-dk:#c99400;--t21-accent-fg:#15140f;
  --t21-display:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --t21-body:"Barlow","Helvetica Neue",Arial,sans-serif;
  --t21-radius:10px;
}
/* styles.css pushes the body down for the old fixed header; the new header is sticky and in flow. */
body{margin-top:0!important}
.t21-wrap{width:100%;max-width:1180px;margin-inline:auto;padding-inline:20px;box-sizing:border-box}
.t21-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 20px;border-radius:var(--t21-radius);
  font-family:var(--t21-display);font-weight:700;font-size:1.05rem;text-transform:uppercase;letter-spacing:.04em;text-decoration:none!important;border:2px solid transparent;line-height:1;cursor:pointer;white-space:nowrap}
.t21-btn-accent{background:var(--t21-accent)!important;color:var(--t21-accent-fg)!important}
.t21-btn-accent:hover{background:var(--t21-accent-dk)!important}
.t21-btn-ghost{background:transparent;color:var(--t21-ink-fg)!important;border-color:rgba(255,255,255,.35)}
.t21-btn-ghost:hover{border-color:var(--t21-accent);color:var(--t21-accent)!important}

/* top bar */
.t21-topbar{background:var(--t21-ink-2);color:var(--t21-ink-muted);font-family:var(--t21-body);font-size:.9rem}
.t21-topbar .t21-wrap{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center;min-height:38px}
.t21-topbar a{text-decoration:none;color:var(--t21-ink-fg)}
.t21-topbar a:hover{color:var(--t21-accent)}
.t21-topbar .t21-spacer{flex:1}
.t21-topbar .t21-socials{display:flex;gap:14px}
.t21-topbar .t21-socials svg{width:16px;height:16px;fill:currentColor;display:block}

/* header */
.t21-head{position:sticky;top:0;z-index:1030;background:var(--t21-ink);color:var(--t21-ink-fg);border-bottom:1px solid var(--t21-line);font-family:var(--t21-body)}
.t21-head .t21-wrap{display:flex;align-items:center;gap:20px;min-height:76px}
.t21-logo{display:flex;align-items:center;gap:10px;text-decoration:none!important;color:var(--t21-ink-fg)!important}
.t21-logo .t21-mark{display:grid;place-items:center;width:46px;height:46px;background:var(--t21-accent);color:var(--t21-accent-fg);border-radius:8px;font-family:var(--t21-display);font-weight:800;font-size:1.5rem;letter-spacing:-.02em}
.t21-logo .t21-word{font-family:var(--t21-display);line-height:.95}
.t21-logo .t21-word b{display:block;font-size:1.45rem;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.t21-logo .t21-word span{display:block;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.2em;color:var(--t21-accent)}
.t21-nav{margin-left:auto;display:flex;gap:4px;align-items:center}
.t21-nav>a,.t21-dd>a{display:block;padding:10px 14px;border-radius:8px;text-decoration:none!important;font-weight:500;font-size:1rem;color:var(--t21-ink-fg)!important;white-space:nowrap}
.t21-nav>a:hover,.t21-dd>a:hover{background:#262622;color:var(--t21-accent)!important}
.t21-dd{position:relative}
.t21-dd>a::after{content:"";display:inline-block;width:6px;height:6px;margin-left:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-3px) rotate(45deg)}
.t21-dd-menu{display:none;position:absolute;top:100%;left:0;min-width:260px;padding:8px;margin:0;background:var(--t21-ink-2);border:1px solid var(--t21-line);border-radius:10px;box-shadow:0 18px 40px rgba(0,0,0,.4);z-index:1031}
.t21-dd-menu::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.t21-dd:hover .t21-dd-menu,.t21-dd:focus-within .t21-dd-menu{display:block}
.t21-dd-menu a{display:block;padding:9px 12px;border-radius:7px;font-size:.95rem;color:var(--t21-ink-fg)!important;text-decoration:none!important}
.t21-dd-menu a:hover{background:#262622;color:var(--t21-accent)!important}
.t21-cta-btns{display:flex;align-items:center;gap:12px}
.t21-menu-btn{display:none;margin-left:auto;background:none;border:2px solid #3a3a35;color:var(--t21-ink-fg);border-radius:8px;width:46px;height:46px;cursor:pointer;padding:0}
.t21-menu-btn svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round}
.t21-mnav{display:none;background:var(--t21-ink-2);border-top:1px solid var(--t21-line)}
.t21-mnav[data-open="true"]{display:block}
.t21-mnav a{display:block;padding:15px 20px;border-bottom:1px solid var(--t21-line);text-decoration:none!important;color:var(--t21-ink-fg)!important;font-family:var(--t21-display);font-size:1.3rem;font-weight:700;text-transform:uppercase}
.t21-mnav a.t21-sub{padding-left:40px;font-family:var(--t21-body);font-size:1rem;font-weight:500;text-transform:none;color:var(--t21-ink-muted)!important}
.t21-mnav a:hover{color:var(--t21-accent)!important}

/* chequer band + areas + CTA (top of footer block) */
.t21-chequer{height:14px;background:repeating-conic-gradient(var(--t21-accent) 0 25%,var(--t21-ink) 0 50%) 0 0/28px 28px}
.t21-areas-sec{background:var(--t21-ink);color:var(--t21-ink-fg);padding:56px 0;font-family:var(--t21-body)}
.t21-eyebrow{display:block;font-family:var(--t21-display);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.85rem;color:var(--t21-accent);margin-bottom:10px}
.t21-areas-sec h2,.t21-cta h2{font-family:var(--t21-display);font-size:clamp(1.9rem,4vw,2.8rem);font-weight:800;text-transform:uppercase;line-height:1;margin:0 0 20px;color:var(--t21-ink-fg)}
.t21-areas{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.t21-areas a{display:inline-block;text-decoration:none!important;padding:9px 15px;border-radius:999px;border:1.5px solid #3a3a35;background:var(--t21-ink-2);font-weight:500;font-size:.95rem;color:var(--t21-ink-fg)!important}
.t21-areas a:hover{border-color:var(--t21-accent);background:var(--t21-accent);color:var(--t21-accent-fg)!important}
.t21-cta{background:var(--t21-ink-2);color:var(--t21-ink-fg);text-align:center;padding:56px 0;border-top:1px solid var(--t21-line);font-family:var(--t21-body)}
.t21-cta .t21-wrap{display:grid;gap:16px;justify-items:center}
.t21-cta .t21-num{font-family:var(--t21-display);font-weight:800;font-size:clamp(2.4rem,7vw,4.2rem);color:var(--t21-accent)!important;text-decoration:none!important;line-height:1;font-variant-numeric:tabular-nums}
.t21-cta .t21-alt{color:var(--t21-ink-muted);font-size:.95rem;margin:0}
.t21-cta .t21-alt a{color:var(--t21-ink-fg)!important;text-decoration:none!important}

/* footer */
.t21-footer{background:var(--t21-ink);color:var(--t21-ink-muted);font-size:.95rem;font-family:var(--t21-body);border-top:1px solid var(--t21-line)}
.t21-footer .t21-wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:36px;padding-top:56px;padding-bottom:32px}
.t21-footer h3{color:var(--t21-ink-fg);font-family:var(--t21-display);font-size:1.05rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin:0 0 14px}
.t21-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.t21-footer a{text-decoration:none!important;color:var(--t21-ink-muted)!important}
.t21-footer a:hover{color:var(--t21-accent)!important}
.t21-footer address{font-style:normal;line-height:1.6;margin:0}
.t21-footer p{margin:16px 0 0;max-width:38ch}
.t21-copy{border-top:1px solid var(--t21-line);font-size:.85rem}
.t21-copy .t21-wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;padding-top:18px;padding-bottom:18px}

/* mobile call bar */
.t21-callbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:1040;background:var(--t21-accent);color:var(--t21-accent-fg);padding:10px 16px;box-shadow:0 -6px 24px rgba(0,0,0,.25)}
.t21-callbar a{display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none!important;color:inherit!important;font-family:var(--t21-display);font-weight:800;font-size:1.35rem;text-transform:uppercase}
.t21-callbar svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

@media (max-width:1100px){
  .t21-nav,.t21-cta-btns .t21-btn-ghost{display:none}
  .t21-menu-btn{display:inline-grid;place-items:center}
  .t21-cta-btns{margin-left:auto}
  .t21-footer .t21-wrap{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .t21-topbar .t21-socials,.t21-topbar .t21-mail{display:none}
  .t21-cta-btns{display:none}
  .t21-footer .t21-wrap{grid-template-columns:1fr}
  .t21-callbar{display:block}
  body{padding-bottom:70px}
}