/* ==========================================================================
   Black011 header + footer only
   For pages that keep their old stylesheets (the partner login page,
   partner/index.html) but show the new site header and footer.

   Every rule is limited to the new header and footer: .promo, .site-header,
   .site-footer, #dialog-content (Support Ticket popup) and .skip-link. Nothing
   is set on :root, body or bare elements, and the fonts use their own family
   names, so the page's own content and its old CSS are not affected.
   Values are copied from black011.css; keep the two in step.
   ========================================================================== */

/* Fonts: own family names, so the old "Manrope" @font-face is left alone */
@font-face{font-family:"B011 Oswald";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/oswald-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"B011 Manrope";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/manrope-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"B011 Manrope";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/manrope-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"B011 Manrope";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/manrope-latin-700-normal.woff2) format("woff2")}

/* Tokens, on the header/footer elements instead of :root */
.promo,.site-header,.site-footer,#dialog-content,.skip-link{
  --hf-ink:#141215;--hf-black:#000;--hf-charcoal:#38333b;--hf-paper:#f6f2ee;--hf-line:#e4dfd8;
  --hf-red:#eb212e;--hf-amber:#ffb547;--hf-muted:#5d5860;--hf-muted-dark-2:#b9b2bb;
  --hf-display:"B011 Oswald","Arial Narrow",Impact,sans-serif;
  --hf-body:"B011 Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --hf-gutter:24px;--hf-header-h:68px;
  font-family:var(--hf-body);font-size:16px;line-height:1.6;
}
.promo *,.site-header *,.site-footer *,#dialog-content *{box-sizing:border-box}
.site-header a,.site-footer a,#dialog-content a{color:inherit}
.site-header img,.site-footer img{max-width:100%;display:block}

/* Shared bits used inside the header/footer */
.skip-link{position:absolute;left:16px;top:-100px;z-index:50;background:var(--hf-amber);color:var(--hf-ink);font-weight:700;padding:10px 16px;border-radius:8px;text-decoration:none}
.skip-link:focus{top:12px}
.site-header .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.site-header .wrap,.site-footer .wrap{max-width:1120px;margin:0 auto;padding:0 var(--hf-gutter)}
.site-header .icon,.site-footer .icon,#dialog-content .icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* Buttons: own class name (hf-btn), so the old .btn and a.btn rules in style.css (one with
   padding:17px 40px !important) never apply to them. */
.site-header .hf-btn,#dialog-content .hf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 26px;border-radius:999px;border:2px solid transparent;font:700 16px/1 var(--hf-body);text-decoration:none;cursor:pointer;white-space:nowrap;background:transparent;color:inherit;width:auto}
.site-header .hf-btn:hover,#dialog-content .hf-btn:hover{filter:brightness(1.08)}
.site-header .hf-btn--red,#dialog-content .hf-btn--red{background:var(--hf-red);color:#fff}
.site-header .hf-btn--sm{min-height:44px;padding:0 20px;font-size:15px}
#dialog-content .hf-btn--outline{border-color:var(--hf-ink);color:var(--hf-ink);background:transparent}
#dialog-content .hf-btn--outline:hover{background:var(--hf-ink);color:var(--hf-paper);filter:none}
#dialog-content .hf-btn-row{display:flex;flex-wrap:wrap;gap:14px}

/* Promo bar */
.promo{background:var(--hf-red);color:#fff;text-align:center;font-weight:700;font-size:15px;line-height:22px;padding:9px var(--hf-gutter);margin:0}
.promo a{color:#fff;text-decoration:underline;text-underline-offset:3px;margin-left:6px;white-space:nowrap}

/* Header */
.site-header{background:var(--hf-black);position:sticky;top:0;z-index:20}
.site-header .wrap{display:flex;align-items:center;gap:20px;min-height:var(--hf-header-h);padding-top:12px;padding-bottom:12px}
.site-header .logo{display:block;margin:0 auto 0 0;line-height:0;width:auto;height:auto;float:none}
.site-header .logo img{height:32px;width:auto}
.site-header .nav{display:flex;gap:22px;width:auto;margin:0}
.site-header .nav a{font-size:14px;line-height:24px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--hf-paper);opacity:.85;text-decoration:none}
.site-header .nav a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.site-header .nav a[aria-current="page"]{opacity:1;text-decoration:underline;text-decoration-color:var(--hf-red);text-decoration-thickness:2px;text-underline-offset:6px}
.site-header .nav-toggle{display:none;background:none;border:0;color:var(--hf-paper);padding:8px;cursor:pointer}
.site-header .nav-toggle .icon{width:24px;height:24px}
.site-header .nav-toggle__close,.site-header.is-open .nav-toggle__open{display:none}
.site-header.is-open .nav-toggle__close{display:block}

/* Footer */
.site-footer{background:var(--hf-black);color:var(--hf-muted-dark-2);padding:48px 0 144px;font-size:15px;line-height:24px}
.site-footer .footer__grid{display:grid;grid-template-columns:559px 379px 1fr;gap:24px 0}
.site-footer .logo{display:block;line-height:0;margin:0;width:auto;height:auto;float:none}
.site-footer .logo img{height:32px;width:auto}
.site-footer .footer__brand p{margin:12px 0 0;max-width:311px}
.site-footer .footer__col{display:flex;flex-direction:column;gap:6px}
.site-footer .footer__col a{text-decoration:none}
.site-footer .footer__col a:hover{color:var(--hf-paper);text-decoration:underline}
.site-footer .footer__legal{margin:36px 0 0;font-size:14px;line-height:20px}
.site-footer .footer__legal a{text-decoration:underline}

/* Support Ticket popup (card styling on the inner div; see t_footer.html) */
#dialog-content .card{background:#fff;border:1px solid var(--hf-line);border-radius:18px;padding:28px;display:flex;flex-direction:column;gap:12px;color:var(--hf-ink)}
#dialog-content .card p{color:var(--hf-muted);font-size:16px;line-height:25.6px;margin:0}
#dialog-content .display{font-family:var(--hf-display);font-weight:700;text-transform:uppercase;margin:0}
#dialog-content .h-sm{font-size:24px;line-height:28px}

/* Responsive (same breakpoints as black011.css) */
@media (max-width:1180px){
  .site-footer .footer__grid{grid-template-columns:1fr auto auto;gap:24px 64px}
}
@media (max-width:960px){
  .site-header .nav{display:none}
  .site-header .nav-toggle{display:inline-flex}
  .site-header.is-open .nav{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--hf-black);padding:8px 24px 20px;gap:12px}
  .site-footer .footer__grid{grid-template-columns:1fr 1fr}
  .site-footer .footer__brand{grid-column:1/-1}
}
@media (max-width:600px){
  .site-header .hf-btn{display:none}
  .promo{font-size:14px;line-height:20px;padding:8px 16px}
  .site-header .logo img,.site-footer .logo img{height:26px}
  .site-footer{padding-bottom:64px}
}