html,body{margin:0;padding:0;background:transparent;overflow:hidden;font-family:Arial,Helvetica,sans-serif;color:#1F2937}
*{box-sizing:border-box}
.sequence-wrap{
  width:100%;height:100%;min-height:420px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#e9f2fb,#f5f7fa);
  padding:28px;
}
.sequence-stage{
  position:relative;
  width:100%;max-width:680px;min-height:280px;
  display:flex;align-items:center;justify-content:center;
}
.sequence-panel{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transform:translateY(12px) scale(.98);
  transition:opacity .7s ease, transform .7s ease;
  pointer-events:none;
}
.sequence-panel.is-active{opacity:1;transform:translateY(0) scale(1)}
.sequence-panel .em-component,
.sequence-panel .mga-component{width:100%}
.sequence-panel .pillar-title{
  text-align:left;
  font-size:32px;
  line-height:1.15;
  margin:0 0 20px;
}
.sequence-panel .em-component{max-width:100%}
.sequence-panel .mga-component{max-width:420px}
.sequence-panel.sequence-em .em-row{gap:12px;flex-wrap:nowrap}
.sequence-panel.sequence-em .em-stage{white-space:nowrap;font-size:14px;padding:12px 14px}
.sequence-panel.sequence-em .em-arrow{width:22px;flex:0 0 22px}
.sequence-panel.sequence-mga{justify-content:center}
@media (max-width: 700px){
  .sequence-wrap{padding:18px}
  .sequence-stage{min-height:320px}
  .sequence-panel .pillar-title{font-size:26px;text-align:center}
  .sequence-panel.sequence-em .em-row{flex-wrap:wrap;justify-content:center;gap:10px}
  .sequence-panel.sequence-em .em-progress{display:none}
  .sequence-panel.sequence-em .em-arrow{display:none}
  .sequence-panel.sequence-em .em-stage{font-size:13px;padding:10px 12px}
  .sequence-panel .mga-component{max-width:100%}
}