/* ============================================================
   SAFFRON AUTOMATIONS — SHARED SITE NAV  (namespaced sfa-)
   Injects a consistent masthead (wordmark + product links +
   "Start here" CTA + mobile hamburger/fullscreen panel) on
   every page. Tokens fall back to hard brand values so it
   renders correctly even on pages that define none.
   ============================================================ */
:root{
  --sfa-navy:  var(--deck-navy,   #16223a);
  --sfa-bg:    var(--deck-bg,     #0E1422);
  --sfa-surf:  var(--deck-surface,#1A2233);
  --sfa-gold:  var(--deck-gold,   #C9A96E);
  --sfa-text:  var(--deck-text,   #F0EAD8);
  --sfa-ivory: var(--deck-ivory,  #F5F0E8);
  --sfa-line:  rgba(201,169,110,.18);
  --sfa-sans:  var(--deck-font-sans, 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif);
  --sfa-disp:  var(--deck-font-display, 'Fraunces',Georgia,serif);
  --sfa-h: 60px;
}
/* reserve space so the fixed bar never covers page content */
html.sfa-ready body{ padding-top: var(--sfa-h); }

.sfa-header{
  position:fixed; top:0; left:0; width:100%; height:var(--sfa-h); z-index:9000;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 clamp(1rem,4vw,2.5rem);
  background:rgba(14,20,34,.72); backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  border-bottom:1px solid var(--sfa-line);
  font-family:var(--sfa-sans);
  transition:transform .35s cubic-bezier(.16,1,.3,1), background .3s;
}
html.sfa-scrolled .sfa-header{ background:rgba(14,20,34,.92); }
html.sfa-hide .sfa-header{ transform:translateY(-100%); }

.sfa-brand{ display:flex; align-items:center; gap:.55rem; text-decoration:none; color:var(--sfa-ivory);
  font-family:var(--sfa-disp); font-size:1.05rem; letter-spacing:.01em; white-space:nowrap; }
.sfa-brand img{ width:28px; height:28px; border-radius:6px; display:block; }
.sfa-brand em{ font-style:italic; color:var(--sfa-gold); }

.sfa-nav{ display:flex; align-items:center; gap:1.35rem; }
.sfa-nav a{ color:var(--sfa-text); text-decoration:none; font-size:.86rem; letter-spacing:.02em;
  opacity:.82; transition:opacity .2s,color .2s; position:relative; padding:.15rem 0; }
.sfa-nav a:hover{ opacity:1; color:var(--sfa-gold); }
.sfa-nav a[aria-current="page"]{ opacity:1; color:var(--sfa-gold); }
.sfa-nav a.sfa-portal{ color:var(--sfa-gold); }
.sfa-cta{ font-family:var(--deck-font-mono,var(--sfa-sans)); font-size:.72rem; letter-spacing:.08em;
  text-transform:uppercase; font-weight:700; padding:.42rem .95rem; border-radius:999px;
  background:linear-gradient(135deg,var(--sfa-gold),#b8945a); color:var(--sfa-bg)!important;
  text-decoration:none; opacity:1!important; }
.sfa-cta:hover{ filter:brightness(1.08); }

.sfa-burger{ display:none; width:44px; height:44px; border:0; background:transparent; cursor:pointer;
  align-items:center; justify-content:center; }
.sfa-burger span,.sfa-burger span::before,.sfa-burger span::after{
  content:''; display:block; width:22px; height:2px; background:var(--sfa-ivory); border-radius:2px;
  transition:transform .3s,opacity .3s; }
.sfa-burger span::before{ transform:translateY(-7px); } .sfa-burger span::after{ transform:translateY(5px); }
html.sfa-open .sfa-burger span{ background:transparent; }
html.sfa-open .sfa-burger span::before{ transform:rotate(45deg); }
html.sfa-open .sfa-burger span::after{ transform:rotate(-45deg) translateY(-2px); }

/* fullscreen mobile panel */
.sfa-panel{ position:fixed; inset:0; z-index:8999; background:rgba(14,20,34,.98);
  backdrop-filter:blur(8px); display:flex; flex-direction:column; justify-content:center;
  padding:clamp(1.5rem,8vw,4rem); gap:.2rem;
  opacity:0; visibility:hidden; transition:opacity .4s,visibility .4s; }
html.sfa-open .sfa-panel{ opacity:1; visibility:visible; }
.sfa-panel a{ display:flex; align-items:baseline; gap:1rem; color:var(--sfa-ivory); text-decoration:none;
  font-family:var(--sfa-disp); font-size:clamp(1.8rem,7vw,2.6rem); line-height:1.35;
  border-bottom:1px solid rgba(240,234,216,.08); padding:.35rem 0; transition:color .2s; }
.sfa-panel a:hover,.sfa-panel a[aria-current="page"]{ color:var(--sfa-gold); }
.sfa-panel a .n{ font-family:var(--sfa-sans); font-size:.8rem; color:var(--sfa-gold); opacity:.75; min-width:2ch; }
.sfa-panel .sfa-foot{ margin-top:1.6rem; font-family:var(--sfa-sans); font-size:.9rem; }
.sfa-panel .sfa-foot a{ display:inline; font-family:var(--sfa-sans); font-size:.95rem; border:0; color:var(--sfa-gold); }

@media (max-width:900px){
  .sfa-nav{ display:none; }
  .sfa-burger{ display:inline-flex; }
}
@media (min-width:901px){ .sfa-panel{ display:none; } }
html.sfa-open{ overflow:hidden; }

/* Safety net: a page whose content overflows horizontally used to widen the document,
   which dragged the fixed masthead off-screen with it (seen on /sub-processors, mobile).
   `clip` contains that overflow WITHOUT turning <html> into a scroll container the way
   `hidden` does — `hidden` is what broke vertical scrolling on /sentinel. */
html.sfa-ready{overflow-x:clip}
.sfa-header,.sfa-header *{box-sizing:border-box}
.sfa-brand{min-width:0}
.sfa-brand em{overflow:hidden;text-overflow:ellipsis}

/* hide a page's own redundant top nav bar once the shared masthead is injected */
.sfa-orig-hidden{ display:none !important; }
/* COMPONENT HARDENING v2 - one masthead language on every page. The shared bar (.sfa-header) is rebuilt to match the homepage bar (.deck-masthead); behaviour rules target BOTH so hover, focus, touch targets and motion are identical site-wide. .sfa-brand uses gap:0 on purpose - it is a flex container holding an <img>, a bare text node and <em>, and a flex gap split the wordmark; the image carries its own margin. */
:root{ --sfa-h: 80px; --sfa-mono: var(--deck-font-mono, 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace); --sfa-dim: var(--deck-text-dim, rgba(240,234,216,.62)); --sfa-max: 1280px; --sfa-pad: 2rem;
}
.sfa-header,
.sfa-header *{ box-sizing:border-box; font-style:normal; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
.sfa-header{ height:var(--sfa-h); padding-left:max(clamp(1rem,4vw,var(--sfa-pad)), calc((100% - var(--sfa-max))/2 + var(--sfa-pad))); padding-right:max(clamp(1rem,4vw,var(--sfa-pad)), calc((100% - var(--sfa-max))/2 + var(--sfa-pad))); background:rgba(14,20,34,.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid rgba(245,240,232,.08);
}
html.sfa-scrolled .sfa-header{ background:rgba(14,20,34,.96); }
.sfa-header .sfa-brand{ gap:0; font-family:var(--sfa-disp); font-size:1.15rem; font-weight:600; line-height:1.2; color:var(--sfa-text); white-space:nowrap; -webkit-tap-highlight-color:transparent;
}
.sfa-header .sfa-brand img{ width:36px; height:36px; min-width:36px; flex:0 0 36px; margin-right:.75rem; border-radius:50%; display:block; box-shadow:0 0 18px rgba(201,169,110,.34);
}
.sfa-header .sfa-brand em{ font-style:italic; color:var(--sfa-gold); }
.sfa-header .sfa-nav{ gap:1.3rem; }
.sfa-header .sfa-nav a:not(.sfa-cta){ position:relative; display:inline-flex; align-items:center; font-family:var(--sfa-mono); font-size:.75rem; font-weight:400; line-height:1.5; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; color:var(--sfa-dim); opacity:1; padding:0; transition:color .2s ease;
}
.sfa-header .sfa-nav a:not(.sfa-cta):hover{ color:var(--sfa-gold); }
.sfa-header .sfa-nav a.sfa-portal{ color:var(--sfa-gold); }
.sfa-header .sfa-nav a[aria-current="page"]{ color:var(--sfa-gold); }
.sfa-header .sfa-cta{ position:relative; display:inline-flex; align-items:center; justify-content:center; min-height:44px; margin-left:.2rem; padding:.25rem .75rem; font-family:var(--sfa-mono); font-size:.75rem; font-weight:600; line-height:1.5; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; border:1px solid var(--sfa-gold); border-radius:999px; background:linear-gradient(135deg,var(--sfa-gold) 0%,var(--deck-gold-dark,#b8945a) 100%); color:var(--sfa-bg)!important; text-decoration:none; user-select:none; -webkit-tap-highlight-color:transparent; touch-action:manipulation;
}
.sfa-header .sfa-cta,
.deck-masthead .deck-header-action{ transition:transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .18s cubic-bezier(.2,.8,.2,1), filter .18s ease;
}
.sfa-header .sfa-cta:hover,
.deck-masthead .deck-header-action:hover{ transform:translateY(-1px); filter:brightness(1.07); box-shadow:0 6px 16px -6px rgba(201,169,110,.55);
}
.sfa-header .sfa-cta:active,
.deck-masthead .deck-header-action:active{ transform:translateY(0) scale(.975); transition-duration:.06s;
}
.deck-masthead .deck-header-action{ justify-content:center; white-space:nowrap; -webkit-tap-highlight-color:transparent; touch-action:manipulation; user-select:none;
}
.sfa-header .sfa-nav a:not(.sfa-cta)::after,
.deck-masthead .deck-prodnav a::after{ content:''; position:absolute; left:0; right:0; bottom:-4px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:50% 50%; transition:transform .26s cubic-bezier(.2,.8,.2,1); pointer-events:none;
}
.deck-masthead .deck-prodnav a{ position:relative; }
.sfa-header .sfa-nav a:not(.sfa-cta):hover::after,
.sfa-header .sfa-nav a[aria-current="page"]::after,
.deck-masthead .deck-prodnav a:hover::after,
.deck-masthead .deck-prodnav a[aria-current="page"]::after{ transform:scaleX(1); }
.sfa-header .sfa-nav a:not(.sfa-cta)::before,
.deck-masthead .deck-prodnav a::before{ content:''; position:absolute; left:0; right:0; top:50%; height:44px; transform:translateY(-50%);
}
.sfa-header a:focus-visible,
.sfa-header button:focus-visible,
.sfa-panel a:focus-visible,
.deck-masthead a:focus-visible,
.deck-masthead button:focus-visible{ outline:2px solid var(--sfa-gold); outline-offset:3px; border-radius:6px;
}
.sfa-header a:focus:not(:focus-visible),
.sfa-header button:focus:not(:focus-visible),
.deck-masthead a:focus:not(:focus-visible),
.deck-masthead button:focus:not(:focus-visible){ outline:none; }
.sfa-header .sfa-burger,
.deck-masthead .deck-menu-btn{ -webkit-tap-highlight-color:transparent; touch-action:manipulation; border-radius:8px; transition:background .2s ease;
}
.sfa-header .sfa-burger:hover,
.deck-masthead .deck-menu-btn:hover{ background:rgba(245,240,232,.06); }
.sfa-panel a{ -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
@media (prefers-reduced-motion:reduce){ .sfa-header .sfa-cta, .deck-masthead .deck-header-action, .sfa-header .sfa-nav a::after, .deck-masthead .deck-prodnav a::after, .sfa-header, .sfa-panel{ transition-duration:.01ms!important; } .sfa-header .sfa-cta:hover, .sfa-header .sfa-cta:active, .deck-masthead .deck-header-action:hover, .deck-masthead .deck-header-action:active{ transform:none; }
}
@media (min-width:901px) and (max-width:1120px){ .sfa-header .sfa-nav, .deck-masthead .deck-prodnav{ gap:.95rem; } .sfa-header .sfa-nav a:not(.sfa-cta), .deck-masthead .deck-prodnav a{ font-size:.7rem; letter-spacing:.06em; } .sfa-header .sfa-brand, .deck-masthead .deck-brand{ font-size:1rem; } .deck-masthead .deck-masthead-meta{ gap:1rem; }
}