.migrated-mobile-nav {
  position: fixed;
  inset: 78px 0 auto 0;
  z-index: 1000;
  padding: 1.25rem 1.5rem 1.75rem;
  background: #111111;
  border-top: 1px solid rgba(200, 160, 70, 0.35);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32);
}
.migrated-mobile-nav[hidden] { display: none; }
.migrated-mobile-nav a:not(.button) {
  display: block;
  padding: .85rem 0;
  color: #f7f7f5;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  text-decoration: none;
  font-family: Montserrat, sans-serif;
}
.migrated-mobile-nav .button { margin-top: 1.2rem; width: 100%; text-align: center; }
.static-form-note { font-size: .88rem; color: #5e5e5e; line-height: 1.55; }

/* Patriotic background treatment: a real flag image, softened beneath MaxOut's
   charcoal-and-gold field palette so copy and portraits stay dominant. */
.flag-field::before {
  z-index: -2;
  opacity: 1;
  background:
    linear-gradient(90deg, rgba(8, 12, 16, .93) 0%, rgba(10, 14, 18, .79) 48%, rgba(10, 13, 17, .56) 100%),
    url("/media/maxout-patriotic-flag.png") center / cover no-repeat;
}
.flag-field::after {
  z-index: -1;
  opacity: .42;
  background: linear-gradient(180deg, rgba(200, 160, 70, .08), rgba(17, 17, 17, .5));
  width: 100%;
  height: 100%;
  inset: 0;
  -webkit-mask-image: none;
  mask-image: none;
}

/* MaxOut prestige emblems: an expanded, dimensional evolution of the supplied
   iconography system with more detail and visual authority. */
.brand-icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 108px;
  height: 108px;
  background-image: url("/assets/maxout-emblems-v2.png");
  background-repeat: no-repeat;
  background-size: 300% 300%;
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .18));
}
.brand-icon--compass { background-position: 0 0; }
.brand-icon--resilience { background-position: 50% 0; }
.brand-icon--healing { background-position: 100% 0; }
.brand-icon--wellness { background-position: 0 50%; }
.brand-icon--community { background-position: 50% 50%; }
.brand-icon--purpose { background-position: 100% 50%; }
.brand-icon--knowledge { background-position: 0 100%; }
.brand-icon--leadership { background-position: 50% 100%; }
.brand-icon--potential { background-position: 100% 100%; }

.mission-card { grid-template-columns: 34px 118px minmax(0, 1fr); gap: 20px; }
.mission-card__icon,
.deployment-row__icon {
  width: 118px;
  height: 118px;
  border: 0;
  background: transparent;
}
.mission-card__icon .brand-icon,
.deployment-row__icon .brand-icon { transform: none; }
.deployment-row { grid-template-columns: 34px 118px minmax(0, 1fr) auto; gap: 20px; }
.service-symbol .brand-icon {
  width: 220px;
  height: 220px;
  transform: none;
}
.field-values .brand-icon { width: 96px; height: 96px; }
.principles-field__footer > .brand-icon,
.algorithm-radar__core > .brand-icon,
.deployment-cta__grid > .brand-icon { width: 92px; height: 92px; transform: none; }
.schedule-pending > .brand-icon { width: 104px; height: 104px; }

@media (max-width: 760px) {
  .flag-field::after { opacity: .35; width: 100%; height: 100%; }
  .mission-card { grid-template-columns: 30px minmax(0, 1fr); }
  .mission-card__icon,
  .mission-card .eyebrow,
  .mission-card h3,
  .mission-card > p:not(.eyebrow),
  .mission-card .text-link { grid-column: 2; }
  .deployment-row { grid-template-columns: 30px minmax(0, 1fr); }
  .deployment-row__icon,
  .deployment-row > div:not(.deployment-row__icon),
  .deployment-row .text-link { grid-column: 2; }
  .mission-card__icon,
  .deployment-row__icon { width: 108px; height: 108px; }
  .service-symbol .brand-icon { width: 180px; height: 180px; }
}
@media (min-width: 1024px) { .migrated-mobile-nav { display: none !important; } }