/* Sushi Go Party! — a warm, playful product story with one clear Steam action. */
.sushi-go-party-page { --sg-cut: polygon(1.2% 3%, 100% 0, 98.8% 100%, 0 97%); }
html:has(body.sushi-go-party-page) { scrollbar-gutter: stable; }
.sg-section { padding: clamp(72px, 8vw, 128px) var(--gutter); }
.sg-section h2 { font-size: clamp(44px, 5.5vw, 86px); letter-spacing: -.05em; line-height: 1.02; }
.sg-section em { color: var(--orange); font-style: normal; }
.sg-section p { font-size: clamp(16px, 1.25vw, 19px); line-height: 1.7; }
#sg-overview, #sg-features, #sg-wishlist { scroll-margin-top: 100px; }
.sg-wishlist { display: inline-block; vertical-align: middle; width: 260px; max-width: 100%; background: transparent; transform: perspective(650px) rotateX(var(--sg-rx,0deg)) rotateY(var(--sg-ry,0deg)); transition: transform .25s var(--ease), filter .25s; }
/* The source badge is untouched. This viewport removes only its transparent padding. */
.sg-badge-art { display: block; position: relative; width: 100%; aspect-ratio: 1024 / 342; overflow: hidden; transition: transform .35s var(--ease); }
.sg-badge-art img { position: absolute; width: 139.0625%; max-width: none; height: auto; left: -19.53125%; top: -29.239766%; }
.sg-wishlist:is(:hover,:focus-visible) .sg-badge-art { transform: scale(1.04); }
.sg-wishlist:is(:hover,:focus-visible) { filter: drop-shadow(0 10px 18px #2a1a1240); }
.sg-wishlist:active { transform: scale(.985); }
.sg-release { display: block; font-size: 14px; font-weight: 700; letter-spacing: .02em; }

.sg-hero { --sg-cue-bottom: 24px; --sg-cue-size: 44px; height: 100svh; min-height: 700px; position: relative; isolation: isolate; overflow: hidden; background: var(--cocoa); color: var(--cream); --focus: var(--cream); }
.sg-hero-media { position: absolute; inset: -4% 0; z-index: -1; transform: translateY(var(--sg-parallax,0)); }
.sg-hero-media > img, .sg-hero-media > video { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; }
.sg-hero-media video { opacity: 0; transition: opacity .75s ease; }
.sg-hero-media video.is-playing { opacity: 1; }
.sg-hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,#2a1a12d9, #2a1a1226 27%, #2a1a1270 57%, #2a1a12e8), linear-gradient(90deg,#2a1a1259,transparent 45%,#2a1a1233); }
.sg-hero-content { position: absolute; inset-block: 0; left: 50%; transform: translateX(-50%); width: min(650px,calc(100% - 48px)); display: grid; grid-template-rows: minmax(0,1fr) auto minmax(0,1fr); justify-items: center; text-align: center; }
.sg-hero h1 { grid-row: 2; width: min(470px,83%); margin: 0; line-height: 0; }
.sg-hero h1 img { width: 100%; height: auto; filter: drop-shadow(0 10px 24px #2a1a1233); }
/* Equal outer rows centre the logo; the lower row spaces the CTA independently. */
.sg-hero-actions { grid-row: 3; width: 100%; min-height: 0; display: grid; grid-template-rows: auto minmax(44px,1fr); justify-items: center; padding-top: 15px; padding-bottom: calc(var(--sg-cue-bottom) + var(--sg-cue-size)/2); }
.sg-hero-actions > p { margin: 0; font-family: var(--font-heading); font-size: clamp(14px,1.5vw,21px); letter-spacing: -.025em; line-height: 1.14; text-wrap: balance; text-shadow: 0 2px 14px #2a1a1299; }
.sg-hero-actions > p strong { font-weight: 700; }
.sg-hero .sg-wishlist { align-self: center; display: flex; align-items: center; width: 172.9px; min-height: 44px; }
.sg-discover { position: absolute; bottom: var(--sg-cue-bottom); left: 50%; transform: translateX(-50%); display: grid; place-items: center; width: var(--sg-cue-size); height: var(--sg-cue-size); }
.sg-discover svg { width: 22px; animation: sg-discover-bob 2.4s ease-in-out infinite; }
.sg-discover:hover { color: var(--orange); }
@keyframes sg-discover-bob { 0%,100% { transform: translateY(-2px); } 50% { transform: translateY(5px); } }
.motion-paused .sg-discover svg { animation: none; transform: none; }
.menu-open .sg-discover svg, .dialog-open .sg-discover svg { animation-play-state: paused; }

.sg-overview { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); align-items: center; gap: clamp(36px,6vw,96px); background: var(--cream); }
.sg-intro-copy h2 { margin-bottom: 28px; }
.sg-intro-copy p { color: var(--walnut); }
.sg-intro-copy .sg-lede { color: var(--cocoa); font-size: clamp(20px,1.8vw,27px); line-height: 1.45; margin-bottom: 20px; }
.sg-film { display: block; position: relative; width: 100%; aspect-ratio: 16 / 9; transform: rotate(-1.4deg); transition: transform .6s var(--ease); filter: drop-shadow(0 25px 25px #2a1a1224); }
.sg-film > img { width: 100%; height: 100%; object-fit: cover; clip-path: var(--sg-cut); }
.sg-film:is(:hover,:focus-visible) { transform: rotate(0deg) scale(1.025); }
.sg-play-icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 88px; height: 76px; display: grid; place-items: center; clip-path: var(--button-clip); background: white; color: var(--cocoa); transition: background .25s, color .25s; }
.sg-play-icon svg { width: 32px; height: 32px; transform: translateX(-1px); }
.sg-film:is(:hover,:focus-visible) .sg-play-icon { background: var(--cocoa); color: white; }

.sg-features { background: var(--cocoa); color: var(--cream); --focus: var(--orange); }
.sg-feature-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 35px; margin-bottom: 40px; }
.sg-feature-tabs:not([hidden]) { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-bottom: 34px; }
.sg-feature-tab { position: relative; isolation: isolate; padding: 17px 18px; min-height: 68px; background: transparent; color: var(--cream); font-family: var(--font-heading); font-size: clamp(16px,1.5vw,21px); font-weight: 600; letter-spacing: -.01em; }
.sg-feature-tab::before { content: ''; position: absolute; inset: 0; z-index: -1; background: #f5ecdd10; clip-path: var(--button-clip); transition: background .25s, transform .3s var(--ease); }
.sg-feature-tab:hover::before { background: #f5ecdd23; transform: scaleY(1.04); }
.sg-feature-tab[aria-selected="true"] { color: var(--cocoa); }
.sg-feature-tab[aria-selected="true"]::before { background: var(--orange); }
.sg-feature-deck { display: grid; gap: 45px; }
.sg-feature-panel { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1.1fr); align-items: center; gap: clamp(32px,4vw,70px); }
.sg-feature-deck.is-enhanced { gap: 0; perspective: 1400px; overflow: clip; margin: -12px; padding: 12px; }
.sg-feature-deck.is-enhanced .sg-feature-panel { grid-area: 1/1; min-width: 0; opacity: 0; visibility: hidden; pointer-events: none; backface-visibility: hidden; }
.sg-feature-deck.is-enhanced .sg-feature-panel.is-transitioning { visibility: visible; will-change: transform, opacity; }
.sg-feature-deck.is-enhanced .sg-feature-panel.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.sg-feature-image { width: 100%; aspect-ratio: 7 / 3; position: relative; display: block; padding: 0; background: transparent; }
.sg-feature-image > :is(img,video) { width: 100%; height: 100%; object-fit: contain; clip-path: var(--sg-cut); }
.sg-feature-image > video { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .2s ease; }
.sg-feature-image > video.is-playing { opacity: 1; }
.motion-paused .sg-feature-image > video { opacity: 0; transition: none; }
.sg-feature-copy h3 { font-size: clamp(32px,3.4vw,53px); line-height: 1.06; letter-spacing: -.04em; margin-bottom: 22px; max-width: 450px; }
.sg-feature-copy { align-self: start; }
.sg-feature-copy p { color: var(--latte); }
.sg-feature-copy p + p { margin-top: 20px; }

.sg-awards { --award-gap: clamp(24px,2.4vw,36px); padding: 32px 0 34px; background: var(--latte); color: var(--cocoa); --focus: var(--cocoa); scroll-margin-top: 100px; }
.sg-awards-window { padding-block: 8px; }
.sg-awards-window:focus-visible { outline: 2px solid var(--cocoa); outline-offset: -2px; }
.sg-awards-group { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 26px var(--award-gap); list-style: none; margin: 0; padding: 0 var(--gutter); }
.sg-awards-group[aria-hidden="true"] { display: none; }
.sg-award { min-width: 0; padding-right: 20px; border-right: 1px solid #6b4a362e; }
.sg-award h3 { margin: 0 0 8px; }
.sg-award-year { display: block; margin-bottom: 12px; color: var(--cocoa); font-size: 38px; line-height: 1; font-weight: 800; letter-spacing: -.055em; }
.sg-award-year::after { content: ''; display: block; width: 30px; height: 3px; margin-top: 8px; background: var(--orange); clip-path: var(--button-clip); }
.sg-award-event { display: block; font-size: 20px; line-height: 1.16; letter-spacing: -.025em; }
.sg-award p { color: var(--cocoa); font-size: 14px; line-height: 1.45; }
.sg-award .sg-award-note { margin-top: 4px; color: var(--walnut); font-size: 12px; }
.sg-awards.is-marquee .sg-awards-window { overflow: hidden; cursor: grab; touch-action: pan-y pinch-zoom; user-select: none; -webkit-user-select: none; }
.sg-awards.is-dragging .sg-awards-window { cursor: grabbing; }
.sg-awards.is-marquee .sg-awards-track { display: flex; width: max-content; animation: sg-awards-drift 88s linear infinite; animation-play-state: paused; will-change: transform; }
.sg-awards.is-marquee .sg-awards-group { display: flex; flex: none; gap: var(--award-gap); padding-inline: calc(var(--award-gap)/2); }
.sg-awards.is-marquee .sg-award { flex: 0 0 clamp(250px,22vw,300px); }
.sg-awards.is-in-view:not(.is-dragging):not(.is-coasting):not(.page-hidden):not(:has(:focus-visible)) .sg-awards-track { animation-play-state: running; }
.menu-open .sg-awards-track, .dialog-open .sg-awards-track { animation-play-state: paused!important; }
@media (hover: hover) { .sg-awards:not(.is-released) .sg-awards-window:hover .sg-awards-track { animation-play-state: paused!important; } }
@keyframes sg-awards-drift { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.sg-finale { min-height: 630px; position: relative; isolation: isolate; overflow: hidden; background: var(--cocoa); color: var(--cream); display: flex; align-items: center; --focus: var(--cream); }
.sg-finale-art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 65% 50%; z-index: -2; }
.sg-finale::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#2a1a12f7 0%,#2a1a12da 32%,#2a1a1233 74%,transparent); }
.sg-finale-copy { max-width: 580px; }
.sg-finale h2 { font-size: clamp(48px,5.7vw,90px); }
.sg-finale p { margin: 25px 0 28px; color: var(--cream); }
.sg-finale .sg-release { margin-top: 23px; }

.sg-wishlist-dock { position: fixed; left: 50%; bottom: max(22px,env(safe-area-inset-bottom)); z-index: 55; transform: translate(-50%,18px); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .3s, transform .4s var(--ease), visibility .3s; filter: drop-shadow(0 8px 20px #2a1a124d); }
.sg-wishlist-dock .sg-wishlist { width: 210px; }
.sg-wishlist-dock.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%,0); }
.menu-open .sg-wishlist-dock, .dialog-open .sg-wishlist-dock { visibility: hidden; pointer-events: none; opacity: 0; }

.sg-media-dialog { padding: 18px 24px 22px; width: min(1180px,94vw); max-height: 94dvh; overflow: auto; border: 1px solid #f5ecdd30; background: var(--cocoa); color: var(--cream); --focus: var(--orange); }
.sg-media-dialog::backdrop { background: #141414e8; backdrop-filter: blur(9px); }
.sg-dialog-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 14px; }
.sg-dialog-bar h2 { font-size: 24px; letter-spacing: -.02em; }
.sg-dialog-close { display: grid; place-items: center; min-width: 44px; height: 44px; background: transparent; color: var(--cream); }
.sg-dialog-close:hover { color: var(--orange); }
.sg-media-content { aspect-ratio: 16 / 9; background: #141414; }
.sg-media-content > video { width: 100%; height: 100%; object-fit: contain; }

@media (min-width: 1600px) {
  .sg-hero h1 { width: 530px; }
}
@media (max-width: 960px) {
  .sg-overview { grid-template-columns: 1fr; gap: 38px; }
  .sg-intro-copy { max-width: 660px; }
  .sg-film { max-width: 800px; }
  .sg-feature-heading { align-items: flex-start; }
  .sg-feature-panel { grid-template-columns: 1fr; grid-template-rows: max-content 1fr; gap: 30px; }
  .sg-feature-copy { max-width: 720px; }
  .sg-feature-copy h3 { max-width: none; font-size: 39px; }
  .sg-awards-group { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sg-finale::before { background: linear-gradient(90deg,#2a1a12f2,#2a1a12c4 46%,#2a1a1240); }
}
@media (max-width: 600px) {
  .sg-hero { min-height: 650px; }
  .sg-hero-media { inset-inline: -35%; }
  .sg-hero h1 { width: 100%; max-width: 370px; }
  .sg-hero-actions { padding-top: 24px; }
  .sg-hero-actions > p { font-size: 16.5px; }
  .sg-hero .sg-wishlist { width: 162.925px; }
  .sg-wishlist { width: 245px; }
  .sg-section { padding-top: 70px; padding-bottom: 70px; }
  .sg-section h2 { font-size: clamp(43px,11.8vw,65px); }
  .sg-intro-copy .sg-lede { font-size: 22px; }
  .sg-intro-copy h2 { margin-bottom: 22px; }
  .sg-play-icon { width: 67px; height: 59px; }
  .sg-play-icon svg { width: 26px; height: 26px; }
  .sg-feature-heading { flex-direction: column; gap: 17px; margin-bottom: 26px; }
  .sg-feature-tabs:not([hidden]) { gap: 6px; margin-bottom: 25px; }
  .sg-feature-tab { font-size: 14px; padding: 14px 8px; min-height: 76px; line-height: 1.2; text-wrap: balance; }
  .sg-feature-copy h3 { font-size: 34px; margin-bottom: 17px; }
  .sg-feature-panel { gap: 27px; }
  .sg-awards { padding-block: 27px 30px; }
  .sg-awards-group { grid-template-columns: 1fr; gap: 22px; }
  .sg-awards:not(.is-marquee) .sg-award { border-right: 0; padding: 0 0 21px; border-bottom: 1px solid #6b4a362e; }
  .sg-awards:not(.is-marquee) .sg-award:last-child { border: 0; padding-bottom: 0; }
  .sg-finale { min-height: 665px; align-items: flex-end; }
  .sg-finale-art { object-position: 57% center; }
  .sg-finale::before { background: linear-gradient(0deg,#2a1a12f7,#2a1a12d9 43%,#2a1a121a); }
  .sg-finale-copy { width: 100%; }
  .sg-finale p { font-size: 17px; margin-block: 22px; }
  .sg-finale .sg-release { font-size: 13px; }
  .sg-wishlist-dock { bottom: max(17px,env(safe-area-inset-bottom)); }
  .sg-wishlist-dock .sg-wishlist { width: 195px; }
  .sg-dock-visible .floating-top { bottom: 99px; }
  .sg-media-dialog { padding: 12px; }
  .sg-dialog-bar h2 { font-size: 19px; }
}
@media (prefers-reduced-motion: reduce) {
  .sushi-go-party-page *, .sushi-go-party-page *::before { animation: none!important; transition-duration: .001ms!important; }
  .sg-hero-media, .sg-film:is(:hover,:focus-visible), .sg-wishlist, .sg-wishlist:is(:hover,:focus-visible) .sg-badge-art { transform: none; }
  .sg-feature-image > video.is-playing { opacity: 0; }
}
.motion-paused .sg-hero-media, .motion-paused .sg-film:is(:hover,:focus-visible), .motion-paused .sg-wishlist, .motion-paused .sg-wishlist:is(:hover,:focus-visible) .sg-badge-art { transform: none; }
.motion-paused :is(.sg-feature-panel,.sg-feature-tab::before,.sg-wishlist-dock,.sg-wishlist,.sg-badge-art,.sg-film) { transition: none; }
@media (forced-colors: active) {
  .sg-hero, .sg-features, .sg-finale, .sg-overview, .sg-media-dialog, .sg-awards { background: Canvas; color: CanvasText; }
  .sg-award-year, .sg-award p, .sg-award .sg-award-note { color: CanvasText; }
  .sg-section p, .sg-section em, .sg-release { color: CanvasText; }
  .sg-hero-media, .sg-finale-art { opacity: .12; }
  .sg-hero-media::after, .sg-finale::before { display: none; }
  .sg-wishlist, .sg-feature-tab, .sg-play-icon { background: ButtonFace; color: ButtonText; border: 2px solid ButtonText; clip-path: none; }
  .sg-wishlist { padding: 16px; text-align: center; }
  .sg-wishlist .sg-badge-art { display: none; }
  .sg-wishlist .sg-wishlist-label { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: normal; }
  .sg-wishlist::before, .sg-feature-tab::before { display: none; }
  .sg-feature-tab[aria-selected="true"] { border-color: Highlight; }
}
