/* VOUCH shared top bar. One stylesheet and one piece of markup on every page, so the bar cannot drift.
   Everything is namespaced under .tb and carries its own tokens, so it looks the same whatever the page's own CSS does. */
.tb { --tb-paper:#FAFAF6; --tb-white:#FFFFFF; --tb-ink:#16170F; --tb-yellow:#FFFD38; --tb-line:#DADBD3; --tb-wash:#F0F1E9;
  --tb-text:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif; --tb-pill:999px; --tb-r1:12px; --tb-r2:24px;
  --tb-ease:cubic-bezier(.2,.7,.2,1); --tb-gut:20px;
  position:relative; z-index:40; background:var(--tb-paper); border-bottom:1px solid var(--tb-line);
  color:var(--tb-ink); font:400 1rem/1.5 var(--tb-text); }
.tb *,.tb *::before,.tb *::after { box-sizing:border-box; }
.tb a { color:inherit; text-underline-offset:4px; }
.tb a:focus-visible,.tb summary:focus-visible { outline:2px solid var(--tb-ink); outline-offset:4px; box-shadow:0 0 0 4px var(--tb-white); }
.tb svg { display:block; }
.tb__bar { max-width:1440px; min-height:80px; margin:auto; padding:12px var(--tb-gut); display:flex; gap:24px; align-items:center; }
.tb__mark { display:inline-flex; align-items:center; gap:8px; min-height:44px; text-decoration:none; flex:none; }
.tb__thumb { width:30px; height:30px; }
.tb__word { width:95px; height:auto; }
.tb__tabs { display:flex; align-items:center; justify-content:center; gap:8px; margin:auto; }
.tb__tabs a { display:flex; min-height:44px; align-items:center; padding:8px 16px; border-radius:var(--tb-pill); font-size:.875rem; text-decoration:none; }
.tb__tabs a[aria-current] { background:var(--tb-wash); }
.tb__tabs a:hover { text-decoration:underline; }
.tb__cta { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 20px; border:1px solid transparent; border-radius:var(--tb-pill); background:var(--tb-yellow); color:var(--tb-ink); font-size:.875rem; font-weight:600; text-decoration:none; white-space:nowrap; transition:transform 180ms var(--tb-ease); }
.tb__cta:active { transform:scale(.98); }
@media (hover:hover) { .tb__cta:hover { transform:translateY(-2px); } }
.tb__menu { display:none; }
@media (min-width:768px) { .tb { --tb-gut:32px; } }
@media (min-width:1200px) { .tb { --tb-gut:48px; } }
@media (max-width:1199px) {
  .tb__bar { gap:16px; }
  .tb__tabs { gap:0; }
  .tb__tabs a { padding-inline:12px; }
}
@media (max-width:899px) {
  .tb__tabs { display:none; }
  .tb__cta { margin-left:auto; }
  .tb__menu { display:block; }
  .tb__menu summary { width:44px; min-height:44px; border:1px solid var(--tb-ink); border-radius:var(--tb-pill); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:5px; cursor:pointer; list-style:none; }
  .tb__menu summary::-webkit-details-marker { display:none; }
  .tb__menu summary span { width:17px; height:1.5px; background:var(--tb-ink); transition:transform 180ms var(--tb-ease); }
  .tb__menu[open] summary span:first-child { transform:translateY(3.25px) rotate(45deg); }
  .tb__menu[open] summary span:last-child { transform:translateY(-3.25px) rotate(-45deg); }
  .tb__panel { position:absolute; top:calc(100% + 8px); left:var(--tb-gut); right:var(--tb-gut); padding:16px; background:var(--tb-white); border:1px solid var(--tb-ink); border-radius:var(--tb-r2); box-shadow:0 20px 48px rgb(22 23 15 / .10); }
  .tb__panel a { display:flex; align-items:center; min-height:48px; padding:8px 12px; text-decoration:none; border-radius:var(--tb-r1); }
  .tb__panel a[aria-current] { background:var(--tb-wash); }
}
@media (max-width:679px) {
  .tb { --tb-gut:16px; }
  .tb__bar { min-height:72px; padding-block:8px; gap:12px; }
  .tb__thumb { width:25px; height:25px; }
  .tb__word { width:78px; }
  .tb__mark { gap:5px; }
  .tb__cta { padding-inline:16px; font-size:12px; }
}
@media (max-width:359px) {
  .tb__bar { gap:8px; }
  .tb__word { width:68px; }
  .tb__thumb { width:22px; }
  .tb__cta { padding-inline:12px; }
}
@media (prefers-reduced-motion:reduce) { .tb *,.tb *::before,.tb *::after { transition:none !important; } .tb__cta:hover,.tb__cta:active { transform:none; } }