/* Homepage narrative upgrades: product-first hero, proof strip, test marquee,
   reputation-gap cases, category comparison, threat coverage, integration,
   why-switch, home FAQ, tools menu, footer status. Loads last. */

/* ------------------------------------------------------------ tools menu */
.nav__item--menu { position: relative; }
.nav__item--menu > .nav__link { display: inline-flex; align-items: center; gap: 6px; background: transparent; border: 0; cursor: pointer; }
.nav__item--menu > .nav__link::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s; }
.nav__item--menu[data-open="true"] > .nav__link::after { transform: translateY(1px) rotate(225deg); }
.nav__menu { position: absolute; top: calc(100% + 6px); left: 8px; min-width: 260px; margin: 0; padding: 8px; list-style: none; background: #fff; border: 1px solid #dbe3f2; border-radius: 12px; box-shadow: 0 18px 44px -18px rgba(37, 48, 83, .35); opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .18s, transform .18s, visibility .18s; z-index: 30; }
.nav__item--menu[data-open="true"] .nav__menu, .nav__item--menu:focus-within .nav__menu { opacity: 1; visibility: visible; transform: translateY(0); }
@media (hover: hover) { .nav__item--menu:hover .nav__menu { opacity: 1; visibility: visible; transform: translateY(0); } }
.nav__menu a { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 10px 12px; border-radius: 8px; color: var(--navy); }
.nav__menu a:hover { background: #eef3ff; }
.nav__menu strong { font-size: 14px; }
.nav__menu small { grid-column: 1; color: #63718a; font-size: 12px; line-height: 1.5; }
.nav__menu a > span:last-child { grid-row: span 2; align-self: center; color: var(--blue); font-size: 14px; }
.nav__menu-tag { display: inline-block; margin-left: 8px; padding: 1px 6px; border-radius: 4px; background: #e6f8f1; color: #1f8a68; font-size: 10px; font-weight: 700; letter-spacing: .06em; vertical-align: 2px; }
@media (max-width: 960px) {
  .nav__item--menu > .nav__link::after { display: none; }
  .nav__menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; padding: 0 0 6px 12px; min-width: 0; }
  .nav__menu a { padding: 8px 4px; }
}

/* ------------------------------------------------------- product-first hero */
.hero--console { padding: 70px 0 64px; }
.hero--console::before { display: none; }
.hero--console::after { -webkit-mask-image: none; mask-image: none; background: radial-gradient(ellipse at 78% 30%, rgba(87, 225, 189, .12), transparent 45%), radial-gradient(ellipse at 15% 80%, rgba(240, 193, 75, .1), transparent 40%), radial-gradient(rgba(255, 255, 255, .07) 1px, transparent 1.2px) 0 0 / 22px 22px; }
.hero--console .hero__grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; gap: 48px; }
.hero--console .hero__inner { max-width: none; }
.hero--console h1 { font-size: clamp(34px, 3.6vw, 50px); line-height: 1.08; letter-spacing: -.03em; }
.hero--console h1 em { font-style: normal; color: #8ff0d6; }
.hero--console .hero__proof span[aria-hidden] { opacity: .5; }
.hero .edge-console { box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .04); }
.hero .edge-console__intro { padding-top: 18px; }
.hero .edge-console__intro h3 { font-size: 18px; }
.hero .edge-console__intro p { margin-bottom: 14px; }
.hero .edge-log tbody tr:nth-child(n+5) { display: none; }
.hero .edge-feed-note { display: none; }
.edge-evidence > div { grid-template-columns: 118px minmax(0, 1fr); }
.edge-evidence dd[data-edge-reputation] { color: #9fd8c3; }
.edge-evidence dd[data-edge-connection] { color: #ffb2b5; font-weight: 600; }
.edge-assessment[data-tone="allow"] .edge-evidence dd[data-edge-connection] { color: #80ebca; }
.edge-assessment[data-tone="caution"] .edge-evidence dd[data-edge-connection] { color: #f4d080; }
.edge-evidence dd[data-edge-seen] { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.edge-rescan { display: flex; justify-content: center; margin: 0 24px 18px; }
.edge-rescan a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 11px 14px; border: 1px solid #3f5d82; border-radius: 8px; background: #10213b; color: #cfe0ff; font: 700 11px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; transition: border-color .2s, background .2s, color .2s; }
.edge-rescan a:hover { border-color: #7fe6c6; background: #14343e; color: #a9efdb; }
.edge-log__ms { display: block; margin-top: 3px; color: #7f95b8; font-size: 9px; }
@media (max-width: 960px) {
  .hero--console { padding: 44px 0 48px; }
  .hero--console .hero__grid { grid-template-columns: 1fr; gap: 30px; }
  .hero .edge-console { max-width: 660px; }
}
@media (max-width: 480px) { .edge-evidence > div { grid-template-columns: 96px minmax(0, 1fr); } .edge-rescan { margin-inline: 16px; } }

/* ------------------------------------------------------------ proof strip */
.mg-proof-strip { background: #fff; border-bottom: 1px solid #dfe7f4; }
.mg-proof-strip__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mg-proof-strip a { display: grid; grid-template-columns: minmax(0, 1fr) 16px; gap: 4px 12px; align-items: start; padding: 22px 20px; border-right: 1px solid #e1e7f1; color: var(--navy); transition: background .2s; }
.mg-proof-strip a:first-child { border-left: 1px solid #e1e7f1; }
.mg-proof-strip a:hover { background: #edf3ff; }
.mg-proof-strip__value, .mg-proof-strip__label { grid-column: 1; }
.mg-proof-strip a > span:last-child { grid-column: 2; grid-row: 1 / span 2; }
.mg-proof-strip__value { display: block; font-family: var(--font-head); font-size: 28px; font-weight: 800; line-height: 1.1; letter-spacing: -.03em; color: var(--blue); }
.mg-proof-strip__value small { font-size: 13px; font-weight: 700; letter-spacing: .04em; margin-left: 6px; color: #5f73a3; }
.mg-proof-strip__label { display: block; font-size: 12.5px; line-height: 1.55; color: #55658a; margin-top: 4px; }
.mg-proof-strip a > span:last-child { grid-row: span 2; align-self: center; color: var(--blue); font-size: 16px; }
@media (max-width: 960px) { .mg-proof-strip__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mg-proof-strip a:nth-child(3) { border-left: 1px solid #e1e7f1; } .mg-proof-strip a:nth-child(n+3) { border-top: 1px solid #e1e7f1; } }
@media (max-width: 480px) { .mg-proof-strip a { padding: 16px 14px; } .mg-proof-strip__value { font-size: 22px; } }

/* --------------------------------------------------------------- marquee */
.mg-marquee { overflow: hidden; background: #091b43; border-bottom: 1px solid #294272; color: #d5e2fa; }
.mg-marquee__inner { display: flex; align-items: center; gap: 24px; max-width: 1360px; margin: 0 auto; padding: 0 20px; }
.mg-marquee__label { flex: 0 0 auto; padding: 12px 0; color: #7df0cf; font-size: 10.5px; font-weight: 750; letter-spacing: .12em; white-space: nowrap; }
.mg-marquee__track { flex: 1 1 auto; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.mg-marquee__list { display: flex; gap: 10px; width: max-content; margin: 0; padding: 10px 0; list-style: none; animation: mg-marquee 38s linear infinite; }
.mg-marquee__list li { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid #2f4a78; border-radius: 999px; font-size: 12px; white-space: nowrap; }
.mg-marquee__list li::before { content: "\2713"; color: #7df0cf; font-weight: 700; }
.mg-marquee:hover .mg-marquee__list, body.mg-motion-paused .mg-marquee__list { animation-play-state: paused; }
@keyframes mg-marquee { to { transform: translateX(-50%); } }
@media (max-width: 600px) { .mg-marquee__inner { flex-direction: column; gap: 0; align-items: stretch; } .mg-marquee__label { padding: 10px 0 0; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .mg-marquee__list { animation: none; flex-wrap: wrap; width: auto; } .mg-marquee__list li:nth-child(n+9) { display: none; } .mg-marquee__track { mask-image: none; -webkit-mask-image: none; } }

/* ------------------------------------------------------ reputation-gap cases */
.mg-cases { display: grid; gap: 14px; }
.mg-case { position: relative; padding: 18px 20px 16px; border: 1px solid #2d4469; border-radius: 12px; background: #0b1831; color: #d8e5fa; box-shadow: 0 20px 55px -30px #15295370; }
.mg-case__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; font: 700 10.5px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .1em; color: #f4d493; }
.mg-case__head span:last-child { color: #9fb4d1; font-weight: 500; }
.mg-case dl { display: grid; gap: 7px; margin: 0; }
.mg-case dl > div { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 10px; font-size: 12px; line-height: 1.5; }
.mg-case dt { color: #9fb2cf; }
.mg-case dd { margin: 0; color: #e6edfa; }
.mg-case dd[data-tone="clean"] { color: #9fd8c3; }
.mg-case dd[data-tone="flag"] { color: #ffb2b5; font-weight: 600; }
.mg-case__verdict { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #263a5a; font-size: 11px; color: #adc0dc; }
.mg-case__verdict strong { letter-spacing: .08em; font-size: 10.5px; }
.mg-case[data-outcome="block"] .mg-case__verdict strong { color: #ffaaa7; }
.mg-case[data-outcome="review"] .mg-case__verdict strong { color: #f4d080; }
.mg-cases__note { margin: 4px 0 0; color: #63718a; font-size: 12px; line-height: 1.6; }
@media (max-width: 480px) { .mg-case dl > div { grid-template-columns: 96px minmax(0, 1fr); } }

/* ------------------------------------------------------- category comparison */
.mg-versus-wrap { overflow-x: auto; border: 1px solid #d5ddef; border-radius: 14px; background: #fff; box-shadow: 0 18px 44px -30px rgba(37, 48, 83, .3); }
.mg-versus { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 14px; line-height: 1.5; }
.mg-versus th, .mg-versus td { padding: 16px 18px; text-align: left; vertical-align: top; border-top: 1px solid #e6ebf5; }
.mg-versus thead th { border-top: 0; background: #f4f7fd; color: #55658a; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.mg-versus thead th.mg-versus__us { background: var(--navy); color: #fff; }
.mg-versus tbody th { color: var(--navy); font-weight: 700; font-size: 14px; width: 21%; }
.mg-versus td { color: #55658a; }
.mg-versus td.mg-versus__us { background: #f2f9f6; color: var(--navy); }
.mg-versus i { display: inline-grid; place-items: center; width: 18px; height: 18px; margin-right: 8px; border-radius: 50%; font-style: normal; font-size: 11px; font-weight: 800; vertical-align: -3px; }
.mg-versus i[data-mark="no"] { background: #fde5e6; color: #c8404b; }
.mg-versus i[data-mark="part"] { background: #fff2d6; color: #b4831e; }
.mg-versus i[data-mark="yes"] { background: #dff5ec; color: #1f8a68; }
.mg-versus__foot { margin: 14px 0 0; color: #63718a; font-size: 12.5px; line-height: 1.7; text-align: center; }

/* ---------------------------------------------------------- threat coverage */
.mg-threats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.mg-threat { position: relative; overflow: hidden; padding: 24px 24px 22px; border: 1px solid rgba(48, 76, 178, .15); border-radius: 18px; background: linear-gradient(145deg, #fff, #f8faff); box-shadow: 0 12px 34px rgba(28, 48, 107, .07); transition: transform .3s, box-shadow .3s, border-color .3s; }
.mg-threat:hover { transform: translateY(-4px); box-shadow: 0 20px 46px rgba(28, 48, 107, .13); border-color: rgba(48, 76, 178, .28); }
.mg-threat::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, #d64550, #f0a04b); }
.mg-threat--pass::before { background: linear-gradient(90deg, #1f8a68, #52e6b4); }
.mg-threat__vis { display: block; width: 100%; height: 72px; margin-bottom: 16px; }
.mg-threat__vis svg { display: block; width: 100%; height: 100%; fill: none; stroke: var(--blue); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.mg-threat__vis .tv-bad { stroke: #d64550; }
.mg-threat__vis .tv-good { stroke: #1f8a68; }
.mg-threat__vis .tv-soft { stroke: #b6c3e6; }
.mg-threat__vis .tv-fill { fill: #eef3ff; }
.mg-threat__vis .tv-fill-bad { fill: #fde5e6; }
.mg-threat__vis .tv-fill-good { fill: #dff5ec; }
.mg-threat__vis text { fill: #5f73a3; stroke: none; font-size: 8px; letter-spacing: .08em; }
.mg-threat__vis .tv-dash { stroke-dasharray: 3 4; }
.mg-threat__vis .tv-flow { stroke-dasharray: 4 8; animation: mg-dash-flow 1.6s linear infinite; }
.mg-threat h3 { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 19px; line-height: 1.3; }
.mg-threat h3 i { flex: 0 0 auto; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: #fde5e6; color: #c8404b; font-style: normal; font-size: 11px; font-weight: 800; }
.mg-threat--pass h3 i { background: #dff5ec; color: #1f8a68; }
.mg-threat p { margin: 0 0 14px; color: var(--text-muted); font-size: 14px; line-height: 1.65; }
.mg-threat__sig { display: inline-flex; align-items: center; gap: 8px; padding: 5px 10px; border-radius: 6px; background: #eef3ff; color: #3d5296; font: 600 11px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .04em; }
.mg-threat__sig::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--blue); }
@media (max-width: 960px) { .mg-threats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .mg-threats { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .mg-threat__vis .tv-flow { animation: none; } }

/* ------------------------------------------------------------ integration */
.mg-integration { background: #f4f7fd; border-block: 1px solid #e1e8f5; }
.mg-integration .mg-split { align-items: start; }
.mg-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; padding: 0; list-style: none; }
.mg-chips li { padding: 8px 12px; border: 1px solid #cfd9ee; border-radius: 8px; background: #fff; color: var(--navy); font: 600 12.5px ui-monospace, SFMono-Regular, Consolas, monospace; }
.mg-chips li[data-hot] { border-color: #8fd6bd; background: #eefaf5; color: #1f8a68; }
.mg-steps { counter-reset: steps; margin: 0; padding: 0; list-style: none; display: grid; }
.mg-steps li { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 16px; padding: 20px 22px; border-top: 1px solid #2c3d5a; }
.mg-steps li:first-child { border-top: 0; }
.mg-steps li::before { counter-increment: steps; content: "0" counter(steps); grid-row: span 2; align-self: start; color: #7fe6c6; font: 700 13px ui-monospace, SFMono-Regular, Consolas, monospace; padding-top: 3px; }
.mg-steps strong { color: #eff5ff; font-size: 16px; }
.mg-steps span { color: #a6bbd9; font-size: 13px; line-height: 1.7; }
.mg-steps code { color: #95e9d2; font: 12px ui-monospace, SFMono-Regular, Consolas, monospace; }
.mg-integration .mg-panel__foot > span { flex: 1; }

/* --------------------------------------------------------------- why switch */
.mg-why { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.mg-why article { padding: 28px 26px; border: 1px solid #dbe4f4; border-radius: 18px; background: #fff; box-shadow: 0 14px 38px rgba(37, 48, 83, .06); }
.mg-why__num { display: block; margin-bottom: 14px; color: var(--blue); font: 700 12px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .1em; }
.mg-why h3 { margin-bottom: 10px; font-size: 21px; line-height: 1.3; }
.mg-why p { margin: 0; color: var(--text-muted); font-size: 15px; line-height: 1.7; }
.mg-why a { display: inline-block; margin-top: 14px; color: var(--blue); font-size: 13px; font-weight: 700; text-underline-offset: 4px; }
.mg-why a:hover { text-decoration: underline; }
@media (max-width: 960px) { .mg-why { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------- home FAQ */
.mg-faq { background: #f8f9fd; border-top: 1px solid #e4eaf5; }
.mg-faq .faq { max-width: 860px; }
.mg-faq .faq__item { background: #fff; }
.mg-faq .faq__q { font-size: 18px; }
.mg-faq__more { text-align: center; margin: 12px 0 0; font-size: 14px; }
.mg-faq__more a { color: var(--blue); font-weight: 700; text-underline-offset: 4px; }
.mg-faq__more a:hover { text-decoration: underline; }
.faq__q { display: flex; gap: 14px; align-items: flex-start; width: 100%; padding: 18px 24px; background: transparent; border: 0; text-align: left; font: 700 19px/1.4 var(--font-head); color: var(--navy); cursor: pointer; }

/* ------------------------------------------------------------ footer status */
.site-footer__bottom { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px 26px; }
.mg-status-pill { display: inline-flex; align-items: center; gap: 9px; padding: 6px 12px; border: 1px solid #cfe2dc; border-radius: 999px; background: #eefaf5; color: #1f8a68; font: 700 10.5px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .1em; }
.mg-status-pill .edge-dot { background: #2fb98e; box-shadow: 0 0 0 4px rgba(47, 185, 142, .15); }

/* ------------------------------------------------------ feature card icons */
.key-feature-card__icon svg { width: 34px; height: 34px; fill: none; stroke: var(--blue); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.key-feature-card__icon svg .kf-accent { stroke: #1f8a68; }
.key-feature-card__icon svg .kf-danger { stroke: #d64550; }
.mg-threat__vis text.tv-text-bad { fill: #c8404b; }

/* ------------------------------------------------ consistency pass */
/* Nav: the Tools button must match link typography exactly. */
.nav__item--menu > .nav__link { font-family: var(--font-body); font-weight: 400; line-height: inherit; letter-spacing: inherit; color: var(--navy); }
.nav__item--menu > .nav__link:hover { font-weight: 700; }
/* Announcement: one line on desktop, pause control docked right. */
@media (min-width: 1100px) {
  .edge-announcement .container { flex-wrap: nowrap; justify-content: flex-start; }
  .edge-announcement .container > span:nth-child(2) { flex: 1 1 auto; min-width: 0; }
  .edge-announcement .mg-motion-toggle { margin-left: auto; flex: 0 0 auto; }
}
/* Hero: copy anchored to the top of the column, console trimmed to three rows. */
.hero--console .hero__grid { align-items: start; }
.hero--console .hero__inner { padding-top: 34px; }
.hero .edge-log tbody tr:nth-child(n+4) { display: none; }
.hero__proof { display: flex; flex-wrap: wrap; gap: 6px 0; }
.hero__proof > span { display: inline-flex; align-items: center; white-space: nowrap; }
.hero__proof > span + span::before { content: ""; width: 4px; height: 4px; margin: 0 10px; border-radius: 50%; background: rgba(255, 255, 255, .45); }
@media (max-width: 960px) { .hero--console .hero__inner { padding-top: 0; } }
/* Threat cards: icon aligned to the first line of a wrapping title. */
.mg-threat h3 { align-items: flex-start; }
.mg-threat h3 i { margin-top: 4px; }
/* Why-switch cards: equal height, link pinned to the bottom. */
.mg-why article { display: flex; flex-direction: column; }
.mg-why p { flex: 1 1 auto; }
.mg-why a { margin-top: 18px; }
/* Comparison table: hanging indent so wrapped lines align with the text, not the icon. */
.mg-versus td { position: relative; padding-left: 46px; }
.mg-versus td > i { position: absolute; left: 18px; top: 17px; margin: 0; }
.mg-versus tbody th { padding-left: 18px; }
/* Integration panel footer: two short labels, no wrapping. */
.mg-integration .mg-panel__foot { flex-wrap: nowrap; }
.mg-integration .mg-panel__foot > span { flex: 1 1 auto; }
.mg-integration .mg-panel__foot > span:last-child { flex: 0 0 auto; text-align: right; }

/* ------------------------------------------------ hero background, full height */
/* The legacy hero painted an 828px-tall artwork gradient over a flat navy base, which the
   taller console exposed as a hard seam. The console hero paints one continuous field. */
.hero--console {
  background-color: #071440;
  background-image:
    radial-gradient(880px 620px at 84% 14%, rgba(87, 225, 189, .18), transparent 62%),
    radial-gradient(760px 560px at 6% 96%, rgba(240, 193, 75, .14), transparent 62%),
    radial-gradient(1300px 900px at 28% 22%, rgba(44, 84, 214, .9), transparent 70%),
    linear-gradient(165deg, #1a3cb8 0%, #0e2789 42%, #071440 100%);
  background-size: auto;
  background-position: 0 0;
  background-repeat: no-repeat;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.hero--console::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  inset: 12% -12% 8% 48%;
  width: auto;
  height: auto;
  aspect-ratio: auto;
  transform: none;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(closest-side, rgba(38, 78, 210, .55), rgba(38, 78, 210, 0));
}
.hero--console::after {
  inset: 0;
  -webkit-mask-image: none;
  mask-image: none;
  background:
    radial-gradient(rgba(255, 255, 255, .085) 1px, transparent 1.4px) 0 0 / 22px 22px,
    linear-gradient(180deg, rgba(255, 255, 255, .04), transparent 30%, transparent 70%, rgba(0, 8, 36, .35));
  background-size: 22px 22px, auto;
  background-repeat: repeat, no-repeat;
}
@media (min-width: 768px) and (max-width: 1279px) { .hero--console::before { background: radial-gradient(closest-side, rgba(38, 78, 210, .55), rgba(38, 78, 210, 0)); } }
/* Hero field, refined: stronger accent glow, a soft diagonal light sweep, and a faint ring motif
   that peeks out behind the console. */
.hero--console {
  background-image:
    radial-gradient(circle at 80% 46%, transparent 27.5%, rgba(127, 230, 198, .10) 27.7%, rgba(127, 230, 198, .10) 28.1%, transparent 28.3%),
    radial-gradient(circle at 80% 46%, transparent 36.5%, rgba(139, 180, 255, .07) 36.7%, rgba(139, 180, 255, .07) 37.1%, transparent 37.3%),
    linear-gradient(112deg, transparent 38%, rgba(255, 255, 255, .055) 50%, transparent 62%),
    radial-gradient(900px 640px at 90% 8%, rgba(87, 225, 189, .26), transparent 62%),
    radial-gradient(760px 560px at 4% 98%, rgba(240, 193, 75, .16), transparent 62%),
    radial-gradient(1300px 900px at 26% 20%, rgba(44, 84, 214, .92), transparent 70%),
    linear-gradient(165deg, #1a3cb8 0%, #0e2789 42%, #071440 100%);
}
@media (min-width: 900px) {
  .edge-announcement .container { flex-wrap: nowrap; justify-content: flex-start; }
  .edge-announcement .container > span:nth-child(2) { flex: 1 1 auto; min-width: 0; }
  .edge-announcement .container > a { flex: 0 0 auto; white-space: nowrap; }
  .edge-announcement .mg-motion-toggle { margin-left: auto; flex: 0 0 auto; white-space: nowrap; }
}
.edge-announcement__label { white-space: nowrap; }

/* ------------------------------------------------ final enhancement pass */
/* Blue band: illustrative report panel replaces the raster dashboard image. */
.section--blue .band { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; }
.mg-report { width: 100%; max-width: 560px; margin-inline: auto; box-shadow: 0 34px 80px -34px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .06); }
.mg-report__kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 20px 22px 6px; border: 1px solid #2d4160; border-radius: 8px; background: #10213b; }
.mg-report__kpis > div { position: relative; min-width: 0; padding: 12px 12px 12px 24px; }
.mg-report__kpis > div + div { border-left: 1px solid #2d4160; }
.mg-report__kpis > div::before { content: ""; position: absolute; left: 12px; top: 16px; width: 5px; height: 5px; border-radius: 50%; background: #9aafce; }
.mg-report__kpis > div[data-tone="allow"]::before { background: #88e8c9; box-shadow: 0 0 6px #88e8c9; }
.mg-report__kpis > div[data-tone="block"]::before { background: #ffb0b1; box-shadow: 0 0 6px #ffb0b1; }
.mg-report__kpis > div[data-tone="review"]::before { background: #f4d080; box-shadow: 0 0 6px #f4d080; }
.mg-report__kpis dt { color: #acbdd8; font-size: 10.5px; }
.mg-report__kpis dd { margin: 4px 0 0; color: #edf3ff; font: 600 20px ui-monospace, SFMono-Regular, Consolas, monospace; font-variant-numeric: tabular-nums; }
.mg-report__kpis dd small { font-size: 11px; margin-left: 2px; color: #9aafce; }
.mg-report__kpis > div[data-tone="allow"] dd { color: #88e8c9; }
.mg-report__kpis > div[data-tone="block"] dd { color: #ffb0b1; }
.mg-report__kpis > div[data-tone="review"] dd { color: #f4d080; }
.mg-report__bars { display: grid; gap: 12px; padding: 16px 22px 18px; }
.mg-report__bars > div { display: grid; grid-template-columns: 150px minmax(0, 1fr) 42px; align-items: center; gap: 12px; font-size: 12px; color: #d8e5fa; }
.mg-report__bars b { text-align: right; color: #edf3ff; font: 600 12px ui-monospace, SFMono-Regular, Consolas, monospace; }
.mg-report__track { display: block; height: 8px; border-radius: 6px; background: #243650; overflow: hidden; }
.mg-report__track i { display: block; height: 100%; width: var(--w, 0%); border-radius: 6px; background: linear-gradient(90deg, #d9777a, #ffb0b1); }
.mg-report__bars > div:nth-child(4) .mg-report__track i { background: linear-gradient(90deg, #4973cf, #8bb4ff); }
.mg-report__bars > div:nth-child(5) .mg-report__track i { background: linear-gradient(90deg, #d8b25f, #f4d080); }
.mg-report__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 22px; border-top: 1px solid #2c3d5a; color: #a6bbd9; font-size: 11px; }
.mg-report__chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid #3f5d82; border-radius: 6px; background: #10213b; color: #cfe0ff; font: 600 10.5px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .06em; white-space: nowrap; }
@media (max-width: 900px) { .section--blue .band { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .mg-report__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mg-report__kpis > div:nth-child(3) { border-left: 0; } .mg-report__kpis > div:nth-child(n+3) { border-top: 1px solid #2d4160; } .mg-report__bars > div { grid-template-columns: 110px minmax(0, 1fr) 38px; font-size: 11px; } }

/* Cloaking cards: line icons to match the rest of the page. */
.card--iconed { display: flex; flex-direction: column; }
.card__icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 18px; border: 1px solid rgba(48, 76, 178, .13); border-radius: 14px; background: linear-gradient(145deg, #f1f5ff, #fff); box-shadow: inset 0 1px 0 #fff, 0 6px 16px rgba(48, 76, 178, .08); }
.card__icon svg { width: 26px; height: 26px; fill: none; stroke: var(--blue); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.card__icon .ci-accent { stroke: #1f8a68; }

/* Fingerprint panel: reputation-lag timeline. */
.mg-lag { margin: 0 24px 22px; padding: 16px 18px 14px; border: 1px solid #294363; border-radius: 8px; background: #0e1e37; }
.mg-lag__track { position: relative; display: flex; align-items: center; justify-content: space-between; height: 22px; margin: 14px 4px 10px; }
.mg-lag__track::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: repeating-linear-gradient(90deg, #3a5578 0 6px, transparent 6px 12px); }
.mg-lag__dot { position: relative; z-index: 1; width: 12px; height: 12px; border-radius: 50%; }
.mg-lag__dot--now { background: #7fe6c6; box-shadow: 0 0 0 4px rgba(127, 230, 198, .18), 0 0 10px rgba(127, 230, 198, .6); }
.mg-lag__dot--later { background: #f4d493; box-shadow: 0 0 0 4px rgba(244, 212, 147, .16); }
.mg-lag__gap { position: relative; z-index: 1; padding: 3px 9px; border: 1px solid #3f5d82; border-radius: 999px; background: #10213b; color: #b9cbe6; font: 9px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .12em; }
.mg-lag__labels { display: flex; justify-content: space-between; gap: 16px; }
.mg-lag__labels > span { display: grid; gap: 3px; max-width: 46%; }
.mg-lag__labels > span:last-child { text-align: right; }
.mg-lag__labels strong { color: #e9f2ff; font-size: 12px; }
.mg-lag__labels small { color: #a2b8d8; font-size: 10.5px; line-height: 1.5; }
@media (max-width: 600px) { .mg-lag { margin-inline: 16px; padding: 14px; } }

/* Why-switch cards: matching line icons. */
.mg-why article { position: relative; }
.mg-why__icon { position: absolute; top: 24px; right: 24px; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgba(48, 76, 178, .13); border-radius: 12px; background: linear-gradient(145deg, #f1f5ff, #fff); }
.mg-why__icon svg { width: 22px; height: 22px; fill: none; stroke: var(--blue); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.mg-why__icon .wi-accent { stroke: #1f8a68; }
.mg-why__icon .wi-danger { stroke: #d64550; }