/* The one bar and the one footer, so every public page feels like the same site.
   Loaded last, after a page's own stylesheet, and written to stand on its own:
   each colour falls back to the brand value when the page sets no variables.
   The markup comes from includes/site_shell.php and _mktgen/shell.py. */

.wt-shell-scope{display:none}

.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line,#e6e6e6)}
.nav .wrap{max-width:1280px;margin:0 auto;padding:0 24px}
.nav-in{display:flex;align-items:center;gap:34px;height:68px}
.nav a{text-decoration:none}
.nav .logo{display:flex;align-items:center;gap:9px;flex:none}
.nav .logo-img{height:30px;width:auto;display:block}
.nav .links{display:flex;gap:26px;font-size:15px;font-weight:700}
.nav .links a{color:#333;white-space:nowrap}
.nav .links a:hover,.nav .links a[aria-current="page"]{color:var(--honey-ink,#7d5800)}
.nav .right{margin-left:auto;display:flex;align-items:center;gap:16px}
.nav .sel{font-size:14px;font-weight:700;color:#333;display:flex;align-items:center;gap:6px;cursor:pointer}
.nav .help{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line,#e6e6e6);
  display:grid;place-items:center;font-weight:700;color:#666;cursor:pointer}
.nav .login{display:inline-flex;align-items:center;gap:8px;border:1.6px solid var(--ink,#1c1c1c);
  border-radius:12px;padding:9px 16px;font-weight:800;font-size:14px;color:var(--ink,#1c1c1c)}
.nav .login:hover{background:var(--soft,#f7f7f7)}

footer{background:var(--dark,#1c1c1c);color:#cdbf9f;padding:54px 0 30px}
footer .wrap{max-width:1280px;margin:0 auto;padding:0 24px}
footer .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.15fr;gap:30px}
footer .logo-img{height:30px;width:auto;display:block;filter:brightness(1.6)}
footer .fdesc{margin-top:14px;max-width:34ch;font-size:14px}
footer h2{color:#fff;font-size:14px;font-weight:800;margin-bottom:12px}
footer a{display:block;color:#cdbf9f;font-size:14px;padding:5px 0;text-decoration:none}
footer a:hover{color:var(--honey,#ffc53d)}
footer .fhubs{margin-top:30px;display:flex;flex-wrap:wrap;gap:8px 16px;font-size:13.5px;opacity:.85}
footer .fhubs a{display:inline;white-space:nowrap}
footer .froster{margin-top:22px;font-size:13px;opacity:.75}
footer .froster h2{margin-bottom:8px}
footer .froster .fr{display:flex;flex-wrap:wrap;gap:6px 14px}
footer .froster .fr a{display:inline}
footer .fbottom{border-top:1px solid #3a2c18;margin-top:34px;padding-top:22px;text-align:center;font-size:14px}
footer .foot-org{border-top:1px solid #3a2c18;margin-top:16px;padding-top:16px;text-align:center;
  font-size:12px;line-height:1.7;color:#a2957c}
footer .foffices .foot-addr{margin-bottom:12px;font-size:13.5px;line-height:1.55;max-width:26ch}
footer .foffices .foot-addr b{display:block;color:#fff;font-size:13px;font-weight:800;
  letter-spacing:.02em;margin-bottom:3px}

@media(max-width:1000px){
  .nav .links{display:none}
  .nav .wrap,footer .wrap{padding:0 18px}
}
@media(max-width:640px){
  .nav-in{height:60px;gap:12px}
  .nav .wrap,footer .wrap{padding:0 15px}
  footer{padding:38px 0 26px}
  footer .fgrid{grid-template-columns:1fr 1fr;gap:18px}
  /* long translated hub names are wider than a phone, so let them wrap */
  footer .fhubs{gap:6px 12px;font-size:13px}
  footer .fhubs a{white-space:normal}
}