:root {
  --gx-nav-height: 70px;
  --gx-nav-bg: rgba(10, 18, 32, .96);
  --gx-nav-fg: #f5f7fb;
  --gx-nav-muted: #aeb8c8;
  --gx-nav-border: rgba(255,255,255,.10);
  --gx-accent: #53c7ff;
  --gx-page-bg: #f5f7fb;
  --gx-page-fg: #152033;
  --gx-card-bg: #ffffff;
  --gx-card-border: #dfe5ee;
  --gx-soft-bg: #eef3f9;
  --gx-shadow: 0 18px 44px rgba(7,16,31,.12);
}

html[data-gurexa-theme="light"] {
  --gx-page-bg: #f5f7fb;
  --gx-page-fg: #152033;
  --gx-card-bg: #ffffff;
  --gx-card-border: #dfe5ee;
  --gx-soft-bg: #eef3f9;
  --gx-nav-bg: rgba(10,18,32,.96);
  --gx-nav-fg: #f5f7fb;
  --gx-nav-muted: #aeb8c8;
}

html[data-gurexa-theme="dark"] {
  --gx-page-bg: #08111f;
  --gx-page-fg: #edf4ff;
  --gx-card-bg: #0f1c2e;
  --gx-card-border: #223552;
  --gx-soft-bg: #0b1728;
  --gx-nav-bg: rgba(4,10,19,.98);
  --gx-nav-fg: #ffffff;
  --gx-nav-muted: #a4b1c6;
  --gx-shadow: 0 20px 50px rgba(0,0,0,.35);
}

html[data-gurexa-theme="slate"] {
  --gx-page-bg: #e8edf3;
  --gx-page-fg: #17202c;
  --gx-card-bg: #f8fafc;
  --gx-card-border: #cbd5df;
  --gx-soft-bg: #dde5ed;
  --gx-nav-bg: rgba(35,44,56,.97);
  --gx-nav-fg: #f6f8fb;
  --gx-nav-muted: #c4ccd7;
}

html[data-gurexa-theme="sand"] {
  --gx-page-bg: #f3efe6;
  --gx-page-fg: #2b2924;
  --gx-card-bg: #fffaf1;
  --gx-card-border: #ded3c1;
  --gx-soft-bg: #ece3d4;
  --gx-nav-bg: rgba(49,43,34,.97);
  --gx-nav-fg: #fffaf0;
  --gx-nav-muted: #d9cfbe;
}

html[data-gurexa-theme="forest"] {
  --gx-page-bg: #edf3ef;
  --gx-page-fg: #13241b;
  --gx-card-bg: #f8fcf9;
  --gx-card-border: #c9d9cf;
  --gx-soft-bg: #dfeae3;
  --gx-nav-bg: rgba(17,42,30,.97);
  --gx-nav-fg: #f5fff9;
  --gx-nav-muted: #b8d0c1;
}

html, body {
  background: var(--gx-page-bg) !important;
  color: var(--gx-page-fg);
}

body.gurexa-has-topnav {
  padding-top: var(--gx-nav-height) !important;
}

#gurexa-topnav {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--gx-nav-height);
  z-index: 2147483000;
  background: var(--gx-nav-bg);
  color: var(--gx-nav-fg);
  border-bottom: 1px solid var(--gx-nav-border);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 8px 30px rgba(0,0,0,.12);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.gx-nav-shell {
  height: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 26px;
}

.gx-brand {
  display: inline-flex;
  flex-direction: column;
  min-width: 178px;
  text-decoration: none;
  color: var(--gx-nav-fg);
  line-height: 1;
}

.gx-brand strong {
  font-size: 18px;
  letter-spacing: .14em;
}

.gx-brand span {
  margin-top: 5px;
  font-size: 10px;
  letter-spacing: .08em;
  color: var(--gx-nav-muted);
}

.gx-nav-links {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
  min-width: 0;
}

.gx-nav-link,
.gx-icon-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--gx-nav-fg);
  text-decoration: none;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .01em;
  cursor: pointer;
  border-radius: 10px;
  transition: background .16s ease, color .16s ease;
}

.gx-nav-link {
  padding: 11px 12px;
  white-space: nowrap;
}

.gx-nav-link:hover,
.gx-nav-link[aria-current="page"],
.gx-icon-btn:hover,
.gx-icon-btn[aria-expanded="true"] {
  background: rgba(255,255,255,.09);
  color: #fff;
}

.gx-nav-tools {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}

.gx-menu-wrap {
  position: relative;
}

.gx-icon-btn {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  font-size: 19px;
}

.gx-dropdown {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  width: 310px;
  max-height: min(72vh, 620px);
  overflow: auto;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid var(--gx-card-border);
  background: var(--gx-card-bg);
  color: var(--gx-page-fg);
  box-shadow: var(--gx-shadow);
  display: none;
}

.gx-dropdown.is-open {
  display: block;
}

.gx-dropdown h4 {
  margin: 10px 8px 7px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .12em;
  opacity: .60;
}

.gx-option {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 11px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
}

.gx-option:hover,
.gx-option.is-selected {
  background: var(--gx-soft-bg);
}

.gx-option small {
  opacity: .55;
}

.gurexa-nav-page {
  min-height: calc(100vh - var(--gx-nav-height));
  background:
    radial-gradient(circle at 85% 4%, rgba(83,199,255,.14), transparent 30%),
    var(--gx-page-bg);
  color: var(--gx-page-fg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.gx-page-shell {
  max-width: 1280px;
  margin: 0 auto;
  padding: 72px 32px 96px;
}

.gx-eyebrow {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--gx-accent);
}

.gx-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
  gap: 52px;
  align-items: end;
  padding-bottom: 48px;
  border-bottom: 1px solid var(--gx-card-border);
}

.gx-hero h1 {
  margin: 14px 0 18px;
  max-width: 900px;
  font-size: clamp(38px, 5vw, 72px);
  line-height: 1.02;
  letter-spacing: -.04em;
}

.gx-hero p {
  margin: 0;
  max-width: 820px;
  font-size: 18px;
  line-height: 1.65;
  opacity: .78;
}

.gx-hero-aside {
  padding: 24px;
  border-radius: 18px;
  border: 1px solid var(--gx-card-border);
  background: color-mix(in srgb, var(--gx-card-bg) 92%, transparent);
  box-shadow: var(--gx-shadow);
}

.gx-hero-aside strong {
  display: block;
  margin-bottom: 8px;
  font-size: 15px;
}

.gx-hero-aside p {
  font-size: 14px;
  line-height: 1.55;
}

.gx-section {
  padding: 52px 0 0;
}

.gx-section-header {
  max-width: 820px;
  margin-bottom: 24px;
}

.gx-section h2 {
  margin: 0 0 12px;
  font-size: 30px;
  letter-spacing: -.025em;
}

.gx-section-header p {
  margin: 0;
  line-height: 1.65;
  opacity: .72;
}

.gx-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.gx-card {
  padding: 24px;
  min-height: 190px;
  border-radius: 16px;
  border: 1px solid var(--gx-card-border);
  background: var(--gx-card-bg);
  box-shadow: 0 7px 24px rgba(7,16,31,.05);
}

.gx-card .gx-num {
  display: inline-block;
  margin-bottom: 28px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  color: var(--gx-accent);
}

.gx-card h3 {
  margin: 0 0 10px;
  font-size: 18px;
}

.gx-card p {
  margin: 0;
  line-height: 1.58;
  font-size: 14px;
  opacity: .72;
}

.gx-flow {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}

.gx-flow div {
  position: relative;
  padding: 18px 16px;
  border: 1px solid var(--gx-card-border);
  background: var(--gx-soft-bg);
  border-radius: 12px;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
}

.gx-footer-note {
  margin-top: 64px;
  padding: 24px 0 0;
  border-top: 1px solid var(--gx-card-border);
  font-size: 13px;
  opacity: .62;
}

@media (max-width: 1120px) {
  .gx-nav-shell { gap: 12px; padding: 0 14px; }
  .gx-brand { min-width: 142px; }
  .gx-brand span { display: none; }
  .gx-nav-link { padding: 10px 8px; font-size: 13px; }
}

@media (max-width: 900px) {
  :root { --gx-nav-height: 62px; }
  .gx-brand { min-width: auto; }
  .gx-nav-links {
    overflow-x: auto;
    scrollbar-width: none;
  }
  .gx-nav-links::-webkit-scrollbar { display: none; }
  .gx-nav-link { flex: 0 0 auto; }
  .gx-hero { grid-template-columns: 1fr; gap: 24px; }
  .gx-grid { grid-template-columns: 1fr 1fr; }
  .gx-flow { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .gx-brand span { display: none; }
  .gx-brand strong { font-size: 15px; }
  .gx-nav-shell { padding: 0 10px; }
  .gx-nav-tools { gap: 0; }
  .gx-icon-btn { width: 36px; }
  .gx-page-shell { padding: 50px 18px 72px; }
  .gx-hero h1 { font-size: 38px; }
  .gx-grid,
  .gx-flow { grid-template-columns: 1fr; }
  .gx-dropdown { width: min(310px, calc(100vw - 24px)); }
}

/* Common sidebar offsets: move fixed/sticky app navigation below the permanent navbar. */
.gurexa-has-topnav .sidebar,
.gurexa-has-topnav .app-sidebar,
.gurexa-has-topnav [class*="sidebar"][style*="position: fixed"],
.gurexa-has-topnav nav[aria-label="Sidebar"] {
  top: var(--gx-nav-height) !important;
  max-height: calc(100vh - var(--gx-nav-height)) !important;
}

/* GUREXA_NAVBAR_V17_BASE_GUARD
   Permanent neutralization of the historical black navbar first paint.
*/
#gurexa-topnav {
  background: #eaf6ff !important;
  color: #173a5e !important;
  box-shadow: none !important;
  border-top: 0 !important;
  border-bottom: 1px solid #cfe5f7 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}