.games-governance-page {
  --gg-bg: #090302;
  --gg-panel: rgba(26, 9, 6, .84);
  --gg-line: rgba(255, 174, 35, .34);
  --gg-gold: #ffbd3f;
  --gg-gold-soft: #ffe58c;
  --gg-red: #ef2f22;
  --gg-muted: #c9b8ae;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 50% 8%, rgba(138, 32, 9, .18), transparent 34%),
    linear-gradient(180deg, #110403 0%, #080202 100%);
}

.games-governance-page *,
.games-governance-page *::before,
.games-governance-page *::after { box-sizing: border-box; }

.gg-container { width: min(1180px, calc(100% - 42px)); margin-inline: auto; }
.gg-section { position: relative; padding: 96px 0; border-top: 1px solid rgba(255, 86, 34, .42); }
.gg-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 50% 0, rgba(255, 70, 12, .09), transparent 35%); }
.gg-center { max-width: 820px; margin: 0 auto 48px; text-align: center; position: relative; z-index: 1; }
.gg-eyebrow { margin: 0 0 12px; color: var(--gg-gold); font-size: 12px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; }
.gg-title { margin: 0; font-size: clamp(34px, 4.2vw, 60px); line-height: 1.06; letter-spacing: -.04em; }
.gg-title span { color: var(--gg-gold); }
.gg-desc { margin: 18px auto 0; max-width: 760px; color: var(--gg-muted); font-size: 16px; line-height: 1.75; }
.gg-btn { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; gap: 10px; padding: 0 22px; border: 1px solid rgba(255, 220, 110, .5); border-radius: 999px; color: #160604; background: linear-gradient(135deg, #fff0a7, #ffab20); box-shadow: 0 10px 35px rgba(255, 113, 16, .2), inset 0 1px 0 #fff7d0; font-size: 14px; font-weight: 800; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease; }
.gg-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 38px rgba(255, 93, 15, .32), inset 0 1px 0 #fff7d0; }
.gg-btn.alt { color: #fff4d0; background: rgba(10, 3, 2, .62); box-shadow: none; }

.gg-hero { position: relative; min-height: 760px; display: flex; align-items: center; isolation: isolate; background: #120503 url('../assets/games-governance-hero-v2.webp') center/cover no-repeat; }
.gg-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5, 2, 2, .97) 0%, rgba(10, 3, 2, .84) 35%, rgba(10, 3, 2, .08) 70%, rgba(10, 3, 2, .18) 100%), linear-gradient(180deg, rgba(8, 2, 1, .18), transparent 62%, rgba(8, 2, 1, .7)); }
.gg-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: linear-gradient(90deg, transparent, #ff3e20 18%, #ffca46 50%, #ff3e20 82%, transparent); box-shadow: 0 0 30px #ff2c12; }
.gg-hero-copy { max-width: 530px; padding: 130px 0 92px; position: relative; z-index: 2; }
.gg-hero-copy h1 { margin: 12px 0 20px; font-size: clamp(48px, 5.5vw, 78px); line-height: .98; letter-spacing: -.05em; }
.gg-hero-copy h1 span { color: var(--gg-gold); }
.gg-hero-copy .lead { max-width: 540px; margin: 0; color: #eadbd2; font-size: 17px; line-height: 1.75; }
.gg-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

.gg-marquee { position: relative; z-index: 4; overflow: hidden; border-bottom: 1px solid rgba(255, 98, 31, .36); background: linear-gradient(90deg, #220705, #4a1309 50%, #220705); }
.gg-marquee-track { display: flex; width: max-content; animation: gg-marquee 30s linear infinite; }
.gg-marquee-set { display: flex; align-items: center; gap: 36px; padding: 17px 18px; color: #f8e8d7; white-space: nowrap; font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.gg-marquee-set b { color: var(--gg-gold); font-size: 16px; }
@keyframes gg-marquee { to { transform: translateX(-50%); } }

.gg-ecosystem { padding: 0; background: #080201; }
.gg-orbit-stage { position: relative; min-height: 790px; z-index: 1; overflow: hidden; margin-top: 0; isolation: isolate; background:
  radial-gradient(ellipse at 50% 63%, rgba(129, 34, 10, .22) 0 15%, rgba(34, 8, 4, .15) 38%, transparent 62%),
  linear-gradient(180deg, #100504 0%, #090302 43%, #050202 100%); }
.gg-orbit-heading-wrap { position: absolute; z-index: 140; top: 58px; left: 50%; width: min(880px, calc(100% - 40px)); transform: translateX(-50%); }
.gg-orbit-heading-wrap .gg-center { margin: 0; padding: 24px 26px 30px; border-radius: 28px; background: radial-gradient(circle at 50% 0, rgba(59, 14, 7, .44), rgba(10, 3, 2, .1) 70%, transparent); text-shadow: 0 4px 22px rgba(0,0,0,.72); }
.gg-orbit-stage::before { content: ""; position: absolute; z-index: 1; left: 50%; top: 61.7%; width: min(1080px, 82%); height: 44%; border: 1px solid rgba(255, 187, 58, .32); border-radius: 50%; transform: translate(-50%, -50%) rotateX(66deg); background: repeating-radial-gradient(ellipse at center, transparent 0 54px, rgba(255, 125, 28, .075) 55px 56px); box-shadow: 0 0 28px rgba(255, 82, 18, .22), inset 0 0 80px rgba(255, 56, 12, .1); pointer-events: none; }
.gg-orbit-stage::after { content: ""; position: absolute; inset: 0; z-index: 0; background:
  linear-gradient(90deg, transparent 49.9%, rgba(255, 151, 46, .08) 50%, transparent 50.1%),
  radial-gradient(ellipse at 50% 62%, transparent 0 24%, rgba(5, 1, 1, .18) 52%, rgba(5, 1, 1, .7) 100%); pointer-events: none; }
.gg-orbit-core { position: absolute; z-index: 72; left: 50%; top: 61.7%; width: 218px; aspect-ratio: 1; transform: translate(-50%, -49%); display: grid; place-items: center; text-align: center; pointer-events: none; }
.gg-orbit-core::before { content: ""; position: absolute; z-index: 0; left: 50%; bottom: 19px; width: 206px; height: 62px; transform: translateX(-50%) perspective(250px) rotateX(63deg); border: 1px solid rgba(255, 213, 116, .7); border-radius: 50%; background: radial-gradient(ellipse, rgba(255, 198, 78, .42) 0 12%, rgba(90, 23, 7, .86) 48%, rgba(12, 3, 2, .95) 69%, transparent 71%); box-shadow: 0 8px 0 rgba(20,4,2,.92), 0 10px 0 rgba(255,118,24,.55), 0 19px 35px rgba(0,0,0,.6), 0 0 34px rgba(255, 71, 12, .34); }
.gg-orbit-core::after { content: ""; position: absolute; z-index: 0; left: 50%; bottom: 22px; width: 150px; height: 34px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(ellipse, rgba(255, 206, 96, .42), rgba(255, 90, 15, .15) 46%, transparent 72%); filter: blur(6px); }
.gg-orbit-core img { position: relative; z-index: 1; display: block; width: 100%; height: auto; transform: translateY(-8px); filter: drop-shadow(0 22px 20px rgba(0,0,0,.68)) drop-shadow(0 0 24px rgba(255, 76, 8, .3)); }
.gg-orbit-item { position: absolute; z-index: 10; left: 0; top: 0; width: 216px; height: 252px; color: #fff; text-decoration: none; text-align: center; transform-origin: center bottom; will-change: transform, filter, opacity; }
.gg-orbit-object { position: relative; height: 188px; display: flex; align-items: flex-end; justify-content: center; }
.gg-orbit-art { position: relative; z-index: 2; display: block; width: 180px; height: 180px; object-fit: contain; filter: drop-shadow(0 18px 18px rgba(0,0,0,.72)) drop-shadow(0 0 14px rgba(255, 104, 18, .26)); transition: transform .25s ease; }
.gg-orbit-platform { position: absolute; z-index: 1; left: 50%; bottom: 2px; width: 188px; height: 58px; border: 1px solid rgba(255, 211, 101, .65); border-radius: 50%; transform: translateX(-50%) perspective(260px) rotateX(62deg); background: radial-gradient(ellipse, rgba(255, 181, 62, .34) 0 14%, rgba(64, 15, 5, .96) 56%, #100302 72%); box-shadow: 0 9px 0 #160402, 0 11px 0 rgba(255, 121, 21, .65), 0 18px 30px rgba(0,0,0,.58), 0 0 28px rgba(255, 66, 10, .32), inset 0 0 24px rgba(255, 170, 45, .22); }
.gg-orbit-label { position: relative; z-index: 3; display: inline-grid; min-width: 166px; min-height: 58px; align-content: center; margin-top: -4px; padding: 8px 16px; border: 1px solid rgba(255, 188, 49, .58); border-radius: 12px; background: linear-gradient(180deg, rgba(30, 7, 4, .9), rgba(9,2,2,.96)); box-shadow: 0 14px 28px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06); backdrop-filter: blur(8px); }
.gg-orbit-label strong { display: block; font-size: 16px; line-height: 1.2; }
.gg-orbit-label small { display: block; margin-top: 4px; color: #d9c0b1; font-size: 10px; line-height: 1.35; }
.gg-orbit-item:hover .gg-orbit-art, .gg-orbit-item:focus-visible .gg-orbit-art { transform: translateY(-8px) scale(1.06); }
.gg-orbit-item:focus-visible { outline: 2px solid #ffd35a; outline-offset: 6px; border-radius: 20px; }
.gg-orbit-controls { position: absolute; right: 22px; bottom: 20px; z-index: 130; display: flex; gap: 8px; }
.gg-orbit-control { width: 42px; height: 42px; border: 1px solid rgba(255, 192, 65, .48); border-radius: 50%; color: #ffe6a0; background: rgba(16,4,3,.76); backdrop-filter: blur(10px); cursor: pointer; }
.gg-orbit-control:hover { border-color: #ffd35a; background: rgba(89,20,8,.82); }

.gg-process { background: linear-gradient(180deg, rgba(4,2,1,.9), rgba(20,5,2,.82)), radial-gradient(circle at 50% 50%, rgba(255, 98, 20, .13), transparent 50%); }
.gg-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; position: relative; z-index: 1; }
.gg-steps::before { content: ""; position: absolute; left: 8%; right: 8%; top: 75px; height: 1px; z-index: -1; background: linear-gradient(90deg, transparent, #f59d21 12%, #ffdf67 50%, #f59d21 88%, transparent); box-shadow: 0 0 14px #ff7a18; }
.gg-step { padding: 20px 12px; text-align: center; }
.gg-step-icon { width: 108px; height: 108px; display: grid; place-items: center; margin: 0 auto 16px; border: 1px solid rgba(255, 185, 50, .48); border-radius: 50%; background: radial-gradient(circle, #46150b 0%, #160704 68%); box-shadow: 0 0 0 7px rgba(255, 130, 20, .05), 0 0 30px rgba(255, 102, 12, .12); }
.gg-step-icon img { width: 76px; height: 76px; object-fit: contain; }
.gg-step em { display: block; color: var(--gg-gold); font-style: normal; font-size: 13px; font-weight: 800; }
.gg-step h3 { min-height: 46px; margin: 5px 0 8px; font-size: 15px; line-height: 1.4; }
.gg-step p { margin: 0; color: #bda99e; font-size: 12px; line-height: 1.6; }

.gg-compare-wrap { position: relative; z-index: 1; overflow: hidden; border: 1px solid rgba(255, 179, 44, .38); border-radius: 24px; background: rgba(18, 6, 4, .8); box-shadow: 0 26px 70px rgba(0,0,0,.25); }
.gg-table { width: 100%; border-collapse: collapse; }
.gg-table th { padding: 18px 16px; color: var(--gg-gold-soft); background: rgba(90, 28, 10, .55); font-size: 12px; text-align: left; }
.gg-table td { padding: 15px 16px; border-top: 1px solid rgba(255, 183, 45, .16); color: #dfcec5; font-size: 12px; line-height: 1.45; }
.gg-table tbody tr { transition: background .2s ease; }
.gg-table tbody tr:hover { background: rgba(255, 86, 20, .08); }
.gg-product-cell { display: flex; align-items: center; gap: 10px; min-width: 150px; color: #fff; font-weight: 800; }
.gg-product-cell img { width: 42px; height: 42px; object-fit: contain; }
.gg-status { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border: 1px solid rgba(52, 255, 128, .35); border-radius: 999px; color: #62f599; background: rgba(7, 85, 44, .22); font-size: 11px; font-weight: 800; white-space: nowrap; }
.gg-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #3ff287; box-shadow: 0 0 12px #3ff287; }

.gg-visibility { background: linear-gradient(135deg, #130604, #090302 58%, #210704); }
.gg-visibility-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 30px; position: relative; z-index: 1; }
.gg-visibility-head .gg-title { font-size: clamp(34px, 3.7vw, 54px); }
.gg-visibility-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; position: relative; z-index: 1; }
.gg-log-panel { padding: 28px; border: 1px solid rgba(255, 180, 43, .34); border-radius: 22px; background: linear-gradient(160deg, rgba(55, 16, 8, .58), rgba(10, 3, 2, .84)); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.gg-log-title { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.gg-log-title img { width: 56px; height: 56px; object-fit: contain; }
.gg-log-title h3 { margin: 0; font-size: 20px; }
.gg-log-list { display: grid; gap: 0; }
.gg-log-row { display: grid; grid-template-columns: 92px 1fr auto; gap: 14px; align-items: center; padding: 14px 0; border-top: 1px solid rgba(255, 176, 38, .14); color: #cbb9af; font-size: 12px; }
.gg-log-row strong { color: #fff; }
.gg-log-row span:last-child { color: #ffdd86; }

.gg-responsible { padding: 58px 0; background: linear-gradient(90deg, #210804, #3f1008 48%, #180604); }
.gg-responsible-inner { display: grid; grid-template-columns: minmax(260px, 1.2fr) repeat(4, minmax(130px, .55fr)); gap: 18px; align-items: center; }
.gg-responsible-copy h2 { margin: 6px 0 8px; font-size: clamp(30px, 3vw, 44px); line-height: 1.1; }
.gg-responsible-copy h2 span { color: var(--gg-gold); }
.gg-responsible-copy p:last-child { margin: 0; color: #cdb9ae; font-size: 13px; line-height: 1.6; }
.gg-principle { min-height: 150px; padding: 17px 10px; border-left: 1px solid rgba(255, 184, 48, .2); text-align: center; }
.gg-principle img { width: 68px; height: 68px; object-fit: contain; margin-bottom: 6px; }
.gg-principle strong { display: block; font-size: 13px; }
.gg-principle small { display: block; margin-top: 4px; color: #bea99d; font-size: 10px; line-height: 1.45; }

@media (max-width: 1050px) {
  .gg-hero { min-height: 690px; background-position: 58% center; }
  .gg-orbit-stage { min-height: 740px; }
  .gg-orbit-item { width: 196px; height: 232px; }
  .gg-orbit-art { width: 160px; height: 160px; }
  .gg-steps { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
  .gg-step { padding-inline: 6px; }
  .gg-responsible-inner { grid-template-columns: repeat(4, 1fr); }
  .gg-responsible-copy { grid-column: 1 / -1; text-align: center; max-width: 760px; margin: 0 auto 12px; }
}

@media (max-width: 780px) {
  .gg-container { width: min(100% - 28px, 1180px); }
  .gg-section { padding: 76px 0; }
  .gg-hero { min-height: 700px; align-items: end; background-position: 66% center; }
  .gg-hero::before { background: linear-gradient(180deg, rgba(8,2,1,.28), rgba(8,2,1,.72) 42%, #080201 82%); }
  .gg-hero-copy { max-width: none; padding: 360px 0 70px; text-align: center; }
  .gg-hero-copy h1 { font-size: clamp(43px, 12vw, 64px); }
  .gg-hero-copy .lead { margin-inline: auto; }
  .gg-hero-actions { justify-content: center; }
  .gg-orbit-stage { min-height: 700px; background-position: center; }
  .gg-orbit-heading-wrap { top: 34px; }
  .gg-orbit-heading-wrap .gg-center { padding: 18px 14px 22px; }
  .gg-orbit-core { top: 63.5%; width: 166px; }
  .gg-orbit-core::before { width: 156px; height: 48px; bottom: 15px; }
  .gg-orbit-item { width: 160px; height: 198px; }
  .gg-orbit-object { height: 142px; }
  .gg-orbit-art { width: 132px; height: 132px; }
  .gg-orbit-platform { width: 142px; height: 45px; }
  .gg-orbit-label { min-width: 132px; min-height: 52px; padding: 7px 10px; }
  .gg-orbit-label strong { font-size: 13px; }
  .gg-steps { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .gg-steps::before { display: none; }
  .gg-step:last-child { grid-column: 1 / -1; max-width: 50%; width: 100%; margin-inline: auto; }
  .gg-compare-wrap { overflow-x: auto; }
  .gg-table { min-width: 850px; }
  .gg-visibility-head { align-items: flex-start; flex-direction: column; }
  .gg-visibility-grid { grid-template-columns: 1fr; }
  .gg-responsible-inner { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 520px) {
  .gg-section { padding: 66px 0; }
  .gg-title { font-size: 34px; }
  .gg-hero { min-height: 850px; }
  .gg-hero-copy { padding-top: 350px; }
  .gg-hero-actions { display: grid; }
  .gg-btn { width: 100%; }
  .gg-orbit-stage { min-height: 660px; }
  .gg-orbit-heading-wrap { top: 24px; }
  .gg-orbit-item { width: 136px; height: 176px; }
  .gg-orbit-object { height: 126px; }
  .gg-orbit-art { width: 116px; height: 116px; }
  .gg-orbit-platform { width: 122px; height: 40px; }
  .gg-orbit-label { min-width: 118px; min-height: 46px; }
  .gg-orbit-label small { display: none; }
  .gg-steps { grid-template-columns: 1fr; }
  .gg-step:last-child { grid-column: auto; max-width: none; }
  .gg-log-panel { padding: 22px 18px; }
  .gg-log-row { grid-template-columns: 72px 1fr; }
  .gg-log-row span:last-child { grid-column: 2; }
  .gg-responsible-inner { grid-template-columns: 1fr; }
  .gg-principle { min-height: auto; border-left: 0; border-top: 1px solid rgba(255, 184, 48, .18); }
}

@media (prefers-reduced-motion: reduce) { .gg-marquee-track { animation: none; } }
