/* Marketing Operations AI (redesign): a photo-led hero. The team photograph runs wide; the launch board rises over its
   lower edge. Four phase columns, each opened by the checkpoint at its top. No ribbon in the hero: the photograph
   carries the colour; the ribbon returns beside the approval record and in the close. */
.mo-hero{padding-bottom:var(--s9)}
.mo-photo{margin:var(--s7) auto 0;max-width:1600px}
.mo-photo img{width:100%;aspect-ratio:21/7.4;object-fit:cover;object-position:50% 36%;border-radius:14px}
.mo-board-wrap{position:relative;margin-top:-150px;padding:0 var(--s6)}
.mo-board{overflow:hidden}
.cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.col{display:grid;grid-template-rows:auto 1fr;border-left:1px solid var(--line);transition:background-color .5s ease}
.col:first-child{border-left:0}
.col-h{padding:20px 20px 16px;display:grid;gap:12px;align-content:start;min-height:174px;border-bottom:1px solid var(--line)}
.col-h h3{font-size:21px;letter-spacing:-.012em;color:var(--ink)}
.gate{display:grid;gap:6px;padding:12px 14px;border-radius:12px;background:#F7FAFF;box-shadow:inset 0 0 0 1px var(--line)}
.gate-t{font-size:15px;line-height:1.4;color:var(--ink)}.gate-st{color:var(--text)}
.gate-who{font-size:14px;color:var(--text)}
.gate .btn{height:40px;justify-self:start;font-size:14.5px}
.gate.ok{background:#E3F7F4;box-shadow:none}.gate.ok .gate-st{color:var(--t-teal);font-weight:700}
.col-tasks{padding:16px;display:grid;gap:10px;align-content:start}
.tk{display:grid;gap:8px;padding:16px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);transition:opacity .4s ease,box-shadow .3s ease,background-color .3s ease}
.tk-h{font-size:16.5px;line-height:1.35;font-weight:700;color:var(--ink)}
.tk-m{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:14px;color:var(--text)}
.tk-p{color:var(--deep);font-weight:600}
.tk-st{justify-self:start;font-size:13.5px;font-weight:700;border-radius:6px;padding:3px 10px;background:#F2F5FA;color:var(--muted)}
.tk[data-s=ready] .tk-st{background:var(--ice);color:var(--deep)}
.tk[data-s=done] .tk-st{background:#E3F7F4;color:var(--t-teal)}
.tk[data-s=perm]{box-shadow:inset 0 0 0 2px #FFE9EC}.tk[data-s=perm] .tk-st{background:#FFF0F2;color:var(--t-coral)}
.col.locked .tk{background:#F7FAFF}.col.locked .tk-h{color:var(--text)}
.tk-perm{display:none;gap:10px;padding-top:10px;border-top:1px solid var(--line)}
.tk[data-s=perm] .tk-perm,.tk[data-perm][data-s=ready] .tk-perm,.tk[data-perm][data-s=done] .tk-perm{display:grid}
.tk-perm p{font-size:14.5px;line-height:1.5;color:var(--ink)}
.tk-perm .btn{height:40px;justify-self:start;font-size:14.5px}
.mo-foot{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;padding:16px 22px;border-top:1px solid var(--line);background:#F7FAFF}
#mo-hist{display:grid;gap:6px;max-height:84px;overflow:auto}
#mo-hist li{font-size:15px;line-height:1.45;color:var(--ink)}

/* approved, but not that version */
.mo-ver-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s7) var(--s9);align-items:center}
.mo-ver-copy{display:grid;gap:var(--s5)}
.mo-q{display:grid;margin-top:var(--s3)}
.mo-q li{display:grid;gap:6px;padding:18px 0;border-top:1px solid var(--line)}.mo-q li:last-child{border-bottom:1px solid var(--line)}
.mo-q q{font-size:20px;line-height:1.35;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.mo-q q::before{content:"“"}.mo-q q::after{content:"”"}
.mo-q span{font-size:16px;line-height:1.5;color:var(--text)}
.ap{overflow:hidden}
.ap-list{display:grid}
.ap-list li{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:20px 24px;border-top:1px solid var(--line)}
.ap-list li:first-child{border-top:0}
.ap-v{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:16px;font-weight:800;background:var(--ice);color:var(--deep)}
.ap-new .ap-v{background:#FFF0F2;color:var(--t-coral)}
.ap-list b{display:block;font-size:17px;color:var(--ink)}.ap-list div span{display:block;margin-top:3px;font-size:15px;line-height:1.5;color:var(--text)}
.ap-note{margin:0 24px 24px;padding:16px 18px;border-radius:12px;background:#FFF0F2;font-size:16px;line-height:1.55;color:var(--ink)}
.ap-note b{color:var(--t-coral)}

/* the rules */
.rl-grid{margin-top:var(--s7);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 var(--s7)}
.rl-grid div{padding:24px 0;border-top:1px solid var(--line)}
.rl-grid dt{font-size:20px;font-weight:800;letter-spacing:-.012em;color:var(--ink)}
.rl-grid dd{margin-top:8px;font-size:16.5px;line-height:1.55;color:var(--text)}
.rl-plan{margin-top:var(--s5)}

@media (max-width:1100px){
  .mo-board-wrap{margin-top:-90px;padding:0}
  .cols{grid-template-columns:1fr 1fr}.col:nth-child(3){border-left:0}.col:nth-child(n+3){border-top:1px solid var(--line)}
  .mo-ver-in{grid-template-columns:1fr}
  .rl-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .mo-photo img{aspect-ratio:4/3;border-radius:14px}
  .mo-board-wrap{margin-top:-40px;padding:0 6px}
  .cols{grid-template-columns:1fr}.col{border-left:0;border-top:1px solid var(--line)}.col:first-child{border-top:0}
  .col-h{min-height:0}
  .mo-foot{grid-template-columns:1fr}
  .ap-list li{grid-template-columns:auto 1fr;padding:16px}.ap-list .x-tag{grid-column:2;justify-self:start}
  .rl-grid{grid-template-columns:1fr}
}