/* HIMART AX v4 — 02.1 line policy, 02.3 row layout, 03.3 icon, 04.1 result refinement. */

/* 02.1 — blue areas become outline-only; neutral module lines use 40% white. */
html body.himart-ax-page #data .ax-pattern-system .ax-pattern-block.is-blue,
html body.himart-ax-page #data .ax-pattern-system .ax-pattern-block.is-title,
html body.himart-ax-page #data .ax-pattern-system .ax-pattern-block.is-content{
  border-color:var(--hm-blue)!important;
  background:transparent!important;
  color:#fff!important;
}
html body.himart-ax-page #data .ax-pattern-system .ax-pattern-block:not(.is-blue){
  border-color:rgba(255,255,255,.40)!important;
}
html body.himart-ax-page #data .ax-pattern-system .ax-paren{
  display:block!important;
  opacity:.50!important;
}

/* 02.3 — three horizontal rows: copy at left, working diagram at right. */
html body.himart-ax-page #data .ax-composition-flow{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  width:100%!important;
}
html body.himart-ax-page #data .ax-composition-step{
  display:grid!important;
  grid-template-columns:260px minmax(0,1fr)!important;
  grid-template-rows:auto 1fr!important;
  column-gap:56px!important;
  min-width:0!important;
  min-height:336px!important;
  padding:28px 0!important;
  border-top:1px solid rgba(255,255,255,.30)!important;
}
html body.himart-ax-page #data .ax-composition-step>span{
  grid-column:1!important;
  grid-row:1!important;
  align-self:start!important;
}
html body.himart-ax-page #data .ax-composition-step h4{
  grid-column:1!important;
  grid-row:2!important;
  align-self:start!important;
  min-height:0!important;
  margin:18px 0 0!important;
}
html body.himart-ax-page #data .ax-composition-visual{
  grid-column:2!important;
  grid-row:1 / span 2!important;
  align-self:center!important;
  width:100%!important;
  height:280px!important;
  min-height:280px!important;
  margin:0!important;
  box-sizing:border-box!important;
  border:1px solid rgba(255,255,255,.60)!important;
  background:#000!important;
  overflow:hidden!important;
}
html body.himart-ax-page #data .ax-select-visual{
  display:grid!important;
  grid-template-columns:repeat(5,1fr)!important;
  gap:8px!important;
  padding:16px!important;
}
html body.himart-ax-page #data .ax-select-visual i::before{
  background:transparent!important;
  border-color:var(--hm-blue)!important;
}
html body.himart-ax-page #data .ax-select-visual i::after{
  border-color:rgba(255,255,255,.40)!important;
}
html body.himart-ax-page #data .ax-upload-visual{
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)!important;
  align-items:stretch!important;
  gap:14px!important;
  padding:18px!important;
}
html body.himart-ax-page #data .ax-upload-fields{
  display:grid!important;
  grid-template-rows:repeat(3,minmax(0,1fr))!important;
  align-content:stretch!important;
  height:100%!important;
  gap:10px!important;
}
html body.himart-ax-page #data .ax-upload-field{
  display:flex!important;
  min-height:0!important;
  height:auto!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:9px 10px!important;
  border-color:rgba(255,255,255,.40)!important;
}
html body.himart-ax-page #data .ax-upload-image{
  height:100%!important;
  min-height:0!important;
  border:1px solid var(--hm-blue)!important;
  background:transparent!important;
}
html body.himart-ax-page #data .ax-assemble-image{
  background:transparent!important;
}

/* 03.3 — update arrow height to match the other 48x48 line icons. */
html body.himart-ax-page #journey .ways-operating-stack>article:nth-child(4) .ways-operating-icon{
  background:center/100% 100% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%2300A6ED' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M7 20L24 4L41 20M24 4V42'/%3E%3C/svg%3E")!important;
}

/* 04.1 — neutral 30% white circles, blue numbers, 16px supporting copy. */
html body.himart-ax-page #direction .ax-result-card,
html body.himart-ax-page #direction .ax-result-card:nth-child(1),
html body.himart-ax-page #direction .ax-result-card:nth-child(2),
html body.himart-ax-page #direction .ax-result-card:nth-child(3){
  border-color:rgba(255,255,255,.30)!important;
}
html body.himart-ax-page #direction .ax-result-card strong{
  color:var(--hm-blue)!important;
}
html body.himart-ax-page #direction .ax-result-card p{
  max-width:18ch!important;
  font-size:16px!important;
  line-height:1.5!important;
}

@media(max-width:780px){
  html body.himart-ax-page #data .ax-composition-step{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto!important;
    row-gap:0!important;
    min-height:0!important;
    padding:24px 0!important;
  }
  html body.himart-ax-page #data .ax-composition-step>span{grid-column:1!important;grid-row:1!important}
  html body.himart-ax-page #data .ax-composition-step h4{grid-column:1!important;grid-row:2!important;margin-top:16px!important}
  html body.himart-ax-page #data .ax-composition-visual{
    grid-column:1!important;
    grid-row:3!important;
    height:240px!important;
    min-height:240px!important;
    margin-top:28px!important;
  }
}