/* The site header on Claude Design pages (worksheets, figures, reference, glossary, tools).
   Added by scripts/install_design_export.py. Every rule is scoped to .mc-header so it can't restyle the design,
   and sizes are in px because some design pages change the root font size.
   It scrolls away with the page instead of sticking, so it never covers the design's own sticky toolbars. */
.mc-header,
.mc-header * { box-sizing: border-box; }
.mc-skip-link {
  position: absolute;
  left: -9999px;
  top: 8px;
  z-index: 10000;
  padding: 10px 16px;
  border-radius: 6px;
  background: #fff;
  color: #003049;
  font-family: "Montserrat", system-ui, sans-serif;
  font-weight: 700;
  font-size: 14px;
}
.mc-skip-link:focus { left: 8px; }
.mc-header {
  position: relative;
  z-index: 50;
  background: #003049;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.mc-header-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  max-width: 1120px;
  height: 64px;
  margin: 0 auto;
  padding: 0 24px;
}
.mc-wordmark {
  font-family: "Josefin Sans", "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}
.mc-wordmark span { color: #7FB8BE; }
.mc-nav { display: flex; align-items: center; gap: 26px; }
.mc-nav a {
  font-family: "Montserrat", system-ui, sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none;
  white-space: nowrap;
}
.mc-nav a:hover { color: #fff; }
.mc-nav .mc-nav-buy,
.mc-nav .mc-nav-cta { color: #fff; padding: 8px 16px; border-radius: 6px; }
.mc-nav .mc-nav-buy { background: #B92D28; }
.mc-nav .mc-nav-buy:hover { background: #9A2521; }
.mc-nav .mc-nav-cta { background: #177E89; }
.mc-nav .mc-nav-cta:hover { background: #0B5858; }
.mc-header a:focus-visible,
.mc-header button:focus-visible,
.mc-skip-link:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.mc-nav-toggle {
  display: none;
  font-family: "Montserrat", system-ui, sans-serif;
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  background: transparent;
  border: 2px solid rgba(255, 255, 255, 0.6);
  border-radius: 6px;
  padding: 7px 16px;
  cursor: pointer;
}
.mc-nav-toggle::after { content: " \2630"; }
.mc-header.is-menu-open .mc-nav-toggle::after { content: " \2715"; }

/* Phones and small tablets: the links live behind the Menu button. */
@media (max-width: 980px) {
  .mc-header-wrap { position: relative; }
  .mc-nav-toggle { display: inline-block; }
  .mc-nav {
    display: none;
    position: absolute;
    top: 64px;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 12px 24px 20px;
    background: #003049;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }
  .mc-header.is-menu-open .mc-nav { display: flex; }
  .mc-nav a { padding: 12px 4px; font-size: 16px; }
  .mc-nav .mc-nav-buy,
  .mc-nav .mc-nav-cta { text-align: center; margin-top: 6px; padding: 12px 16px; }
}
@media print {
  .mc-header, .mc-skip-link { display: none !important; }
}
