:root{
  --bk-bg: #FAFAFC;
  --bk-surface: #FFFFFF;
  --bk-ink: #172133;
  --bk-muted: #647089;
  --bk-accent: #2563EB;
  --bk-accent-2: #059669;
  --bk-border: #E6E9F0;
  --bk-shadow: 0 12px 28px rgba(15,23,42,.06);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bk-bg);color:var(--bk-ink);font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;line-height:1.65}
.bk-container{max-width:1160px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}

#bk-header{position:sticky;top:0;background:rgba(250,250,252,.92);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--bk-border);z-index:100}
.bk-header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.bk-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--bk-ink);font-weight:800}
.bk-brand-mark{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:8px;background:linear-gradient(135deg, var(--bk-accent), var(--bk-accent-2));color:#fff;box-shadow:var(--bk-shadow)}
.bk-brand-text{letter-spacing:.3px}

.bk-topnav{display:flex;gap:8px;align-items:center;justify-content:center}
.bk-topnav a{padding:10px 12px;text-decoration:none;color:var(--bk-ink);border-radius:10px}
.bk-topnav a:hover{background:#eef3ff}
.bk-active{background:#e6efff;outline:1px solid #d7e6ff}

.bk-nav-toggle{display:none;background:transparent;border:0;gap:4px;flex-direction:column}
.bk-bars{display:block;width:24px;height:2px;background:var(--bk-ink)}

.bk-hero{display:grid;grid-template-columns:1fr;gap:18px;padding:42px 0 8px}
.bk-h1{font-family:"Source Serif 4", Georgia, serif;font-size:44px;line-height:1.15;margin:0 0 14px}
.bk-h2{font-family:"Source Serif 4", Georgia, serif;font-size:30px;margin:26px 0 10px}
.bk-h3{font-family:"Source Serif 4", Georgia, serif;font-size:22px;margin:10px 0}
.bk-h4{font-weight:700;margin:0 0 8px}
.bk-lead{font-size:18px;color:var(--bk-muted)}
.bk-small{font-size:12px}
.bk-muted{color:var(--bk-muted)}

.bk-bullets{padding-left:22px}
.bk-bullets li{margin:6px 0}

.bk-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:14px 0 30px}
.bk-card{background:var(--bk-surface);border:1px solid var(--bk-border);border-radius:16px;padding:18px;box-shadow:var(--bk-shadow)}
.bk-link{color:var(--bk-accent);font-weight:600;text-decoration:none}
.bk-link:hover{text-decoration:underline}

.bk-article{background:var(--bk-surface);border:1px solid var(--bk-border);border-radius:16px;padding:24px;margin:18px 0;box-shadow:var(--bk-shadow)}
.bk-numbered{counter-reset:item;padding-left:0}
.bk-numbered li{list-style:none;margin:10px 0;padding-left:36px;position:relative}
.bk-numbered li::before{counter-increment:item;content:counter(item);position:absolute;left:0;top:0;width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#eef5ff;border:1px solid #dfe9ff;font-weight:700;color:#2b5fff}

.bk-glossary{display:grid;grid-template-columns:220px 1fr;gap:6px 18px}
.bk-glossary dt{font-weight:700}
.bk-glossary dd{margin:0;color:var(--bk-ink)}

#bk-briefs{margin-bottom:30px}
.bk-briefs-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.bk-brief{background:var(--bk-surface);border:1px solid var(--bk-border);border-radius:14px;padding:14px;box-shadow:var(--bk-shadow)}

.bk-form .bk-label{display:block;margin:10px 0}
.bk-input,.bk-textarea{width:100%;padding:12px;border-radius:12px;border:1px solid var(--bk-border);background:#fff;color:var(--bk-ink)}
.bk-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.bk-form-actions{display:flex;gap:10px;align-items:center;margin-top:12px}
.bk-btn{background:linear-gradient(135deg, var(--bk-accent), var(--bk-accent-2));border:0;color:#fff;padding:10px 14px;border-radius:12px;font-weight:700;cursor:pointer}
.bk-btn:hover{filter:brightness(1.05)}

#bk-footer{border-top:1px solid var(--bk-border);background:#f5f8ff}
.bk-footer-sections{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:24px 0}
.bk-footer-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--bk-border);padding:12px 0;color:var(--bk-muted)}
.bk-backtop{text-decoration:none}

.bk-list{list-style:none;padding-left:0;margin:0}
.bk-list li{margin:6px 0}

@media (max-width:1040px){ .bk-briefs-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:900px){
  .bk-grid3{grid-template-columns:1fr}
  .bk-footer-sections{grid-template-columns:1fr}
  .bk-glossary{grid-template-columns:1fr}
  .bk-nav-toggle{display:flex}
  .bk-topnav{position:fixed;inset:64px 0 auto 0;padding:12px 20px;background:#0f182b;border-bottom:1px solid var(--bk-border);transform:translateY(-120%);transition:.25s;flex-direction:column;gap:6px}
  .bk-topnav.bk-open{transform:translateY(0)}
  .bk-grid2{grid-template-columns:1fr}
}


/* --- v3 centering fixes --- */
#bk-header > .bk-container,
#bk-footer > .bk-container,
#bk-main > .bk-container,
#bk-main > section.bk-container,
#bk-main > .bk-article.bk-container {
  margin-left: auto !important;
  margin-right: auto !important;
}

#bk-main{ width:100%; }
#bk-footer{ width:100%; }
#bk-header{ width:100%; }

/* Prevent accidental shift by floats or transforms */
#bk-body{ transform: none !important; }
#bk-body, #bk-main, #bk-footer{ position: relative; left: 0; right: 0; }

/* Ensure scrollbar doesn't cause layout jump */
.bk-container{ max-width:1160px; padding-left:24px; padding-right:24px; }

/* Fix for file:// CSS caching differences */
@media all {
  html, body{ margin:0; padding:0; }
}


/* ===== v9: Sticky footer & animations ===== */
html, body { height: 100%; }
#bk-body { min-height: 100vh; display: flex; flex-direction: column; }
#bk-main { flex: 1 0 auto; }
#bk-footer { flex-shrink: 0; }

/* Smooth back-to-top scroll */
html { scroll-behavior: smooth; }

/* Global transitions */
a, .bk-btn { transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease; }
.bk-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(37,99,235,.18); }
.bk-card:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(15,23,42,.08); }
.bk-link:hover { text-decoration: underline; }

/* Reveal-on-scroll animation */
.bk-reveal { opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; }
.bk-reveal.in { opacity: 1; transform: translateY(0); }

/* Stagger helper */
.bk-stagger > * { opacity: 0; transform: translateY(12px); transition: opacity .6s ease, transform .6s ease; }
.bk-stagger.in > * { opacity: 1; transform: translateY(0); }
.bk-stagger.in > *:nth-child(1) { transition-delay: .05s; }
.bk-stagger.in > *:nth-child(2) { transition-delay: .1s; }
.bk-stagger.in > *:nth-child(3) { transition-delay: .15s; }
.bk-stagger.in > *:nth-child(4) { transition-delay: .2s; }
.bk-stagger.in > *:nth-child(5) { transition-delay: .25s; }
.bk-stagger.in > *:nth-child(6) { transition-delay: .3s; }

/* Header subtle shadow on scroll */
#bk-header.scrolled { box-shadow: 0 6px 18px rgba(15,23,42,.06); }

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
  .bk-reveal, .bk-stagger > *, .bk-card, .bk-btn, a { transition: none !important; transform: none !important; }
}


/* ===== v10: Brand micro-animations + scrollspy styles ===== */
.bk-brand { transition: transform .25s ease; will-change: transform; }
.bk-brand:hover { transform: translateY(-1px); }
.bk-brand-mark { position: relative; overflow: hidden; }
.bk-brand-mark::after {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(120px 60px at 0% 0%, rgba(255,255,255,.25), transparent 45%);
  opacity: 0; transition: opacity .25s ease;
}
.bk-brand:hover .bk-brand-mark::after { opacity: .9; }

/* Subtle idle pulse for brand gradient (respects reduced motion) */
@keyframes bkGradientPulse {
  0% { filter: hue-rotate(0deg) brightness(1); }
  50% { filter: hue-rotate(12deg) brightness(1.05); }
  100% { filter: hue-rotate(0deg) brightness(1); }
}
.bk-brand-mark { animation: bkGradientPulse 6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
  .bk-brand-mark { animation: none !important; }
}

/* Scrollspy active link */
.bk-topnav a.bk-current { background: #06022e; outline: 1px solid #c6dafd; }

/* Light theme — Scrollspy active link */
:root:not([data-theme="dark"]) .bk-topnav a.bk-current {
  background: #f0eff1;
  color: #204e94;            /* readable on dark pill */
  outline: 1px solid #9ec2ff;
  box-shadow: 0 8px 16px rgba(20, 30, 50, .18);
}


/* ===== v12: Theme toggle (light/dark) and TOC sidebar ===== */
:root{
  --bk-bg: #FAFAFC;
  --bk-surface: #FFFFFF;
  --bk-ink: #172133;
  --bk-muted: #647089;
  --bk-accent: #2563EB;
  --bk-accent-2: #059669;
  --bk-border: #E6E9F0;
  --bk-shadow: 0 12px 28px rgba(15,23,42,.06);
}
:root[data-theme="dark"]{
  --bk-bg: #0b1220;         /* deeper blue-black */
  --bk-surface: #0e1729;    /* card surface */
  --bk-ink: #e8f0ff;        /* primary text */
  --bk-muted: #9eb0c9;      /* secondary text */
  --bk-accent: #6da3ff;     /* primary accent */
  --bk-accent-2: #29d3a0;   /* secondary accent */
  --bk-border: #1a2740;     /* borders */
  --bk-shadow: 0 14px 32px rgba(3,9,22,.5);
}
html, body{ background: var(--bk-bg); color: var(--bk-ink); }

/* Theme toggle button */
.bk-theme-btn{
  margin-left:8px;
  border:1px solid var(--bk-border);
  background: var(--bk-surface);
  color: var(--bk-ink);
  border-radius:10px;
  padding:8px;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.bk-theme-btn:hover{ box-shadow: 0 6px 14px rgba(15,23,42,.08); transform: translateY(-1px); }

/* TOC sidebar */
#bk-main{ position: relative; }

.bk-toc-title{ font-weight:700; margin-bottom:8px; }
.bk-toc-list{ list-style:none; padding:0; margin:0; }
.bk-toc-list a{
  display:block; padding:6px 8px; margin:2px 0; text-decoration:none;
  color: var(--bk-ink); border-radius:8px;
}
.bk-toc-list a:hover{ background: rgba(37,99,235,.08); }
.bk-toc-list a.bk-current{ background:#dfeaff; outline:1px solid #c6dafd; }
:root[data-theme="dark"] .bk-toc-list a.bk-current{ background:#1e2a42; outline:1px solid #2d3b57; }

@media (max-width: 1100px){
  
}

/* Dark-specific surfaces */
:root[data-theme="dark"] .bk-card,
:root[data-theme="dark"] .bk-article,
:root[data-theme="dark"] .bk-footer-sections,
:root[data-theme="dark"] .bk-surface{
  background: var(--bk-surface);
  border-color: var(--bk-border);
  color: var(--bk-ink);
}
:root[data-theme="dark"] .bk-topnav a:hover{ background: #152238; }
:root[data-theme="dark"] .bk-active{ background: #182540; outline-color: #223355; }


/* ===== v13: smooth theme transitions ===== */
:root, :root * {
  transition: background-color .35s ease, color .35s ease, border-color .35s ease, box-shadow .35s ease;
}
/* Avoid animating layout-heavy props */
.bk-card, .bk-article, .bk-topnav a, .bk-btn, .bk-toc, .bk-footer-sections, #bk-header, #bk-footer {
  transition: background-color .35s ease, color .35s ease, border-color .35s ease, box-shadow .35s ease, transform .2s ease;
}
@media (prefers-reduced-motion: reduce){
  :root, :root * { transition: none !important; }
}

/* Theme button icon swap helpers */
.bk-theme-btn svg{ transition: transform .3s ease, opacity .2s ease; }
:root[data-theme="dark"] .bk-theme-btn svg{ transform: rotate(180deg); }

/* ===== v14: fixed TOC (no content shift) + icon fade ===== */
#bk-main{ position: relative; }

/* Desktop: fixed TOC aligned to container's right edge */
@media (min-width: 1101px){
  .bk-toc{
    position: fixed;
    top: 96px;
    right: calc( max(24px, (100vw - 1160px)/2) - 0px );
    width: 260px;
    max-height: calc(100vh - 120px);
    overflow: auto;
    background: var(--bk-surface);
    border:1px solid var(--bk-border);
    box-shadow: var(--bk-shadow);
    border-radius:12px;
    padding:12px;
    z-index: 20;
  }
  /* add right padding to content to avoid overlap when very wide */
  .bk-container{ padding-right: 24px; }
}

/* Mobile/tablet: hide TOC */
@media (max-width: 1100px){
  .bk-toc{ display:none; }
}

/* Icon fade for theme button */
.bk-theme-btn svg{ opacity:1; transition: opacity .2s ease, transform .3s ease; }
.bk-theme-btn.switching svg{ opacity:0; }


/* ===== v15: anchor offset + safe reveal fallback ===== */
[id]{ scroll-margin-top: 92px; } /* keep anchors visible under sticky header */
.bk-reveal.in{ opacity:1; transform:none; }
@supports not (anchor-name: --a){ /* no-op, just a grouping trick */ }

/* ===== v16: safe no-JS defaults ===== */
.nojs .bk-reveal { opacity: 1 !important; transform: none !important; }
.nojs .bk-stagger > * { opacity: 1 !important; transform: none !important; }


/* ===== v18: dark theme header & nav contrast ===== */
:root[data-theme="dark"] #bk-header{
  background: rgba(14, 23, 41, .92);
  border-bottom-color: #1a2740;
}
:root[data-theme="dark"] .bk-topnav a{
  color: var(--bk-ink);
}
:root[data-theme="dark"] .bk-topnav a:hover{
  background: #16243d;
}
:root[data-theme="dark"] .bk-active{
  background: #1c2e50;
  outline-color: #29426f;
}
:root[data-theme="dark"] .bk-theme-btn{
  background: #111a2c;
  border-color: #1a2740;
  color: var(--bk-ink);
}


/* ===== v19: dark footer full-width + link contrast ===== */
:root[data-theme="dark"] #bk-footer{
  background: #0e1729;            /* same tone as surfaces */
  border-top-color: #1a2740;
}
:root[data-theme="dark"] #bk-footer .bk-footer-bottom{
  background: #0e1729;
  border-top-color: #1a2740;
  color: var(--bk-muted);
}
/* Remove card look from footer grid in dark so it blends with footer bg */
:root[data-theme="dark"] .bk-footer-sections{
  background: transparent;
  border: none;
  box-shadow: none;
}
/* Footer links readable in both themes */
#bk-footer a:link, #bk-footer a:visited{
  color: var(--bk-accent);
  text-decoration: none;
}
#bk-footer a:hover{ text-decoration: underline; }


/* ===== v20: dark theme topnav contrast fix ===== */
:root[data-theme="dark"] .bk-topnav a{
  color: #d6e4ff;
}
:root[data-theme="dark"] .bk-topnav a.bk-active{
  background: #22324d;           /* darker pill for contrast */
  color: #f0f6ff;                /* bright text on pill */
  outline: 1px solid #35507b;
  box-shadow: 0 6px 14px rgba(20,30,50,.35);
}
:root[data-theme="dark"] .bk-topnav a:hover{
  background: #1b2942;
  color: #ffffff;
}
:root[data-theme="dark"] .bk-topnav a:focus{
  outline: 2px solid #4b6fb1;
  outline-offset: 2px;
}


/* ===== v21: dark theme active tab with BLACK text ===== */
:root[data-theme="dark"] .bk-topnav a.bk-active{
  background: #e9efff;   /* light pill for contrast in dark theme */
  color: #000000;        /* user request: black text */
  outline: 1px solid #c8d6ff;
  box-shadow: 0 8px 16px rgba(20,30,50,.25);
}
:root[data-theme="dark"] .bk-topnav a.bk-active:hover{
  background: #e3eaff;
  color: #000000;
}


/* ===== v22: ensure BLACK text on light pill (dark theme) ===== */
:root[data-theme="dark"] .bk-topnav a.bk-active,
:root[data-theme="dark"] .bk-topnav a.bk-active:link,
:root[data-theme="dark"] .bk-topnav a.bk-active:visited,
:root[data-theme="dark"] .bk-topnav a.bk-active:hover,
:root[data-theme="dark"] .bk-topnav a.bk-active:focus {
  background: #e9efff;
  color: #000000 !important;   /* force black text */
  outline: 1px solid #c8d6ff;
  box-shadow: 0 8px 16px rgba(20,30,50,.25);
  opacity: 1 !important;
}


/* ===== v23: Back-to-top floating button ===== */
#bk-fab-top{
  position: fixed;
  right: 24px;
  bottom: 24px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid var(--bk-border);
  background: var(--bk-surface);
  color: var(--bk-ink);
  display: grid;
  place-items: center;
  box-shadow: 0 14px 28px rgba(15,23,42,.18);
  cursor: pointer;
  z-index: 60;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .25s ease, transform .25s ease, background-color .25s ease, color .25s ease, border-color .25s ease;
}
#bk-fab-top svg{ width: 20px; height: 20px; }
#bk-fab-top:hover{ transform: translateY(6px); }
#bk-fab-top.bk-show{ opacity: 1; transform: translateY(0); }
#bk-fab-top:focus{ outline: 2px solid var(--bk-accent); outline-offset: 2px; }

:root[data-theme="dark"] #bk-fab-top{
  background: #111a2c;
  border-color: #1a2740;
  color: var(--bk-ink);
  box-shadow: 0 18px 32px rgba(0,0,0,.45);
}

@media (max-width: 520px){
  #bk-fab-top{ right: 16px; bottom: 16px; }
}

@media (prefers-reduced-motion: reduce){
  #bk-fab-top{ transition: none; transform: none; }
}


/* ===== v24: Neon RGB highlight + bigger FAB ===== */

/* Neon animation */
@keyframes bkNeonCycle {
  0%   { --bk-neon: rgba(37,99,235,.85); }
  25%  { --bk-neon: rgba(16,185,129,.85); }
  50%  { --bk-neon: rgba(250,204,21,.9); }
  75%  { --bk-neon: rgba(236,72,153,.9); }
  100% { --bk-neon: rgba(37,99,235,.85); }
}

/* Interactive elements get neon on hover/focus */
.bk-neon, 
a, button, .bk-btn, .bk-topnav a, 
input.bk-input, textarea.bk-textarea, select.bk-input, 
.bk-card {
  position: relative;
  z-index: 0;
  outline: none;
  transition: box-shadow .25s ease, transform .2s ease;
}

/* Neon ring using box-shadows (no heavy filters, good perf) */
a:hover, a:focus-visible,
button:hover, button:focus-visible,
.bk-btn:hover, .bk-btn:focus-visible,
.bk-topnav a:hover, .bk-topnav a:focus-visible,
input.bk-input:focus, textarea.bk-textarea:focus, select.bk-input:focus,
.bk-card:hover, .bk-card:focus-within {
  animation: bkNeonCycle 3.2s linear infinite;
  box-shadow:
    0 0 0 2px rgba(255,255,255,.12),
    0 0 14px var(--bk-neon),
    0 0 26px calc(var(--bk-neon));
}

/* Keep active topnav pill style + neon rim */
.bk-topnav a.bk-active {
  box-shadow:
    0 0 0 1px rgba(255,255,255,.12),
    0 0 16px rgba(125,170,255,.28),
    0 0 32px rgba(125,170,255,.20);
}

/* Larger back-to-top FAB with neon hover */
#bk-fab-top{
  width: 56px;
  height: 56px;
}
#bk-fab-top svg{ width: 26px; height: 26px; }
#bk-fab-top:hover{ transform: translateY(4px) scale(1.03); }
#bk-fab-top:focus-visible{ outline: 2px solid var(--bk-accent); }

/* Neon aura around FAB */
#bk-fab-top::after{
  content:"";
  position:absolute; inset:-6px;
  border-radius:inherit;
  pointer-events:none;
  opacity:0; transition: opacity .25s ease;
  background: radial-gradient(40% 40% at 50% 50%, rgba(125,170,255,.45), transparent 60%);
}
#bk-fab-top:hover::after, #bk-fab-top.bk-show::after{ opacity:.9; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  a:hover, a:focus-visible,
  button:hover, button:focus-visible,
  .bk-btn:hover, .bk-btn:focus-visible,
  .bk-topnav a:hover, .bk-topnav a:focus-visible,
  input.bk-input:focus, textarea.bk-textarea:focus, select.bk-input:focus,
  .bk-card:hover, .bk-card:focus-within {
    animation: none !important;
    box-shadow: 0 0 0 2px rgba(255,255,255,.12);
  }
}


/* ===== v25: text selection + click ripple ===== */
/* Neon text selection (light) */
::selection{
  background: rgba(37,99,235,.35); /* blue glow */
  color: #0b1220;
}
/* Neon text selection (dark) */
:root[data-theme="dark"] ::selection{
  background: rgba(109,163,255,.45);
  color: #0b1220;
}

/* Ripple flash for interactive elements */
.bk-card, .bk-btn { overflow: visible; position: relative; }
.bk-card::after, .bk-btn::after{
  content:"";
  position:absolute;
  left: var(--x, 50%);
  top: var(--y, 50%);
  width: 16px; height: 16px;
  transform: translate(-50%,-50%) scale(0);
  border-radius: 999px;
  background: radial-gradient( circle at center, rgba(125,170,255,.55), rgba(125,170,255,.25) 40%, transparent 60% );
  pointer-events:none;
  opacity: 0;
}
.bk-card.bk-flash::after, .bk-btn.bk-flash::after{
  animation: bkRipple .6s ease-out forwards;
}

@keyframes bkRipple{
  0%{ transform: translate(-50%,-50%) scale(0); opacity: .55; }
  100%{ transform: translate(-50%,-50%) scale(22); opacity: 0; }
}

@media (prefers-reduced-motion: reduce){
  .bk-card.bk-flash::after, .bk-btn.bk-flash::after{ animation: none; opacity: 0; }
}


/* ===== v26: robust neon halo (not clipped) ===== */
@keyframes bkHueSpin { from { filter: hue-rotate(0deg); } to { filter: hue-rotate(360deg); } }

/* Base styles: ensure target elements form a containing block */
.bk-card, .bk-btn, .bk-topnav a, #bk-fab-top{
  position: relative;
  z-index: 0;
}

/* Neon halo on ::before */
.bk-card::before,
.bk-btn::before,
.bk-topnav a::before,
#bk-fab-top::before{
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s ease;
  box-shadow:
    0 0 10px rgba(125,170,255,.35),
    0 0 22px rgba(37,99,235,.35),
    0 0 34px rgba(37,99,235,.25);
}

/* Show + animate hue on interaction */
.bk-card:hover::before, .bk-card:focus-within::before,
.bk-btn:hover::before, .bk-btn:focus-visible::before,
.bk-topnav a:hover::before, .bk-topnav a:focus-visible::before,
#bk-fab-top:hover::before, #bk-fab-top:focus-visible::before{
  opacity: 1;
  animation: bkHueSpin 6s linear infinite;
  filter: hue-rotate(0deg);
}

/* Dark theme stronger glow */
:root[data-theme="dark"] .bk-card::before,
:root[data-theme="dark"] .bk-btn::before,
:root[data-theme="dark"] .bk-topnav a::before,
:root[data-theme="dark"] #bk-fab-top::before{
  box-shadow:
    0 0 12px rgba(125,170,255,.55),
    0 0 28px rgba(109,163,255,.45),
    0 0 42px rgba(37,99,235,.35);
}


/* ===== v27: form-field neon focus + active nav/TOC glow ===== */

/* Inputs/Textareas: stronger neon on focus */
.bk-input, .bk-textarea, select.bk-input{
  position: relative;
  z-index: 0;
  outline: none;
}
.bk-input:focus, .bk-textarea:focus, select.bk-input:focus{
  animation: bkHueSpin 6s linear infinite;
  box-shadow:
    0 0 0 2px rgba(255,255,255,.12),
    0 0 16px rgba(125,170,255,.45),
    0 0 32px rgba(37,99,235,.35);
  border-color: transparent;
}
/* Subtle default focus for accessibility when motion reduced */
@media (prefers-reduced-motion: reduce){
  .bk-input:focus, .bk-textarea:focus, select.bk-input:focus{
    animation: none !important;
    box-shadow: 0 0 0 2px rgba(125,170,255,.55);
  }
}

/* Persistent glow for active TOPNAV item */
.bk-topnav a.bk-active,
.bk-topnav a.bk-current{
  position: relative;
  z-index: 0;
}
.bk-topnav a.bk-active::before,
.bk-topnav a.bk-current::before{
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 12px;
  pointer-events: none;
  opacity: 1;
  box-shadow:
    0 0 10px rgba(125,170,255,.35),
    0 0 22px rgba(37,99,235,.30),
    0 0 34px rgba(37,99,235,.22);
  animation: bkHueSpin 8s linear infinite;
}
:root[data-theme="dark"] .bk-topnav a.bk-active::before,
:root[data-theme="dark"] .bk-topnav a.bk-current::before{
  box-shadow:
    0 0 12px rgba(125,170,255,.55),
    0 0 28px rgba(109,163,255,.45),
    0 0 42px rgba(37,99,235,.35);
}

/* Persistent glow for active TOC item */
.bk-toc .bk-toc-list a.bk-current{
  position: relative;
  z-index: 0;
}
.bk-toc .bk-toc-list a.bk-current::before{
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 10px;
  pointer-events: none;
  opacity: 1;
  box-shadow:
    0 0 8px rgba(125,170,255,.35),
    0 0 18px rgba(37,99,235,.28);
  animation: bkHueSpin 8s linear infinite;
}
:root[data-theme="dark"] .bk-toc .bk-toc-list a.bk-current::before{
  box-shadow:
    0 0 10px rgba(125,170,255,.55),
    0 0 24px rgba(109,163,255,.45);
}


/* ===== v28: section glow on selection (anchor target) ===== */
/* Subtle persistent glow for any element targeted by hash */


:root[data-theme="dark"] 

/* Strong but short pulse when a section becomes selected */
@keyframes bkTargetPulse {
  0%   { box-shadow: 0 0 0 3px rgba(255,255,255,.14), 0 0 22px rgba(125,170,255,.65), 0 0 44px rgba(37,99,235,.45); }
  60%  { box-shadow: 0 0 0 2px rgba(255,255,255,.10), 0 0 16px rgba(125,170,255,.40), 0 0 32px rgba(37,99,235,.30); }
  100% { box-shadow: 0 0 0 2px rgba(255,255,255,.10), 0 0 14px rgba(125,170,255,.30), 0 0 26px rgba(37,99,235,.22); }
}

.bk-section.bk-selected{
  position: relative;
  border-radius: 12px;
  animation: bkTargetPulse 1.2s ease-out forwards;
}
.bk-section.bk-selected::before{
  content:"";
  position:absolute; inset:-6px; border-radius:inherit; pointer-events:none;
  animation: bkHueSpin 6s linear infinite;
  box-shadow:
    0 0 14px rgba(125,170,255,.55),
    0 0 32px rgba(109,163,255,.45),
    0 0 54px rgba(37,99,235,.35);
}


/* ===== v29: section wrappers ===== */
.bk-section{
  background: var(--bk-surface);
  border: 1px solid var(--bk-border);
  border-radius: 16px;
  padding: 18px;
  margin: 16px 0;
  box-shadow: var(--bk-shadow);
}

/* Make anchors land nicely */
.bk-section{ scroll-margin-top: 96px; }

/* Highlight entire section on :target */
.bk-section:target{
  position: relative;
  z-index: 0;
  box-shadow:
    0 0 0 2px rgba(255,255,255,.10),
    0 0 18px rgba(125,170,255,.38),
    0 0 36px rgba(37,99,235,.28);
}
.bk-section:target::before{
  content:"";
  position:absolute; inset:-8px; border-radius:18px; pointer-events:none;
  box-shadow:
    0 0 14px rgba(125,170,255,.55),
    0 0 32px rgba(109,163,255,.45),
    0 0 54px rgba(37,99,235,.35);
  animation: bkHueSpin 8s linear infinite;
}

/* Transient pulse on selection */
.bk-section.bk-section.bk-selected{
  animation: bkTargetPulse 1.2s ease-out forwards;
}
.bk-section.bk-section.bk-selected::before{
  content:""; position:absolute; inset:-8px; border-radius:18px; pointer-events:none;
  animation: bkHueSpin 6s linear infinite;
  box-shadow:
    0 0 16px rgba(125,170,255,.65),
    0 0 38px rgba(109,163,255,.50),
    0 0 64px rgba(37,99,235,.40);
}


/* ===== v31: neon on SECTION hover (not on headings) ===== */
.bk-section{
  position: relative;
  z-index: 0;
}
/* default: no neon visible */
.bk-section::before{
  content:"";
  position:absolute; inset:-8px;
  border-radius:18px;
  pointer-events:none;
  opacity:0;
  transition: opacity .25s ease;
  box-shadow:
    0 0 12px rgba(125,170,255,.45),
    0 0 26px rgba(37,99,235,.30),
    0 0 42px rgba(37,99,235,.22);
}
/* hover/focus-within: show neon aura, animate hues */
.bk-section:hover::before,
.bk-section:focus-within::before{
  opacity:1;
  animation: bkHueSpin 8s linear infinite;
}
/* strengthen in dark theme */
:root[data-theme="dark"] .bk-section::before{
  box-shadow:
    0 0 16px rgba(125,170,255,.60),
    0 0 34px rgba(109,163,255,.50),
    0 0 58px rgba(37,99,235,.40);
}

/* ensure headings themselves DO NOT get neon: reset any pseudo-glow */
.bk-section h1::before,
.bk-section h2::before,
.bk-section h3::before,
.bk-section h4::before,
.bk-section h5::before,
.bk-section h6::before{
  content: none !important;
}


/* ===== v32: FAB visibility, contrast, safe-area, z-index ===== */
#bk-fab-top{
  position: fixed;
  right: max(16px, env(safe-area-inset-right, 16px));
  bottom: calc(max(20px, env(safe-area-inset-bottom, 0px)) + 6px);
  width: 60px;
  height: 60px;
  border-radius: 999px;
  border: 1px solid var(--bk-border);
  background: var(--bk-surface);
  color: var(--bk-ink);
  display: grid;
  place-items: center;
  box-shadow: 0 20px 36px rgba(15,23,42,.25), 0 0 0 3px rgba(255,255,255,.06) inset;
  cursor: pointer;
  z-index: 9999;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .25s ease, transform .25s ease, background-color .25s ease, color .25s ease, border-color .25s ease;
  mix-blend-mode: normal;
}
#bk-fab-top svg{ width: 28px; height: 28px; }
#bk-fab-top:hover{ transform: translateY(4px) scale(1.03); }
#bk-fab-top.bk-show{ opacity: 1; transform: translateY(0); }
#bk-fab-top:focus{ outline: 2px solid var(--bk-accent); outline-offset: 2px; }

:root[data-theme="dark"] #bk-fab-top{
  background: #16233b;       /* brighter than page to pop */
  border-color: #35507b;
  color: #e8f0ff;
  box-shadow: 0 22px 38px rgba(0,0,0,.55), 0 0 0 3px rgba(26,39,64,.65) inset;
}

/* Soft neon aura */
#bk-fab-top::before{
  content:"";
  position:absolute; inset:-8px; border-radius:inherit; pointer-events:none;
  opacity:.9;
  background: radial-gradient(40% 40% at 50% 50%, rgba(125,170,255,.30), transparent 60%);
}

@media (max-width: 520px){
  #bk-fab-top{ right: max(12px, env(safe-area-inset-right, 12px)); bottom: calc(max(12px, env(safe-area-inset-bottom, 0px)) + 4px); width:54px; height:54px; }
  #bk-fab-top svg{ width:24px; height:24px; }
}


/* ===== v34: prevent TOC overlapping content ===== */
@media (min-width: 1101px){
  body.bk-has-toc #bk-main .bk-container{
    /* reserve space for the sidebar (TOC width + gap) */
    padding-right: clamp(280px, 24vw, 340px);
  }
}


/* ===== v35: Smart sticky TOC + toggle ===== */
/* TOC reveal/hide with animation */
.bk-toc{
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity .25s ease, transform .25s ease;
}
.bk-toc.bk-show{ opacity: 1; transform: translateY(0); }

/* Collapse (slide out to the right, keep a thin edge visible for focus) */
.bk-toc.bk-collapsed{
  transform: translateX(108%) translateY(0);
  opacity: .85;
}

/* Header row for toggle */
.bk-toc .bk-toc-title-wrap{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  margin-bottom:8px;
}
.bk-toc-toggle{
  border:1px solid var(--bk-border);
  background: var(--bk-surface);
  color: var(--bk-ink);
  border-radius:10px;
  cursor:pointer;
  padding:6px 8px;
  line-height:0;
}
.bk-toc-toggle svg{ width:18px; height:18px; }
.bk-toc-toggle:hover{ box-shadow: 0 6px 14px rgba(15,23,42,.08); transform: translateY(-1px); }

/* When collapsed, also remove right padding reservation to avoid empty gutter */
@media (min-width: 1101px){
  body.bk-has-toc:not(.bk-toc-off) #bk-main .bk-container{ padding-right: clamp(280px, 24vw, 340px); }
  body.bk-has-toc.bk-toc-off #bk-main .bk-container{ padding-right: 24px; }
}

/* Dark theme for toggle */
:root[data-theme="dark"] .bk-toc, :root[data-theme="dark"] .bk-toc-toggle{
  background: #0e1729;
  border-color: #1a2740;
  color: var(--bk-ink);
}


/* ===== v36: Hero banner with Ken Burns + parallax + glow ===== */
.bk-hero-banner{
  position: relative;
  height: clamp(280px, 46vh, 420px);
  border-radius: 18px;
  overflow: hidden;
  background: #0b1220;
  border: 1px solid var(--bk-border);
  box-shadow: var(--bk-shadow);
  margin-bottom: 18px;
  isolation: isolate;
}
.bk-hero-banner::after{
  /* top gradient for readability */
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.08) 35%, transparent 60%);
  z-index: 2;
  pointer-events: none;
}
.bk-hero-banner::before{
  /* soft neon glow */
  content:"";
  position:absolute; inset:-8px; border-radius: 22px;
  box-shadow:
    0 0 32px rgba(109,163,255,.35),
    0 0 64px rgba(37,99,235,.25);
  z-index: 0; pointer-events:none;
}

/* Image itself */
.bk-hero-img{
  position:absolute;
  left:50%; top:50%;
  transform: translate(-50%, -50%) scale(1) rotate(.001deg);
  width: 120%; height: auto; min-height: 100%;
  opacity: 0;
  will-change: transform, opacity;
  z-index: 1;
  animation: bkHeroFade .9s ease .05s forwards, bkKenBurns 26s ease-in-out .2s infinite alternate;
  filter: saturate(1.08) contrast(1.02);
}
@keyframes bkHeroFade{ from{ opacity: 0; transform: translate(-50%, -52%) scale(1.06);} to{ opacity: 1; transform: translate(-50%, -50%) scale(1);} }
@keyframes bkKenBurns{
  0%   { transform: translate(calc(-50% + var(--px,0px)), calc(-50% + var(--py,0px))) scale(1.02) rotate(.001deg); }
  100% { transform: translate(calc(-48% + var(--px,0px)), calc(-52% + var(--py,0px))) scale(1.08) rotate(.001deg); }
}

/* Dark theme tune */
:root[data-theme="dark"] .bk-hero-banner::after{
  background: linear-gradient(180deg, rgba(0,0,0,.30), rgba(0,0,0,.18) 38%, transparent 62%);
}

/* v37: hero image wrapper for <picture> */
.bk-hero-imgwrap, .bk-hero-imgwrap img{
  position:absolute; inset:0; width:100%; height:100%;
}
.bk-hero-imgwrap img{
  object-fit: cover;
  transform: translate(-50%, -50%) scale(1) rotate(.001deg);
  left:50%; top:50%;
}


/* ===== v38: Rain overlay for hero banner ===== */
.bk-hero-rain, .bk-hero-rain .bk-rain{
  position:absolute; inset:0; pointer-events:none;
}
.bk-hero-rain{ z-index:3; mix-blend-mode: screen; opacity:.65; }

/* Layer 1: fine drizzle */
.bk-hero-rain .bk-rain.l1{
  background-image: repeating-linear-gradient(-18deg,
    rgba(180,200,255,0) 0 2px,
    rgba(160,190,255,.35) 2px 3px,
    rgba(180,200,255,0) 3px 7px);
  background-size: 8px 18px;
  animation: bkRain1 1.3s linear infinite;
  opacity:.75;
}

/* Layer 2: medium streaks */
.bk-hero-rain .bk-rain.l2{
  background-image: repeating-linear-gradient(-18deg,
    rgba(180,200,255,0) 0 2px,
    rgba(140,170,245,.28) 2px 3px,
    rgba(180,200,255,0) 3px 9px);
  background-size: 10px 24px;
  animation: bkRain2 1.9s linear infinite;
  opacity:.55;
}

/* Layer 3: soft big streaks (slow) */
.bk-hero-rain .bk-rain.l3{
  background-image: repeating-linear-gradient(-18deg,
    rgba(180,200,255,0) 0 3px,
    rgba(120,150,235,.22) 3px 4px,
    rgba(180,200,255,0) 4px 12px);
  background-size: 12px 30px;
  animation: bkRain3 2.8s linear infinite;
  opacity:.40;
}

/* Keyframes: move diagonally down-right for each layer */
@keyframes bkRain1{ from{ background-position: 0 -40px; } to{ background-position: -40px 40px; } }
@keyframes bkRain2{ from{ background-position: 0 -60px; } to{ background-position: -60px 60px; } }
@keyframes bkRain3{ from{ background-position: 0 -80px; } to{ background-position: -80px 80px; } }

/* Dark theme: slightly stronger visibility */
:root[data-theme="dark"] .bk-hero-rain{ opacity:.8; }

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce){
  .bk-hero-rain .bk-rain{ animation: none !important; }
}


/* ===== v39: Neon hover for Knowledge briefs cards ===== */
.bk-brief{
  position: relative;
  z-index: 0;
  outline: none;
}
.bk-brief::before{
  content:"";
  position:absolute; inset:-8px;
  border-radius: 18px;
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s ease;
  box-shadow:
    0 0 12px rgba(125,170,255,.45),
    0 0 26px rgba(37,99,235,.30),
    0 0 42px rgba(37,99,235,.22);
}
.bk-brief:hover::before,
.bk-brief:focus-visible::before,
.bk-brief:focus-within::before{
  opacity: 1;
  animation: bkHueSpin 8s linear infinite;
}
:root[data-theme="dark"] .bk-brief::before{
  box-shadow:
    0 0 16px rgba(125,170,255,.60),
    0 0 34px rgba(109,163,255,.50),
    0 0 58px rgba(37,99,235,.40);
}
@media (prefers-reduced-motion: reduce){
  .bk-brief:hover::before,
  .bk-brief:focus-visible::before,
  .bk-brief:focus-within::before{ animation: none !important; }
}


/* ===== v40: Inputs use BLACK text on white fields (all themes) ===== */
.bk-input, .bk-textarea, select.bk-input{
  color: #0b1220 !important;      /* dark ink */
  caret-color: #0b1220 !important;
  background: #ffffff !important; /* keep white field for readability */
}
/* Placeholders darker (not white) */
.bk-input::placeholder, .bk-textarea::placeholder{
  color: #475569 !important;      /* slate-600 */
  opacity: 1;
}

/* Dark theme keeps black text on white inputs */
:root[data-theme="dark"] .bk-input,
:root[data-theme="dark"] .bk-textarea,
:root[data-theme="dark"] select.bk-input{
  color: #0b1220 !important;
  background: #ffffff !important;
}

/* Autofill (Chrome/WebKit) */
input.bk-input:-webkit-autofill,
textarea.bk-textarea:-webkit-autofill,
select.bk-input:-webkit-autofill{
  -webkit-text-fill-color: #0b1220 !important;
  caret-color: #0b1220 !important;
  transition: background-color 9999s ease-in-out 0s;
}

/* Disabled/read-only keep readable gray text */
.bk-input:disabled, .bk-textarea:disabled, select.bk-input:disabled,
.bk-input[readonly], .bk-textarea[readonly]{
  color: #334155 !important;      /* slate-700 */
}


/* ===== v41: wider spacing for top navigation, avoid overlap ===== */
:root{ --bk-nav-gap: 18px; }
#bk-topnav{ display:flex; gap: var(--bk-nav-gap); flex-wrap: wrap; align-items: center; }
.bk-topnav a{ margin: 0; padding: 10px 18px; }
/* Reduce neon aura overflow specifically on nav items */
#bk-topnav a::before{ inset: -4px; }

@media (max-width: 1200px){
  :root{ --bk-nav-gap: 14px; }
  .bk-topnav a{ padding: 9px 16px; }
}
@media (max-width: 900px){
  :root{ --bk-nav-gap: 10px; }
  .bk-topnav a{ padding: 8px 14px; }
}


/* ===== v42: Fly-in on scroll (homepage) ===== */
:root{ --bk-fly-ease: cubic-bezier(.22,.61,.36,1); }
.bk-fly{
  opacity: 0;
  transform: translateY(16px) scale(.98);
  transition: transform .60s var(--bk-fly-ease), opacity .60s var(--bk-fly-ease);
  transition-delay: var(--d, 0ms);
  will-change: transform, opacity;
}
.bk-fly[data-fly="left"]{ transform: translateX(-22px) scale(.98); }
.bk-fly[data-fly="right"]{ transform: translateX(22px) scale(.98); }
.bk-fly.in{ opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce){
  .bk-fly{ opacity: 1 !important; transform: none !important; transition: none !important; }
}


/* ===== v43: Smooth scale-up on highlight ===== */
:root{ --bk-spring: cubic-bezier(.2,.7,.2,1); }

/* Common base to avoid layout shift and enable GPU rendering */
.bk-section,
.bk-brief{
  transform: translateZ(0) scale(1);
  transition: transform .35s var(--bk-spring), box-shadow .35s var(--bk-spring);
  transform-origin: center;
}

/* Hover/focus enlarge */
.bk-section:hover,
.bk-section:focus-within,
.bk-brief:hover,
.bk-brief:focus-within{
  transform: scale(1.03);
}

/* Selected/targeted: a bit stronger and with tiny overshoot */
@keyframes bkPopIn{
  0%{ transform: scale(1); }
  55%{ transform: scale(1.035); }
  100%{ transform: scale(1.02); }
}
.bk-section:target,
.bk-section.bk-selected{
  transform: scale(1.02);
  animation: bkPopIn .42s var(--bk-spring) both;
}

/* Ensure raised element is visually above neighbors when scaled */
.bk-section:hover, .bk-section:focus-within, .bk-section:target, .bk-section.bk-selected,
.bk-brief:hover, .bk-brief:focus-within{
  position: relative;
  z-index: 5;
  box-shadow: 0 12px 28px rgba(15,23,42,.35), var(--bk-shadow);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .bk-section, .bk-brief{ transition: none !important; animation: none !important; transform: none !important; }
}


/* ===== v44: higher-contrast email links in dark theme ===== */
:root[data-theme="dark"] .bk-article a[href^="mailto:"],
:root[data-theme="dark"] #bk-footer a[href^="mailto:"]{
  color: #7ce1ff !important;          /* bright cyan */
  text-decoration: none;
  text-shadow: 0 0 8px rgba(124,225,255,.28);
  font-weight: 600;
}
:root[data-theme="dark"] .bk-article a[href^="mailto:"]:visited,
:root[data-theme="dark"] #bk-footer a[href^="mailto:"]:visited{
  color: #7ce1ff !important;
}
:root[data-theme="dark"] .bk-article a[href^="mailto:"]:hover,
:root[data-theme="dark"] #bk-footer a[href^="mailto:"]:hover{
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  color: #a8eeff !important;
}
:root[data-theme="dark"] .bk-article a[href^="mailto:"]:focus-visible,
:root[data-theme="dark"] #bk-footer a[href^="mailto:"]:focus-visible{
  outline: 2px solid #7ce1ff;
  outline-offset: 2px;
  border-radius: 6px;
}
@media (prefers-contrast: more){
  :root[data-theme="dark"] .bk-article a[href^="mailto:"],
  :root[data-theme="dark"] #bk-footer a[href^="mailto:"]{
    color: #b9f3ff !important;
    text-shadow: none;
  }
}


/* ===== v45: Light theme mailto styling (distinct color) ===== */
:root:not([data-theme="dark"]) .bk-article a[href^="mailto:"],
:root:not([data-theme="dark"]) #bk-footer a[href^="mailto:"]{
  color: #2b6cff !important;            /* royal blue for light theme */
  text-decoration: none;
  text-shadow: 0 0 6px rgba(43,108,255,.15);
  font-weight: 600;
}
:root:not([data-theme="dark"]) .bk-article a[href^="mailto:"]:visited,
:root:not([data-theme="dark"]) #bk-footer a[href^="mailto:"]:visited{
  color: #2b6cff !important;
}
:root:not([data-theme="dark"]) .bk-article a[href^="mailto:"]:hover,
:root:not([data-theme="dark"]) #bk-footer a[href^="mailto:"]:hover{
  color: #4c86ff !important;            /* brighter on hover */
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
:root:not([data-theme="dark"]) .bk-article a[href^="mailto:"]:focus-visible,
:root:not([data-theme="dark"]) #bk-footer a[href^="mailto:"]:focus-visible{
  outline: 2px solid #2b6cff;
  outline-offset: 2px;
  border-radius: 6px;
}
@media (prefers-contrast: more){
  :root:not([data-theme="dark"]) .bk-article a[href^="mailto:"],
  :root:not([data-theme="dark"]) #bk-footer a[href^="mailto:"]{
    color: #143ea6 !important;          /* deeper for max contrast */
    text-shadow: none;
  }
}


/* ===== v46: phone (tel:) links styled like mailto ===== */
/* Dark theme */
:root[data-theme="dark"] .bk-article a[href^="tel:"],
:root[data-theme="dark"] #bk-footer a[href^="tel:"]{
  color: #7ce1ff !important;
  text-decoration: none;
  text-shadow: 0 0 8px rgba(124,225,255,.28);
  font-weight: 600;
}
:root[data-theme="dark"] .bk-article a[href^="tel:"]:visited,
:root[data-theme="dark"] #bk-footer a[href^="tel:"]:visited{
  color: #7ce1ff !important;
}
:root[data-theme="dark"] .bk-article a[href^="tel:"]:hover,
:root[data-theme="dark"] #bk-footer a[href^="tel:"]:hover{
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  color: #a8eeff !important;
}
:root[data-theme="dark"] .bk-article a[href^="tel:"]:focus-visible,
:root[data-theme="dark"] #bk-footer a[href^="tel:"]:focus-visible{
  outline: 2px solid #7ce1ff;
  outline-offset: 2px;
  border-radius: 6px;
}

/* Light theme */
:root:not([data-theme="dark"]) .bk-article a[href^="tel:"],
:root:not([data-theme="dark"]) #bk-footer a[href^="tel:"]{
  color: #2b6cff !important;
  text-decoration: none;
  text-shadow: 0 0 6px rgba(43,108,255,.15);
  font-weight: 600;
}
:root:not([data-theme="dark"]) .bk-article a[href^="tel:"]:visited,
:root:not([data-theme="dark"]) #bk-footer a[href^="tel:"]:visited{
  color: #2b6cff !important;
}
:root:not([data-theme="dark"]) .bk-article a[href^="tel:"]:hover,
:root:not([data-theme="dark"]) #bk-footer a[href^="tel:"]:hover{
  color: #4c86ff !important;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
:root:not([data-theme="dark"]) .bk-article a[href^="tel:"]:focus-visible,
:root:not([data-theme="dark"]) #bk-footer a[href^="tel:"]:focus-visible{
  outline: 2px solid #2b6cff;
  outline-offset: 2px;
  border-radius: 6px;
}


/* ===== v47: brief card media block ===== */
.bk-brief-media{
  position: relative;
  margin: 10px 10px 14px;
  border-radius: 14px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--bk-border);
  box-shadow: var(--bk-shadow);
  height: 160px;
}
@media (min-width: 980px){
  .bk-brief-media{ height: 180px; }
}
.bk-brief-media picture, .bk-brief-media img{
  position:absolute; inset:0; width:100%; height:100%;
}
.bk-brief-media img{ object-fit: cover; transform: scale(1.02) translateZ(0); filter: saturate(1.06) contrast(1.02); }

/* soft gradient for readability */
.bk-brief-media::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.0) 40%, rgba(0,0,0,.18));
  z-index:1; pointer-events:none;
}

/* Ken Burns on hover/focus-within of the card */
@keyframes bkKBBrief {
  0% { transform: scale(1.02); }
  100% { transform: scale(1.08); }
}
.bk-brief:hover .bk-brief-media img,
.bk-brief:focus-within .bk-brief-media img{
  animation: bkKBBrief 8s ease-in-out infinite alternate;
}

/* Neon rim on hover for the media itself */
.bk-brief:hover .bk-brief-media::before,
.bk-brief:focus-within .bk-brief-media::before{
  content:""; position:absolute; inset:-6px; border-radius:16px; pointer-events:none;
  box-shadow: 0 0 14px rgba(125,170,255,.45), 0 0 28px rgba(37,99,235,.30);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .bk-brief:hover .bk-brief-media img,
  .bk-brief:focus-within .bk-brief-media img{ animation: none !important; transform: none !important; }
}


/* ===== v51: Hover scale for the Quick Start grid section ===== */
#bk-quick-start{
  position: relative;
  transform: translateZ(0) scale(1);
  transform-origin: center center;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s cubic-bezier(.2,.7,.2,1);
  will-change: transform;
  z-index: 0;
}
#bk-quick-start:hover,
#bk-quick-start:focus-within{
  transform: scale(1.02);
  z-index: 3;
}
/* small lift for inner cards while the section is hovered */
#bk-quick-start:hover .bk-card,
#bk-quick-start:focus-within .bk-card{
  transform: translateY(-2px);
  transition: transform .35s cubic-bezier(.2,.7,.2,1);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  #bk-quick-start{ transition: none !important; transform: none !important; }
  #bk-quick-start:hover, #bk-quick-start:focus-within{ transform: none !important; }
  #bk-quick-start .bk-card{ transform: none !important; }
}


/* ===== v52: Brand / logo animations ===== */
#bk-brand{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border-radius: 12px;
  transition: transform .35s cubic-bezier(.2,.7,.2,1),
              box-shadow .35s cubic-bezier(.2,.7,.2,1),
              background-color .3s ease, color .3s ease;
  will-change: transform;
}
#bk-brand::before{
  /* subtle neon aura container */
  content:"";
  position:absolute; inset:-6px; border-radius:14px;
  pointer-events:none; opacity:0;
  box-shadow: 0 0 12px rgba(125,170,255,.35), 0 0 22px rgba(37,99,235,.25);
  transition: opacity .25s ease;
}
#bk-brand .bk-brand-mark{
  width: 34px; height: 34px;
  border-radius: 10px;
  display:grid; place-items:center;
  font-weight: 800; letter-spacing: .2px;
  color: #061021;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.6), 0 4px 10px rgba(15,23,42,.15);
  background: conic-gradient(from 140deg, #b3e1ff, #88e2c5, #b3e1ff);
  filter: saturate(1.05);
  transition: transform .35s cubic-bezier(.2,.7,.2,1), filter .35s ease;
}
#bk-brand .bk-brand-text{
  font-weight: 700;
  background: linear-gradient(90deg, #1f3b8f, #2b6cff, #00c2ff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  background-size: 200% 100%;
  transition: background-position .8s ease, letter-spacing .35s ease, opacity .35s ease;
}

/* Intro "pop-in" */
@keyframes bkBrandIn{
  0%   { opacity:0; transform: translateY(-6px) scale(.96) rotate(-1deg); }
  70%  { opacity:1; transform: translateY(0) scale(1.04); }
  100% { opacity:1; transform: none; }
}
#bk-brand.bk-in{
  animation: bkBrandIn .6s cubic-bezier(.2,.7,.2,1) both;
}

/* Hover / focus */
#bk-brand:hover, #bk-brand:focus-visible{
  transform: translateY(-2px);
}
#bk-brand:hover::before, #bk-brand:focus-visible::before{
  opacity: 1;
  animation: bkHueSpin 6s linear infinite;
}
#bk-brand:hover .bk-brand-mark,
#bk-brand:focus-visible .bk-brand-mark{
  transform: rotate(-3deg) scale(1.08);
  filter: hue-rotate(12deg) saturate(1.15);
}
#bk-brand:hover .bk-brand-text,
#bk-brand:focus-visible .bk-brand-text{
  background-position: 100% 0;
  letter-spacing: .2px;
  opacity: .98;
}

/* Dark theme tune */
:root[data-theme="dark"] #bk-brand .bk-brand-mark{
  color: #0b1220;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55), 0 6px 16px rgba(0,0,0,.45);
}
:root[data-theme="dark"] #bk-brand::before{
  box-shadow: 0 0 14px rgba(125,170,255,.55), 0 0 28px rgba(109,163,255,.45), 0 0 38px rgba(37,99,235,.35);
}

/* Accessibility */
#bk-brand:focus-visible{ outline: 2px solid var(--bk-accent); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce){
  #bk-brand, #bk-brand .bk-brand-mark, #bk-brand .bk-brand-text{ transition: none !important; animation: none !important; }
  #bk-brand::before{ transition: none !important; }
}


/* ===== v53: Fancy text reveal (homepage) ===== */
:root{ --bk-reveal-ease: cubic-bezier(.22,.61,.36,1); }

.bk-reveal-text{
  position: relative;
  display: block;
}
.bk-reveal-text .bk-word{
  display: inline-block;
  opacity: 0;
  transform: translateY(10px) scale(.98);
  filter: blur(3px);
  transition:
    opacity .60s var(--bk-reveal-ease),
    transform .60s var(--bk-reveal-ease),
    filter .60s var(--bk-reveal-ease);
  transition-delay: var(--delay, 0ms);
  will-change: transform, opacity, filter;
}

/* when in view */
.bk-reveal-text.in .bk-word{
  opacity: 1;
  transform: none;
  filter: blur(0);
}

/* light sweep across the whole line */
.bk-reveal-text::after{
  content:"";
  position:absolute;
  inset: 0 0 0 0;
  pointer-events:none;
  background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,.6) 12%, transparent 22%);
  transform: translateX(-140%);
  opacity: 0;
}
.bk-reveal-text.in::after{
  opacity: .6;
  animation: bkSweep 1s var(--bk-reveal-ease) .1s both;
}
@keyframes bkSweep{
  0%{ transform: translateX(-140%); opacity:.0; }
  40%{ opacity:.6; }
  100%{ transform: translateX(140%); opacity:0; }
}

/* Reduced motion: show instantly without sweep */
@media (prefers-reduced-motion: reduce){
  .bk-reveal-text .bk-word{ opacity: 1 !important; transform: none !important; filter: none !important; transition: none !important; }
  .bk-reveal-text::after{ display: none !important; }
}


/* ===== v54: media inside Quick Start cards ===== */
.bk-card-media{
  position: relative;
  margin: 8px 8px 14px;
  border-radius: 12px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--bk-border);
  box-shadow: var(--bk-shadow);
  height: 150px;
}
@media (min-width: 980px){
  .bk-card-media{ height: 170px; }
}
.bk-card-media picture, .bk-card-media img{ position:absolute; inset:0; width:100%; height:100%; }
.bk-card-media img{ object-fit: cover; transform: scale(1.02) translateZ(0); filter: saturate(1.05) contrast(1.02); }

.bk-card-media::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.0) 40%, rgba(0,0,0,.16));
}

/* Hover zoom on the card */
@keyframes bkKBCard { 0%{ transform: scale(1.02);} 100%{ transform: scale(1.08);} }
.bk-card:hover .bk-card-media img,
.bk-card:focus-within .bk-card-media img{
  animation: bkKBCard 8s ease-in-out infinite alternate;
}

/* Optional neon rim */
.bk-card:hover .bk-card-media::before,
.bk-card:focus-within .bk-card-media::before{
  content:""; position:absolute; inset:-6px; border-radius:14px; pointer-events:none;
  box-shadow: 0 0 14px rgba(125,170,255,.45), 0 0 28px rgba(37,99,235,.30);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .bk-card:hover .bk-card-media img,
  .bk-card:focus-within .bk-card-media img{ animation: none !important; transform: none !important; }
}