/* public/site-header.css — written by scripts/seo_pages.py (D-359.1) from src/styles/brand.css and src/styles/site-header.css. Do not edit: the next build overwrites it. */
@font-face{font-family:'DM Sans';src:url('/fonts/DMSans-var.woff2') format('woff2');font-weight:300 700;font-style:normal;font-display:swap}
.brand-grad-btn { background-image: linear-gradient(92deg, #5e61ec 0%, #8352f3 50%, #c026d3 100%); color: #fff !important; transition: opacity .18s ease, transform .18s ease, box-shadow .18s ease; }
.brand-grad-btn:hover { opacity: .92; transform: translateY(-1px); }
.glow-cta { box-shadow: 0 10px 34px -8px rgba(139, 92, 246, .55); }
.brand-grad { background-image: linear-gradient(92deg,#5e61ec 0%,#8352f3 50%,#c026d3 100%); color:#fff !important; }
.mh { position: sticky; top: 0; z-index: 40; background: rgba(10, 15, 28, .85); border-bottom: 1px solid rgba(255, 255, 255, .1);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  display: block; margin: 0; padding: 0; text-align: left; font-family: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px; line-height: 1.5; font-weight: 400; font-style: normal; letter-spacing: normal; color: #f8fafc; -webkit-font-smoothing: antialiased; }
.mh :where(*, *::before, *::after) { box-sizing: border-box; }
.mh :where(a:not(.brand-grad-btn), p, nav, div, span:not(.brand-grad), details, summary, button) { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
  font: inherit; color: inherit; letter-spacing: inherit; text-align: inherit; text-decoration: none; text-transform: none; list-style: none; }
.mh :where(nav, div, p, details) { display: block; }
.mh :where(svg) { display: block; flex: none; }
.mh .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; }
.mh-row { position: relative; max-width: 72rem; margin: 0 auto; padding: 12px 16px; display: flex; align-items: center;
  justify-content: space-between; gap: 12px; }
@media (min-width: 640px) { .mh-row { padding: 14px 24px; gap: 16px; } }
.mh a, .mh button, .mh summary { -webkit-tap-highlight-color: transparent; }
.mh :focus-visible { outline: 2px solid #a78bfa; outline-offset: 2px; }
.mh-brand { display: flex; align-items: center; gap: 11px; flex: none; margin: 0; padding: 0; border: 0; border-radius: 12px;
  background: none; color: inherit; font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.mh-mark { width: 38px; height: 38px; flex: none; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.mh-mark svg { width: 19px; height: 19px; }
.mh-lockup { display: flex; flex-direction: column; gap: 5px; }
.mh-word { font-size: 19px; line-height: 1; font-weight: 700; letter-spacing: -.02em; color: #f8fafc; white-space: nowrap; }
.mh-tag { display: flex; justify-content: space-between; contain: inline-size; font-size: 10px; line-height: 1; font-weight: 500;
  color: #94a3b8; white-space: nowrap; }
.mh-tag .mh-dot { color: #8b5cf6; }
.mh-tag .mh-last { color: #c4b5fd; }
.mh-nav { display: none; }
@media (min-width: 1024px) {
  .mh-nav { display: flex; align-items: center; gap: 2px; padding: 4px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 9999px;
    background: rgba(255, 255, 255, .025); }
}
.mh-link { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border-radius: 9999px; font-size: 14px; line-height: 18px;
  font-weight: 500; letter-spacing: -.005em; color: #cbd5e1; text-decoration: none; white-space: nowrap;
  transition: color .15s ease, background-color .15s ease; }
.mh-link svg { width: 14px; height: 14px; opacity: .6; transition: transform .2s ease, opacity .2s ease; }
.mh-link:hover, .mh-item:hover > .mh-link, .mh-item:focus-within > .mh-link, .mh-link[aria-current] { color: #f8fafc; background: rgba(255, 255, 255, .07); }
.mh-item:hover > .mh-link svg, .mh-item:focus-within > .mh-link svg { transform: rotate(180deg); opacity: 1; }
.mh-drop { position: absolute; left: 50%; top: calc(100% - 19px); z-index: 50; padding-top: 27px; width: min(66rem, calc(100vw - 32px));
  opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, 6px);
  transition: opacity .16s ease, transform .16s ease, visibility 0s linear .16s; }
.mh-drop-narrow { width: min(48rem, calc(100vw - 32px)); }
.mh-item:hover > .mh-drop, .mh-item:focus-within > .mh-drop { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 0);
  transition-delay: 0s; }
.mh-panel { display: grid; gap: 4px; padding: 10px; border-radius: 20px; background: #0f1527; border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .85); text-align: left; }
.mh-panel-4 { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 15rem); }
.mh-panel-3 { grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(0, 15rem); }
.mh-col { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mh-col-h { margin: 0; padding: 12px 12px 8px; font-size: 11px; line-height: 1; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: #7c8aa3; }
.mh-it { display: flex; align-items: flex-start; gap: 12px; padding: 10px 12px; border-radius: 13px; text-decoration: none;
  transition: background-color .15s ease; }
.mh-it:hover { background: rgba(255, 255, 255, .05); }
.mh-ico { width: 34px; height: 34px; flex: none; border-radius: 10px; display: flex; align-items: center; justify-content: center;
  color: #c4b5fd; background: rgba(139, 92, 246, .12); border: 1px solid rgba(139, 92, 246, .26); }
.mh-ico svg { width: 17px; height: 17px; }
.mh-it-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mh-it-l { display: flex; align-items: center; gap: 7px; font-size: 14px; line-height: 1.3; font-weight: 600; color: #f8fafc; }
.mh-it-d { font-size: 12.5px; line-height: 1.4; color: #94a3b8; }
.mh-pill { font-size: 10px; line-height: 1; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; border-radius: 6px; padding: 3px 6px; }
.mh-pill-new { background: rgba(34, 197, 94, .14); color: #86efac; }
.mh-pill-soon { background: rgba(251, 191, 36, .12); color: #fcd34d; }
.mh-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 4px; }
.mh-links a { padding: 9px 12px; border-radius: 10px; font-size: 13.5px; line-height: 1.3; color: #cbd5e1; text-decoration: none; }
.mh-links a:hover { background: rgba(255, 255, 255, .05); color: #fff; }
.mh-links .mh-all { grid-column: 1 / -1; }
.mh-links a.mh-all, .mh-strip a.mh-all { color: #c4b5fd; font-weight: 600; }
.mh-links a.mh-all:hover, .mh-strip a.mh-all:hover { color: #fff; }
.mh-feat { display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 15px; text-decoration: none;
  background: linear-gradient(155deg, rgba(94, 97, 236, .26), rgba(131, 82, 243, .14) 45%, rgba(192, 38, 211, .12));
  border: 1px solid rgba(196, 181, 253, .24); transition: border-color .15s ease; }
.mh-feat:hover { border-color: rgba(196, 181, 253, .5); }
.mh-feat-k { font-size: 11px; line-height: 1; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #c4b5fd; }
.mh-feat-t { font-size: 17px; line-height: 1.25; font-weight: 700; letter-spacing: -.015em; color: #fff; }
.mh-feat-d { font-size: 13px; line-height: 1.45; color: #cbd5e1; }
.mh-feat-go { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #fff; }
.mh-feat-go svg, .mh-strip svg { width: 15px; height: 15px; }
.mh-strip { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; margin-top: 6px; padding: 12px 12px 4px;
  border-top: 1px solid rgba(255, 255, 255, .08); }
.mh-strip a { display: inline-flex; align-items: center; gap: 7px; padding: 4px 0; font-size: 13px; color: #94a3b8; text-decoration: none; }
.mh-strip a:hover { color: #fff; }
.mh-strip .mh-all { margin-left: auto; }
.mh-acts { display: flex; align-items: center; gap: 8px; flex: none; }
.mh-signin { display: none; padding: 10px 12px; border-radius: 10px; font-size: 14px; line-height: 18px; font-weight: 500; color: #e2e8f0;
  text-decoration: none; white-space: nowrap; }
.mh-signin:hover { color: #fff; }
@media (min-width: 640px) { .mh-signin { display: block; } }
.mh-start { display: inline-flex; align-items: center; gap: 7px; padding: 10px 14px; border-radius: 11px; font-size: 14px; line-height: 18px;
  font-weight: 600; text-decoration: none; white-space: nowrap; }
.mh-start svg { width: 15px; height: 15px; transition: transform .16s ease; }
.mh-start:hover svg { transform: translateX(2px); }
@media (min-width: 1024px) { .mh-menu { display: none; } }
.mh-menu > summary { list-style: none; width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center;
  color: #e2e8f0; cursor: pointer; transition: background-color .15s ease; }
.mh-menu > summary::-webkit-details-marker { display: none; }
.mh-menu > summary:hover, .mh-menu[open] > summary { background: rgba(255, 255, 255, .08); }
.mh-menu > summary svg { width: 22px; height: 22px; }
.mh-menu .mh-ico-x, .mh-menu[open] .mh-ico-menu { display: none; }
.mh-menu[open] .mh-ico-x { display: block; }
.mh-sheet { position: absolute; left: 0; right: 0; top: 100%; max-height: calc(100vh - 64px); max-height: calc(100dvh - 64px); overflow-y: auto;
  overscroll-behavior: contain; padding: 4px 16px 16px; background: #0a0f1c; border-bottom: 1px solid rgba(255, 255, 255, .1);
  box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .6); }
@media (min-width: 640px) {
  .mh-sheet { left: auto; right: 24px; width: 24rem; margin-top: 8px; max-height: calc(100vh - 88px); max-height: calc(100dvh - 88px);
    border: 1px solid rgba(255, 255, 255, .12); border-radius: 18px; }
}
.mh-acc { border-bottom: 1px solid rgba(255, 255, 255, .08); }
.mh-acc > summary { list-style: none; min-height: 52px; padding: 0 6px; display: flex; align-items: center; justify-content: space-between;
  font-size: 16px; font-weight: 600; color: #f8fafc; cursor: pointer; }
.mh-acc > summary::-webkit-details-marker { display: none; }
.mh-acc > summary svg { width: 18px; height: 18px; color: #94a3b8; transition: transform .2s ease; }
.mh-acc[open] > summary svg { transform: rotate(180deg); }
.mh-acc-body { padding: 0 0 12px; }
.mh-acc-h { margin: 0; padding: 12px 6px 6px; font-size: 11px; line-height: 1; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: #7c8aa3; }
.mh-acc-body a { min-height: 44px; padding: 0 6px; border-radius: 10px; display: flex; align-items: center; gap: 12px; font-size: 15px;
  font-weight: 500; color: #cbd5e1; text-decoration: none; }
.mh-acc-body a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.mh-acc-body a svg { width: 18px; height: 18px; flex: none; color: #c4b5fd; }
.mh-acc-body a.mh-all { color: #c4b5fd; font-weight: 600; }
.mh-acc-more { margin-top: 6px; padding-top: 6px; border-top: 1px solid rgba(255, 255, 255, .06); }
.mh-sheet-link { min-height: 52px; padding: 0 6px; display: flex; align-items: center; font-size: 16px; font-weight: 600; color: #f8fafc;
  text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.mh-sheet-signin { margin-top: 14px; min-height: 48px; display: flex; align-items: center; justify-content: center; border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .16); font-size: 15px; font-weight: 600; color: #f8fafc; text-decoration: none; }
@media (min-width: 640px) { .mh-sheet-signin { display: none; } }
@media (max-width: 369px) {
  .mh-row { padding-left: 12px; padding-right: 12px; gap: 8px; }
  .mh-brand { gap: 9px; }
  .mh-mark { width: 34px; height: 34px; border-radius: 11px; }
  .mh-word { font-size: 17px; }
  .mh-tag { font-size: 9px; }
  .mh-acts { gap: 6px; }
  .mh-start { padding: 10px 12px; }
  .mh-start svg { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .mh-link, .mh-link svg, .mh-drop, .mh-it, .mh-feat, .mh-start svg, .mh-menu > summary, .mh-acc > summary svg { transition: none; }
}
