/* Shared site header + footer (injected by scripts/apply-layout.js).
   Colours and type follow the inner-page header in inner-pages.css.
   Every selector starts with :is(#public-landing-root, #product-root, html) so it
   carries ID specificity: the landing page resets all descendants with
   "#public-landing-root * { all: revert }", which would otherwise win. */
:is(#public-landing-root, #product-root, html) :is(.hai-header, .hai-footer) {
  --hai-gold: #e2bd70;
  --hai-cream: #faf0dc;
  --hai-muted: #bdb3a2;
  --hai-line: rgba(225, 184, 105, .3);
  display: block;
  box-sizing: border-box;
  font-family: 'Lora', Georgia, serif;
  line-height: 1.5;
  text-align: left;
}
:is(#public-landing-root, #product-root, html) :is(.hai-header, .hai-footer) * { box-sizing: border-box; }

/* Header */
:is(#public-landing-root, #product-root, html) .hai-header { position: relative; z-index: 30; width: 100%; margin: 0; padding: 0; background: linear-gradient(100deg, #15130f, #20190f 55%, #12110e); border: 0; border-bottom: 1px solid var(--hai-line); box-shadow: 0 4px 24px #00000026; }
:is(#public-landing-root, #product-root, html) .hai-header-inner { display: flex; align-items: center; gap: 28px; width: min(1320px, 100%); min-height: 76px; margin: 0 auto; padding: 14px 40px; }
:is(#public-landing-root, #product-root, html) .hai-brand { display: inline-flex; align-items: center; gap: 12px; color: var(--hai-gold); font: 600 21px/1 Georgia, serif; letter-spacing: 2px; text-decoration: none; white-space: nowrap; }
:is(#public-landing-root, #product-root, html) .hai-brand-mark { font-size: 32px; font-weight: 400; line-height: 1; }
:is(#public-landing-root, #product-root, html) .hai-nav { display: flex; align-items: center; justify-content: center; gap: 26px; margin: 0 auto; padding: 0; }
:is(#public-landing-root, #product-root, html) .hai-link { color: var(--hai-muted); font: 14px/1.5 'Lora', Georgia, serif; text-decoration: none; padding: 6px 0; border: 0; border-bottom: 1px solid transparent; background: none; white-space: nowrap; }
:is(#public-landing-root, #product-root, html) .hai-link:hover { color: #f4d997; }
:is(#public-landing-root, #product-root, html) .hai-link[aria-current="page"] { color: var(--hai-gold); border-bottom-color: var(--hai-gold); }
:is(#public-landing-root, #product-root, html) .hai-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
:is(#public-landing-root, #product-root, html) .hai-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; margin: 0; padding: 9px 18px; border-radius: 7px; font: 600 13px/1.5 'Lora', Georgia, serif; text-decoration: none; white-space: nowrap; cursor: pointer; }
:is(#public-landing-root, #product-root, html) .hai-btn--primary { color: #241a09; border: 1px solid #ffe6a3; background: linear-gradient(120deg, #ffe3a0, #e9ba5a 65%, #dba643); box-shadow: inset 0 1px 0 #fff8e6b0, 0 5px 18px #d4963233; }
:is(#public-landing-root, #product-root, html) .hai-btn--primary:hover { color: #201a0f; background: linear-gradient(120deg, #ffedb8, #f2cd7b); }
:is(#public-landing-root, #product-root, html) .hai-btn--ghost { color: var(--hai-gold); border: 1px solid var(--hai-line); background: #c5a35908; box-shadow: none; }
:is(#public-landing-root, #product-root, html) .hai-btn--ghost:hover { color: #f4d997; border-color: #d8b66a88; }
:is(#public-landing-root, #product-root, html) .hai-menu-toggle { display: none; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0 0 0 auto; padding: 0; border: 1px solid var(--hai-line); border-radius: 8px; background: none; color: var(--hai-gold); font: 20px/1 Georgia, serif; cursor: pointer; }
:is(#public-landing-root, #product-root, html) .hai-menu { display: block; margin: 0; padding: 12px 16px 18px; border-top: 1px solid var(--hai-line); background: #15130f; }
:is(#public-landing-root, #product-root, html) .hai-menu[hidden] { display: none; }
:is(#public-landing-root, #product-root, html) .hai-menu-links { display: flex; flex-direction: column; }
:is(#public-landing-root, #product-root, html) .hai-menu-links .hai-link { display: block; padding: 12px 4px; border-bottom: 1px solid #d8b66a15; }
:is(#public-landing-root, #product-root, html) .hai-menu-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
:is(#public-landing-root, #product-root, html) .hai-signout[hidden] { display: none; }

/* Landing hero: keep the transparent, in-hero bar */
:is(#public-landing-root, #product-root, html) .hai-header--overlay { background: transparent; box-shadow: none; border-bottom: 1px solid #c59c5142; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-header-inner { width: min(1420px, 70%); min-height: 52px; padding: 0; gap: 48px; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-nav { margin: 0; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-actions { margin-left: auto; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-nav { gap: 28px; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-link { color: #fff8ea; font-weight: 600; font-size: 12px; line-height: 1.5; font-family: inherit; text-shadow: 0 1px 6px #000c; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-link:hover { color: #ffe69a; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-link[aria-current="page"] { color: #ffe69a; border-bottom-color: transparent; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-brand { font-size: 18px; letter-spacing: 1.5px; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-brand-mark { font-size: 26px; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-btn { min-height: 32px; padding: 5px 16px; font-weight: 600; font-size: 12px; line-height: 1.5; font-family: inherit; border-radius: 7px; }
:is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-menu { background: #15130ff2; }

/* Signed-in app (homepage): sticky like the old product top bar */
#product-root .hai-header { position: sticky; top: 0; background: rgba(9, 10, 9, .97); box-shadow: none; }
#product-root .hai-header .hai-header-inner { width: 100%; min-height: 58px; padding: 0 22px; }
#product-root .hai-sidebar-nav { display: none; }
#product-root .product-signout { width: 100%; background: none; border: 0; text-align: left; cursor: pointer; font: inherit; color: inherit; }
#product-root .product-signout[hidden] { display: none; }

/* Footer */
:is(#public-landing-root, #product-root, html) .hai-footer { width: 100%; margin: 0; padding: 40px max(40px, calc((100% - 1240px) / 2)) 28px; background: #090c09; border: 0; border-top: 1px solid var(--hai-line); color: var(--hai-muted); }
:is(#public-landing-root, #product-root, html) .hai-footer-inner { display: grid; grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(130px, 1fr)); gap: 28px 40px; }
:is(#public-landing-root, #product-root, html) .hai-footer-brand p { margin: 14px 0 0; max-width: 320px; color: var(--hai-muted); font-size: 13px; line-height: 1.8; }
:is(#public-landing-root, #product-root, html) .hai-footer-col { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; }
:is(#public-landing-root, #product-root, html) .hai-footer-title { margin: 0 0 4px; color: var(--hai-cream); font: 600 11px/1.6 Arial, sans-serif; letter-spacing: 2px; text-transform: uppercase; }
:is(#public-landing-root, #product-root, html) .hai-footer a { color: #c6b792; font-size: 13px; text-decoration: none; }
:is(#public-landing-root, #product-root, html) .hai-footer a:hover { color: #f4d997; }
:is(#public-landing-root, #product-root, html) .hai-footer .hai-brand { color: var(--hai-gold); font-size: 20px; }
:is(#public-landing-root, #product-root, html) .hai-footer-note { margin: 28px 0 0; padding-top: 18px; border-top: 1px solid #d8b66a15; color: var(--hai-muted); font-size: 12px; line-height: 1.9; }
:is(#public-landing-root, #product-root, html) .hai-footer-social { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-top: 14px; }
:is(#public-landing-root, #product-root, html) .hai-footer-social a { font: 12px/1.8 Arial, sans-serif; }
:is(#public-landing-root, #product-root, html) .hai-footer-copy { margin-left: auto; color: #8f8676; font: 12px/1.8 Arial, sans-serif; }
:is(#public-landing-root, #product-root, html) body.root-state-resolving .hai-footer { display: none; }

@media (max-width: 1100px) {
  :is(#public-landing-root, #product-root, html) .hai-header-inner { padding: 12px 24px; gap: 18px; }
  :is(#public-landing-root, #product-root, html) .hai-nav { gap: 18px; }
  :is(#public-landing-root, #product-root, html) .hai-footer-inner { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  :is(#public-landing-root, #product-root, html) .hai-footer-brand { grid-column: 1 / -1; }
  :is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-header-inner { width: 92%; padding: 0; }
}
@media (max-width: 900px) {
  :is(#public-landing-root, #product-root, html) .hai-header-inner { min-height: 60px; padding: 10px 16px; gap: 10px; }
  :is(#public-landing-root, #product-root, html) .hai-header--overlay .hai-header-inner { width: 100%; padding: 10px 16px; }
  :is(#public-landing-root, #product-root, html) :is(.hai-nav, .hai-header--marketing .hai-actions) { display: none; }
  :is(#public-landing-root, #product-root, html) .hai-menu-toggle { display: inline-flex; }
  :is(#public-landing-root, #product-root, html) .hai-header--app .hai-actions { margin-left: auto; }
  :is(#public-landing-root, #product-root, html) .hai-header--app .hai-menu-toggle { margin-left: 0; }
  :is(#public-landing-root, #product-root, html) .hai-brand { font-size: 18px; gap: 8px; letter-spacing: 1px; }
  :is(#public-landing-root, #product-root, html) .hai-brand-mark { font-size: 28px; }
  :is(#public-landing-root, #product-root, html) .hai-btn { min-height: 38px; padding: 7px 13px; }
  #product-root .hai-header .hai-header-inner { min-height: 60px; padding: 0 16px; }
  #product-root .hai-sidebar-nav { display: flex; flex-direction: column; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid var(--border, #d8b66a26); }
  :is(#public-landing-root, #product-root, html) .hai-footer { padding: 32px 16px 24px; }
  :is(#public-landing-root, #product-root, html) .hai-footer-inner { grid-template-columns: 1fr 1fr; }
  :is(#public-landing-root, #product-root, html) .hai-footer-brand { grid-column: 1 / -1; }
  :is(#public-landing-root, #product-root, html) .hai-footer-copy { margin-left: 0; width: 100%; }
}