/* Shared frame owns its palette and typography on every page family. */
.masthead,.platform-footer{--navy:#10283f;--paper:#fcfaf5;--gold:#795b20;--gold-line:#c79a43;--gold-light:#e5c77f;--line:#ded5c5;--serif:"Lora",Georgia,serif;--sans:"IBM Plex Sans",Arial,sans-serif;box-sizing:border-box;font-size:16px;line-height:1.5;letter-spacing:normal}
/* Shared navigation and footer. Homepage components retain their editorial layout. */
.masthead {
  position: sticky;
  top: 0;
  z-index: 100;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 88px;
  padding: 12px max(24px, calc((100vw - 1200px)/2));
  border-bottom: 1px solid var(--line-light);
  background: var(--paper);

}
.masthead .brand, .platform-footer .brand {
  display: flex;
  align-items: center;
  gap: 14px;
}
.masthead .mark, .platform-footer .mark {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 58px;
  height: 52px;
  border: 1px solid var(--gold-line);
  color: var(--navy);
  font: 600 1.55rem/1 var(--serif);
  letter-spacing: -.05em;
}
.masthead .brand strong, .platform-footer .brand strong {
  display: block;
  color: var(--navy);
  font: 600 22px/1.2 var(--serif);
}
.masthead .brand small, .platform-footer .brand small {
  display: block;
  color: var(--muted);
  font-size: .64rem;
}
.masthead nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 26px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.masthead nav :is(a, button) {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  white-space: nowrap;
}
.masthead nav a {
  text-decoration:none;
  position: relative;
  padding: 15px 0 10px;
  color: var(--navy-soft);
  font-size: 16px;
  letter-spacing: 0;
}
.masthead nav a::after {
  content: "";
  position: absolute;
  inset: auto 0 2px;
  height: 2px;
  background: var(--gold-line);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--motion-fast) ease;
}
.masthead nav a:is(:hover, :focus-visible, [aria-current="page"]) {
  color: var(--navy);
}
.masthead nav a:is(:hover, :focus-visible, [aria-current="page"])::after {
  transform: scaleX(1);
}
.masthead .nav-cv { padding: 0 12px; border: 1px solid var(--line); }
.masthead .nav-search {
  padding: 7px 10px;
  border: 1px solid rgba(7, 24, 43, .3);
  border-radius: 2px;
  background: transparent;
  color: var(--navy);
  font: 600 13px var(--sans);
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}
.masthead .nav-search:is(:hover, :focus-visible) {
  border-color: var(--gold-line);
  background: var(--navy);
  color: #fff;
}
.static-menu-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 48px;
  min-height: 44px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--navy);
  font: 600 13px var(--sans);
  letter-spacing: .07em;
  text-transform: uppercase;
  cursor: pointer;
}
.static-menu-toggle[hidden] { display: none; }
.platform-footer {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, .65fr);
  gap: 42px;
  padding: 40px max(5vw, 28px) 32px;
  border-top: 3px solid var(--gold-line);
  background: var(--navy);
  color: var(--paper);
  font-family: var(--sans);
}
.platform-footer > div p { max-width: 420px; color: #9dabbc; font-size: .8rem; }
.platform-footer nav { display: grid; align-content: start; gap: 9px; }
.platform-footer nav strong {
  margin-bottom: 6px;
  color: #dfc27d;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.platform-footer nav a { font:400 14px/1.5 var(--sans);min-height:44px;display:flex;align-items:center;text-decoration:none; }
.platform-footer a { color: #dce3eb; overflow-wrap: anywhere; }
.platform-footer a:hover { color: var(--gold-light); }
.platform-footer > small {
  grid-column: 1 / -1;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  color: #8291a3;
}
.platform-footer .brand { width: max-content; max-width: 100%; }
.platform-footer .brand .mark {
  color: var(--gold-light);
  background: rgba(255, 255, 255, .035);
}
.platform-footer .brand strong { color: #fff; }
.platform-footer .brand small { color: #aebed0; }
.platform-footer .brand:is(:hover, :focus-visible) strong { color: var(--gold-light); }
.platform-footer .professional-social {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
}
.platform-footer .professional-social svg { width: 20px; height: 20px; fill: currentColor; flex-shrink: 0; }
.platform-footer .professional-social:hover { text-decoration: underline; text-underline-offset: 4px; }
.reader-dark .masthead { background: #0b1827; }
@media (max-width: 1000px) {
  .platform-footer { grid-template-columns: 1fr 1fr; }
  .platform-footer > div { grid-column: 1 / -1; }
}
@media (min-width: 761px) and (max-width: 1000px) {
  .masthead { flex-direction: column; align-items: flex-start; }
  .masthead nav { width: 100%; overflow-x: auto; flex-wrap: nowrap; justify-content: flex-start; gap: 18px; }
  .masthead nav > * { flex-shrink: 0; }
}
@media (max-width: 760px) {
  .masthead { min-height: 74px; flex-direction: row; padding-block: 9px; }
  .masthead nav { width: 100%; gap: 12px; }
  .masthead .brand small { display: none; }
  .masthead[data-navigation-ready] .static-menu-toggle { display: inline-flex; margin-left: auto; }
  .masthead[data-navigation-ready] nav {
    position: absolute;
    z-index: 120;
    inset: 100% 0 auto;
    display: none;
    max-height: calc(100dvh - 74px);
    align-items: stretch;
    gap: 0;
    padding: 12px 18px 20px;
    overflow-y: auto;
    border-bottom: 1px solid var(--line);
    background: var(--paper);
    box-shadow: var(--shadow-soft);
  }
  .masthead[data-navigation-ready] nav.is-open { display: grid; }
  .masthead nav :is(a, button) { width: 100%; min-height: 44px; padding: 11px; justify-content: flex-start; }
  .masthead nav a::after { display: none; }
  .masthead .nav-search { margin-top: 8px; }
  .platform-footer { grid-template-columns: 1fr; padding-inline: 22px; }
  .platform-footer > div, .platform-footer > small { grid-column: auto; }
}
@media (max-width: 520px) {
  .masthead { padding-inline: 18px; }
  .platform-footer { padding-inline: 18px; }
}
@media (max-width: 420px) {
  .masthead .mark { width: 46px; height: 44px; }
}

/* The masthead monogram is the same asset used on the homepage. */
.masthead img.mark { width:58px;height:58px;object-fit:contain;border:0;display:block; }
@media(max-width:760px){.masthead .brand strong{font-size:20px}.masthead img.mark{width:46px;height:46px}.masthead{gap:14px}}
/* A single compact navigation behaviour across portfolio pages and product demos. */
.masthead[data-navigation-ready],.editorial-masthead[data-navigation-ready]{position:sticky;top:0;z-index:100;background:var(--paper);overflow:visible}
.editorial-masthead .primary{gap:24px;align-items:center}
.editorial-masthead .primary :is(a,button){min-height:44px;display:inline-flex;align-items:center}
.editorial-masthead .nav-search,.editorial-masthead .nav-cv{padding:8px 12px;border:1px solid var(--line);border-radius:2px;background:transparent;color:var(--navy);font:600 14px var(--sans);text-decoration:none}
@media(max-width:1000px){
 .masthead[data-navigation-ready],.editorial-masthead[data-navigation-ready]{min-height:74px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;padding-block:9px}
 .masthead[data-navigation-ready] .static-menu-toggle,.editorial-masthead[data-navigation-ready] .static-menu-toggle{display:inline-flex;margin-left:auto}
 .masthead[data-navigation-ready] nav,.editorial-masthead[data-navigation-ready] .primary{position:absolute;z-index:120;inset:100% 0 auto;display:none;width:100%;max-height:calc(100dvh - 74px);padding:12px 18px 20px;overflow-y:auto;gap:0;background:var(--paper);border:1px solid var(--line);box-shadow:0 12px 24px rgba(16,40,63,.12)}
 .masthead[data-navigation-ready] nav.is-open,.editorial-masthead[data-navigation-ready] .primary.is-open{display:grid}
 .masthead[data-navigation-ready] nav :is(a,button),.editorial-masthead[data-navigation-ready] .primary :is(a,button){width:100%;min-height:44px;padding:11px;justify-content:flex-start;font:600 16px var(--sans)}
 .masthead[data-navigation-ready] nav a::after{display:none}
 .editorial-masthead[data-navigation-ready] .brand{font-size:21px;gap:12px}
 .editorial-masthead[data-navigation-ready] .brand img{width:48px;height:48px}
}

/* Short landscape screens need the full viewport for forms and reading. */
@media(max-height:500px) and (max-width:1000px){.masthead[data-navigation-ready],.editorial-masthead[data-navigation-ready]{position:relative!important}}
.platform-footer>*{min-width:0;max-width:100%;box-sizing:border-box}
.platform-footer nav{grid-template-columns:minmax(0,1fr)}
.platform-footer .brand>*{min-width:0;overflow-wrap:anywhere}
@media(max-width:760px){.platform-footer{grid-template-columns:minmax(0,1fr)}}

/* Optional update notice: never reload automatically or clear saved drafts. */
.site-update-notice{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:200;width:min(720px,calc(100% - 32px));display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:16px;background:#fcfaf5;color:#10283f;border:1px solid #795b20;border-radius:3px;box-shadow:0 6px 24px #10283f26;font:400 15px/1.5 var(--sans,Arial,sans-serif)}
.site-update-notice p{flex:1 1 280px;margin:0}.site-update-notice button{min-height:44px;padding:10px 16px;border:1px solid #10283f;background:#10283f;color:white;font:inherit;border-radius:3px;cursor:pointer}.site-update-notice [data-update-dismiss]{background:transparent;color:#10283f}.site-update-notice button:focus-visible{outline:3px solid #795b20;outline-offset:3px}
#library-search{scroll-margin-top:100px}.library-search-return{display:inline-flex;min-height:44px;align-items:center;margin:0 0 16px;color:#795b20;text-underline-offset:4px}
@media print{.site-update-notice{display:none!important}}

/* Reserve the compact header row before web fonts finish loading. */
@media(max-width:1000px){
 .masthead[data-navigation-ready],.editorial-masthead[data-navigation-ready]{flex-wrap:nowrap}
 .masthead[data-navigation-ready]>.brand,.editorial-masthead[data-navigation-ready]>.brand{min-width:0}
 .static-menu-toggle{flex-shrink:0}
}
@media(max-width:420px){
 .masthead[data-navigation-ready]>.brand{gap:8px}
 .masthead .brand strong{font-size:clamp(16px,4.6vw,18px)}
 .masthead img.mark{width:40px;height:40px;flex-shrink:0}
}

.product-context{max-width:1200px;margin:32px auto;padding:24px;border-top:1px solid var(--line,#ded5c5);font:400 16px/1.6 var(--sans);color:var(--ink,#10283f);background:var(--paper,#fcfaf5)}
.product-context nav{display:flex;flex-wrap:wrap;gap:12px 24px}.product-context a{min-height:44px;display:inline-flex;align-items:center;color:inherit;text-decoration:underline}
.platform-footer .brand{font-size:16px;letter-spacing:normal;text-decoration:none}
.platform-footer .brand strong{font:600 22px/1.2 var(--serif)}
.platform-footer .brand small{font:400 13px/1.5 var(--sans)}
.platform-footer>div p{margin:16px 0 0;font:400 14px/1.65 var(--sans);color:#c6cfda}
.platform-footer>small{font:400 13px/1.5 var(--sans);color:#b7c3d1}
.platform-footer a:focus-visible{outline:3px solid var(--gold-light);outline-offset:3px}
@media print{.masthead,.platform-footer,.product-context{display:none!important}}
