/* HIMART AX v7 — 02.1 label grammar, 03.1 maker details, 03.2 quote color, 04 subsection rhythm. */

/* 02.1 — slash convention keeps the primary label and its qualifier as one phrase. */
html body.himart-ax-page #data .ax-pattern-block .ax-paren{
  display:inline!important;
  margin:0!important;
}

/* 03.1 — every text element begins exactly on the card's top-rule left edge. */
html body.himart-ax-page #journey .ax-maker-step,
html body.himart-ax-page #journey .ax-maker-step.is-current{
  padding:24px 0 0!important;
}
html body.himart-ax-page #journey .ax-maker-step>span,
html body.himart-ax-page #journey .ax-maker-step h4,
html body.himart-ax-page #journey .ax-maker-step p,
html body.himart-ax-page #journey .ax-maker-step ul,
html body.himart-ax-page #journey .ax-maker-step li{
  margin-left:0!important;
  padding-left:0!important;
  text-align:left!important;
  transform:none!important;
}
html body.himart-ax-page #journey .ax-maker-step p{
  font-size:18px!important;
  line-height:1.5!important;
}
html body.himart-ax-page #journey .ax-maker-step ul{
  width:100%!important;
  margin-top:34px!important;
  margin-right:0!important;
  margin-bottom:0!important;
  justify-items:start!important;
}
html body.himart-ax-page #journey .ax-maker-step li{
  display:flex!important;
  align-items:flex-start!important;
  gap:6px!important;
}
html body.himart-ax-page #journey .ax-maker-step li::before{
  content:"・"!important;
  display:inline-block!important;
  flex:0 0 auto!important;
  margin:0!important;
  color:var(--hm-blue)!important;
}

/* 02.3 / SELECT — remove legacy pseudo-blocks that produced duplicate bottom rules.
   All five mini models stretch to one common top/bottom rail. */
html body.himart-ax-page #data .ax-select-visual{
  align-items:stretch!important;
}
html body.himart-ax-page #data .ax-select-mini{
  align-self:stretch!important;
  min-height:0!important;
  height:100%!important;
  overflow:hidden!important;
}
html body.himart-ax-page #data .ax-select-mini::before,
html body.himart-ax-page #data .ax-select-mini::after{
  content:none!important;
  display:none!important;
  border:0!important;
  height:0!important;
  flex:none!important;
}

/* 03.2 — interview-card titles are uniformly white. */
html body.himart-ax-page #journey .ways-quote-grid strong,
html body.himart-ax-page #journey .ways-quote-grid article:first-child strong{
  color:#fff!important;
}

/* 04.2+ — explicitly lock the canonical subsection rhythm: 100px unit gap + 40px line-to-title inset. */
html body.himart-ax-page #direction .hm-wide-right-rail > .hm-subsection + .hm-subsection{
  margin-top:var(--hm-space-subsection,100px)!important;
  padding-top:var(--hm-space-component,40px)!important;
}

@media(max-width:780px){
  html body.himart-ax-page #journey .ax-maker-step,
  html body.himart-ax-page #journey .ax-maker-step.is-current{
    padding-left:0!important;
    padding-right:0!important;
  }
  html body.himart-ax-page #journey .ax-maker-step ul{
    width:100%!important;
    transform:none!important;
  }
}

/* 03.5 — embedded AI Banner Script Generator.
   The portfolio viewport remains 4:3; the embedded document itself scrolls. */
html body.himart-ax-page #journey .ax-script-generator{
  width:100%!important;
}
html body.himart-ax-page #journey .ax-script-generator-frame{
  position:relative!important;
  width:100%!important;
  aspect-ratio:4 / 3!important;
  overflow:hidden!important;
  border:0!important;
  background:#121212!important;
}
html body.himart-ax-page #journey .ax-script-generator-frame iframe{
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:#121212!important;
}
html body.himart-ax-page #journey .ax-script-generator-credit{
  margin-top:12px!important;
  color:var(--hm-text-tertiary)!important;
}


/* 03.6 — shared Design System carousel variant.
   One screen = four 1328×800 outputs in a seamless 2×2 composition.
   Left/right gallery navigation switches between four screens (16 images total).
   Captions and black matte overlays are intentionally excluded. */
html body.himart-ax-page #journey .ax-banner-output-carousel{
  --hm-ds-media-carousel-ratio:1328 / 800;
  width:100%!important;
  background:transparent!important;
}
html body.himart-ax-page #journey .ax-banner-output-carousel .hm-ds-media-carousel__viewport{
  background:transparent!important;
}
html body.himart-ax-page #journey .ax-banner-output-carousel .ax-banner-output-page{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-template-rows:repeat(2,minmax(0,1fr))!important;
  gap:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:transparent!important;
}
html body.himart-ax-page #journey .ax-banner-output-carousel .ax-banner-output-item{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
html body.himart-ax-page #journey .ax-banner-output-carousel .ax-banner-output-item::after,
html body.himart-ax-page #journey .ax-banner-output-carousel .ax-banner-output-item figcaption{
  content:none!important;
  display:none!important;
}
html body.himart-ax-page #journey .ax-banner-output-carousel .ax-banner-output-item>img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  object-fit:cover!important;
  object-position:center!important;
}
html body.himart-ax-page #journey .ax-banner-output-carousel .ax-banner-output-item>img.is-missing{
  opacity:0!important;
}

/* 03.6 — keep shared arrows adaptive over light/dark banner artwork. */
html body.himart-ax-page #journey .ax-banner-output-carousel .hm-ds-gallery-nav::before{
  border-top-color:#fff!important;
  border-right-color:#fff!important;
  mix-blend-mode:difference!important;
}


/* 03.6 notice — follows the existing portfolio NOTICE note grammar. */
html body.himart-ax-page #journey .ax-banner-output-notice{
  margin:30px 0 0!important;
  padding:0!important;
  color:var(--hm-description-color)!important;
  font:300 var(--hm-type-note)/1.6 var(--hm-font-ko)!important;
  letter-spacing:var(--hm-track-body)!important;
  word-break:keep-all!important;
}
html body.himart-ax-page #journey .ax-banner-output-notice>span{
  color:inherit!important;
  font-family:var(--hm-font-en)!important;
  font-weight:400!important;
  letter-spacing:var(--hm-track-note)!important;
}

@media(max-width:780px){
  html body.himart-ax-page #journey .ax-banner-output-carousel .ax-banner-output-page{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-template-rows:repeat(2,minmax(0,1fr))!important;
    gap:0!important;
  }
}