/*
Theme Name: GreenBox Neon Matrix
Theme URI: https://greenbox.rightclickitsupport.com/
Author: GreenBox Project
Description: Neon Matrix block theme for the GreenBox Command Platform showcase.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: greenbox-neon-matrix
*/

:root {
  --gb-bg: #020502;
  --gb-panel: rgba(8, 24, 10, .88);
  --gb-panel-strong: rgba(10, 34, 12, .96);
  --gb-green: #39ff14;
  --gb-green-2: #00ff99;
  --gb-blue: #54d9ff;
  --gb-text: #f4fff4;
  --gb-muted: #b7d3bd;
  --gb-line: rgba(57,255,20,.42);
  --gb-shadow: rgba(57,255,20,.28);
  --gb-max: 1280px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background:
    linear-gradient(180deg, rgba(2,5,2,.88), rgba(2,5,2,.98)),
    url("assets/backgrounds/neon-matrix-source-v1.png") center top / cover fixed no-repeat,
    #020502;
  color: var(--gb-text);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .25;
  background-image:
    linear-gradient(rgba(57,255,20,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(57,255,20,.07) 1px, transparent 1px);
  background-size: 44px 44px;
  z-index: 0;
}

a {
  color: var(--gb-green-2);
}

.gb-site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid var(--gb-line);
  background: rgba(2, 8, 2, .91);
  backdrop-filter: blur(14px);
  box-shadow: 0 0 28px rgba(57,255,20,.12);
}

.gb-header-inner {
  max-width: var(--gb-max);
  margin: 0 auto;
  padding: 14px 22px;
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
}

.gb-brand {
  display: flex;
  gap: 12px;
  align-items: center;
  text-decoration: none !important;
  min-width: 260px;
}

.gb-brand-mark {
  width: 46px;
  height: 46px;
  border: 1px solid var(--gb-line);
  border-radius: 15px;
  display: grid;
  place-items: center;
  color: #001600;
  font-weight: 950;
  background:
    radial-gradient(circle at 40% 30%, #ffffff, var(--gb-green) 52%, #008c2d);
  box-shadow: 0 0 22px var(--gb-shadow);
}

.gb-brand-text strong {
  color: #fff;
  display: block;
  font-size: 1.28rem;
  line-height: 1;
}

.gb-brand-text span {
  color: var(--gb-muted);
  display: block;
  font-size: .78rem;
  margin-top: 4px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.wp-block-navigation {
  gap: 8px;
}

.wp-block-navigation a,
.wp-block-navigation-item__content {
  color: #eaffea !important;
  text-decoration: none !important;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 8px 11px;
  font-weight: 760;
  font-size: .91rem;
}

.wp-block-navigation a:hover,
.wp-block-navigation-item__content:hover {
  border-color: var(--gb-line);
  color: var(--gb-green) !important;
  box-shadow: 0 0 18px rgba(57,255,20,.16);
}

.gb-main {
  position: relative;
  z-index: 1;
}

.gb-wrap {
  max-width: var(--gb-max);
  margin: 0 auto;
  padding: 38px 22px 82px;
}

.gb-hero {
  border: 1px solid var(--gb-line);
  border-radius: 34px;
  padding: clamp(30px, 5vw, 62px);
  background:
    radial-gradient(circle at 78% 22%, rgba(57,255,20,.30), transparent 22rem),
    radial-gradient(circle at 22% 16%, rgba(0,255,153,.13), transparent 24rem),
    linear-gradient(135deg, rgba(12,36,12,.95), rgba(1,7,1,.98));
  box-shadow: 0 0 48px rgba(57,255,20,.20), inset 0 0 30px rgba(57,255,20,.05);
  overflow: hidden;
  position: relative;
}

.gb-hero-split {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, .92fr);
  gap: 30px;
  align-items: center;
}

.gb-hero-media {
  border: 1px solid rgba(57,255,20,.35);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 0 34px rgba(57,255,20,.25);
  background: rgba(0,0,0,.35);
}

.gb-hero-media img {
  width: 100%;
  height: auto;
  display: block;
}

.gb-kicker {
  color: var(--gb-green);
  text-transform: uppercase;
  letter-spacing: .24em;
  font-weight: 900;
  font-size: .82rem;
}

.gb-hero h1,
.gb-title-xl {
  color: #ffffff;
  font-size: clamp(3rem, 7.1vw, 7rem);
  line-height: .9;
  letter-spacing: -.06em;
  margin: 14px 0 18px;
  text-shadow: 0 0 24px rgba(57,255,20,.35);
}

.gb-hero p,
.gb-lead {
  color: var(--gb-muted);
  max-width: 930px;
  font-size: clamp(1.08rem, 2vw, 1.42rem);
  line-height: 1.58;
}

.gb-tagline {
  color: #fff !important;
  font-weight: 900;
}

.gb-actions,
.gb-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

.gb-button,
.wp-block-button__link {
  display: inline-block;
  border-radius: 999px !important;
  padding: 13px 18px !important;
  text-decoration: none !important;
  font-weight: 900 !important;
  border: 1px solid rgba(57,255,20,.58) !important;
}

.gb-button-primary {
  color: #001900 !important;
  background: var(--gb-green) !important;
  box-shadow: 0 0 26px rgba(57,255,20,.26);
}

.gb-button-secondary {
  color: #ffffff !important;
  background: rgba(57,255,20,.08) !important;
}

.gb-pill {
  border: 1px solid rgba(57,255,20,.5);
  border-radius: 999px;
  padding: 9px 14px;
  background: rgba(57,255,20,.08);
  color: #ecffec;
  font-weight: 780;
}

.gb-section {
  margin-top: 44px;
}

.gb-section h2 {
  color: #ffffff;
  font-size: clamp(1.9rem, 3.4vw, 3.15rem);
  letter-spacing: -.03em;
  margin-bottom: 12px;
}

.gb-section > p {
  color: var(--gb-muted);
  max-width: 960px;
  font-size: 1.08rem;
  line-height: 1.65;
}

.gb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
  gap: 18px;
  margin-top: 24px;
}

.gb-grid-wide {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.gb-card {
  border: 1px solid rgba(57,255,20,.28);
  border-radius: 24px;
  padding: 22px;
  background:
    linear-gradient(180deg, rgba(20,42,20,.90), rgba(5,12,5,.96));
  box-shadow: 0 0 22px rgba(57,255,20,.10);
  min-height: 150px;
}

.gb-card:hover {
  border-color: rgba(57,255,20,.62);
  box-shadow: 0 0 32px rgba(57,255,20,.18);
  transform: translateY(-1px);
}

.gb-card h2,
.gb-card h3 {
  color: #ffffff;
  margin-top: 0;
  margin-bottom: 8px;
}

.gb-card p,
.gb-card li {
  color: var(--gb-muted);
}

.gb-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  border: 1px solid var(--gb-line);
  color: #001700;
  background: var(--gb-green);
  font-weight: 950;
  margin-bottom: 14px;
  box-shadow: 0 0 22px rgba(57,255,20,.25);
}

.gb-service-group {
  margin-top: 34px;
}

.gb-service-group h3 {
  color: #fff;
  font-size: 1.55rem;
  margin-bottom: 14px;
}

.gb-service-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
  gap: 14px;
}

.gb-service {
  border: 1px solid rgba(57,255,20,.25);
  border-radius: 18px;
  padding: 16px;
  background: rgba(9, 20, 9, .90);
}

.gb-service strong {
  color: #ffffff;
  display: block;
  margin-bottom: 6px;
}

.gb-service span {
  color: var(--gb-muted);
  font-size: .95rem;
  line-height: 1.45;
}

.gb-band {
  border: 1px solid rgba(57,255,20,.35);
  border-left: 5px solid var(--gb-green);
  border-radius: 18px;
  padding: 22px;
  background: rgba(57,255,20,.08);
  color: var(--gb-muted);
  line-height: 1.65;
}

.gb-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid rgba(57,255,20,.26);
  border-radius: 18px;
  overflow: hidden;
  margin-top: 22px;
}

.gb-table th,
.gb-table td {
  padding: 15px;
  border-bottom: 1px solid rgba(57,255,20,.14);
  color: var(--gb-muted);
  vertical-align: top;
}

.gb-table th {
  color: #ffffff;
  background: rgba(57,255,20,.11);
  text-align: left;
}

.gb-world-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(285px, 1fr));
  gap: 18px;
  margin-top: 24px;
}

.gb-world {
  border: 1px solid rgba(57,255,20,.30);
  border-radius: 22px;
  overflow: hidden;
  background: rgba(5, 12, 5, .94);
  box-shadow: 0 0 22px rgba(57,255,20,.12);
}

.gb-world img {
  display: block;
  width: 100%;
  height: auto;
}

.gb-world div {
  padding: 16px;
}

.gb-world strong {
  color: #fff;
  display: block;
  font-size: 1.15rem;
  margin-bottom: 6px;
}

.gb-world span {
  color: var(--gb-muted);
  line-height: 1.45;
}

.gb-footer {
  border-top: 1px solid rgba(57,255,20,.26);
  background: rgba(2, 8, 2, .94);
  color: var(--gb-muted);
}

.gb-footer-inner {
  max-width: var(--gb-max);
  margin: 0 auto;
  padding: 26px 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
}

@media (max-width: 900px) {
  .gb-header-inner,
  .gb-hero-split {
    align-items: flex-start;
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .gb-hero h1,
  .gb-title-xl {
    font-size: clamp(2.7rem, 14vw, 4.2rem);
  }
}

/* GREENBOX_CLICKABLE_SERVICE_PAGES_V3_BEGIN */

/* Suppress legacy TTTC/classic-theme navigation leakage on staging only. */
body:not(.wp-admin) #site-navigation,
body:not(.wp-admin) .main-navigation,
body:not(.wp-admin) .primary-navigation,
body:not(.wp-admin) .menu-primary-container,
body:not(.wp-admin) .menu-main-container,
body:not(.wp-admin) .menu-top-menu-container,
body:not(.wp-admin) .site-header:not(.gb-site-header),
body:not(.wp-admin) #masthead:not(.gb-site-header) {
  display: none !important;
}

body:not(.wp-admin) .gb-site-header,
body:not(.wp-admin) .gb-site-header .wp-block-navigation,
body:not(.wp-admin) .gb-site-header .wp-block-navigation__container {
  display: flex !important;
}

.gb-header-inner {
  min-height: 74px;
}

.wp-block-navigation a,
.wp-block-navigation-item__content {
  font-size: .98rem !important;
  font-weight: 850 !important;
}

.gb-hero h1,
.gb-title-xl {
  font-size: clamp(2.8rem, 5.6vw, 5.85rem) !important;
  line-height: .94 !important;
}

.gb-hero-split {
  grid-template-columns: minmax(0, 1fr) minmax(340px, .72fr);
}

.gb-service-grid {
  align-items: stretch;
}

.gb-service,
.gb-service-link {
  display: block;
  color: inherit !important;
  text-decoration: none !important;
}

.gb-service-link {
  position: relative;
  min-height: 168px;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.gb-service-link:hover {
  transform: translateY(-2px);
  border-color: rgba(57,255,20,.72);
  box-shadow: 0 0 30px rgba(57,255,20,.20);
}

.gb-card-action {
  display: inline-block;
  margin-top: 12px;
  color: var(--gb-green);
  font-weight: 900;
  font-size: .92rem;
}

.gb-detail-hero {
  min-height: 440px;
}

.gb-breadcrumb {
  color: var(--gb-muted);
  font-size: .95rem;
  margin-bottom: 16px;
}

.gb-breadcrumb a {
  color: var(--gb-green-2);
  text-decoration: none;
}

.gb-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .55fr);
  gap: 22px;
  align-items: start;
}

.gb-related-list {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.gb-related-list li {
  margin: 8px 0;
}

.gb-related-list a {
  text-decoration: none;
  font-weight: 800;
}

.gb-mini-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.gb-mini-nav a {
  border: 1px solid rgba(57,255,20,.38);
  border-radius: 999px;
  padding: 9px 13px;
  text-decoration: none;
  font-weight: 850;
  color: #fff;
  background: rgba(57,255,20,.08);
}

.gb-main-button-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-top: 22px;
}

.gb-main-button-grid a {
  border: 1px solid rgba(57,255,20,.30);
  border-radius: 18px;
  padding: 18px;
  text-decoration: none;
  background: rgba(9, 20, 9, .92);
  color: #fff;
  font-weight: 900;
  box-shadow: 0 0 18px rgba(57,255,20,.08);
}

.gb-main-button-grid a span {
  display: block;
  color: var(--gb-muted);
  font-weight: 600;
  margin-top: 7px;
  line-height: 1.45;
}

.gb-main-button-grid a:hover {
  border-color: rgba(57,255,20,.72);
  box-shadow: 0 0 28px rgba(57,255,20,.18);
}

@media (max-width: 900px) {
  .gb-detail-layout,
  .gb-hero-split {
    grid-template-columns: 1fr;
  }
}

/* GREENBOX_CLICKABLE_SERVICE_PAGES_V3_END */


/* GREENBOX_SERVICE_DETAIL_ENRICHMENT_V3_1_BEGIN */

.gb-list {
  margin: 0;
  padding-left: 20px;
}

.gb-list li {
  margin: 8px 0;
  color: var(--gb-muted);
  line-height: 1.45;
}

.gb-launch-panel {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.gb-launch-disabled {
  display: block;
  border: 1px solid rgba(57,255,20,.32);
  border-radius: 18px;
  padding: 16px;
  color: #fff;
  background: rgba(57,255,20,.08);
  font-weight: 900;
  box-shadow: 0 0 18px rgba(57,255,20,.08);
}

.gb-launch-disabled small {
  display: block;
  color: var(--gb-muted);
  font-weight: 650;
  margin-top: 6px;
}

.gb-detail-layout h2 {
  margin-top: 30px;
}

.gb-detail-layout h2:first-child {
  margin-top: 0;
}

.gb-service-link strong {
  font-size: 1.02rem;
}

.gb-service-link span {
  min-height: 76px;
}

.gb-mini-nav a {
  color: #fff !important;
}

.gb-card .gb-list {
  margin-top: 8px;
}

/* GREENBOX_SERVICE_DETAIL_ENRICHMENT_V3_1_END */


/* GREENBOX_SERVICE_LINK_WIRING_V3_2_BEGIN */

.gb-launch-panel-v3-2 {
  align-items: stretch;
}

.gb-launch-link {
  display: block;
  border: 1px solid rgba(57,255,20,.46);
  border-radius: 18px;
  padding: 16px;
  color: #fff !important;
  text-decoration: none !important;
  background:
    linear-gradient(135deg, rgba(57,255,20,.16), rgba(4,18,8,.92));
  font-weight: 900;
  box-shadow: 0 0 20px rgba(57,255,20,.13);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.gb-launch-link:hover {
  transform: translateY(-2px);
  border-color: rgba(57,255,20,.9);
  box-shadow: 0 0 34px rgba(57,255,20,.24);
}

.gb-launch-link strong {
  display: block;
  color: #fff;
  font-size: 1rem;
}

.gb-launch-link small,
.gb-launch-disabled small {
  display: block;
  margin-top: 7px;
  color: var(--gb-muted);
  font-size: .82rem;
  line-height: 1.35;
}

.gb-scope-admin {
  border-color: rgba(255,215,0,.52) !important;
}

.gb-scope-status {
  border-color: rgba(0,220,255,.42) !important;
}

.gb-scope-docs {
  border-color: rgba(57,255,20,.34) !important;
}

.gb-scope-pending {
  opacity: .78;
}

/* GREENBOX_SERVICE_LINK_WIRING_V3_2_END */
