/* ================================================
   jubilee.css — SyNchRoniK Silver Jubilee (2001–2026)
   Announcement bar · Silver "25" emblem · Timeline accent
   The bar is switched on by the one-line script in each page's <head>
   (adds html.jb-on) and stops by itself after 31 March 2027.
   ================================================ */
:root{
  --jb-navy:#004AAD;
  --jb-silver:linear-gradient(160deg,#5E666E 0%,#9EA6AE 30%,#E1E5E9 47%,#858D95 62%,#C3C9CF 80%,#646C74 100%);
  --jb-silver-b:linear-gradient(160deg,#A9B1B9 0%,#E9EDF0 38%,#FFFFFF 50%,#C3C9CF 66%,#9AA2AA 100%);
  --jb-h:42px;
}

/* ── ANNOUNCEMENT BAR ── space is reserved before first paint, so nothing shifts */
html.jb-on body{padding-top:calc(var(--nav) + var(--jb-h))}
html.jb-on body::before{content:'';position:absolute;top:0;left:0;right:0;height:var(--jb-h);background:var(--jb-navy)}
html.jb-on .nav{top:var(--jbt,var(--jb-h))}
@media(max-width:1024px){html.jb-on .nav-links{top:calc(var(--nav) + var(--jbt,var(--jb-h)))}}

.jb-bar{position:absolute;top:0;left:0;right:0;z-index:1000;height:var(--jb-h);background:var(--jb-navy);color:#fff;display:flex;align-items:center;justify-content:center;padding:0 52px;font-size:.8rem;font-weight:500;letter-spacing:.01em}
.jb-bar::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--jb-silver-b);opacity:.45}
.jb-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jb-txt strong{font-weight:800}
.jb-sep{opacity:.55;margin:0 .55em}
.jb-bar a{color:#fff;font-weight:700;text-decoration:underline;text-decoration-color:rgba(255,255,255,.45);text-underline-offset:3px;transition:text-decoration-color .2s}
.jb-bar a:hover{text-decoration-color:#fff}
.jb-x{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;border-radius:var(--r8);color:rgba(255,255,255,.85);font-size:1.3rem;line-height:1;cursor:pointer;transition:background .2s,color .2s}
.jb-x:hover{background:rgba(255,255,255,.12);color:#fff}
.jb-bar a:focus-visible,.jb-x:focus-visible{outline:2px solid #fff;outline-offset:2px}
.jb-short{display:none}
@media(max-width:640px){
  .jb-bar{padding:0 46px 0 14px;font-size:.76rem}
  .jb-long{display:none}.jb-short{display:inline}
}

/* ── SILVER "25" EMBLEM ── default is for dark (navy) backgrounds */
.jb-emb{display:inline-flex;align-items:center;gap:14px;text-decoration:none;color:inherit;border-radius:var(--r8)}
.jb-emb-n{font-family:'Plus Jakarta Sans',sans-serif;font-size:2.6rem;font-weight:800;line-height:.9;letter-spacing:-.04em;color:#C3C9CF;background:var(--jb-silver-b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.jb-emb-t{display:flex;flex-direction:column;gap:6px;padding-left:14px;border-left:1px solid rgba(225,229,233,.3)}
.jb-emb-y{font-size:.72rem;font-weight:700;letter-spacing:.34em;text-transform:uppercase;color:#E1E5E9;line-height:1}
.jb-emb-d{font-size:.66rem;font-weight:600;letter-spacing:.2em;color:#A9B1B9;line-height:1}
a.jb-emb:hover .jb-emb-y{color:#fff}
a.jb-emb:focus-visible{outline:2px solid var(--blue-l);outline-offset:6px}
/* light-background variant: darker silver so small text keeps 4.5:1 contrast */
.jb-emb--light .jb-emb-n{color:#858D95;background:var(--jb-silver);-webkit-background-clip:text;background-clip:text}
.jb-emb--light .jb-emb-t{border-left-color:#C3C9CF}
.jb-emb--light .jb-emb-y{color:#4B5259}
.jb-emb--light .jb-emb-d{color:#5E666E}

/* ── TIMELINE: silver jubilee milestone ── */
.tl-dot.jb{background:#E1E5E9;border-color:#fff;box-shadow:0 0 14px rgba(225,229,233,.55)}
.tl-yr.jb{color:#C3C9CF}