/* The map section, pinned story (option A). */
.mo-a{background:#E8EEF2}

.mo-seg{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.mo-seg button{height:36px;padding:0 13px;border-radius:999px;font-size:14px;color:#3C5261;background:rgb(255 255 255/.7);box-shadow:inset 0 0 0 1px rgb(1 16 26/.12);transition:background .2s ease,color .2s ease}
.mo-seg button[aria-pressed=true]{background:#0E3A52;color:#fff;box-shadow:none}
.mo-map{position:relative}
.mo-map svg{position:absolute;inset:0}

.mo-pin{position:sticky;top:0;height:100svh;overflow:hidden}
.mo-top{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;padding:96px var(--m) 0;max-width:calc(var(--max) + 2 * var(--m));margin:0 auto}
.mo-top .h2{font-size:clamp(30px,3.4vw,48px)}
.mo-top p{color:var(--soft);font-size:16px;margin-top:6px;max-width:44ch}
.mo-top .mo-seg{max-width:560px}

/* A */
.mo-a{position:relative;height:calc(100svh + 7 * 72svh)}
.mo-a .mo-pin{display:grid;grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1fr)}
.mo-a .mo-stage{position:relative;min-height:0}
.mo-a .mo-map{position:absolute;inset:0}
.mo-card{position:absolute;left:max(var(--m),calc(50% - 600px));bottom:clamp(20px,4vh,40px);width:min(370px,calc(100% - 2 * var(--m)));background:#fff;border-radius:14px;padding:18px 20px 20px;box-shadow:0 0 0 1px rgb(1 16 26/.08),0 24px 48px -28px rgb(1 16 26/.4)}
.mo-k{display:flex;justify-content:space-between;font-size:12.5px;color:#566976;font-variant-numeric:tabular-nums;margin-bottom:10px}
.mo-card>b{display:block;font-size:22px;font-weight:600;letter-spacing:-.015em;color:#01101A}
.mo-card>small{display:block;font-size:14px;color:#566976}
.mo-n{display:flex;align-items:baseline;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid rgb(1 16 26/.1)}
.mo-n strong{font-size:clamp(30px,3vw,40px);font-weight:600;letter-spacing:-.03em;color:#0E3A52;font-variant-numeric:tabular-nums;line-height:1}
.mo-n span{font-size:14px;color:#46586A}
.mo-card [data-p]{margin-top:12px;font-size:15px;line-height:1.45;color:#26394A}
.mo-r{margin-top:8px;font-size:14px;color:#0B6B4F}
.mo-rail{position:absolute;right:max(var(--m),calc(50% - 600px));top:50%;transform:translateY(-50%);list-style:none;margin:0;padding:0;display:grid;gap:12px;font-size:14px;color:#7D8E9B}
.mo-rail li{position:relative;padding-right:20px;text-align:right;transition:color .3s ease}
.mo-rail li::after{content:"";position:absolute;right:0;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;box-shadow:inset 0 0 0 1px currentColor;transition:background .3s ease}
.mo-rail li.done{color:#46586A}.mo-rail li.done::after{background:#46586A}
.mo-rail li.on{color:#01101A;font-weight:500}.mo-rail li.on::after{background:#0E3A52;box-shadow:none}

@media (max-width:860px){
  .mo-top{flex-direction:column;align-items:stretch;gap:12px;padding-top:80px}
  .mo-top p{display:none}
  .mo-seg{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none;margin:0 calc(-1 * var(--m));padding:0 var(--m)}
  .mo-seg::-webkit-scrollbar{display:none}
  .mo-seg button{flex:none}
  .mo-rail{display:none}
  .mo-card{left:var(--m);right:var(--m);width:auto;bottom:72px;padding:14px 16px 16px}
  .mo-card [data-p],.mo-r{display:none}
  .mo-card>b{font-size:19px}
  .mo-n{margin-top:10px;padding-top:10px}
}
