/* NEXT "Global - Statement": a standout message for any page. Heading + paragraph on the left, a drawn
 * LED sign cycling short messages + an example callout on the right. Brand tokens only (--next-*).
 * Place it in a full-width container with no padding.
 */
.nx-gst {
  --nx-gutter: clamp(16px, 4vw, 56px);
  --nx-h: var(--next-white); --nx-t: #C9C9CC; --nx-acc: var(--next-red); --nx-b: var(--next-red); --nx-rule: rgba(255, 255, 255, .16); --nx-card: #161618;
  position: relative; box-sizing: border-box; overflow: hidden;
  padding: clamp(64px, 8vw, 110px) var(--nx-gutter);
  background: var(--next-black); font-family: var(--next-font-head);
}
.nx-gst *, .nx-gst *::before, .nx-gst *::after { box-sizing: border-box; }
.nx-gst--white { background: var(--next-white); --nx-h: var(--next-black); --nx-t: var(--next-body); --nx-rule: var(--next-border); --nx-card: var(--next-tint); }
.nx-gst--tint { background: var(--next-tint); --nx-h: var(--next-black); --nx-t: var(--next-body); --nx-rule: var(--next-border); --nx-card: var(--next-white); }
.nx-gst--red { background: var(--next-red); --nx-h: var(--next-black); --nx-t: var(--next-black); --nx-acc: var(--next-black); --nx-b: var(--next-white); --nx-rule: rgba(0, 0, 0, .22); --nx-card: var(--next-white); }
.nx-gst--cyan { background: var(--next-cyan); --nx-h: var(--next-black); --nx-t: var(--next-black); --nx-acc: var(--next-black); --nx-b: var(--next-black); --nx-rule: rgba(0, 0, 0, .2); --nx-card: var(--next-white); }
/* Pixel Circle halftone in the corner on black */
.nx-gst--dark::before { content: ""; position: absolute; right: -180px; top: -220px; width: 640px; height: 640px; pointer-events: none;
  background-image: radial-gradient(circle, rgba(200, 200, 200, .55) 1.6px, transparent 2.2px); background-size: 14px 14px;
  -webkit-mask-image: radial-gradient(circle, #000 0%, rgba(0, 0, 0, .6) 35%, transparent 68%);
          mask-image: radial-gradient(circle, #000 0%, rgba(0, 0, 0, .6) 35%, transparent 68%);
  opacity: .25; }
.nx-gst-in { position: relative; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 48px clamp(48px, 6vw, 110px); align-items: center; max-width: 1480px; margin: 0 auto; padding-inline: clamp(28px, 3vw, 56px); }
.nx-gst-in--solo { grid-template-columns: minmax(0, 1fr); max-width: 1480px; }
.nx-gst-in--solo .nx-gst-copy { max-width: 860px; }
.nx-gst-eyebrow { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; font: 700 12px/1 var(--next-font-sub); letter-spacing: .2em; text-transform: uppercase; color: var(--nx-acc); }
.nx-gst-eyebrow::after { content: ""; width: 48px; height: 2px; background: currentColor; }
.nx-gst-h { margin: 0; color: var(--nx-h); font: 700 clamp(32px, 4vw, 52px)/1.08 var(--next-font-head); letter-spacing: -.02em; text-transform: none; text-wrap: balance; }
.nx-gst-h b { font-weight: inherit; color: var(--nx-b); }
.nx-gst--cyan .nx-gst-h b { box-shadow: inset 0 -.12em 0 var(--next-red); }
.nx-gst-text { margin-top: 22px; }
.nx-gst-text p { margin: 0 0 14px; max-width: 64ch; font: 400 clamp(16.5px, 1.3vw, 18.5px)/1.7 var(--next-font-head); color: var(--nx-t); }
.nx-gst-text p:last-child { margin-bottom: 0; }
/* The sign */
.nx-gst-sign { width: 100%; max-width: 560px; margin: 0 auto; }
.nx-gst-scr { position: relative; display: grid; place-items: center; aspect-ratio: 2 / 1; overflow: hidden; border: 14px solid #1C1C1F; box-shadow: 0 30px 60px rgba(0, 0, 0, .35); text-align: center; }
.nx-gst-scr::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle, transparent 40%, rgba(0, 0, 0, .35) 48%) 0 0 / 5px 5px; pointer-events: none; }
.nx-gst-scr p { grid-area: 1 / 1; position: relative; z-index: 1; margin: 0; padding: 0 16px; opacity: 0; transform: translateY(8px); transition: opacity .5s, transform .5s; font: 900 clamp(30px, 3.4vw, 52px)/1 var(--next-font-call); text-transform: uppercase; }
.nx-gst-scr p.is-on { opacity: 1; transform: none; }
.nx-gst-scr b { display: block; margin-top: 6px; font-size: .62em; }
.nx-gst-scr--black { background: #050505; } .nx-gst-scr--black p { color: #fff; } .nx-gst-scr--black b { color: var(--next-cyan); }
.nx-gst-scr--red { background: var(--next-red); } .nx-gst-scr--red p { color: #000; } .nx-gst-scr--red b { color: #fff; }
.nx-gst-scr--cyan { background: var(--next-cyan); } .nx-gst-scr--cyan p, .nx-gst-scr--cyan b { color: #000; }
.nx-gst-posts { width: 64%; height: 34px; margin: 0 auto; background: linear-gradient(90deg, transparent 0 14%, #3A3A3A 14% 22%, transparent 22% 78%, #3A3A3A 78% 86%, transparent 86%); }
/* Example callout */
.nx-gst-ex { position: relative; max-width: 560px; margin: 28px auto 0; padding: 22px 24px 22px 28px; background: var(--nx-card); border-left: 4px solid var(--next-red); }
.nx-gst-ex .k { display: inline-block; margin-bottom: 10px; padding: 5px 16px 5px 8px; background: var(--next-red); color: #000; font: 700 10px/1 var(--next-font-sub); letter-spacing: .16em; text-transform: uppercase; clip-path: polygon(0 0, 100% 0, calc(100% - 6px) 100%, 0 100%); }
.nx-gst-ex p { margin: 0; font: 400 15.5px/1.6 var(--next-font-head); color: var(--nx-t); }
.nx-gst--red .nx-gst-ex p, .nx-gst--cyan .nx-gst-ex p { color: var(--next-body); }
@media (max-width: 1100px) {
  .nx-gst-in { grid-template-columns: 1fr; padding-inline: 28px; }
}
@media (max-width: 560px) { .nx-gst-in { padding-inline: 20px; } }
@media (prefers-reduced-motion: reduce) { .nx-gst-scr p { transition: none; } }