/* WemeNetwork Cobalt UI — presentation layer for the existing WordPress content. */
:root {
  --wc-night: #040f2b;
  --wc-night-2: #081a42;
  --wc-night-3: #0a245c;
  --wc-blue: #288cf8;
  --wc-blue-2: #4fa6ff;
  --wc-blue-soft: #e3f0ff;
  --wc-orange: #f68920;
  --wc-orange-2: #ef5a17;
  --wc-ink: #16182c;
  --wc-muted: #676d84;
  --wc-line: rgba(22, 24, 44, .1);
  --wc-paper: #fff;
  --wc-mist: #f4f7fc;
  --wc-container: min(92vw, 84rem);
  --wc-shadow: 0 18px 48px rgba(4, 15, 43, .1);
  --wc-radius: 18px;
  --wc-ease: cubic-bezier(.2, .7, .1, 1);
}

html { scroll-behavior: smooth; background: var(--wc-night); }

body.weme-cobalt-ui,
body.weme-cobalt-ui.ch-home,
body.weme-cobalt-ui.ch-page {
  overflow-x: hidden;
  color: var(--wc-ink);
  background: var(--wc-paper);
  font-family: "Be Vietnam Pro", Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.weme-cobalt-ui *,
.weme-cobalt-ui *::before,
.weme-cobalt-ui *::after { box-sizing: border-box; }

.weme-cobalt-ui a { transition: color .25s ease, background-color .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease; }

/* Ecosystem bar and main navigation */
.weme-cobalt-ui .weme-network-bar {
  color: #586078;
  border-bottom: 1px solid #e3e9f3;
  background: #f7f9fc;
}

.weme-cobalt-ui .weme-network-bar a { color: #586078; }
.weme-cobalt-ui .weme-network-bar a:first-child { color: #0f65ca; }

.weme-cobalt-ui .site-header {
  position: sticky;
  z-index: 1000;
  top: 0;
  min-height: 68px;
  color: var(--wc-ink);
  border-bottom: 1px solid rgba(8, 26, 66, .08);
  background: rgba(255, 255, 255, .97);
  box-shadow: none;
  backdrop-filter: blur(18px);
}

.weme-cobalt-ui .site-header__inner { min-height: 68px; }

.weme-cobalt-ui .site-brand,
.weme-cobalt-ui .site-brand:visited { color: var(--wc-ink); }

.weme-cobalt-ui .site-brand__logo {
  width: 36px;
  height: 36px;
  padding: 7px;
  border: 2px solid var(--wc-night);
  border-radius: 50%;
  background: #eef6ff;
  object-fit: contain;
}

.weme-cobalt-ui .site-title,
.weme-cobalt-ui .site-brand__name { color: var(--wc-ink); font-weight: 800; letter-spacing: -.03em; }

.weme-cobalt-ui .main-navigation a,
.weme-cobalt-ui .site-nav a {
  color: var(--wc-ink);
  border-radius: 9px;
  font-size: .82rem;
  font-weight: 700;
}

.weme-cobalt-ui .main-navigation a:hover,
.weme-cobalt-ui .site-nav a:hover { color: var(--wc-blue); background: var(--wc-blue-soft); }

.weme-cobalt-ui .site-header a[href*="contact"],
.weme-cobalt-ui .site-header a[href*="tu-van"],
.weme-cobalt-ui .site-header .menu-item:last-child > a {
  color: #fff;
  border-color: transparent;
  border-radius: 13px;
  background: linear-gradient(100deg, var(--wc-blue), var(--wc-blue-2));
  box-shadow: 0 8px 22px rgba(40, 140, 248, .28);
}

.weme-cobalt-ui .site-header a[href*="contact"]:hover,
.weme-cobalt-ui .site-header a[href*="tu-van"]:hover,
.weme-cobalt-ui .site-header .menu-item:last-child > a:hover { color: #fff; transform: translateY(-1px); }

.weme-cobalt-ui .menu-toggle,
.weme-cobalt-ui .site-header__toggle {
  color: var(--wc-night);
  border: 0;
  border-radius: 13px;
  background: #eef2f8;
}

/* Shared commercial-hub tokens */
.weme-cobalt-ui .ch-home,
.weme-cobalt-ui .ch-page {
  --ch-ink: var(--wc-ink);
  --ch-green: var(--wc-blue);
  --ch-lime: var(--wc-orange);
  --ch-paper: var(--wc-paper);
  --ch-tint: var(--wc-mist);
  --ch-line: var(--wc-line);
  --ch-muted: var(--wc-muted);
  color: var(--wc-ink);
  background: #fff;
}

.weme-cobalt-ui .ch-wrap { width: var(--wc-container); max-width: 100%; padding-inline: 0; }

.weme-cobalt-ui .ch-kicker {
  color: var(--wc-blue);
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
}

.weme-cobalt-ui .ch-kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  display: inline-block;
  margin-right: 10px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 5px color-mix(in srgb, currentColor 14%, transparent);
  vertical-align: 1px;
}

.weme-cobalt-ui .ch-button {
  min-height: 52px;
  padding: .9rem 1.45rem;
  color: #fff;
  border: 0;
  border-radius: 13px;
  background: linear-gradient(100deg, var(--wc-orange), var(--wc-orange-2));
  box-shadow: 0 14px 30px rgba(239, 90, 23, .27);
  font-weight: 800;
}

.weme-cobalt-ui .ch-button:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 18px 34px rgba(239, 90, 23, .34); }

.weme-cobalt-ui .ch-button--ghost {
  color: #dbe8ff !important;
  border: 1px solid rgba(134, 194, 255, .45);
  background: rgba(8, 26, 66, .72);
  box-shadow: none;
}

.weme-cobalt-ui .ch-button--ghost:hover { color: #fff !important; border-color: var(--wc-blue-2); background: rgba(40, 140, 248, .24); }

/* Main hero */
.weme-cobalt-ui .ch-home-hero {
  position: relative;
  isolation: isolate;
  min-height: 720px;
  padding-block: clamp(5rem, 8vw, 7.5rem) 8rem;
  overflow: hidden;
  color: #fff;
  border: 0;
  border-radius: 0 0 50% 5% / 0 0 6% 3%;
  background:
    radial-gradient(circle at 55% 18%, rgba(40, 140, 248, .35), transparent 32%),
    linear-gradient(145deg, var(--wc-night), var(--wc-night-2));
}

.weme-cobalt-ui .ch-home-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(rgba(79, 166, 255, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(79, 166, 255, .08) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, .72) 65%, transparent 98%);
}

.weme-cobalt-ui .ch-home-hero::after {
  content: "WEME NETWORK";
  position: absolute;
  z-index: -1;
  right: 3vw;
  bottom: 2rem;
  color: rgba(79, 166, 255, .07);
  font-size: clamp(5rem, 13vw, 13rem);
  font-weight: 800;
  letter-spacing: -.08em;
  white-space: nowrap;
}

.weme-cobalt-ui .ch-home-hero__grid {
  align-items: center;
  gap: clamp(3rem, 7vw, 7rem);
  grid-template-columns: 1.05fr .95fr;
}

.weme-cobalt-ui .ch-home-hero .ch-kicker { color: var(--wc-orange); }

.weme-cobalt-ui .ch-home-hero h1,
.weme-cobalt-ui .ch-hero h1 {
  max-width: 12.5ch;
  color: #fff;
  font-size: clamp(3.8rem, 6.2vw, 6.7rem);
  font-weight: 800;
  line-height: .94;
  letter-spacing: -.065em;
  text-wrap: balance;
  text-shadow: 0 8px 36px rgba(0, 0, 0, .25);
}

.weme-cobalt-ui .ch-home-hero__grid > div:first-child > p:last-of-type,
.weme-cobalt-ui .ch-hero > .ch-wrap > p:last-child { color: #c6d4ed; font-size: clamp(1rem, 1.35vw, 1.2rem); }

.weme-cobalt-ui .ch-home-map {
  padding: 1.05rem;
  color: #fff;
  border: 1px solid rgba(134, 194, 255, .3);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(14, 48, 119, .82), rgba(7, 26, 71, .78));
  box-shadow: 0 30px 80px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .06);
  backdrop-filter: blur(18px);
}

.weme-cobalt-ui .ch-home-map__head { border-color: rgba(134, 194, 255, .25); }
.weme-cobalt-ui .ch-home-map__head b { color: #8fc8ff; font-family: "JetBrains Mono", monospace; }
.weme-cobalt-ui .ch-home-map > a { border-color: rgba(134, 194, 255, .2); }
.weme-cobalt-ui .ch-home-map > a:hover { padding-inline: .8rem; border-radius: 10px; background: rgba(40, 140, 248, .13); }
.weme-cobalt-ui .ch-home-map > a span { color: #fff; }
.weme-cobalt-ui .ch-home-map > a strong { color: #aebedf; }

.weme-cobalt-ui .ch-trust {
  position: relative;
  z-index: 4;
  width: var(--wc-container);
  margin: -54px auto 0;
  overflow: hidden;
  color: var(--wc-ink);
  border: 1px solid #d8e7fb;
  border-radius: 17px;
  background: #fff;
  box-shadow: var(--wc-shadow);
}

.weme-cobalt-ui .ch-trust > .ch-wrap { width: 100%; }
.weme-cobalt-ui .ch-trust span { min-height: 104px; display: grid; place-items: center; color: #52617a; border-color: #e3edf9; font-family: "JetBrains Mono", monospace; }

/* Alternating bands */
.weme-cobalt-ui .ch-section {
  position: relative;
  isolation: isolate;
  width: 100%;
  max-width: none;
  padding: clamp(7rem, 10vw, 10rem) 0;
  color: var(--wc-ink);
  background: #fff;
}

.weme-cobalt-ui #need-router { width: 100%; max-width: none; padding-inline: max(4vw, calc((100vw - 84rem) / 2)); }

.weme-cobalt-ui #need-router::after,
.weme-cobalt-ui .ch-section--tint::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -4%;
  bottom: -42px;
  left: -4%;
  height: 84px;
  border-radius: 0 0 50% 50%;
  background: #fff;
}

.weme-cobalt-ui .ch-section--dark {
  padding-top: clamp(9rem, 12vw, 12rem);
  color: #fff;
  background:
    radial-gradient(circle at 82% 18%, rgba(40, 140, 248, .2), transparent 28%),
    linear-gradient(145deg, var(--wc-night), var(--wc-night-2));
}

.weme-cobalt-ui .ch-section--dark::after {
  content: "";
  position: absolute;
  z-index: 1;
  right: -4%;
  bottom: -42px;
  left: -4%;
  height: 84px;
  border-radius: 0 0 50% 50%;
  background: var(--wc-night-2);
}

.weme-cobalt-ui .ch-section--tint { padding-top: clamp(9rem, 12vw, 12rem); background: #fff; }

.weme-cobalt-ui .ch-heading { width: var(--wc-container); margin-inline: auto; }

.weme-cobalt-ui .ch-heading h2,
.weme-cobalt-ui .ch-two h2,
.weme-cobalt-ui .ch-final h2 {
  color: inherit;
  font-size: clamp(2.8rem, 5vw, 5rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.055em;
  text-wrap: balance;
}

.weme-cobalt-ui .ch-heading > p,
.weme-cobalt-ui .ch-large-copy { color: var(--wc-muted); font-size: 1rem; }
.weme-cobalt-ui .ch-section--dark .ch-heading > p,
.weme-cobalt-ui .ch-section--dark .ch-large-copy { color: #aebedf; }
.weme-cobalt-ui .ch-section--dark .ch-kicker { color: #8fc8ff; }

.weme-cobalt-ui .ch-router-grid {
  width: var(--wc-container);
  margin-inline: auto;
  gap: 16px;
  border: 0;
  grid-template-columns: repeat(3, 1fr);
}

.weme-cobalt-ui .ch-router-grid > a {
  min-height: 19rem;
  padding: 1.65rem;
  border: 1px solid #dfe8f5;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(4, 15, 43, .06);
}

.weme-cobalt-ui .ch-router-grid > a:hover { border-color: #a9d2ff; background: #f7fbff; transform: translateY(-4px); }
.weme-cobalt-ui .ch-router-grid > a > span { color: transparent; -webkit-text-stroke: 1px var(--wc-blue); font-size: 2.6rem; }
.weme-cobalt-ui .ch-router-grid h3 { color: var(--wc-ink); font-size: 1.45rem; }
.weme-cobalt-ui .ch-router-grid p { color: var(--wc-muted); font-size: .9rem; }
.weme-cobalt-ui .ch-router-grid strong { color: #1767d6; font-size: .78rem; }

.weme-cobalt-ui .ch-system-rows { border-color: rgba(134, 194, 255, .22); }
.weme-cobalt-ui .ch-system-rows > a { min-height: 86px; border-color: rgba(134, 194, 255, .2); }
.weme-cobalt-ui .ch-system-rows > a:hover { padding-inline: 1rem; background: rgba(40, 140, 248, .11); }
.weme-cobalt-ui .ch-system-rows span,
.weme-cobalt-ui .ch-system-rows em { color: #8fc8ff; font-family: "JetBrains Mono", monospace; }
.weme-cobalt-ui .ch-system-rows b { color: #fff; }

.weme-cobalt-ui .ch-ladder {
  width: var(--wc-container);
  margin-inline: auto;
  gap: 16px;
  border: 0;
}

.weme-cobalt-ui .ch-ladder article {
  min-height: 25rem;
  padding: 1.5rem;
  border: 1px solid #dfe8f5;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(4, 15, 43, .055);
}

.weme-cobalt-ui .ch-ladder article:nth-child(3) {
  color: #fff;
  border-color: #1b63c1;
  background: linear-gradient(145deg, #0c327d, var(--wc-night-2));
}
.weme-cobalt-ui .ch-ladder article:nth-child(3) ul { color: #b2c3e0; }
.weme-cobalt-ui .ch-ladder article:nth-child(3) li { border-color: rgba(134, 194, 255, .2); }
.weme-cobalt-ui .ch-ladder span { color: var(--wc-blue); font-family: "JetBrains Mono", monospace; }
.weme-cobalt-ui .ch-ladder li { border-color: #e2e9f3; }

.weme-cobalt-ui .ch-ecosystem {
  width: var(--wc-container);
  margin-inline: auto;
  gap: 16px;
}
.weme-cobalt-ui .ch-ecosystem article {
  min-height: 20rem;
  padding: 1.6rem;
  border: 1px solid #dfe8f5;
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(4, 15, 43, .055);
}
.weme-cobalt-ui .ch-ecosystem article:nth-child(2) { border-color: #a9d2ff; background: #eef6ff; }
.weme-cobalt-ui .ch-ecosystem span { color: var(--wc-blue); font-family: "JetBrains Mono", monospace; }
.weme-cobalt-ui .ch-ecosystem p { color: var(--wc-muted); font-size: .9rem; }
.weme-cobalt-ui .ch-ecosystem a { color: #1767d6; font-weight: 700; }

.weme-cobalt-ui .ch-final {
  position: relative;
  overflow: hidden;
  padding-block: clamp(6.5rem, 10vw, 10rem);
  color: #fff;
  background:
    radial-gradient(circle at 76% 24%, rgba(40, 140, 248, .24), transparent 30%),
    linear-gradient(145deg, var(--wc-night), var(--wc-night-2));
}

.weme-cobalt-ui .ch-final::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(79, 166, 255, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(79, 166, 255, .07) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: linear-gradient(to bottom, #000, transparent 96%);
}
.weme-cobalt-ui .ch-final > .ch-wrap { position: relative; }
.weme-cobalt-ui .ch-final .ch-kicker { color: var(--wc-orange); }
.weme-cobalt-ui .ch-final > .ch-wrap > p:not(.ch-kicker) { color: #b8c8e4; }
.weme-cobalt-ui .ch-final .ch-button { background: linear-gradient(100deg, var(--wc-orange), var(--wc-orange-2)); }
.weme-cobalt-ui .ch-final .ch-button--ghost { color: #dbe8ff !important; border-color: rgba(134, 194, 255, .45); }

/* Interior commercial pages */
.weme-cobalt-ui .ch-hero {
  position: relative;
  isolation: isolate;
  min-height: 480px;
  padding-block: clamp(5rem, 8vw, 8rem);
  overflow: hidden;
  color: #fff;
  border: 0;
  border-radius: 0 0 50% 5% / 0 0 6% 3%;
  background:
    radial-gradient(circle at 75% 30%, rgba(40, 140, 248, .3), transparent 32%),
    linear-gradient(145deg, var(--wc-night), var(--wc-night-2));
}
.weme-cobalt-ui .ch-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(rgba(79, 166, 255, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 166, 255, .07) 1px, transparent 1px);
  background-size: 60px 60px;
}
.weme-cobalt-ui .ch-hero .ch-kicker { color: var(--wc-orange); }
.weme-cobalt-ui .ch-components article,
.weme-cobalt-ui .ch-price,
.weme-cobalt-ui .ch-market-list > article,
.weme-cobalt-ui .ch-system-grid > a,
.weme-cobalt-ui .ch-simple-grid article { border-color: #dfe8f5; border-radius: 16px; box-shadow: 0 12px 30px rgba(4, 15, 43, .055); }
.weme-cobalt-ui .ch-components span,
.weme-cobalt-ui .ch-market-list dt,
.weme-cobalt-ui .ch-system-grid > a > span,
.weme-cobalt-ui .ch-simple-grid span { color: var(--wc-blue); }
.weme-cobalt-ui .ch-status { color: #1767d6; background: var(--wc-blue-soft); }
.weme-cobalt-ui .ch-status--validated { color: #fff; background: var(--wc-blue); }
.weme-cobalt-ui .ch-evidence-note a { color: #1767d6; }

/* Footer */
.weme-cobalt-ui .site-footer {
  color: #c0cce3;
  border-top: 1px solid rgba(134, 194, 255, .16);
  background: #020a1f;
}
.weme-cobalt-ui .site-footer a { color: #aebedf; }
.weme-cobalt-ui .site-footer a:hover { color: #fff; }
.weme-cobalt-ui .site-footer__logo,
.weme-cobalt-ui .site-footer__heading { color: #fff; }
.weme-cobalt-ui .site-footer__tagline,
.weme-cobalt-ui .site-footer__legal,
.weme-cobalt-ui .site-footer__copy { color: #8e9fbe; }

/* Privacy policy appended to the existing terms page. */
.weme-cobalt-ui .weme-privacy-policy {
  margin-top: clamp(3rem, 7vw, 6rem);
  padding: clamp(1.5rem, 4vw, 3rem);
  border: 1px solid #dfe8f5;
  border-radius: 20px;
  background: #f7faff;
  box-shadow: 0 18px 44px rgba(4, 15, 43, .07);
}
.weme-cobalt-ui .weme-privacy-policy h2,
.weme-cobalt-ui .weme-privacy-policy h3 { color: var(--wc-ink); }
.weme-cobalt-ui .weme-privacy-policy h2 { margin-top: 0; }
.weme-cobalt-ui .weme-privacy-policy h3 { margin-top: 2rem; }
.weme-cobalt-ui .weme-privacy-policy p,
.weme-cobalt-ui .weme-privacy-policy li { color: #42516c; }
.weme-cobalt-ui .weme-privacy-policy a { color: #1767d6; }

@media (max-width: 70rem) {
  .weme-cobalt-ui .ch-home-hero__grid { grid-template-columns: 1fr; }
  .weme-cobalt-ui .ch-home-map { max-width: 760px; }
  .weme-cobalt-ui .ch-router-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 48rem) {
  .weme-cobalt-ui .weme-network-bar { display: none; }
  .weme-cobalt-ui .site-header,
  .weme-cobalt-ui .site-header__inner { min-height: 60px; }
  .weme-cobalt-ui .ch-wrap { width: calc(100% - 40px); }
  .weme-cobalt-ui .ch-home-hero { min-height: 780px; padding-block: 3.5rem 7rem; border-radius: 0 0 50% 3% / 0 0 3% 2%; }
  .weme-cobalt-ui .ch-home-hero h1,
  .weme-cobalt-ui .ch-hero h1 { font-size: clamp(3rem, 14vw, 4.5rem); }
  .weme-cobalt-ui .ch-home-map { padding: .85rem; }
  .weme-cobalt-ui .ch-home-map > a { grid-template-columns: 1fr; gap: .35rem; padding-block: .75rem; }
  .weme-cobalt-ui .ch-trust { width: calc(100% - 32px); margin-top: -36px; }
  .weme-cobalt-ui .ch-trust > .ch-wrap { width: 100%; grid-template-columns: repeat(2, 1fr); }
  .weme-cobalt-ui .ch-trust span { min-height: 68px; padding: .8rem; border-right: 1px solid #e3edf9; border-bottom: 1px solid #e3edf9; }
  .weme-cobalt-ui .ch-trust span:last-child { grid-column: 1 / -1; }
  .weme-cobalt-ui .ch-section { padding-block: 6rem; }
  .weme-cobalt-ui #need-router { padding-inline: 20px; }
  .weme-cobalt-ui .ch-heading { width: 100%; }
  .weme-cobalt-ui .ch-router-grid,
  .weme-cobalt-ui .ch-ladder,
  .weme-cobalt-ui .ch-ecosystem { width: 100%; grid-template-columns: 1fr; }
  .weme-cobalt-ui .ch-router-grid > a { min-height: 15rem; }
  .weme-cobalt-ui .ch-system-rows > a { grid-template-columns: 1fr; }
  .weme-cobalt-ui #need-router::after,
  .weme-cobalt-ui .ch-section--tint::after,
  .weme-cobalt-ui .ch-section--dark::after { bottom: -24px; height: 48px; }
  .weme-cobalt-ui .ch-actions { display: grid; }
  .weme-cobalt-ui .ch-button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .weme-cobalt-ui *,
  .weme-cobalt-ui *::before,
  .weme-cobalt-ui *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
