/* Mumbai City Girls - media + tap parts for every section (22 Oct 2026). Loaded after first paint; everything here is below the first screen. */

/* ----- lift the poster ----- */
.mcg-lift,.mcg-bill figure.mcg-lift{position:relative;margin:0;padding:0;max-width:540px;background:none;box-shadow:none;transform:rotate(var(--mcg-t,-1deg))}
.mcg-lift-in{position:relative;perspective:1100px;background:
  radial-gradient(circle at 30% 70%,rgba(255,255,255,.05) 0 2px,transparent 3px) 0 0/14px 14px,#33363b;border-radius:2px}
.mcg-lift .mcg-lift-note,.mcg-bill .mcg-lift .mcg-lift-note{position:absolute;left:7%;right:7%;bottom:7%;margin:0;font:400 19px/1.25 var(--mcg-fm);color:var(--mcg-paper);text-align:center;
  transform:rotate(-1.5deg)}
.mcg-lift .mcg-lift-note b,.mcg-lift .mcg-lift-note a{color:var(--mcg-or)}
.mcg-lift-b{position:relative;z-index:1;display:block;width:100%;margin:0;padding:8px;border:0;border-radius:0;background:var(--mcg-paper);cursor:pointer;
  box-shadow:0 10px 18px rgba(0,0,0,.45),0 2px 0 rgba(0,0,0,.25);transform-origin:50% 0;transition:transform .65s cubic-bezier(.2,.8,.2,1),box-shadow .65s}
.mcg-lift .mcg-lift-b img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:#3A3D42}
.mcg-lift-tape{position:absolute;left:50%;top:-9px;width:84px;height:22px;margin-left:-42px;background:rgba(239,233,221,.72);transform:rotate(-3deg);
  box-shadow:0 1px 2px rgba(0,0,0,.25)}
.mcg-up .mcg-lift-b{transform:rotateX(64deg);box-shadow:0 2px 4px rgba(0,0,0,.4)}
.mcg-lift-b:focus-visible{outline:3px solid var(--mcg-or);outline-offset:3px}
.mcg-lift .mcg-lift-cap{margin:12px 2px 0;padding:0;font:500 15px/1.4 var(--mcg-fb);color:#C9C4B9}
.mcg-lift-hint{font:400 15px/1 var(--mcg-fm);color:var(--mcg-or);white-space:nowrap}
.mcg-bill .mcg-lift .mcg-lift-cap,.mcg-wash .mcg-lift .mcg-lift-cap{color:#3b3d42}
.mcg-lift.mcg-lift-fr,.mcg-bill .mcg-lift.mcg-lift-fr{margin:18px auto 24px}
@media (min-width:760px){.mcg-lift.mcg-lift-fr,.mcg-bill .mcg-lift.mcg-lift-fr{float:right;width:44%;margin:6px 0 18px 26px}.mcg-lift.mcg-lift-fl,.mcg-bill .mcg-lift.mcg-lift-fl{float:left;width:44%;margin:6px 26px 18px 0}}
.mcg-bill h3{clear:both}
@media (prefers-reduced-motion:reduce){.mcg-lift-b{transition:none}}

/* ----- FAQ with its picture or map ----- */
.mcg-qwrap{display:grid;gap:26px;margin-top:24px}
.mcg-qwrap .mcg-qs{margin-top:0}
.mcg-qmedia{max-width:460px}
@media (min-width:900px){.mcg-qwrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start;gap:44px}
  .mcg-qmedia{order:2;position:sticky;top:96px}}

/* ----- the sprayed map ----- */
.mcg-map{margin:0;padding:14px 14px 16px;background:#24262a;border:2px dashed rgba(239,233,221,.22);color:var(--mcg-paper)}
.mcg-map-h{margin:0 0 10px;font:400 19px/1.1 var(--mcg-fs);letter-spacing:.5px;text-transform:uppercase}
.mcg-map-box{position:relative;width:100%;max-width:400px;margin:0 auto;aspect-ratio:290/420}
.mcg-map-svg{position:absolute;inset:0;width:100%;height:100%}
.mcg-map-land{fill:#45484e;stroke:#EFE9DD;stroke-width:1.1;stroke-dasharray:4 2;stroke-opacity:.55}
.mcg-map-park{fill:#4f6b55;opacity:.6}
.mcg-map-lake{fill:#24262a}
.mcg-map-bridge{fill:none;stroke:#FF5A1F;stroke-width:1.6;stroke-dasharray:3 2}
.mcg-map-sea{font:400 9px var(--mcg-fs);letter-spacing:2.5px;fill:#8F9299;text-transform:uppercase}
.mcg-map-park-t{font:600 7.5px var(--mcg-fb);fill:#b8cdb9}
.mcg-map-nm{font:800 9.5px var(--mcg-fb);fill:#EFE9DD;paint-order:stroke;stroke:#24262a;stroke-width:2.4px}
.mcg-map-nm-f{fill:#FF5A1F}
.mcg-map-dot{position:absolute;display:grid;place-items:center;width:var(--mcg-r,18px);height:var(--mcg-r,18px);border-radius:50%;
  transform:translate(-50%,-50%);background:var(--mcg-paper);color:var(--mcg-ink);font:800 10.5px/1 var(--mcg-fb);text-decoration:none;
  box-shadow:0 2px 0 rgba(0,0,0,.5)}
.mcg-map-dot::before{content:"";position:absolute;inset:-11px;border-radius:50%}
.mcg-map-dot.mcg-map-f{background:var(--mcg-or);color:var(--mcg-ink)}
.mcg-map-dot.mcg-map-f::after{content:"";position:absolute;inset:-5px;border:2px solid var(--mcg-or);border-radius:50%;animation:mcgPing 1.8s ease-out infinite}
.mcg-map-dot.mcg-map-0{opacity:.5}
.mcg-map-dot.mcg-map-on,.mcg-map-dot:focus-visible{outline:3px solid #fff;outline-offset:2px;z-index:2}
.mcg-map-tag{margin:12px 0 0;min-height:2.8em;font:500 16px/1.4 var(--mcg-fb);color:var(--mcg-paper)}
.mcg-map-tag a{color:var(--mcg-or);font-weight:800;white-space:nowrap}
.mcg-map-tag svg{width:14px;height:14px;vertical-align:-2px;fill:currentColor}
.mcg-map-cap{margin:6px 0 0;font:400 15px/1.3 var(--mcg-fm);color:#9EA1A8}
@keyframes mcgPing{from{transform:scale(.8);opacity:1}to{transform:scale(1.7);opacity:0}}
@media (prefers-reduced-motion:reduce){.mcg-map-dot.mcg-map-f::after{animation:none}}

/* ----- the roller slip ----- */
.mcg-chit{position:relative;max-width:380px;margin:26px 0 0;padding:14px 16px 64px;background:#FFF6DC;color:var(--mcg-ink);overflow:hidden;
  transform:rotate(1.4deg);box-shadow:0 6px 12px rgba(0,0,0,.18)}
.mcg-chit-k{margin:0;font:800 12px/1.2 var(--mcg-fb);letter-spacing:1px;text-transform:uppercase;color:#6b6e75}
.mcg-chit-t{margin:8px 0 0;font:400 22px/1.3 var(--mcg-fm)}
.mcg-chit-coat{position:absolute;left:-4%;top:0;bottom:52px;width:0;background:
  repeating-linear-gradient(90deg,rgba(17,18,20,.03) 0 9px,transparent 9px 18px),#F4F0E6;transition:width .9s cubic-bezier(.4,0,.2,1)}
.mcg-rolled .mcg-chit-coat{width:108%}
.mcg-chit-done{position:absolute;left:14px;right:14px;top:34%;margin:0;font:400 20px/1.2 var(--mcg-fs);color:var(--mcg-or);text-align:center}
.mcg-chit-b{position:absolute;left:12px;right:12px;bottom:10px;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:0;
  background:var(--mcg-ink);color:var(--mcg-paper);font:800 14px/1 var(--mcg-fb);letter-spacing:.6px;text-transform:uppercase;cursor:pointer}
.mcg-chit-ic{width:16px;height:16px;fill:currentColor;transform:rotate(90deg)}
.mcg-chit-b:focus-visible{outline:3px solid var(--mcg-or);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.mcg-chit-coat{transition:none}}

/* ----- long walls: paste 8 more ----- */
.mcg-more{margin:4px 0 34px;text-align:center}
.mcg-more-b{display:inline-block;min-height:48px;padding:13px 24px 12px;border:0;background:var(--mcg-or);color:var(--mcg-ink);cursor:pointer;
  font:900 18px/1.1 var(--mcg-fb);letter-spacing:.4px;text-transform:uppercase;transform:rotate(-1deg);box-shadow:0 5px 0 var(--mcg-ink)}
.mcg-more-n{display:block;margin-top:3px;font:500 13px/1.2 var(--mcg-fb);letter-spacing:0;text-transform:none}
.mcg-more-b:focus-visible{outline:3px solid #fff;outline-offset:3px}

/* ----- picture in a hero that had only words ----- */
.mcg-lift.mcg-hero-pic{width:100%;max-width:330px;margin:14px auto 6px}
@media (min-width:900px){.mcg-lift.mcg-hero-pic{align-self:center;max-width:470px;margin:0 0 0 auto}}

/* ----- reels made from her own posters ----- */
.mcg-reels2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px;padding:6px 0 30px}
@media (min-width:760px){.mcg-reels2{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 20px}}
@media (min-width:1100px){.mcg-reels2{grid-template-columns:repeat(4,minmax(0,1fr))}}
.mcg-reel2{position:relative;margin:0;padding:7px 7px 10px;background:var(--mcg-paper);color:var(--mcg-ink);transform:rotate(var(--mcg-t,0deg));
  box-shadow:0 8px 16px rgba(0,0,0,.4)}
.mcg-reel2 video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;background:#2A2C30}
.mcg-reel2 figcaption{margin:8px 2px 0;font:800 16px/1.15 var(--mcg-fb);text-transform:uppercase}
.mcg-reel2 figcaption a{color:inherit;text-decoration:none}
.mcg-reel2 figcaption span{display:block;margin-top:2px;font:500 13px/1.3 var(--mcg-fb);text-transform:none;color:#55585e}
.mcg-reel2[hidden],.mcg-card[hidden],.mcg-seeall[hidden]{display:none!important}

.mcg-lift.mcg-lift-wide{max-width:none;margin:16px 0 24px}
@media (min-width:1100px){.mcg-strip-hrs li{white-space:nowrap}}
