/* Categories are construction-specific MG vector scenes. Job imagery remains photographic. */
body.experience-site.quality-2026 .category-vector-stage{position:relative;isolation:isolate;overflow:hidden;min-width:0;min-height:350px;border:1px solid #dae6f6;border-radius:26px;background:radial-gradient(ellipse at 65% 44%,#e9f1ff,transparent 68%),linear-gradient(145deg,#fff,#f2f7ff);box-shadow:0 18px 50px #183b6b08;display:flex;align-items:center;justify-content:center;padding:12px}
body.experience-site.quality-2026 .category-vector-stage>img{width:100%;height:100%;max-height:420px;min-height:300px;object-fit:contain;border:0;border-radius:0;mix-blend-mode:normal;filter:none;transform:none}
body.experience-site.quality-2026 .category-vector-stage:before,body.experience-site.quality-2026 .category-vector-stage:after{display:none}
body.experience-site.quality-2026.mg-category-page .detail-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:center}
body.experience-site.quality-2026.mg-city-category-page .service-featured{margin:0;aspect-ratio:1.45;min-height:0}
body.experience-site.quality-2026.mg-city-category-page .service-featured>img{height:auto;max-height:none;min-height:0;aspect-ratio:640/440;object-fit:contain}
body.experience-site.quality-2026 .mg-catalog-vector-stage{height:420px;min-height:340px;padding:0;background:radial-gradient(ellipse at center,#edf4ff,transparent 70%);border-color:#e2eaf6;box-shadow:none}
body.experience-site.quality-2026 .mg-catalog-vector-stage:before{display:none}
body.experience-site.quality-2026 .mg-overview-illustration{width:100%;height:100%;object-fit:contain;position:relative;inset:auto;opacity:1;max-height:none}
body.experience-site.quality-2026 .home-directions-list{gap:20px;border:0}
body.experience-site.quality-2026 .home-direction-row{display:grid;grid-template-columns:155px minmax(0,1fr) 30px;align-items:center;gap:18px;padding:22px 20px;border:1px solid #dfe8f5;border-radius:20px;background:linear-gradient(135deg,#fff,#f8fbff);min-height:190px;box-shadow:0 4px 18px #17375f03}
body.experience-site.quality-2026 .home-direction-row:hover{border-color:#9ebce8;box-shadow:0 12px 30px #17375f0b;transform:translateY(-2px)}
body.experience-site.quality-2026 .mg-home-category-art{width:155px;height:128px;object-fit:contain;object-position:center}
body.experience-site.quality-2026 .home-direction-row>div{min-width:0}
body.experience-site.quality-2026 .home-direction-row h3{font-size:21px;line-height:1.35;margin-bottom:10px}
body.experience-site.quality-2026 .home-direction-row p{font-size:14px;line-height:1.8}
body.experience-site.quality-2026 .home-direction-row .direction-arrow{width:30px;height:30px;min-width:30px;align-self:end;font-size:17px}
body.experience-site.quality-2026 .project-path-panels article>img.mg-project-direction-art{object-fit:contain;background:linear-gradient(140deg,#f8fbff,#edf4ff);padding:10px;min-height:390px}
body.experience-site.quality-2026 .service-direction summary>img.mg-category-group-art{width:158px;height:121px;object-fit:contain;border-radius:0;background:none;border:0;flex-shrink:0}
body.experience-site.quality-2026 .service-direction summary{gap:18px;padding:22px;min-height:180px}
body.experience-site.quality-2026 .service-direction summary>div{min-width:0;flex:1}
body.experience-site.quality-2026 .service-direction nav>a{display:flex;align-items:center;gap:13px;min-height:76px;padding:8px 14px}
body.experience-site.quality-2026 .service-direction nav>a>span{flex:1}
body.experience-site.quality-2026 .service-direction nav>a>img.mg-category-choice-art{width:76px;height:54px;object-fit:contain;flex-shrink:0;border:0;border-radius:0}
body.experience-site.quality-2026 .service-direction nav>a>b{flex-shrink:0}
body.experience-site.quality-2026 .mg-category-card{padding:0;overflow:hidden;display:flex;flex-direction:column;gap:0;background:white;min-height:0}
body.experience-site.quality-2026 .mg-category-card>img.mg-category-card-art{width:100%;height:190px;object-fit:contain;background:linear-gradient(145deg,#f9fbff,#edf4ff);padding:8px;border:0;border-radius:0}
body.experience-site.quality-2026 .mg-category-card>h3{font-size:21px;line-height:1.4;margin:21px 23px 10px}
body.experience-site.quality-2026 .mg-category-card>p{font-size:15px;line-height:1.8;margin:0 23px 20px}
body.experience-site.quality-2026 .mg-category-card>.card-arrow{margin:0 23px 21px;font-size:14px;margin-top:auto}
body.experience-site.quality-2026 .mg-category-support-character{display:flex;justify-content:center;align-items:flex-end;width:100%;height:175px;margin-top:22px;overflow:hidden;background:radial-gradient(ellipse at 50% 100%,#d9e7fc,transparent 68%);border-radius:14px}
body.experience-site.quality-2026 .mg-category-support-character>img{width:165px;height:175px;object-fit:contain;object-position:bottom;filter:none;mix-blend-mode:normal}
body.experience-site.quality-2026 .service-guided-cta>.container{display:grid;grid-template-columns:minmax(0,1fr) 160px auto;gap:27px;align-items:center}
body.experience-site.quality-2026 .mg-catalog-support-character{height:190px;width:160px;display:flex;align-items:flex-end;justify-content:center}
body.experience-site.quality-2026 .mg-catalog-support-character>img{width:100%;height:100%;object-fit:contain;object-position:bottom}
@media(max-width:1120px){body.experience-site.quality-2026 .home-direction-row{grid-template-columns:130px minmax(0,1fr) 25px;gap:14px;padding:21px 17px}body.experience-site.quality-2026 .mg-home-category-art{width:130px;height:112px}body.experience-site.quality-2026 .home-direction-row h3{font-size:20px}body.experience-site.quality-2026 .home-direction-row p{font-size:14px}body.experience-site.quality-2026 .service-direction summary>img.mg-category-group-art{width:130px;height:112px}body.experience-site.quality-2026 .service-direction h3{font-size:20px}body.experience-site.quality-2026 .service-direction summary{padding:20px;gap:14px}body.experience-site.quality-2026 .service-guided-cta>.container{grid-template-columns:minmax(0,1fr) 160px}body.experience-site.quality-2026 .service-guided-cta>.container>.button{grid-column:1;justify-self:start}body.experience-site.quality-2026 .mg-catalog-support-character{grid-column:2;grid-row:1/3;height:225px}}
@media(max-width:900px){body.experience-site.quality-2026 .home-directions-list{grid-template-columns:1fr}body.experience-site.quality-2026 .home-direction-row{grid-template-columns:165px minmax(0,1fr) 30px;gap:22px;padding:23px}body.experience-site.quality-2026 .mg-home-category-art{width:165px;height:125px}body.experience-site.quality-2026 .service-direction summary>img.mg-category-group-art{width:125px;height:105px}body.experience-site.quality-2026 .category-vector-stage{min-height:300px}body.experience-site.quality-2026 .category-vector-stage>img{min-height:260px}body.experience-site.quality-2026 .mg-catalog-vector-stage{height:340px;min-height:280px}body.experience-site.quality-2026.mg-category-page .detail-grid{gap:25px}}
@media(max-width:760px){body.experience-site.quality-2026 .home-direction-row{grid-template-columns:120px minmax(0,1fr);gap:15px;padding:21px 17px;min-height:180px;border-radius:17px}body.experience-site.quality-2026 .home-direction-row .direction-arrow{display:none}body.experience-site.quality-2026 .mg-home-category-art{width:120px;height:112px}body.experience-site.quality-2026 .home-direction-row h3{font-size:20px;line-height:1.4}body.experience-site.quality-2026 .home-direction-row p{font-size:14px;line-height:1.75}body.experience-site.quality-2026 .service-direction summary{padding:19px 17px;gap:13px;min-height:170px}body.experience-site.quality-2026 .service-direction summary>img.mg-category-group-art{width:116px;height:110px}body.experience-site.quality-2026 .service-direction h3{font-size:20px}body.experience-site.quality-2026 .service-direction p{font-size:14px}body.experience-site.quality-2026 .service-direction summary>span:last-child{margin-left:0}body.experience-site.quality-2026 .service-direction nav>a{font-size:14px;line-height:1.7;padding:10px 14px;min-height:74px;gap:10px}body.experience-site.quality-2026 .service-direction nav>a>img.mg-category-choice-art{width:64px;height:50px}body.experience-site.quality-2026.mg-category-page .detail-grid{grid-template-columns:1fr;gap:27px}body.experience-site.quality-2026 .category-vector-stage{min-height:265px;border-radius:21px;padding:5px}body.experience-site.quality-2026 .category-vector-stage>img{min-height:240px;max-height:320px}body.experience-site.quality-2026 .mg-catalog-vector-stage{height:300px;min-height:260px;padding:0}body.experience-site.quality-2026 .mg-overview-illustration{min-height:0;height:100%}body.experience-site.quality-2026 .project-path-panels article>img.mg-project-direction-art{height:260px;min-height:0;padding:5px}body.experience-site.quality-2026 .mg-category-card>img.mg-category-card-art{height:190px}body.experience-site.quality-2026 .service-guided-cta>.container{grid-template-columns:1fr;gap:22px}body.experience-site.quality-2026 .mg-catalog-support-character{grid-column:1;grid-row:auto;justify-self:center;height:180px;width:220px}body.experience-site.quality-2026 .service-guided-cta>.container>.button{grid-column:1;justify-self:start}body.experience-site.quality-2026 .mg-category-support-character{height:175px}}
@media(max-width:390px){body.experience-site.quality-2026 .home-direction-row{grid-template-columns:102px minmax(0,1fr);padding:20px 14px;gap:12px}body.experience-site.quality-2026 .mg-home-category-art{width:102px;height:105px}body.experience-site.quality-2026 .home-direction-row h3{font-size:18px}body.experience-site.quality-2026 .home-direction-row p{font-size:14px}body.experience-site.quality-2026 .service-direction summary>img.mg-category-group-art{width:95px;height:100px}body.experience-site.quality-2026 .service-direction h3{font-size:19px}body.experience-site.quality-2026 .category-vector-stage{min-height:240px}body.experience-site.quality-2026 .category-vector-stage>img{min-height:220px}}
@media(prefers-reduced-motion:reduce){body.experience-site.quality-2026 .home-direction-row{transition:none}body.experience-site.quality-2026 .home-direction-row:hover{transform:none}}

body.experience-site.quality-2026 .mg-catalog-hero-scene {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  height: auto;
  min-height: 0;
  background: linear-gradient(155deg, #f9fcff, #edf4ff);
  border-color: #dce8f8;
}
body.experience-site.quality-2026 .mg-catalog-hero-scene .mg-overview-illustration {
  display: block;
  height: auto;
  aspect-ratio: 640 / 440;
}
.mg-catalog-hero-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 16px;
  margin: 0;
  padding: 12px 10px 16px;
  border-top: 1px solid #dce8f8;
  background: #ffffffb8;
  list-style: none;
}
.mg-catalog-hero-legend li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #17375f;
  font-size: .78rem;
  font-weight: 750;
}
.mg-catalog-hero-legend li span {
  display: inline-grid;
  place-items: center;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: #0753e8;
  color: #fff;
  font-size: .68rem;
}
@media (max-width: 430px) {
  .mg-catalog-hero-legend { gap: 6px 9px; }
  .mg-catalog-hero-legend li { font-size: .72rem; gap: 4px; }
}

/* Category archive portraits: the reference's blueprint and orbit in MG's light palette. */
body.experience-site.quality-2026 .category-specialist-stage {
  --category-scroll: 0;
  aspect-ratio: 1.27;
  min-height: 310px;
  max-height: 435px;
  padding: 18px 18px 0;
  align-items: end;
  background: radial-gradient(ellipse at 50% 43%, #fff 2%, #ecf4ff 60%, #e7f0fc 100%);
}
.category-specialist-grid {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: linear-gradient(#83a8d82a 1px, transparent 1px),
                    linear-gradient(90deg, #83a8d82a 1px, transparent 1px);
  background-size: 26px 26px;
  mask-image: radial-gradient(ellipse at 50% 52%, #000, transparent 77%);
}
.category-specialist-orbit {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: min(64%, 330px);
  aspect-ratio: 1;
  border: 1px dashed #91b4e5;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 13px #fff6, 0 0 0 14px #b6cfef58;
  pointer-events: none;
}
.category-specialist-orbit::after {
  content: "";
  position: absolute;
  top: 16%;
  right: 10%;
  width: 7px;
  height: 7px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #0753e8;
}
body.experience-site.quality-2026 .category-specialist-stage > .category-specialist-art {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 9px 12px #17375f24);
}
@media (max-width: 760px) {
  body.experience-site.quality-2026 .category-specialist-stage {
    min-height: 0;
    max-height: 320px;
    aspect-ratio: 1.35;
    padding: 13px 12px 0;
  }
}
@media (prefers-reduced-motion: no-preference) {
  body.experience-site.quality-2026 .category-specialist-stage > .category-specialist-art {
    animation: category-specialist-enter .55s cubic-bezier(.2,.7,.25,1) both;
    translate: 0 calc(var(--category-scroll) * 10px);
  }
  .category-specialist-orbit {
    transform: translate(-50%, -50%) rotate(calc(var(--category-scroll) * 19deg));
  }
}
@keyframes category-specialist-enter {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Artwork with a hard crop must share the card's edges at every width. */
body.experience-site.quality-2026 .category-specialist-stage.category-specialist-bleed {
  aspect-ratio: auto;
  min-height: 0;
  max-height: none;
  padding: 0;
}
body.experience-site.quality-2026 .category-specialist-bleed > .category-specialist-art {
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: none;
  translate: none;
  animation: none;
}
