/* ==========================================================================
   Sohag Exclusive — Grand Opening curtain & ribbon-cutting ceremony
   Theatre stage: maroon velvet drapes, gold valance, a satin ribbon with a bow,
   golden scissors, drifting gold dust. Used by the curtain page and the ceremony.
   ========================================================================== */

:root {
  --go-maroon: #7a1230;
  --go-deep: #2b0710;
  --go-gold: #e2b45a;
  --go-gold-light: #f6dfa4;
  --go-cream: #fbf1e0;
  --go-drape-w: clamp(38px, 13vw, 190px);
  --go-ribbon-h: clamp(30px, 4.6vh, 50px);
  --go-script: "Great Vibes", cursive;
  --go-display: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --go-body: "Jost", "Segoe UI", system-ui, sans-serif;
}

html.go-lock, html.go-lock body { overflow: hidden; }
body.go-page { margin: 0; background: var(--go-deep); color: var(--go-cream); font-family: var(--go-body); }

/* ---------- Stage ---------- */
.go-stage {
  position: fixed; inset: 0; z-index: 9999; overflow: hidden;
  display: grid; grid-template-rows: 1fr auto 1fr; align-items: center; justify-items: center;
  background:
    radial-gradient(60% 48% at 50% 42%, rgba(255, 196, 120, .22), transparent 70%),
    radial-gradient(120% 80% at 50% 110%, #4a0b1a 0%, transparent 60%),
    linear-gradient(180deg, #1c040a 0%, #3a0913 55%, #22050c 100%);
  color: var(--go-cream);
  font-family: var(--go-body);
  padding: env(safe-area-inset-top, 0px) 0 env(safe-area-inset-bottom, 0px);
}
.go-dust { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
.go-spot {
  position: absolute; left: 50%; top: -20%; width: min(900px, 120vw); height: 110%;
  transform: translateX(-50%);
  background: radial-gradient(50% 60% at 50% 40%, rgba(255, 226, 170, .16), transparent 70%);
  pointer-events: none; z-index: 1;
}

/* Velvet drapes with folds */
.go-drape {
  position: absolute; top: 0; bottom: 0; width: var(--go-drape-w); z-index: 3;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .35), transparent 30%, transparent 70%, rgba(0, 0, 0, .35)),
    repeating-linear-gradient(90deg, #4e0819 0, #8c1636 calc(var(--go-drape-w) / 6), #5a0a1f calc(var(--go-drape-w) / 3));
  box-shadow: 0 0 40px rgba(0, 0, 0, .6);
}
.go-drape::after { /* gold fringe at the hem */
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 14px;
  background: repeating-linear-gradient(90deg, var(--go-gold) 0 3px, transparent 3px 7px);
  opacity: .8;
}
.go-drape--l { left: 0; border-right: 2px solid rgba(226, 180, 90, .35); }
.go-drape--r { right: 0; border-left: 2px solid rgba(226, 180, 90, .35); }

.go-valance {
  position: absolute; top: 0; left: 0; right: 0; height: clamp(34px, 7vh, 70px); z-index: 4;
  background:
    radial-gradient(circle at 50% 0, transparent 0, transparent 0),
    linear-gradient(180deg, #6d0f28, #4a0819);
  -webkit-mask: radial-gradient(28px 22px at 28px 100%, transparent 98%, #000) 0 0 / 56px 100%;
          mask: radial-gradient(28px 22px at 28px 100%, transparent 98%, #000) 0 0 / 56px 100%;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .45);
}
.go-valance::before {
  content: ""; position: absolute; left: 0; right: 0; top: 60%; height: 2px;
  background: linear-gradient(90deg, transparent, var(--go-gold), transparent);
}

/* ---------- Content ---------- */
.go-content, .go-below { position: relative; z-index: 5; text-align: center; padding: 0 calc(var(--go-drape-w) + 12px); }
.go-content { align-self: end; padding-bottom: clamp(14px, 3vh, 34px); }
.go-below { align-self: start; padding-top: clamp(18px, 3.5vh, 40px); }
.go-logo {
  width: clamp(76px, 12vh, 120px); height: auto; aspect-ratio: 1; border-radius: 50%; display: block; margin: 0 auto 10px;
  box-shadow: 0 0 0 3px var(--go-gold), 0 0 40px rgba(246, 223, 164, .45);
}
.go-eyebrow { margin: 0; font-family: var(--go-display); letter-spacing: .38em; text-transform: uppercase; font-size: clamp(11px, 1.5vh, 14px); color: var(--go-gold-light); }
.go-title { margin: 4px 0 0; font-weight: 400; line-height: 1; }
.go-title__script {
  display: block; font-family: var(--go-script); font-size: clamp(52px, 11vh, 118px);
  background: linear-gradient(180deg, #fff6d6 10%, #e9bf66 55%, #b8893b 90%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 4px 18px rgba(233, 191, 102, .35));
  padding: 0 .12em;
}
.go-title__sub {
  display: block; margin-top: 6px; font-family: var(--go-display); font-size: clamp(15px, 2.4vh, 22px);
  letter-spacing: .5em; text-transform: uppercase; color: var(--go-cream); padding-left: .5em;
}

/* ---------- Ribbon ---------- */
.go-ribbon { position: relative; z-index: 6; width: 100%; height: var(--go-ribbon-h); }
.go-ribbon__half {
  position: absolute; top: 0; bottom: 0; width: 50%;
  background: linear-gradient(180deg, #6d0a1b 0%, #b3172f 16%, #e8425c 36%, #c01d37 58%, #85102a 86%, #5e0818 100%);
  border-top: 2px solid rgba(246, 223, 164, .75); border-bottom: 2px solid rgba(246, 223, 164, .75);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .45);
}
.go-ribbon__half::after { /* satin sheen */
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, transparent 20%, rgba(255, 255, 255, .28) 30%, transparent 40%) no-repeat;
  background-size: 300% 100%; animation: go-sheen 5s ease-in-out infinite;
}
.go-ribbon__half--l { left: 0; transform-origin: 0 50%; }
.go-ribbon__half--r { right: 0; transform-origin: 100% 50%; }
.go-bow {
  position: absolute; left: 50%; top: 50%; width: clamp(120px, 20vh, 210px); height: auto;
  transform: translate(-50%, -46%); filter: drop-shadow(0 10px 16px rgba(0, 0, 0, .5));
}
.go-scissors {
  position: absolute; top: 50%; left: calc(50% + clamp(70px, 12vh, 120px)); width: clamp(84px, 13vh, 132px); height: auto;
  transform: translateY(-50%) rotate(-14deg); transform-origin: 44% 50%;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .55));
}
.go-scissors__a, .go-scissors__b { transform-box: view-box; transform-origin: 74px 50px; transition: transform .22s ease-in; }
.go-scissors__a { transform: rotate(-9deg); }
.go-scissors__b { transform: rotate(9deg); }

/* ---------- Countdown & actions ---------- */
.go-count { display: flex; justify-content: center; gap: clamp(8px, 2vw, 18px); margin: 0 auto 14px; }
.go-count[hidden], .go-soon[hidden] { display: none; }
.go-count__cell {
  min-width: clamp(58px, 9vh, 88px); padding: 10px 8px 8px; border-radius: 12px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02));
  border: 1px solid rgba(226, 180, 90, .45); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}
.go-count__cell span {
  display: block; font-family: var(--go-display); font-size: clamp(24px, 4.6vh, 44px); line-height: 1.05;
  color: var(--go-gold-light); font-variant-numeric: tabular-nums;
}
.go-count__cell small { display: block; margin-top: 4px; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: rgba(251, 241, 224, .7); }
.go-soon { margin: 0 0 12px; font-family: var(--go-display); font-style: italic; font-size: clamp(17px, 2.6vh, 22px); color: var(--go-gold-light); }
.go-tagline { margin: 0; font-family: var(--go-display); font-size: clamp(15px, 2.2vh, 19px); color: var(--go-cream); }
.go-perks { margin: 6px 0 16px; font-size: 14px; color: rgba(251, 241, 224, .72); }
.go-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.go-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 20px; border-radius: 999px;
  border: 1px solid rgba(226, 180, 90, .7); color: var(--go-cream); text-decoration: none; font-weight: 500; font-size: 15px;
  background: rgba(255, 255, 255, .04); transition: background .2s, transform .2s; max-width: 100%;
}
.go-btn svg { width: 18px; height: 18px; flex: none; }
.go-btn:hover { background: rgba(226, 180, 90, .16); transform: translateY(-1px); }
.go-btn--gold { background: linear-gradient(135deg, #f3d58a, #c99a48); color: #3a0913; border-color: transparent; }
.go-btn--gold:hover { background: linear-gradient(135deg, #f8e2a8, #d6a753); }
.go-btn:focus-visible, .go-skip:focus-visible { outline: 2px solid var(--go-gold-light); outline-offset: 3px; }

.go-preview-note {
  position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 10000;
  background: #fff; color: #7a1230; padding: 8px 16px; border-radius: 999px; font: 600 13px var(--go-body); text-decoration: none;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .35); white-space: nowrap; max-width: calc(100% - 24px); overflow: hidden; text-overflow: ellipsis;
}

/* Curtain page: rows size to content and centre as a group, clear of the valance; scroll if the screen is short. */
.go-stage--curtain {
  scroll-behavior: smooth; overflow-x: hidden;
  grid-template-rows: auto auto auto; align-content: center; align-content: safe center; overflow-y: auto;
  padding-top: calc(env(safe-area-inset-top, 0px) + clamp(40px, 8vh, 80px));
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 24px);
}
.go-stage--curtain .go-content { align-self: auto; }
.go-stage--curtain .go-below { align-self: auto; }
.go-stage--curtain .go-drape, .go-stage--curtain .go-valance, .go-stage--curtain .go-dust, .go-stage--curtain .go-spot { position: fixed; }

/* ---------- Curtain page: entrance sequence ---------- */
.go-stage--curtain .go-scissors { animation: go-float 3.6s ease-in-out 2.6s infinite; }
.go-stage--curtain .go-spot { animation: go-fade 2.2s ease-out both; }
.go-stage--curtain .go-logo { animation: go-rise 1.1s cubic-bezier(.2, .7, .2, 1) .3s both; }
.go-stage--curtain .go-eyebrow { animation: go-rise 1s cubic-bezier(.2, .7, .2, 1) .6s both; }
.go-stage--curtain .go-title__script { animation: go-glow-in 1.6s ease-out .8s both; }
.go-stage--curtain .go-title__sub { animation: go-rise 1s cubic-bezier(.2, .7, .2, 1) 1.3s both; }
.go-stage--curtain .go-ribbon__half--l { animation: go-unroll-l 1.1s cubic-bezier(.3, .8, .2, 1) 1.2s both; }
.go-stage--curtain .go-ribbon__half--r { animation: go-unroll-r 1.1s cubic-bezier(.3, .8, .2, 1) 1.2s both; }
.go-stage--curtain .go-bow { animation: go-pop .7s cubic-bezier(.3, 1.5, .5, 1) 2.1s both; }
.go-stage--curtain .go-scissors { opacity: 0; animation: go-scissors-in .9s ease-out 2.4s forwards, go-float 3.6s ease-in-out 3.3s infinite; }
.go-stage--curtain .go-below { animation: go-rise 1s cubic-bezier(.2, .7, .2, 1) 2.2s both; }
.go-stage--curtain .go-drape--l { animation: go-drape-l 1.6s cubic-bezier(.6, 0, .2, 1) both; }
.go-stage--curtain .go-drape--r { animation: go-drape-r 1.6s cubic-bezier(.6, 0, .2, 1) both; }

@keyframes go-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes go-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes go-glow-in { from { opacity: 0; letter-spacing: .08em; filter: blur(8px); } to { opacity: 1; letter-spacing: 0; filter: drop-shadow(0 4px 18px rgba(233, 191, 102, .35)); } }
@keyframes go-unroll-l { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes go-unroll-r { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes go-pop { from { opacity: 0; transform: translate(-50%, -46%) scale(.3) rotate(-12deg); } to { opacity: 1; transform: translate(-50%, -46%) scale(1); } }
@keyframes go-scissors-in { from { opacity: 0; transform: translate(40px, -50%) rotate(-30deg); } to { opacity: 1; transform: translateY(-50%) rotate(-14deg); } }
@keyframes go-float { 0%, 100% { transform: translateY(-50%) rotate(-14deg); } 50% { transform: translateY(calc(-50% - 7px)) rotate(-10deg); } }
@keyframes go-drape-l { from { width: 50.5%; } to { width: var(--go-drape-w); } }
@keyframes go-drape-r { from { width: 50.5%; } to { width: var(--go-drape-w); } }
@keyframes go-sheen { 0% { background-position: 150% 0; } 60%, 100% { background-position: -150% 0; } }

/* ---------- Ceremony (after opening) ---------- */
.go-stage--ceremony { grid-template-rows: 1fr auto 1fr; transition: opacity .8s ease; }
.go-stage--ceremony .go-ribbon { grid-row: 2; }
.go-stage--ceremony .go-drape { width: 50.5%; transition: width 1.5s cubic-bezier(.65, 0, .25, 1); }
.go-stage--ceremony .go-scissors {
  left: 100%; transition: left .95s cubic-bezier(.3, .7, .2, 1), transform .95s cubic-bezier(.3, .7, .2, 1);
  transform: translateY(-50%) rotate(-22deg);
}
.go-stage--ceremony.is-aim .go-scissors { left: calc(50% - 20px); transform: translateY(-50%) rotate(0deg); }
.go-stage--ceremony.is-snip .go-scissors__a, .go-stage--ceremony.is-snip .go-scissors__b { transform: rotate(0deg); }
.go-stage--ceremony .go-ribbon__half, .go-stage--ceremony .go-bow {
  transition: transform 1.2s cubic-bezier(.55, 0, .75, .3), opacity 1.2s ease;
}
.go-stage--ceremony.is-cut .go-ribbon__half--l { transform: rotate(38deg) translateY(20vh); opacity: 0; }
.go-stage--ceremony.is-cut .go-ribbon__half--r { transform: rotate(-38deg) translateY(20vh); opacity: 0; }
.go-stage--ceremony.is-cut .go-bow { transform: translate(-50%, 60vh) rotate(24deg); opacity: 0; }
.go-stage--ceremony.is-cut .go-scissors { opacity: 0; transition: opacity .5s ease .2s; }
.go-stage--ceremony.is-open .go-drape { width: 0; }
.go-stage--ceremony.is-open { background: transparent; }
.go-stage--ceremony .go-spot { transition: opacity .8s ease; }
.go-stage--ceremony.is-open .go-spot { opacity: 0; }
.go-stage--ceremony.is-done { opacity: 0; pointer-events: none; }
.go-stage--ceremony { transition: opacity .8s ease, background-color .9s ease; }

.go-open-text {
  position: absolute; left: 50%; top: 50%; z-index: 7; margin: 0; text-align: center;
  transform: translate(-50%, -50%) scale(.6); opacity: 0; transition: transform .9s cubic-bezier(.2, 1.4, .4, 1), opacity .6s ease;
  pointer-events: none; width: 100%;
}
.go-open-text span {
  display: block; font-family: var(--go-script); font-size: clamp(64px, 14vh, 140px); line-height: 1;
  background: linear-gradient(180deg, #fff6d6 10%, #e9bf66 55%, #b8893b 90%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 6px 24px rgba(0, 0, 0, .55));
}
.go-open-text small {
  display: inline-block; margin-top: 8px; font: 600 14px var(--go-body); letter-spacing: .28em; text-transform: uppercase;
  color: #fff; background: rgba(43, 7, 16, .78); padding: 7px 16px; border-radius: 999px;
}
.go-stage--ceremony.is-cheer .go-open-text { opacity: 1; transform: translate(-50%, -50%) scale(1); }

.go-skip {
  position: absolute; top: calc(env(safe-area-inset-top, 0px) + 14px); right: 14px; z-index: 8;
  background: rgba(255, 255, 255, .12); color: #fff; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px;
  padding: 7px 16px; font: 500 14px var(--go-body); cursor: pointer;
}

/* ---------- Team badge (store visible to team while the curtain is on) ---------- */
.go-team-badge {
  position: fixed; left: 14px; bottom: 16px; z-index: 70; max-width: calc(100% - 100px);
  display: inline-flex; gap: 6px; align-items: center; padding: 8px 14px; border-radius: 999px;
  background: #2b0710; color: #f6dfa4 !important; font: 500 12.5px/1.3 var(--go-body, sans-serif); text-decoration: none;
  box-shadow: 0 8px 22px -8px rgba(0, 0, 0, .5); border: 1px solid rgba(226, 180, 90, .5);
}
@media (max-width: 900px) { .go-team-badge { bottom: 78px; } }

/* ---------- Sneak peek under the curtain ---------- */
.go-date { margin: -4px 0 12px; font-family: var(--go-display); font-style: italic; font-size: clamp(16px, 2.3vh, 20px); color: var(--go-gold-light); }
.go-peek-cue {
  display: inline-flex; gap: 8px; align-items: center; margin-top: 22px; color: rgba(251, 241, 224, .75); text-decoration: none;
  font-size: 12px; letter-spacing: .24em; text-transform: uppercase;
}
.go-peek-cue span { display: inline-block; animation: go-bob 2s ease-in-out infinite; color: var(--go-gold); }
.go-peek-cue:hover { color: var(--go-gold-light); }
@keyframes go-bob { 0%, 100% { transform: none; } 50% { transform: translateY(4px); } }

.go-peek {
  position: relative; z-index: 5; width: 100%; box-sizing: border-box; text-align: center;
  margin-top: clamp(56px, 12vh, 120px); padding: 56px calc(var(--go-drape-w) + 20px) 72px;
  border-top: 1px solid rgba(226, 180, 90, .28);
  background: linear-gradient(180deg, rgba(20, 3, 8, 0), rgba(20, 3, 8, .55) 30%);
}
.go-peek__title { margin: 10px 0 10px; font-family: var(--go-display); font-weight: 500; font-style: italic; font-size: clamp(28px, 4.2vw, 46px); color: var(--go-cream); line-height: 1.1; }
.go-peek__lead { max-width: 560px; margin: 0 auto 34px; color: rgba(251, 241, 224, .72); line-height: 1.7; font-size: 15px; }
.go-peek__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 2vw, 24px); max-width: 980px; margin: 0 auto; }
.go-peek__card { position: relative; margin: 0; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 160px 160px 6px 6px; border: 1px solid rgba(226, 180, 90, .55); background: #1c040a; }
.go-peek__card::before { /* inner gold hairline */
  content: ""; position: absolute; inset: 6px; border-radius: inherit; border: 1px solid rgba(246, 223, 164, .35); z-index: 2; pointer-events: none;
}
.go-peek__card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.go-peek__card.is-veiled img { filter: blur(6px) saturate(.7) brightness(.7); transform: scale(1.08); }
.go-peek__card figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 40px 10px 16px;
  background: linear-gradient(180deg, transparent, rgba(20, 3, 8, .92));
}
.go-peek__card figcaption span { display: block; font-family: var(--go-display); font-size: 19px; color: var(--go-cream); }
.go-peek__card figcaption small { display: block; margin-top: 2px; font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--go-gold); }
.go-peek__promise { list-style: none; margin: 34px auto 26px; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; font-size: 14px; color: rgba(251, 241, 224, .8); }
.go-peek__promise li::before { content: "✦"; margin-right: 8px; font-size: 10px; color: var(--go-gold); vertical-align: middle; }

@media (max-width: 640px) {
  .go-peek { padding: 44px 34px 64px; }
  .go-peek__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .go-peek__card figcaption span { font-size: 16px; }
  .go-peek__lead { font-size: 14px; }
}

/* ---------- Small screens ---------- */
@media (max-width: 640px) {
  :root { --go-drape-w: 22px; }
  .go-content, .go-below { padding-left: 34px; padding-right: 34px; }
  .go-drape::after { height: 8px; }
  .go-count__cell { min-width: 62px; padding: 8px 4px 6px; }
  .go-count { gap: 8px; }
  .go-scissors { left: calc(50% + 62px); }
}
@media (max-height: 620px) {
  .go-logo { width: 64px; margin-bottom: 4px; }
  .go-perks { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .go-stage *, .go-stage { animation: none !important; transition-duration: .01ms !important; }
  .go-stage--curtain .go-scissors { opacity: 1; }
}