/* [GS v16] PC 넓은 화면 오른쪽 카피 배너 3장(대표 2026-10-11 «이 위치에 카피가 잘 담긴 배너 3개가 돌아가면 좋겠다»)
   - 가운데 500px 화면(#wrap) 오른쪽 빈 곳에만 보인다 · 1160px 미만(휴대폰·작은 창)에서는 숨김
   - 글자는 그림이 아니라 실제 글자(검색엔진·AI가 읽는다) · 사진은 우리 상품 사진(고도몰 상품 이미지) */
.gs-side { display: none; }
@media (min-width: 1160px) {
  .gs-side { display: block; position: fixed; z-index: 300; top: 50%; transform: translateY(-50%);
    left: calc(50% + 250px + 28px); width: 300px; font-family: var(--gs-font, 'Pretendard', -apple-system, 'Apple SD Gothic Neo', sans-serif);
    letter-spacing: -0.03em; word-break: keep-all; }
}
@media (min-width: 1320px) {
  .gs-side { left: calc(50% + 250px + 48px); width: 360px; }
}
.gs-side-stage { position: relative; width: 100%; aspect-ratio: 36 / 50; border-radius: 24px; overflow: hidden;
  box-shadow: 0 18px 40px rgba(36, 25, 15, .16), 0 2px 6px rgba(36, 25, 15, .08); background: #2b1d12; }
.gs-side-slide { position: absolute; inset: 0; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; padding: 30px 28px 26px;
  text-decoration: none; opacity: 0; visibility: hidden; transition: opacity .7s ease, visibility 0s linear .7s; }
.gs-side-slide.on { opacity: 1; visibility: visible; transition: opacity .7s ease; }
.gs-side-slide:focus-visible { outline: 3px solid #2CD3A0; outline-offset: -3px; }
.gs-side-kick { display: inline-block; align-self: flex-start; font-size: 13px; font-weight: 700; padding: 6px 11px; border-radius: 999px; }
.gs-side-title { margin: 22px 0 0; font-size: 46px; line-height: 1.13; font-weight: 800; letter-spacing: -0.055em; }
.gs-side-title span { display: block; }
.gs-side-title i { font-style: normal; font-weight: 300; }
.gs-side-sub { margin: 18px 0 0; font-size: 16px; line-height: 1.5; font-weight: 500; }
.gs-side-cta { margin-top: auto; align-self: flex-start; font-size: 15px; font-weight: 700; padding: 12px 18px; border-radius: 999px; }
.gs-side-cta:after { content: ' \203A'; }
@media (max-width: 1319px) {
  .gs-side-slide { padding: 26px 24px 22px; }
  .gs-side-title { font-size: 38px; margin-top: 18px; }
  .gs-side-sub { font-size: 15px; }
}

/* 1장 — 남길 걱정으로 메뉴를 고르지 마라(어두운 음식 사진 + 큰 흰 글씨) */
.gs-side-s1 { color: #fff; background: #2b1d12; }
.gs-side-s1:before { content: ''; position: absolute; inset: -12px; z-index: -1; background: var(--photo) center 78% / 175% no-repeat;
  filter: blur(1.5px) saturate(1.05); }
.gs-side-s1:after { content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(43, 29, 18, .86) 0%, rgba(43, 29, 18, .70) 48%, rgba(43, 29, 18, .30) 100%); }
.gs-side-s1 .gs-side-kick { background: rgba(255, 255, 255, .16); color: #fff; }
.gs-side-s1 .gs-side-sub { color: rgba(255, 255, 255, .86); }
.gs-side-s1 .gs-side-cta { background: #fff; color: #24190f; }

/* 2장 — 월–금 오후 2시까지 주문하면 오늘 출발(민트) */
.gs-side-s2 { color: #053B31; background: #E6F8F2; }
.gs-side-s2 .gs-side-kick { background: #2CD3A0; color: #053B31; }
.gs-side-s2 .gs-side-title em { font-style: normal; color: #00785F; }
.gs-side-s2 .gs-side-sub { color: #2f5a50; }
.gs-side-s2 .gs-side-cta { background: #053B31; color: #fff; position: relative; z-index: 2; }
.gs-side-s2 .gs-side-pic { position: absolute; right: -46px; bottom: -40px; width: 230px; height: 230px; border-radius: 50%;
  background: var(--photo) center / 150% no-repeat; box-shadow: 0 10px 30px rgba(5, 59, 49, .18); }

/* 3장 — 지금 가장 먹고 싶은 한 스푼(크림) */
.gs-side-s3 { color: #24190f; background: #FFF3E6; }
.gs-side-s3 .gs-side-kick { background: #24190f; color: #fff; }
.gs-side-s3 .gs-side-title em { font-style: normal; color: #00785F; }
.gs-side-s3 .gs-side-sub { color: #5e4f40; }
.gs-side-s3 .gs-side-cta { background: #2CD3A0; color: #053B31; position: relative; z-index: 2; }
.gs-side-s3 .gs-side-pic { position: absolute; right: -54px; bottom: -48px; width: 250px; height: 250px; border-radius: 50%;
  background: var(--photo) center / 140% no-repeat; box-shadow: 0 10px 30px rgba(36, 25, 15, .16); }

.gs-side-dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.gs-side-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: #d9cfc2; cursor: pointer; transition: width .3s ease, background .3s ease; }
.gs-side-dots button.on { width: 24px; background: #00785F; }
@media (prefers-reduced-motion: reduce) { .gs-side-slide, .gs-side-slide.on { transition: none; } }
.gs-side-logo { display: block; width: 107px; height: auto; filter: brightness(0) invert(1); opacity: .95; }
.gs-side-s1 .gs-side-title { margin-top: 26px; }