@import url("/assets/case-study-20260831g.css");

/* One deliberate system view for the AI operations case. */
.sequence-map {
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:1.4rem;
  padding:1.1rem 0 0;
  color:var(--paper);
  background:var(--ink);
}
.sequence-map::before {
  content:"";
  position:absolute;
  top:1.1rem;
  right:0;
  left:0;
  height:1px;
  background:rgba(232,200,109,.74);
}
.sequence-step {
  position:relative;
  min-width:0;
  min-height:13.25rem;
  padding:2rem 1.2rem 1.35rem;
  border-left:1px solid rgba(255,252,247,.18);
}
.sequence-step:first-child { border-left:0; }
.sequence-step::before {
  content:"";
  position:absolute;
  top:.78rem;
  left:1.2rem;
  width:.68rem;
  height:.68rem;
  border:1px solid var(--gold);
  border-radius:50%;
  background:var(--ink);
}
.sequence-mark { display:block; color:var(--gold); font:500 .67rem/1 var(--mono); letter-spacing:.1em; }
.sequence-step h3 { margin:1.45rem 0 0; color:var(--paper); font:400 clamp(1.24rem,2vw,1.65rem)/.98 var(--serif); letter-spacing:-.035em; text-wrap:balance; }
.sequence-step p { margin:.7rem 0 0; color:var(--light); font-size:.77rem; line-height:1.5; text-wrap:pretty; }
@media (max-width:700px) {
  .sequence-map { grid-template-columns:1fr; padding:0 1.15rem; }
  .sequence-map::before { top:0; bottom:0; left:1.47rem; right:auto; width:1px; height:auto; }
  .sequence-step { min-height:0; padding:1.25rem 0 1.25rem 2.35rem; border:0; }
  .sequence-step::before { top:1.42rem; left:-.02rem; }
  .sequence-step h3 { margin:.85rem 0 0; font-size:1.55rem; }
  .sequence-step p { font-size:.82rem; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; }
}