/* One public header and footer for the landing, explanatory pages, and legal documents. */
@font-face{
  font-family:"Public Instrument Sans";
  src:url("/brand/fonts/vq-sans-var.woff2") format("woff2");
  font-style:normal;font-weight:400 700;font-display:swap
}
@font-face{
  font-family:"Public Cormorant";
  src:url("/brand/fonts/CormorantGaramond-latin.woff2") format("woff2");
  font-style:normal;font-weight:600 700;font-display:swap
}
.site-header,.site-footer{
  --pc-bg:#090A0B;--pc-ink:#F5F3EC;--pc-muted:#BBB9B0;--pc-dim:#918F88;
  --pc-line:rgba(255,255,255,.14);--pc-gold:#E8BD50;
  font-family:"Public Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  box-sizing:border-box
}
/* by day the public pages' own ground (tokens.css --c-bg-light, white since 2026-10-01); the landing loads no tokens.css and
   keeps its cream through the fallback */
html:is([data-theme="day"],[data-theme="light"]) .site-header,
html:is([data-theme="day"],[data-theme="light"]) .site-footer{
  --pc-bg:var(--c-bg-light,#F5F3EF);--pc-ink:#181715;--pc-muted:#4D4B46;--pc-dim:#64615B;
  --pc-line:rgba(22,20,16,.2);--pc-gold:#765514
}
.site-header *,.site-footer *{box-sizing:border-box}
/* the header's place, in one spot: its top offset and inner height per breakpoint, and where it ends (the inner height and
   its 1px border above and below). A page element that sticks or scrolls to just under the header reads --pc-head-bottom */
:root{--pc-head-top:12px;--pc-head-h:66px;--pc-head-bottom:calc(var(--pc-head-top) + var(--pc-head-h) + 2px)}
.site-header{
  display:block;position:sticky;inset:auto;top:var(--pc-head-top);left:auto;right:auto;z-index:50;
  width:min(1552px,calc(100% - 44px));height:auto;min-height:0;margin:12px auto 0;padding:0;
  border:1px solid rgba(255,255,255,.36);border-radius:18px;
  background:rgba(12,13,15,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.46),inset 0 -1px 0 rgba(255,255,255,.11),
             0 20px 56px -28px rgba(0,0,0,.48);
  -webkit-backdrop-filter:blur(34px) saturate(210%) contrast(1.12);
  backdrop-filter:blur(34px) saturate(210%) contrast(1.12)
}
.site-header::before{display:none;content:none}
html:is([data-theme="day"],[data-theme="light"]) .site-header{
  border-color:rgba(255,255,255,.88);background:rgba(255,255,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 20px 56px -28px var(--c-pc-shadow-light,rgba(57,43,15,.28))
}
.site-header .header-inner{
  position:relative;z-index:1;width:calc(100% - 48px);height:var(--pc-head-h);margin:auto;
  display:flex;align-items:center;gap:48px;padding:0
}
.site-header .brand,.site-footer .footer-brand{
  display:inline-flex;align-items:center;gap:12px;flex:none;min-height:0;
  color:var(--pc-ink);text-decoration:none
}
.site-header .brand img,.site-footer .footer-brand img{display:block;object-fit:contain;max-width:none}
.site-header .brand span,.site-footer .footer-brand span{
  font:700 24px/1 "Public Cormorant",Georgia,serif;
  letter-spacing:.22em;white-space:nowrap;color:var(--pc-ink)
}
.site-header .header-nav{display:flex;align-items:center;gap:38px;margin-inline:auto 0}
.site-header .header-nav a{
  color:var(--pc-muted);font-size:13px;font-weight:600;text-decoration:none;
  transition:color .2s
}
.site-header .header-nav a:hover{color:var(--pc-ink)}
.site-header .header-actions{display:flex;align-items:center;gap:17px;margin-left:0}
.site-header .theme-switch{
  display:grid;place-items:center;width:42px;height:42px;padding:0;
  border:0;border-radius:0;background:transparent;color:var(--pc-muted);cursor:pointer
}
.site-header .theme-switch:hover{color:var(--pc-ink)}
.site-header .theme-switch svg{width:19px;height:19px}
.site-header .theme-switch .sun{display:block}
.site-header .theme-switch .moon{display:none}
html:is([data-theme="day"],[data-theme="light"]) .site-header .theme-switch .sun{display:none}
html:is([data-theme="day"],[data-theme="light"]) .site-header .theme-switch .moon{display:block}
.site-header .header-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:20px;
  min-height:42px;padding:0 17px;border:1px solid #E8BD50;border-radius:5px;
  background:transparent;color:var(--pc-ink);font-size:13px;font-weight:650;
  white-space:nowrap;text-decoration:none;transition:background .2s,transform .2s
}
.site-header .header-cta:hover{background:rgba(232,189,80,.12);transform:translateY(-1px)}
.site-header .header-cta span{color:var(--pc-gold);font-size:18px}
.site-header :is(a,button):focus-visible,.site-footer a:focus-visible{
  outline:2px solid #E8BD50;outline-offset:4px
}
.site-footer{
  display:block;position:relative;z-index:4;isolation:isolate;
  border-top:1px solid var(--pc-line);background:var(--pc-bg);color:var(--pc-ink)
}
.site-footer .footer-inner{
  width:min(1552px,calc(100% - 96px));margin:auto;padding:42px 0 30px;
  display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:26px 60px
}
.site-footer .footer-brand{align-self:start}
.site-footer .footer-brand span{font-size:20px}
.site-footer nav{display:flex;flex-wrap:wrap;align-content:start;gap:10px 18px}
.site-footer nav a,.site-footer .business-details,.site-footer .footer-inner>p{
  color:var(--pc-dim);font-size:11px;line-height:1.55;text-decoration:none
}
.site-footer .business-details a{color:var(--pc-dim);text-decoration:none}
.site-footer nav a:hover,.site-footer .business-details a:hover,
.site-footer .footer-brand:hover span{color:var(--pc-ink)}
.site-footer .business-details{
  display:flex;flex-wrap:wrap;gap:4px 18px;grid-column:1/-1;
  padding-top:20px;border-top:1px solid var(--pc-line)
}
.site-footer .footer-inner>p{grid-column:1/-1;margin:0}
/* The legal documents keep vq.js for language and account behavior; its older footer is not shown. */
.site-footer ~ .vqbiz{display:none!important}
@media(max-width:900px), (orientation:portrait){
  :root{--pc-head-top:8px;--pc-head-h:60px}
  .site-header{width:calc(100% - 20px);margin-top:8px;border-radius:14px}
  .site-header .header-inner{width:calc(100% - 28px);gap:12px}
  .site-header .header-nav{display:none}
  .site-header .header-actions{margin-left:auto;gap:7px}
  .site-footer .footer-inner{width:calc(100% - 40px);grid-template-columns:1fr 1fr}
  .site-footer .footer-brand{grid-column:1/-1}
}
@media(max-width:600px){
  :root{--pc-head-top:8px;--pc-head-h:58px}
  .site-header{width:calc(100% - 16px);margin-top:8px;border-radius:14px}
  .site-header .header-inner{width:calc(100% - 24px);gap:10px}
  .site-header .brand span{font-size:19px}
  .site-header .brand img{width:26px;height:26px}
  .site-header .header-actions{gap:5px}
  .site-header .theme-switch{width:38px;height:38px}
  .site-header .header-cta{min-height:38px;padding:0 11px;font-size:11px;gap:6px}
  .site-footer .footer-inner{grid-template-columns:1fr 1fr;padding:32px 0}
}
@media(max-width:360px){
  .site-header .brand span{display:none}
}
/* by day where the header cannot blur, the public pages give it their ground (--c-pc-fallback-day, tokens.css);
   the landing loads no tokens.css and keeps its film */
@media(prefers-reduced-transparency:reduce){
  .site-header{background:var(--pc-bg);-webkit-backdrop-filter:none;backdrop-filter:none}
  html:is([data-theme="day"],[data-theme="light"]) .site-header{background:var(--c-pc-fallback-day,rgba(255,255,255,.24))}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .site-header{background:var(--pc-bg)}
  html:is([data-theme="day"],[data-theme="light"]) .site-header{background:var(--c-pc-fallback-day,rgba(255,255,255,.24))}
}