/* Photo cards: only the five explicitly marked groups. Original page layout,
   typography outside cards, source photographs and all interactions are preserved. */
.final-story .mv-photo-grid.mv-photo-grid {
  --photo-card-height: 328px;
  --photo-card-title: 23px;
  --photo-card-inset: 25px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  padding: 0;
  margin: 0;
  list-style: none;
}
.final-story .mv-photo-grid.mv-photo-grid > .mv-photo-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: var(--photo-card-height);
  padding: 27px var(--photo-card-inset) 23px;
  margin: 0;
  text-align: left;
  border: 1px solid #83a3cb47;
  border-radius: 7px;
  background: #0a1726;
  box-shadow: inset 0 1px 0 #dcecff09;
  transform: none;
  transition: border-color .35s ease;
}
.final-story .mv-photo-grid.mv-photo-grid .mv-photo-card > .mv-photo-image {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  object-fit: cover;
  object-position: var(--photo-position, 65% 50%);
  pointer-events: none;
  transition: transform .7s ease;
}
.final-story .mv-photo-grid.mv-photo-grid > .mv-photo-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, #061424db 0%, #08172cb3 40%, #0612212e 100%),
    linear-gradient(180deg, #101e355c 0%, #06121d28 55%, #030d1e91 100%);
}
.final-story .mv-photo-grid.mv-photo-grid > .mv-photo-card::after {
  content: none;
}
.final-story .mv-photo-grid.mv-photo-grid .mv-photo-number {
  display: block;
  position: static;
  margin: 0 0 20px;
  color: #bad1ed;
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: .04em;
  font-variant-numeric: tabular-nums;
}
.final-story .mv-photo-grid.mv-photo-grid .mv-photo-number::after {
  content: "";
  display: block;
  width: 24px;
  height: 1px;
  margin-top: 15px;
  background: #a6c7ed;
}
.final-story .mv-photo-grid.mv-photo-grid .mv-photo-card h3 {
  align-self: stretch;
  min-height: 1.35em;
  margin: 0 0 11px;
  color: #f2f6ff;
  font-size: var(--photo-card-title);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -.035em;
  text-wrap: balance;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.final-story .mv-photo-grid.mv-photo-grid .mv-photo-card p {
  max-width: 25ch;
  margin: 0;
  color: #ccdaf0;
  font-size: 15px;
  line-height: 1.8;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.final-story .mv-photo-grid.mv-photo-grid .mv-photo-label {
  display: block;
  margin: auto 0 0;
  padding-top: 34px;
  color: #b5cdef;
  font-size: 9px;
  line-height: 1.5;
  letter-spacing: .18em;
}
.final-story .mv-photo-grid.mv-photo-services {
  --photo-card-height: 372px;
  --photo-card-title: 22px;
}
/* These two grids keep the original heading alongside them on wide screens. */
.final-story .mv-photo-grid.mv-photo-process,
.final-story .mv-photo-grid.mv-photo-principles {
  --photo-card-height: 382px;
  --photo-card-title: 19px;
  --photo-card-inset: 16px;
  gap: 12px;
}
.final-story .mv-photo-grid.mv-photo-process .mv-photo-card h3 {
  min-height: 2.7em;
}
.final-story .mv-photo-grid.mv-photo-principles .mv-photo-card h3 {
  min-height: 2.7em;
}
.final-story .mv-photo-grid.mv-photo-process .mv-photo-card::before,
.final-story .mv-photo-grid.mv-photo-principles .mv-photo-card::before,
.final-story .mv-photo-grid.mv-photo-services .mv-photo-card::before {
  background: linear-gradient(180deg, #071428ed 0%, #071428db 36%, #07142873 62%, #07142840 80%, #071428b3 100%);
}
@media (hover: hover) and (pointer: fine) {
  .final-story .mv-photo-grid.mv-photo-grid > .mv-photo-card:hover {
    transform: none;
    border-color: #abcdf176;
  }
  .final-story .mv-photo-grid.mv-photo-grid > .mv-photo-card:hover .mv-photo-image {
    transform: scale(1.025);
  }
}
@media (max-width: 1180px) {
  .final-story .mv-photo-grid.mv-photo-grid { --photo-card-inset: 21px; --photo-card-title: 21px; }
  .final-story .mv-photo-grid.mv-photo-process,
  .final-story .mv-photo-grid.mv-photo-principles { --photo-card-title: 20px; }
}
@media (max-width: 900px) {
  .final-story .mv-photo-grid.mv-photo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    --photo-card-height: 342px;
    --photo-card-title: 22px;
    gap: 16px;
  }
  .final-story .mv-photo-grid.mv-photo-grid .mv-photo-card h3 { min-height: 2.7em; }
}
@media (max-width: 560px) {
  .final-story .mv-photo-grid.mv-photo-grid {
    grid-template-columns: minmax(0, 1fr);
    --photo-card-height: 330px;
    --photo-card-title: 23px;
    --photo-card-inset: 24px;
    gap: 16px;
  }
  .final-story .mv-photo-grid.mv-photo-grid .mv-photo-card h3 { min-height: 0; margin-bottom: 15px; }
  .final-story .mv-photo-grid.mv-photo-grid .mv-photo-card p { max-width: 27ch; font-size: 15px; }
  .final-story .mv-photo-grid.mv-photo-grid .mv-photo-label { padding-top: 46px; }
}
@media (prefers-reduced-motion: reduce) {
  .final-story .mv-photo-grid.mv-photo-grid > .mv-photo-card,
  .final-story .mv-photo-grid.mv-photo-grid .mv-photo-image { transition: none; }
  .final-story .mv-photo-grid.mv-photo-grid > .mv-photo-card:hover .mv-photo-image { transform: none; }
}

/* All five photo-card groups keep the desktop photograph treatment on compact
   screens. Content determines their height; there is no separate thumbnail row. */
@media (max-width:1100px) {
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,max(9rem,calc((100% - 12px) / 2))),1fr));
    gap:12px;
  }
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles)>.mv-photo-card {
    min-height:210px;padding:14px 12px 12px;border-radius:12px;
    border-color:#a9aec33d;background:#081522;box-shadow:none;
  }
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) .mv-photo-image {
    position:absolute;inset:0;z-index:-2;width:100%;height:100%;margin:0;
    object-fit:cover;object-position:var(--photo-position,center);border-radius:0;transform:none;
  }
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles)>.mv-photo-card::before {
    content:"";display:block;position:absolute;inset:0;z-index:-1;
    background:linear-gradient(180deg,#071222ed 0%,#071222d4 45%,#07122282 69%,#07122245 82%,#071222cc 100%),linear-gradient(90deg,#0712223d,transparent);
  }
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) .mv-photo-number {
    font-size:.6875rem;line-height:1.5;color:#c7bfeb;margin:0 0 10px;
  }
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) .mv-photo-number::after {content:none}
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) .mv-photo-card h3 {
    min-height:0;margin:0 0 8px;font-size:1.0625rem;line-height:1.4;
    text-wrap:wrap;word-break:keep-all;overflow-wrap:anywhere;color:#f0f3fb;
  }
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) .mv-photo-card p {
    max-width:none;font-size:.875rem;line-height:1.65;margin:0;color:#d9e2f1;
    text-shadow:0 1px 5px #04101fcc;word-break:keep-all;overflow-wrap:anywhere;
  }
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) .mv-photo-label {
    font-size:.5625rem;line-height:1.5;letter-spacing:.08em;color:#c4d0e4;
    margin:auto 0 0;padding-top:28px;overflow-wrap:anywhere;
  }
}
@media (min-width:768px) and (max-width:1100px) {
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles)>.mv-photo-card {min-height:220px;padding:18px 20px 16px}
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) .mv-photo-card h3 {font-size:1.125rem}
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) .mv-photo-card p {font-size:.9375rem;max-width:32ch}
}
@media (max-width:359px) {
  :is(.solutions-page,.implementation-page,.marketing-page) .final-story
  .mv-photo-grid:is(.mv-photo-solutions,.mv-photo-implementation,.mv-photo-services,.mv-photo-process,.mv-photo-principles) {grid-template-columns:1fr}
}