/* ===========================================================================
   ServicesMaVietnam — SVG Figure display rules, media queries, and responsive sizing.
   5 SVG pairs: hero (mvhl/mvhp), story (mvsl/mvsp), grow (mvrl/mvrp),
   open (mvfl/mvfp), compare (mvcl/mvcp).
   Breakpoint: 600px.
   - Viewport > 600px: landscape visible, portrait display:none.
   - Viewport <= 600px: portrait visible, landscape display:none.
   =========================================================================== */

/* Default / Viewport > 600px */
svg.mvhl,
svg.mvsl,
svg.mvrl,
svg.mvfl,
svg.mvcl {
  display: block;
}

svg.mvhp,
svg.mvsp,
svg.mvrp,
svg.mvfp,
svg.mvcp {
  display: none !important;
}

@media (min-width: 601px) {
  svg.mvhl,
  svg.mvsl,
  svg.mvcl {
    width: 100%;
    max-width: 640px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
  }

  svg.mvrl,
  svg.mvfl {
    width: 100%;
    max-width: 360px;
    min-width: 312px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Viewport <= 600px */
@media (max-width: 600px) {
  svg.mvhl,
  svg.mvsl,
  svg.mvrl,
  svg.mvfl,
  svg.mvcl {
    display: none !important;
  }

  svg.mvhp,
  svg.mvsp,
  svg.mvrp,
  svg.mvfp,
  svg.mvcp {
    display: block !important;
  }

  svg.mvhp,
  svg.mvsp,
  svg.mvcp {
    width: 100%;
    max-width: 360px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
  }

  svg.mvrp,
  svg.mvfp {
    width: 100%;
    max-width: 320px;
    min-width: 278px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Wrapper elements */
.mv-hero__fig {
  position: relative;
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.mv-mini {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 16px 0 0;
}

/* Ensure SVG text has proper rendering */
svg.mvhl, svg.mvhp,
svg.mvsl, svg.mvsp,
svg.mvrl, svg.mvrp,
svg.mvfl, svg.mvfp,
svg.mvcl, svg.mvcp {
  font-family: 'Zen Kaku Gothic New', 'Noto Sans JP', sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}