/* ===== Public pages (partials/public-head.php) ===== */
  :root {
    --ground:#e9eef0; --surface:#ffffff; --surface-2:#f2f5f6; --field:#ffffff;
    --ink:#12303a; --ink-soft:#4a5f66; --hairline:#d3dcde; --hairline-2:#c2ced1;
    --navy:#0d2b36; --stone:#5c6b70; --red:#b3202b; --red-ink:#b3202b;
    --gold:#b9862f; --good:#2f7d5b;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      --ground:#08191f; --surface:#0e2830; --surface-2:#123039; --field:#0a2028;
      --ink:#eaf1f2; --ink-soft:#9db3ba; --hairline:#1f3d47; --hairline-2:#2a4c57;
      --navy:#cfe3e8; --stone:#93a6ac; --red:#e0616a; --red-ink:#e0616a;
      --gold:#e0b25f; --good:#59b98c;
    }
  }
  :root[data-theme="dark"] {
    --ground:#08191f; --surface:#0e2830; --surface-2:#123039; --field:#0a2028;
    --ink:#eaf1f2; --ink-soft:#9db3ba; --hairline:#1f3d47; --hairline-2:#2a4c57;
    --navy:#cfe3e8; --stone:#93a6ac; --red:#e0616a; --red-ink:#e0616a;
    --gold:#e0b25f; --good:#59b98c;
  }
  * { box-sizing:border-box; }
  img { max-width:100%; }
  body { margin:0; background:var(--ground); color:var(--ink); font-family:"Karla",system-ui,-apple-system,sans-serif; font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; }
  a { color:var(--red-ink); }
  .eyebrow { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:12.5px; letter-spacing:0.22em; text-transform:uppercase; color:var(--stone); }
  header.topbar { border-bottom:1px solid var(--hairline); background:color-mix(in srgb,var(--ground) 86%,transparent); position:sticky; top:0; z-index:10; backdrop-filter:saturate(1.4) blur(8px); }
  .topbar-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:13px 24px; max-width:1120px; margin:0 auto; }
  .brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
  .brand .legs { width:38px; height:38px; flex:none; }
  .brand .legs path { fill:var(--red); }
  .brand-name { font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:17px; color:var(--ink); }
  .brand-domain { font-family:"IBM Plex Mono",monospace; font-size:11.5px; color:var(--ink-soft); }
  .nav { display:flex; align-items:center; gap:20px; font-size:14.5px; }
  .nav a { color:var(--ink-soft); text-decoration:none; font-weight:600; }
  .nav a:hover { color:var(--red-ink); }
  .nav a.cta { color:#fff; background:var(--red); padding:8px 15px; border-radius:9px; }
  .nav a.cta:hover { background:color-mix(in srgb,var(--red) 88%,#000); color:#fff; }
  @media (max-width:640px){ .nav .hide-sm { display:none; } .topbar-inner { padding:12px 16px; } }
  main { max-width:1080px; margin:0 auto; padding:40px 24px 72px; }
  main.narrow { max-width:760px; }
  h1 { font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:clamp(1.9rem,4.5vw,2.7rem); line-height:1.06; letter-spacing:-0.015em; margin:0 0 10px; text-wrap:balance; color:var(--ink); }
  h1 em { font-style:italic; color:var(--red-ink); font-weight:500; }
  .lede { margin:0 0 28px; color:var(--ink-soft); font-size:18px; }
  .crumb { font-size:14px; margin:0 0 18px; color:var(--ink-soft); }
  .crumb a { color:var(--ink-soft); text-decoration:none; } .crumb a:hover { color:var(--red-ink); }

  /* Search + filter bar */
  .toolbar { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin:0 0 8px; }
  .toolbar input[type=search], .toolbar select {
    font-family:"Karla",sans-serif; font-size:16px; color:var(--ink); background:var(--field);
    border:1px solid var(--hairline-2); border-radius:11px; padding:12px 15px; appearance:none; }
  .toolbar input[type=search] { flex:1 1 260px; min-width:180px; }
  .toolbar select { flex:0 0 auto; padding-right:38px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235c6b70' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; }
  .toolbar input:focus, .toolbar select:focus { outline:none; border-color:var(--red); box-shadow:0 0 0 3px color-mix(in srgb,var(--red) 22%,transparent); }
  .toolbar .btn-primary { font-family:"Karla"; font-weight:700; font-size:15px; color:#fff; background:var(--red); border:0; border-radius:11px; padding:12px 20px; cursor:pointer; }
  .count { font-family:"IBM Plex Mono",monospace; font-size:12.5px; color:var(--stone); margin:14px 0 22px; }

  /* Cards grid */
  .grid-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:18px; }
  .biz { display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--hairline); border-radius:16px; padding:20px 22px; text-decoration:none; color:inherit; transition:border-color .15s ease, transform .15s ease; }
  .biz:hover { border-color:var(--red); transform:translateY(-2px); }
  .biz .cat { font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
  .biz .name { font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:20px; color:var(--ink); line-height:1.15; margin:0 0 6px; }
  .biz .where { font-size:14px; color:var(--ink-soft); margin-bottom:10px; }
  .biz .blurb { font-size:14.5px; color:var(--ink-soft); margin:0; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .empty { background:var(--surface); border:1px dashed var(--hairline-2); border-radius:16px; padding:36px; text-align:center; color:var(--ink-soft); }

  /* Business detail page */
  .detail { background:var(--surface); border:1px solid var(--hairline); border-radius:18px; padding:30px 32px; }
  .detail .cat { font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); }
  .detail h1 { margin:6px 0 4px; }
  .detail .desc { color:var(--ink); white-space:pre-line; margin:18px 0 0; }
  .facts { list-style:none; margin:22px 0 0; padding:20px 0 0; border-top:1px solid var(--hairline); display:flex; flex-direction:column; gap:12px; }
  .facts li { display:flex; gap:12px; font-size:15.5px; align-items:baseline; }
  .facts .k { font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--stone); flex:0 0 88px; }
  .facts a { color:var(--red-ink); text-decoration:none; } .facts a:hover { text-decoration:underline; }
  .btn-primary { font-family:"Karla",sans-serif; font-weight:700; font-size:16px; color:#fff; background:var(--red); border:0; border-radius:11px; padding:13px 22px; cursor:pointer; display:inline-flex; align-items:center; gap:9px; text-decoration:none; }
  .btn-primary:hover { background:color-mix(in srgb,var(--red) 88%,#000); }
  .ownernote { margin-top:18px; font-size:14px; color:var(--ink-soft); }
  a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }

/* ===== Events page (events.php, body.page-events) ===== */
.ev-controls { display:flex; flex-direction:column; gap:14px; margin:0 0 6px; }
.viewtabs { display:flex; gap:6px; flex-wrap:wrap; }
.viewtabs a { font-size:14px; font-weight:700; color:var(--ink-soft); text-decoration:none; padding:7px 15px; border:1px solid var(--hairline); border-radius:999px; }
.viewtabs a.active { color:#fff; background:var(--red); border-color:transparent; }
.viewtabs a:hover:not(.active) { border-color:var(--stone); }
.ev-row2 { display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:space-between; }
.navrow { display:flex; gap:10px; align-items:center; }
.navrow a { font-size:14px; font-weight:700; color:var(--red-ink); text-decoration:none; padding:7px 12px; border:1px solid var(--hairline); border-radius:9px; }
.navrow a:hover { border-color:var(--stone); }
.navrow .now { color:var(--ink-soft); font-weight:600; }
.ev-tools { display:flex; gap:10px; flex-wrap:wrap; }
.ev-tools input[type=search], .ev-tools select { font-family:"Karla",sans-serif; font-size:15px; color:var(--ink); background:var(--field); border:1px solid var(--hairline-2); border-radius:10px; padding:10px 13px; }
.ev-tools input[type=search] { flex:1 1 200px; min-width:150px; }
.ev-tools button { font-family:"Karla"; font-weight:700; font-size:14px; color:#fff; background:var(--red); border:0; border-radius:10px; padding:10px 18px; cursor:pointer; }
.period { font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:1.5rem; margin:18px 0 6px; color:var(--ink); }
.page-events .count { font-family:"IBM Plex Mono",monospace; font-size:12.5px; color:var(--stone); margin:0 0 20px; }
.ev-daylabel { font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); margin:26px 0 12px; padding-bottom:6px; border-bottom:1px solid var(--hairline); }
.ev-list { display:flex; flex-direction:column; gap:12px; }
.ev { display:block; background:var(--surface); border:1px solid var(--hairline); border-radius:14px; padding:16px 20px; text-decoration:none; color:inherit; transition:border-color .15s ease, transform .15s ease; }
.ev:hover { border-color:var(--red); transform:translateY(-1px); }
.ev .when { font-family:"IBM Plex Mono",monospace; font-size:12.5px; color:var(--red-ink); margin-bottom:4px; }
.onnow { color:var(--good); font-weight:700; }
.ev .etitle { font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:19px; color:var(--ink); line-height:1.2; }
.ev .emeta { font-size:14px; color:var(--ink-soft); margin-top:3px; }
.ev .eblurb { font-size:14.5px; color:var(--ink-soft); margin:8px 0 0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.page-events .empty { background:var(--surface); border:1px dashed var(--hairline-2); border-radius:16px; padding:34px; text-align:center; color:var(--ink-soft); }

/* ===== Privacy and terms pages ===== */
.legal h2 { font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:1.35rem; margin:34px 0 8px; color:var(--ink); }
.legal h3 { font-weight:700; font-size:1rem; margin:20px 0 4px; color:var(--ink); }
.legal p, .legal li { color:var(--ink); }
.legal ul { margin:8px 0 8px 2px; padding-left:20px; display:flex; flex-direction:column; gap:6px; }
.legal .meta { color:var(--ink-soft); font-size:14px; }
.legal table { width:100%; border-collapse:collapse; margin:10px 0; font-size:14.5px; }
.legal th, .legal td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--hairline); vertical-align:top; }
.legal a { color:var(--red-ink); }

/* ===== Formerly inline styles (public pages and the shared footer) ===== */
.svg-defs { position:absolute; }
.site-foot { max-width:1080px; margin:0 auto; padding:24px; font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--stone); display:flex; align-items:center; gap:12px; flex-wrap:wrap; border-top:1px solid var(--hairline); }
.site-foot__email { color:var(--red-ink); text-decoration:none; }
.site-foot__ver { opacity:.7; }
.site-foot__links { display:inline-flex; gap:14px; align-items:center; }
.site-foot__link { color:var(--stone); text-decoration:none; }
.site-foot__social { color:var(--stone); display:inline-flex; }
.lede.m-0 { margin:0; }
.link-pending { color:var(--ink-soft); }
.mt-18 { margin-top:18px; }
.ownernote.ownernote--claim { margin:0 0 10px; }
.report-row { margin:16px 0 0; }
.report-link { font-size:13px; color:var(--stone); text-decoration:none; }
.clear-link { color:var(--stone); }
.empty__text { margin:0 0 14px; }
.on-now { color:var(--good); font-weight:700; }
.ticket-row { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:20px; }
.free-pill { font-family:'IBM Plex Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--good); border:1px solid color-mix(in srgb,var(--good) 45%,transparent); border-radius:999px; padding:5px 12px; }
.price { font-size:17px; }
.btn-primary.btn-primary--pending { opacity:.5; cursor:default; }
.free { color:var(--good); }
.period__query { font-weight:400; color:var(--ink-soft); }
.legal .meta.mt-28 { margin-top:28px; }

/* brading.co.uk logo: red spire, ink tower (fill-rule evenodd cuts the window and door) */
.brand .legs .mark-body { fill: var(--ink); }

/* Mobile menu (assets/js/site.js adds the "js" class and opens/closes it).
   Without JavaScript the header stays as it was. */
.menu-toggle { display: none; }
header.topbar { position: relative; }
@media (max-width: 640px) {
  .js .menu-toggle {
    display: inline-flex; align-items: center; gap: 9px; min-height: 40px; padding: 0 13px;
    border: 1px solid var(--hairline); border-radius: 10px; background: var(--surface); color: var(--ink);
    font: 700 14px/1 Karla, sans-serif; cursor: pointer; margin-left: auto;
  }
  .js .menu-toggle:focus-visible { outline: 2px solid var(--gold, #b9862f); outline-offset: 2px; }
  .menu-icon, .menu-icon::before, .menu-icon::after { display: block; width: 16px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .2s, opacity .2s; }
  .menu-icon { position: relative; }
  .menu-icon::before, .menu-icon::after { content: ""; position: absolute; left: 0; }
  .menu-icon::before { top: -5px; }
  .menu-icon::after { top: 5px; }
  .menu-toggle[aria-expanded="true"] .menu-icon { background: transparent; }
  .menu-toggle[aria-expanded="true"] .menu-icon::before { transform: translateY(5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-icon::after { transform: translateY(-5px) rotate(-45deg); }
  .js .main-nav {
    display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 60;
    flex-direction: column; align-items: stretch; gap: 0; padding: 4px 16px 14px;
    background: var(--ground); border-bottom: 1px solid var(--hairline); box-shadow: 0 14px 28px rgba(0, 0, 0, .18);
  }
  .js .main-nav.is-open { display: flex; }
  .js .main-nav a, .js .main-nav .hide-sm { display: block; padding: 14px 2px; font-size: 16px; color: var(--ink); border-bottom: 1px solid var(--hairline); }
  .js .main-nav .status-pill { display: none; }
  .js .main-nav a.cta { margin-top: 12px; padding: 13px; border-bottom: 0; border-radius: 10px; text-align: center; color: #fff; }
}
