/* Marketplace-only city layers. A pinned viewport clips an oversize moving photo;
   the content remains in normal document flow and covers it as it rises. */
.market-home .market-shell { width:100%; max-width:none; margin:0; padding:0; border:0; border-radius:0; }
.market-home #market-main { margin:0; }
.market-home .city-hero { --city-vh:100svh; height:calc(var(--city-vh) * 2.6); overflow:visible; border-radius:0; background:transparent; animation:none; isolation:auto; }
/* Safari extends solid sticky backgrounds into its top and bottom browser bars.
   The photograph provides the full-bleed background; don't tint the chrome blue. */
.city-stage { position:sticky; top:0; height:var(--city-vh); overflow:hidden; isolation:isolate; background:transparent; }
.city-scene { position:absolute; top:0; left:50%; width:max(100%, calc(var(--city-vh) * 2.05)); aspect-ratio:4 / 3; transform:translate3d(-50%,-8vh,0); will-change:transform; }
.city-image, .city-foreground { position:absolute; inset:0; width:100%; height:100%; object-fit:fill; }
.city-image img, .city-foreground img { display:block; width:100%; height:100%; object-fit:fill; }
.city-image { z-index:0; }
/* Pixel-aligned foreground from the same photograph, never a mismatched tower.
   Silhouette coordinates are percentages of the uncropped 1448 × 1086 source. */
.city-foreground { z-index:2; clip-path:polygon(50.14% 7.45%,50.28% 7.45%,50.28% 13.2%,50.5% 13.2%,50.5% 15.3%,50.77% 15.3%,50.77% 23.3%,51.15% 23.3%,51.15% 28.5%,51.6% 28.5%,51.6% 38%,52.1% 38%,52.1% 54.4%,52.65% 54.4%,52.65% 71%,53.4% 71%,53.4% 83%,55% 100%,46.1% 100%,46.8% 66%,47.3% 66%,47.3% 49%,48% 49%,48% 34%,48.7% 34%,48.7% 28.4%,49.2% 28.4%,49.2% 23.4%,49.5% 23.4%,49.5% 17.7%,49.65% 17.7%,49.65% 13.8%,49.95% 13.8%,49.95% 10.5%,50.14% 10.5%); }
.city-wordmark { position:absolute; z-index:1; left:50%; top:17%; width:max-content; max-width:none; margin:0; color:#faf4e5; font-family:Arial,Helvetica,sans-serif; font-size:clamp(80px,15vw,280px); font-weight:400; line-height:1; letter-spacing:.035em; white-space:nowrap; transform:translateX(-50%); will-change:opacity,transform; }
.city-shade { position:absolute; inset:0; z-index:3; pointer-events:none; background:linear-gradient(180deg,#182c3226,transparent 30%,transparent 55%,#10241ad9); }
.city-cloud { position:absolute; z-index:4; left:-23%; bottom:13%; width:75%; max-width:none; height:auto; opacity:0; filter:grayscale(1) blur(3px); pointer-events:none; will-change:transform,opacity; }
.city-intro { position:absolute; z-index:5; bottom:15%; left:0; width:100%; text-align:center; color:#faf5e9; }
.market-home .city-intro h1 { margin:0; color:inherit; font-size:clamp(30px,3vw,48px); font-weight:400; letter-spacing:0; line-height:1.5; }
.city-intro p { margin:6px 0 18px; font-size:14px; color:#f8f3e3c7; }
.city-browse { display:inline-flex; align-items:center; gap:14px; min-height:48px; color:inherit; font-size:17px; text-decoration:none; border-bottom:1px solid #faf5e975; padding:0 0 5px; }
.city-browse svg { width:34px; height:34px; stroke:currentColor; stroke-width:1.2; fill:none; }
.city-browse:hover { border-color:currentColor; }
.city-scroll { position:absolute; z-index:5; bottom:28px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:8px; color:#faf5e9b3; font-size:11px; pointer-events:none; }
.city-scroll svg { width:18px; height:25px; fill:none; stroke:currentColor; stroke-width:1; }
.city-filter-defs { position:absolute; pointer-events:none; }
.market-home .market-content { position:relative; z-index:6; margin-top:calc(var(--city-vh,100svh) * -1); padding:48px max(24px,calc((100vw - 1360px) / 2)) 40px; background:#f8f7f3; border-radius:22px 22px 0 0; min-height:100svh; box-shadow:0 -12px 40px #172b2910; }
.market-home .market-nav { position:absolute; z-index:30; top:0; left:0; right:0; padding:24px 40px; margin:0; min-height:96px; color:#faf5e9; background:transparent; }
.market-home .market-brand img { filter:none; }
.market-home .market-nav .as-action { --as-ink:#faf5e9; --as-inner:#faf5e9; color:#faf5e9; }
.market-home .market-nav .as-action__icon { display:none; }
.market-home .market-nav .as-action__copy { padding-bottom:0; }
.market-home .market-nav .as-action__rule { display:none; }
.market-home .market-dock-anchor { position:absolute; top:100px; height:1px; }
.market-home .market-dock-wrap { position:fixed; z-index:35; top:28px; left:50%; transform:translateX(-50%); width:520px; height:56px; margin:0; transition:top .2s ease; }
.market-home .market-dock { transition:width .25s ease,height .25s ease; }
.market-home:not(.city-covered) .market-dock,
.market-home:not(.city-covered) .market-dock-wrap.is-stuck .market-dock { background:transparent; backdrop-filter:none; box-shadow:none; width:100%; }
.market-home:not(.city-covered) .market-dock a,
.market-home:not(.city-covered) .market-dock a[aria-current],
.market-home:not(.city-covered) .market-dock a:hover,
.market-home:not(.city-covered) .market-dock a:focus-visible { background:transparent; color:#fff9ed; text-shadow:0 1px 12px #192a3040; }
.market-home:not(.city-covered) .market-dock .ui-icon { display:none; }
.market-home:not(.city-covered) .market-dock a:hover { text-decoration:underline; text-underline-offset:8px; }
.market-home.city-scrolled .market-dock-wrap { top:12px; }
.market-home .market-footer { max-width:1360px; margin:0 auto; padding:56px 24px 30px; }
.city-browse:focus-visible { outline:2px solid #eee1c5; outline-offset:8px; }
.city-wordmark { opacity:0; }
@media(max-width:760px) {
  .market-nav { padding-top:calc(20px + env(safe-area-inset-top, 0px)); }
  .market-home .market-nav { padding:calc(20px + env(safe-area-inset-top, 0px)) max(20px, env(safe-area-inset-right, 0px)) 20px max(20px, env(safe-area-inset-left, 0px)); min-height:88px; }
  .market-home .market-brand { width:auto; }
  .market-home .market-brand img { width:110px; height:auto; }
  .market-home .market-nav .as-action__icon { width:30px; height:30px; }
  .market-home .market-nav .as-action__label { font-size:13px; }
  .market-home .market-dock-wrap { top:calc(98px + env(safe-area-inset-top, 0px)); width:calc(100% - 28px); }
  .market-home.city-scrolled .market-dock-wrap { top:calc(12px + env(safe-area-inset-top, 0px)); }
  .city-wordmark { top:21%; font-size:17vw; letter-spacing:.015em; }
  .city-intro { bottom:calc(18% + env(safe-area-inset-bottom, 0px)); }
  .city-cloud { width:160%; left:-90%; bottom:26%; }
  .market-home .market-content { padding:28px 18px; border-radius:18px 18px 0 0; }
  .city-scroll { bottom:calc(32px + env(safe-area-inset-bottom, 0px)); }
  .market-home .market-footer, .market-footer { padding-bottom:calc(30px + env(safe-area-inset-bottom, 0px)); }
}
@media(prefers-reduced-motion:reduce) { .city-scene,.city-wordmark,.city-cloud { will-change:auto; } .city-wordmark { opacity:1; } .market-home .market-dock-wrap { transition:none; } }
@media print { .market-home .city-hero { height:450px; } .city-stage { position:relative; height:450px; } .market-home .market-content { margin-top:0; } .city-cloud,.city-scroll { display:none; } .market-home .market-dock-wrap { display:none; } }

@media(max-width:600px) {
  .city-scene { width:max(100%,calc(var(--city-vh) * .675)); aspect-ratio:1 / 2; }
  .city-foreground { clip-path:polygon(49.8% 19.45%,50.1% 19.45%,50.1% 23%,50.4% 23%,50.4% 24.8%,50.8% 24.8%,50.8% 28.5%,51.4% 28.5%,51.4% 31.8%,52% 31.8%,52% 37.5%,53% 37.5%,53% 44.5%,54% 44.5%,54% 57%,57% 57%,57% 73%,58.3% 73%,58.3% 78.5%,60% 78.5%,60% 92.5%,61.5% 92.5%,61.5% 100%,39% 100%,39% 90%,40% 90%,40% 73.5%,41.5% 73.5%,41.5% 57.5%,43.6% 57.5%,43.6% 44.5%,45.5% 44.5%,45.5% 37.5%,46.6% 37.5%,46.6% 31.8%,47.8% 31.8%,47.8% 28.5%,48.7% 28.5%,48.7% 26.8%,49.3% 26.8%,49.3% 24.5%,49.8% 24.5%); }
}
