/* ==========================================================
   Golden Midnight — a New Year card from a business
   Black marble, champagne gold, Bodoni and Jost.
   ========================================================== */
.gm {
  --g-bg: #0b0a09; --g-bg2: #14110d; --g-ink: #f6ecd6; --g-muted: rgba(246, 236, 214, 0.74);
  --g-accent: #d8b46a; --g-accent2: #f3d998; --g-card: #f7f1e3; --g-card-ink: #231c12;
  --g-display: 'Bodoni Moda', 'Playfair Display', serif; --g-script: 'Cormorant Garamond', serif;
  --g-body: 'Jost', 'Sora', sans-serif; --g-label: 'Jost', 'Sora', sans-serif;
}
.gm .vx-loader { background: radial-gradient(circle at 50% 30%, #2a2214, #0b0a09 70%); }

/* the year slider on the opening */
.gm-track { position: relative; display: flex; align-items: center; justify-content: space-between; height: 64px; padding: 0 22px; border-radius: 40px; background: rgba(8, 7, 6, 0.55); border: 1px solid rgba(243, 217, 152, 0.55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 0 30px rgba(216, 180, 106, 0.25); }
.gm-track .gr-chevrons { position: static; }
.gm-yr { font: 500 0.95rem var(--g-display); letter-spacing: 0.08em; color: rgba(243, 217, 152, 0.6); }
.gm .gr-knob { position: absolute; left: 4px; top: 4px; display: grid; place-items: center; width: 92px; height: 54px; border-radius: 30px; background: linear-gradient(135deg, #fff3c8, #d8b46a 55%, #a87f34); color: #1b150c; font: 600 1.05rem var(--g-display); letter-spacing: 0.06em; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45), 0 0 24px rgba(243, 217, 152, 0.5); }

.gm-year-big { margin: 6px 0 0; font: 500 clamp(3.6rem, 22vw, 5.6rem)/1 var(--g-display); letter-spacing: 0.04em; background: linear-gradient(180deg, #fff6dc, #e9c77c 50%, #b08a3e); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 4px 24px rgba(216, 180, 106, 0.4)); }
.gm .gr-big { font-style: italic; font-size: clamp(2.2rem, 11vw, 3rem); }

.gm-year { background: radial-gradient(circle at 50% 0%, #1f1a12, var(--g-bg) 70%); }

.gm-people { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.gm-person { margin: 0; text-align: left; }
.gm-person img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 14px; filter: grayscale(0.15) contrast(1.05); }
.gm-person figcaption { display: grid; gap: 2px; padding: 8px 2px 0; }
.gm-person strong { font: 400 1.05rem var(--g-display); color: var(--g-ink); }
.gm-person span { font: 500 0.62rem var(--g-label); letter-spacing: 0.16em; text-transform: uppercase; color: var(--g-accent); }

.gm-closure { background: linear-gradient(180deg, var(--g-bg), #1a150d); }
.gm-closure-sprite { width: 110px; margin: 0 auto 10px; filter: drop-shadow(0 12px 22px rgba(0, 0, 0, 0.5)); }
.gm-count-note { margin: 10px 0 0; font: 500 0.66rem var(--g-label); letter-spacing: 0.2em; text-transform: uppercase; color: var(--g-muted); }
.gm .vx-countdown b { font-family: var(--g-display); color: var(--g-accent2); }

.gm-finale-ball { width: 120px; margin: 0 auto 6px; filter: drop-shadow(0 0 30px rgba(243, 217, 152, 0.45)); }
.gm .gr-finale-inner .gr-to { color: var(--g-accent2); }
