/* Upjet Signal Stack — additive production skin. Load after XFS default styles. */
:root {
  --upjet-canvas: #07111E;
  --upjet-surface: #0E1B2C;
  --upjet-surface-raised: #132744;
  --upjet-blue: #21B8F6;
  --upjet-violet: #7357F4;
  --upjet-lime: #B8F34B;
  --upjet-ink: #F6F9FF;
  --upjet-muted: #A9B8CC;
  --upjet-border: #263852;
}

body { font-family: Manrope, Arial, sans-serif; }
h1, h2, h3, h4, .slide-h1 { font-family: "Space Grotesk", Manrope, Arial, sans-serif; letter-spacing: -0.035em; }

.header {
  background: var(--upjet-canvas);
  border-bottom: 1px solid var(--upjet-border);
  box-shadow: none;
}
.header .logo img { width: auto; height: 32px; max-width: 220px; }
.header .nav-link, .header .link-body-emphasis, .header .login-btn { color: var(--upjet-muted) !important; }
.header .nav-link:hover, .header .nav-link:focus, .header .login-btn:hover, .header .login-btn:focus { color: var(--upjet-ink) !important; }
.header .icon-btn, .header .icon-btn.text-dark { color: var(--upjet-ink) !important; }
.header .dropdown-menu { background: var(--upjet-surface); border-color: var(--upjet-border); }
.header .dropdown-item { color: var(--upjet-muted); }
.header .dropdown-item:hover, .header .dropdown-item:focus { background: var(--upjet-surface-raised); color: var(--upjet-ink); }

.btn-primary, .btn-primary:focus { background: var(--upjet-blue); border-color: var(--upjet-blue); color: var(--upjet-canvas); box-shadow: none; }
.btn-primary:hover, .btn-primary:active, .btn-primary:focus-visible { background: var(--upjet-lime) !important; border-color: var(--upjet-lime) !important; color: var(--upjet-canvas) !important; box-shadow: 0 0 0 .2rem rgba(33, 184, 246, .22) !important; }
.btn:focus-visible, a:focus-visible { outline: 2px solid var(--upjet-lime); outline-offset: 3px; }

.slide {
  overflow: hidden;
  background: radial-gradient(circle at 79% 26%, rgba(115, 87, 244, .32), transparent 26rem), linear-gradient(135deg, #07111E 0%, #0B1930 100%);
  padding-top: 5.5rem;
  padding-bottom: 5.5rem;
}
.slide::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .26;
  background-image: linear-gradient(rgba(33, 184, 246, .12) 1px, transparent 1px), linear-gradient(90deg, rgba(33, 184, 246, .12) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(90deg, #000, transparent 78%);
}
.slide .container { position: relative; }
.slide .brand-kicker { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; color: var(--upjet-blue); font-family: "IBM Plex Mono", Consolas, monospace; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.slide .brand-kicker::before { content: ""; width: 22px; height: 1px; background: currentColor; }
.slide-h1 { max-width: 660px; font-weight: 650; line-height: 1.02; }
.slide-text { max-width: 560px; color: var(--upjet-muted); opacity: 1; }
.slide-button { background: var(--upjet-blue); color: var(--upjet-canvas); border-radius: 8px; box-shadow: 0 12px 32px rgba(33, 184, 246, .18); }
.slide-button:hover, .slide-button:focus, .slide-button:active { background: var(--upjet-lime); color: var(--upjet-canvas); }

.signal-stack-hero { width: min(440px, 82vw); min-height: 330px; position: relative; display: inline-grid; place-items: center; isolation: isolate; }
.signal-stack-hero::before, .signal-stack-hero::after { content: ""; position: absolute; z-index: -1; transform: rotate(-45deg); border: 1px solid rgba(33, 184, 246, .28); }
.signal-stack-hero::before { width: 290px; height: 290px; border-radius: 34px; background: linear-gradient(135deg, rgba(33, 184, 246, .12), rgba(115, 87, 244, .07)); box-shadow: 0 0 95px rgba(33, 184, 246, .18); }
.signal-stack-hero::after { width: 390px; height: 390px; border-radius: 50px; opacity: .48; }
.signal-stack-hero__mark { width: min(270px, 52vw); filter: drop-shadow(0 20px 30px rgba(0, 0, 0, .38)); animation: upjet-rise 4.4s ease-in-out infinite; }
.signal-stack-hero__packet { position: absolute; width: 12px; height: 12px; border-radius: 2px; background: var(--upjet-blue); opacity: .75; transform: rotate(45deg); }
.signal-stack-hero__packet--1 { left: 7%; bottom: 21%; animation: upjet-packet 3.8s linear infinite; }
.signal-stack-hero__packet--2 { left: 20%; bottom: 8%; background: var(--upjet-violet); animation: upjet-packet 4.6s .9s linear infinite; }
.signal-stack-hero__packet--3 { right: 8%; top: 18%; background: var(--upjet-lime); animation: upjet-packet 3.7s 1.6s linear infinite; }
@keyframes upjet-rise { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-11px); } }
@keyframes upjet-packet { 0% { opacity: 0; transform: translate(-20px, 22px) rotate(45deg); } 22%, 72% { opacity: .85; } 100% { opacity: 0; transform: translate(72px, -84px) rotate(45deg); } }

.counters { background: #F7FAFF; color: #526477; }
.counters .number { color: var(--upjet-canvas); font-family: "Space Grotesk", Manrope, Arial, sans-serif; }
.advantages { background: #EDF4FA; }
.advantages-item { border: 1px solid #D9E5F1; border-radius: 14px; box-shadow: 0 16px 42px -30px rgba(7, 17, 30, .32); }
.advantages-icon { border-radius: 12px; background-color: rgba(33, 184, 246, .12); color: #087EAE; }
.advantages-item:hover .advantages-icon { background-color: var(--upjet-blue); color: var(--upjet-canvas); }
.footer { background: var(--upjet-canvas); }

@media (prefers-reduced-motion: reduce) {
  .signal-stack-hero__mark, .signal-stack-hero__packet { animation: none; }
}
@media (max-width: 1199px) {
  .slide { padding-top: 4rem; padding-bottom: 4rem; }
  .signal-stack-hero { min-height: 270px; }
}
@media (max-width: 575px) {
  .header .logo img { height: 28px; }
  .slide { padding-top: 3rem; padding-bottom: 3rem; }
  .signal-stack-hero { min-height: 220px; }
  .signal-stack-hero__mark { width: 185px; }
}

/* Preserve the concurrent mobile-navigation hotfix. */
.header .icon-btn svg { color: inherit; }

/* Unified application shell: public, member, and admin share one brand.
   White task surfaces are intentional, matching the homepage feature cards. */
:root {
  --upjet-page: #F7FAFF;
  --upjet-rule: #D9E5F1;
  --upjet-copy: #526477;
  --upjet-link: #08729B;
  --upjet-hover: #5BCEFB;
  --bs-primary: #21B8F6;
  --bs-primary-rgb: 33, 184, 246;
  --bs-link-color: #08729B;
  --bs-link-color-rgb: 8, 114, 155;
  --bs-link-hover-color: #075675;
  --bs-link-hover-color-rgb: 7, 86, 117;
  --bs-body-color: #132744;
  --bs-body-color-rgb: 19, 39, 68;
  --bs-secondary-color: #526477;
  --bs-border-color: #D9E5F1;
  --bs-body-bg: #F7FAFF;
  --bs-font-sans-serif: Manrope, Arial, sans-serif;
}
body { background-color: var(--upjet-page); color: var(--upjet-surface-raised); }
.header, .navpanel, .footer { background-color: var(--upjet-canvas); color: var(--upjet-muted); }
.header .header-stats { color: var(--upjet-muted); }
.header .header-stats .text-dark { color: var(--upjet-ink) !important; }
.header .header-stats .border-end { border-color: var(--upjet-border) !important; }
.header-stats svg path[fill="#3586FF"] { fill: var(--upjet-blue); }
.header .icon-btn svg { fill: currentColor; }
.header .logo img, .navpanel .logo img, .footer .logo img {
  display: inline-block; width: auto; height: 36px; max-width: 200px; object-fit: contain;
}
.footer .logo img { height: 42px; }
.footer .logo { display: inline-block; max-width: 100%; }
.footer .nav-link { color: var(--upjet-muted); }
.footer .nav-link:hover, .footer .nav-link:focus { color: var(--upjet-ink); }
.footer-bottom { border-top: 1px solid var(--upjet-border); }

.navpanel { border-right: 1px solid var(--upjet-border); }
.navpanel .text-muted { color: var(--upjet-muted) !important; }
.navpanel-menu .nav-link { color: var(--upjet-muted); }
.navpanel-menu .nav-link:hover, .navpanel-menu .nav-link:focus-visible {
  background: var(--upjet-surface); color: var(--upjet-ink);
}
.navpanel-menu .nav-link.active {
  color: var(--upjet-blue); background: var(--upjet-surface-raised);
  box-shadow: inset 3px 0 0 var(--upjet-blue); border-radius: 8px;
}
.navpanel-menu .nav-link.active svg, .navpanel-menu .nav-link.active svg path { fill: currentColor; }
.navpanel-submenu { background: var(--upjet-surface); border-radius: 0 0 8px 8px; }
.navpanel-submenu .nav-link.text-white { color: var(--upjet-blue) !important; }
.navpanel-tabs .nav-link { color: var(--upjet-muted); border-color: var(--upjet-border); }
.navpanel-tabs .nav-link.active { color: var(--upjet-ink); background: var(--upjet-surface-raised); }
.navpanel .navpanel-close { filter: invert(1); }
.navpanel.custom-scrollbar { scrollbar-color: var(--upjet-border) var(--upjet-canvas); }
.navpanel.custom-scrollbar::-webkit-scrollbar { background-color: var(--upjet-canvas); }
.navpanel.custom-scrollbar::-webkit-scrollbar-thumb { background-color: var(--upjet-border); }

.block, .card, .modal-content {
  background-color: #FFFFFF; border-color: var(--upjet-rule); border-radius: 14px;
  box-shadow: 0 8px 24px -20px rgba(7, 17, 30, .3);
}
.block-tabs { border-color: var(--upjet-rule); }
.block-tabs .nav-link { color: var(--upjet-copy); }
.block-tabs .nav-link.active, .block-tabs .nav-link:hover {
  color: var(--upjet-link); border-color: var(--upjet-blue); background: #EDF7FD;
}
.form-control, .form-select, .input-group-text { border-color: #BDCFDF; border-radius: 8px; }
.form-control, .form-select { background-color: #FFFFFF; color: var(--upjet-surface-raised); }
.form-control:focus, .form-select:focus {
  border-color: var(--upjet-blue); box-shadow: 0 0 0 .2rem rgba(33, 184, 246, .18);
}
.form-check-input:checked { background-color: var(--upjet-link); border-color: var(--upjet-link); }
.form-switcher .form-check-input:checked { background-color: var(--upjet-link); }

/* Cyan means an action; lime is reserved for actual completion/status. */
.btn-primary, .btn-success, .btn-primary:focus, .btn-success:focus {
  --bs-btn-bg: #21B8F6; --bs-btn-border-color: #21B8F6;
  --bs-btn-color: #07111E; --bs-btn-disabled-bg: #21B8F6;
  --bs-btn-disabled-border-color: #21B8F6; --bs-btn-disabled-color: #07111E;
  background: var(--upjet-blue); border-color: var(--upjet-blue); color: var(--upjet-canvas);
  box-shadow: none; border-radius: 8px;
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus-visible,
.btn-success:hover, .btn-success:active, .btn-success:focus-visible {
  background: var(--upjet-hover) !important; border-color: var(--upjet-hover) !important;
  color: var(--upjet-canvas) !important; box-shadow: none !important;
}
.slide-button:hover, .slide-button:focus, .slide-button:active { background: var(--upjet-hover); color: var(--upjet-canvas); }
.btn:focus-visible, a:focus-visible { outline: 2px solid var(--upjet-link); outline-offset: 3px; }
.header a:focus-visible, .header .btn:focus-visible, .navpanel a:focus-visible,
.footer a:focus-visible, .slide a:focus-visible { outline-color: var(--upjet-blue); }
.btn-outline-primary { color: var(--upjet-link); border-color: var(--upjet-link); border-radius: 8px; }
.btn-outline-primary:hover, .btn-outline-primary:active, .btn-outline-primary:focus-visible {
  background: var(--upjet-blue); border-color: var(--upjet-blue); color: var(--upjet-canvas);
}
.btn-secondary { background: var(--upjet-surface-raised); border-color: var(--upjet-border); color: var(--upjet-ink); }
.btn-outline-light { border-color: #BDCFDF; color: var(--upjet-copy); }
.text-primary, .link-primary { color: var(--upjet-link) !important; }
.alert-primary, .alert-info { color: #075675; background-color: #E8F6FD; border-color: #B9E4F8; }
.bg-primary { color: var(--upjet-canvas); }
.progress { background-color: #E3ECF5; border-radius: 8px; }
.progress-bar:not(.file-error) { background-color: var(--upjet-violet); color: var(--upjet-ink); }
.table { --bs-table-bg: #FFFFFF; --bs-table-border-color: #D9E5F1; --bs-table-hover-bg: #EDF7FD; }
.table thead th { color: var(--upjet-surface-raised); background-color: #EDF4FA; }
.paging .page-link, .pagination .page-link { color: var(--upjet-link); border-color: var(--upjet-rule); }
.paging .active .page-link, .pagination .active .page-link { background: var(--upjet-blue); color: var(--upjet-canvas); }

/* Premium is the same product surface, with a restrained Lift Violet tint. */
.premiumTable, .premiumPlan { border: 1px solid var(--upjet-rule); border-radius: 14px; }
.premiumTable .col { background-color: var(--upjet-page); }
.premiumTable .col.premium { background-color: #EEEAFE; }
.premiumTable .col:first-child { background-color: #FFFFFF; color: var(--upjet-copy); }
.premiumPlan { box-shadow: 0 8px 24px -20px rgba(7, 17, 30, .3); }

/* Reuse the approved ChatGPT Image concept's exact SVG; no mockup art. */
.upjet-transfer-art { display: inline-grid; place-items: center; width: min(280px, 70vw); aspect-ratio: 1;
  border: 1px solid var(--upjet-rule); border-radius: 22px; background: #EDF4FA; }
.upjet-transfer-art img { display: block; width: 68%; height: auto; }
.signal-stack-hero__packet--3 { background: var(--upjet-blue); }
@media (max-width: 575px) {
  .header .logo img { height: 30px; max-width: 145px; }
  .navpanel .logo img { height: 36px; }
  .footer .logo img { height: 36px; max-width: 180px; }
  .navpanel { max-width: calc(100vw - 24px); }
}