/* ZOLVEX M19U — final background luminance lock.
   Background now uses the newly approved ZvX storm emblem artwork embedded directly into the site.
   
   Visual target: approved ZOLVEX HQ green/red bull-bear reference mockup.
   Functional account/education/library/community/commerce behavior is unchanged. */
:root{
  --zref-green:#38e95d;
  --zref-green-hot:#63ff7e;
  --zref-green-deep:#0d6d2d;
  --zref-red:#e43b42;
  --zref-red-hot:#ff5960;
  --zref-red-deep:#7c171d;
  --zref-steel:#cbd1d2;
  --zref-panel:rgba(5,10,9,.91);
  --zref-panel-strong:rgba(5,9,8,.96);
  --zref-line:rgba(203,215,211,.18);
  --zvx-brand-green:var(--zref-green)!important;
  --zvx-brand-green-soft:#26b948!important;
  --zvx-brand-green-bright:var(--zref-green-hot)!important;
  --zvx-brand-red:var(--zref-red)!important;
  --zvx-brand-red-soft:#ad252d!important;
  --zvx-brand-red-bright:var(--zref-red-hot)!important;
  --zvx-accent:var(--zref-green)!important;
  --zvx-shell-green:var(--zref-green)!important;
  --za-green:var(--zref-green)!important;
  --za-red:var(--zref-red)!important;
}

/* Global graphite/steel base from the reference. */
html,body{background:#010202!important;color:#edf3f1}
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(22,178,61,.028),transparent 27%,transparent 73%,rgba(210,39,47,.032)),
    linear-gradient(180deg,rgba(255,255,255,.008),transparent 18%,rgba(0,0,0,.18));
}

/* Background uses the newly approved storm emblem artwork while staying subordinate to readable content. */
#zvx-ambient-bg{
  inset:-1.5vmax!important;
  background-color:#010202!important;
  background-image:
    linear-gradient(rgba(1,3,3,.385),rgba(1,3,3,.425)),
    linear-gradient(90deg,rgba(28,201,66,.050) 0%,rgba(0,0,0,0) 39%,rgba(0,0,0,0) 57%,rgba(228,59,66,.086) 100%),
    linear-gradient(180deg,rgba(1,2,2,.12) 0%,rgba(1,2,2,.08) 42%,rgba(1,2,2,.31) 100%),
    url('/assets/hero-live/zvx-live-bg.webp')!important;
  background-size:cover!important;
  background-position:center 33%!important;
  filter:saturate(.86) brightness(.695) contrast(1.065)!important;
  opacity:1!important;
}
#zvx-ambient-bg::before{
  left:-28vw!important;top:-30vw!important;
  background:radial-gradient(circle at 50% 50%,rgba(57,255,98,.19),rgba(32,205,69,.095) 31%,rgba(15,93,39,.04) 54%,transparent 75%)!important;
  opacity:.425!important;
}
#zvx-ambient-bg::after{
  right:-30vw!important;bottom:-34vw!important;
  background:radial-gradient(circle at 50% 50%,rgba(255,74,82,.18),rgba(211,43,50,.095) 31%,rgba(112,20,26,.04) 54%,transparent 75%)!important;
  opacity:.435!important;
}
.zvx-ambient-grid{opacity:.045!important}
.zvx-ambient-vignette{
  background:
    radial-gradient(ellipse at 50% 38%,rgba(214,222,220,.020) 0%,rgba(214,222,220,.010) 20%,rgba(0,0,0,.030) 48%,rgba(0,0,0,.18) 74%,rgba(0,0,0,.40) 100%),
    linear-gradient(90deg,rgba(0,0,0,.19) 0%,rgba(0,0,0,.05) 26%,transparent 52%,rgba(228,59,66,.024) 78%,rgba(228,59,66,.034) 100%),
    linear-gradient(180deg,rgba(0,0,0,.015),rgba(0,0,0,.165))!important;
}

/* HEADER — match the mockup: logo mark + steel wordmark + green HQ, gradient light rail. */
#zvx-global-header{
  background:rgba(2,5,4,.955)!important;
  border-bottom:1px solid rgba(176,191,187,.17)!important;
  box-shadow:0 13px 38px rgba(0,0,0,.30)!important;
  backdrop-filter:blur(15px) saturate(.72)!important;
  -webkit-backdrop-filter:blur(15px) saturate(.72)!important;
}
#zvx-global-header::after{
  height:2px!important;
  background:linear-gradient(90deg,var(--zref-green) 0%,rgba(56,233,93,.68) 22%,rgba(255,255,255,.055) 48%,rgba(255,255,255,.055) 52%,rgba(228,59,66,.68) 78%,var(--zref-red) 100%)!important;
  opacity:.68!important;
  box-shadow:-10px 0 15px rgba(56,233,93,.15),10px 0 15px rgba(228,59,66,.13)!important;
}
.zvx-shell-bar{min-height:72px!important;padding-inline:20px!important}
.zvx-shell-brand{
  display:inline-flex!important;align-items:center!important;gap:10px!important;
  color:#e7eceb!important;font-family:'Rajdhani',sans-serif!important;font-weight:700!important;
  font-size:1.24rem!important;letter-spacing:.11em!important;text-shadow:none!important;
}
.zvx-shell-brand-mark{
  display:block;flex:0 0 auto;width:38px;height:38px;
  background:url('/assets/zvx-ai-mark.webp') center/contain no-repeat;
  filter:saturate(1.08) contrast(1.05) drop-shadow(0 0 9px rgba(56,233,93,.07));
}
.zvx-shell-brand-word{color:#e7eceb!important;white-space:nowrap}
.zvx-shell-brand-word b{color:var(--zref-green)!important;font-weight:700;text-shadow:0 0 11px rgba(56,233,93,.16)}
.zvx-shell-brand>span:not(.zvx-shell-brand-mark):not(.zvx-shell-brand-word){color:inherit!important}

.zvx-shell-account,.zvx-shell-account-persistent,.zvx-shell-language>summary,.zvx-shell-mobile-language>summary,.zvx-shell-menu-toggle,.zvx-shell-watch{
  border:1px solid rgba(184,198,194,.22)!important;
  background:linear-gradient(120deg,rgba(56,233,93,.018),rgba(5,8,8,.93) 52%,rgba(228,59,66,.018))!important;
  color:#dce4e1!important;
  box-shadow:inset 1px 0 0 rgba(56,233,93,.19),inset -1px 0 0 rgba(228,59,66,.17)!important;
}
.zvx-shell-account:hover,.zvx-shell-account.is-current,.zvx-shell-account-persistent:hover,.zvx-shell-account-persistent.is-current,
.zvx-shell-language>summary:hover,.zvx-shell-mobile-language>summary:hover,.zvx-shell-menu-toggle:hover,.zvx-shell-watch:hover{
  border-color:rgba(222,230,227,.34)!important;
  background:linear-gradient(110deg,rgba(56,233,93,.060),rgba(7,10,10,.96) 52%,rgba(228,59,66,.052))!important;
}
.zvx-shell-account.is-current,.zvx-shell-account-persistent.is-current{box-shadow:inset 0 -2px 0 var(--zref-green),inset 1px 0 0 rgba(56,233,93,.22),inset -1px 0 0 rgba(228,59,66,.18)!important}
.zvx-shell-link.is-current{border-bottom-color:var(--zref-green)!important;background:linear-gradient(180deg,rgba(56,233,93,.05),rgba(228,59,66,.01),transparent)!important}
.zvx-shell-dropdown-panel{background:#050807!important;border-color:rgba(191,204,200,.18)!important;box-shadow:0 20px 58px rgba(0,0,0,.48),inset 1px 0 0 rgba(56,233,93,.11),inset -1px 0 0 rgba(228,59,66,.09)!important}

/* Reference-style account/member tab bar. */
.za-account-nav{
  position:relative!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;margin-top:24px!important;
  border:1px solid transparent!important;
  border-image:linear-gradient(90deg,rgba(56,233,93,.72),rgba(181,195,191,.21) 45%,rgba(181,195,191,.21) 55%,rgba(228,59,66,.72)) 1!important;
  background:rgba(4,8,7,.93)!important;
  box-shadow:0 16px 44px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.018)!important;
}
.za-account-nav a{
  min-height:52px!important;display:flex!important;align-items:center!important;justify-content:center!important;
  padding:0 15px!important;background:rgba(7,12,10,.91)!important;border-right:1px solid rgba(191,204,200,.12)!important;
  color:#b8c3c0!important;font:600 .68rem/1 'Share Tech Mono',monospace!important;letter-spacing:.07em!important;
  box-shadow:none!important;
}
.za-account-nav a:last-child{border-right:0!important}
.za-account-nav a:hover{background:linear-gradient(90deg,rgba(56,233,93,.028),rgba(9,14,12,.96),rgba(228,59,66,.020))!important;color:#edf4f1!important}
.za-account-nav a.is-current{
  position:relative;background:linear-gradient(180deg,rgba(24,55,34,.58),rgba(7,13,11,.96))!important;color:#f0f7f4!important;
  box-shadow:inset 0 -3px 0 var(--zref-green),0 6px 24px rgba(56,233,93,.05)!important;
}
.za-account-nav a.is-current::after{content:"";position:absolute;left:18%;right:18%;bottom:-1px;height:2px;background:var(--zref-green);box-shadow:0 0 12px rgba(56,233,93,.55)}

/* Shared panel language: graphite glass, steel hairline, green left light / red right light. */
.za-hero-main,.za-hero-side,.za-panel,.za-card,.za-guest-intro,.za-module,.za-library-item,.za-billing-box,.za-lesson,
.za-member-head,.za-plan-card,.za-membership-state,.za-community-access-card,.za-auth-note,.za-clerk-wrap,
.z2-path,.z2-detail,.z2-market,.z2-flow-step,.z2-stream-card,.z2-teaser,.m13-home-card,.m13-stream-card{
  border:1px solid transparent!important;
  border-image:linear-gradient(90deg,rgba(56,233,93,.68),rgba(181,195,191,.17) 38%,rgba(181,195,191,.17) 62%,rgba(228,59,66,.66)) 1!important;
  background:
    linear-gradient(112deg,rgba(56,233,93,.030),transparent 31%,transparent 68%,rgba(228,59,66,.027)),
    linear-gradient(180deg,rgba(8,14,12,.91),rgba(4,8,7,.955))!important;
  box-shadow:inset 1px 0 0 rgba(56,233,93,.12),inset -1px 0 0 rgba(228,59,66,.11),0 20px 58px rgba(0,0,0,.24)!important;
  backdrop-filter:blur(5px) saturate(.74)!important;
  -webkit-backdrop-filter:blur(5px) saturate(.74)!important;
}

/* Hero / intro surface follows the mockup more closely. */
.za-shell{max-width:1460px!important;padding-inline:20px!important}
.za-guest-intro{
  position:relative!important;overflow:hidden!important;grid-template-columns:minmax(0,1.4fr) minmax(360px,.6fr)!important;
  gap:34px!important;padding:32px 32px!important;min-height:210px!important;align-items:center!important;
}
.za-guest-intro::before,.za-hero-main::before,.za-card::after,.za-module::after,.za-library-item::after{
  content:"";position:absolute;pointer-events:none;inset:0;
  background:
    linear-gradient(90deg,var(--zref-green),transparent 70%) top left/28% 1px no-repeat,
    linear-gradient(180deg,var(--zref-green),transparent 70%) top left/1px 38% no-repeat,
    linear-gradient(270deg,var(--zref-red),transparent 70%) top right/28% 1px no-repeat,
    linear-gradient(0deg,var(--zref-red),transparent 70%) bottom right/1px 38% no-repeat;
  opacity:.65;
}
.za-hero-main,.za-card,.za-module,.za-library-item{position:relative!important;overflow:hidden!important}
.za-eyebrow,.z2-kicker,.za-module-code{color:var(--zref-green)!important;text-shadow:0 0 10px rgba(56,233,93,.10)}
.za-h1,.za-h2,.za-h3,.za-module h3{color:#eef4f2!important;text-shadow:0 1px 0 rgba(255,255,255,.025)}
.za-guest-intro .za-h2{font-size:clamp(1.7rem,2.25vw,2.55rem)!important;line-height:1.02!important;letter-spacing:.015em!important;text-transform:uppercase!important;max-width:780px!important}
.za-lead,.za-copy,.za-module p{color:#bdc7c4!important}

.za-guest-stats{
  border:1px solid transparent!important;
  border-image:linear-gradient(90deg,var(--zref-green),rgba(188,201,197,.20) 50%,var(--zref-red)) 1!important;
  background:rgba(7,12,10,.88)!important;box-shadow:inset 1px 0 0 rgba(56,233,93,.16),inset -1px 0 0 rgba(228,59,66,.15)!important;
}
.za-guest-stat{background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.005))!important;border-right-color:rgba(190,202,198,.11)!important}
.za-guest-stat:first-child{box-shadow:inset 0 -2px 0 rgba(56,233,93,.82)}
.za-guest-stat:last-child{box-shadow:inset 0 -2px 0 rgba(228,59,66,.82)}
.za-guest-stat strong{color:#eff5f3!important}

/* Curriculum cards — black glass with unmistakable bull-left / bear-right edge light. */
.za-guest-modules,.za-library-preview,.za-library-member-grid{gap:16px!important}
.za-module,.za-library-item,.za-card{
  min-height:250px;
  border-image:linear-gradient(135deg,rgba(56,233,93,.82),rgba(181,195,191,.16) 42%,rgba(181,195,191,.11) 62%,rgba(228,59,66,.80)) 1!important;
  background:
    radial-gradient(circle at 0% 0%,rgba(56,233,93,.07),transparent 25%),
    radial-gradient(circle at 100% 100%,rgba(228,59,66,.055),transparent 26%),
    linear-gradient(180deg,rgba(7,13,11,.94),rgba(3,7,6,.975))!important;
}
.za-module{padding:24px!important}
.za-module:hover,.za-library-item:hover,.za-card:hover{
  border-image:linear-gradient(135deg,var(--zref-green),rgba(191,204,200,.24) 44%,rgba(191,204,200,.20) 58%,var(--zref-red)) 1!important;
  box-shadow:inset 1px 0 0 rgba(56,233,93,.20),inset -1px 0 0 rgba(228,59,66,.18),0 22px 58px rgba(0,0,0,.29),-5px 0 20px rgba(56,233,93,.035),5px 0 20px rgba(228,59,66,.033)!important;
}
.za-module-code{font-size:.64rem!important}.za-module-lock,.za-preview-lock{color:#a9b4b1!important}.za-module-time{color:#9aa7a3!important}
.za-module-foot{padding-top:16px!important;border-top:1px solid rgba(188,200,196,.09)!important}

/* Primary actions resemble the example's illuminated green controls, with a restrained red far edge. */
.za-btn,.z2-btn.primary,.z2-btn.is-primary,.zvx-card-route,.m13-compare-btn{
  border:1px solid transparent!important;
  border-image:linear-gradient(90deg,var(--zref-green),rgba(181,195,191,.20) 72%,rgba(228,59,66,.58)) 1!important;
  background:linear-gradient(100deg,rgba(56,233,93,.075),rgba(7,12,10,.96) 66%,rgba(228,59,66,.035))!important;
  color:#d9fbe0!important;
  box-shadow:inset 1px 0 0 rgba(56,233,93,.20),inset -1px 0 0 rgba(228,59,66,.13)!important;
}
.za-btn:hover,.z2-btn.primary:hover,.z2-btn.is-primary:hover,.zvx-card-route:hover,.m13-compare-btn:hover{
  background:linear-gradient(100deg,rgba(56,233,93,.14),rgba(8,14,11,.97) 64%,rgba(228,59,66,.07))!important;
}

/* AI launcher mirrors the locked green/bear-red brand treatment. */
.zvx-ai-launch{
  border:1px solid transparent!important;
  border-image:linear-gradient(90deg,var(--zref-green),rgba(187,199,195,.24) 52%,var(--zref-red)) 1!important;
  background:linear-gradient(102deg,rgba(56,233,93,.082),rgba(4,9,7,.975) 52%,rgba(228,59,66,.070))!important;
  box-shadow:-7px 0 24px rgba(56,233,93,.065),7px 0 24px rgba(228,59,66,.060),0 18px 48px rgba(0,0,0,.40),inset 1px 0 0 rgba(56,233,93,.28),inset -1px 0 0 rgba(228,59,66,.24),inset 0 1px 0 rgba(215,224,221,.055)!important;
  backdrop-filter:blur(9px) saturate(.95);
  -webkit-backdrop-filter:blur(9px) saturate(.95);
}
.zvx-ai-launch:hover{
  background:linear-gradient(102deg,rgba(56,233,93,.125),rgba(5,11,9,.985) 52%,rgba(228,59,66,.105))!important;
  box-shadow:-8px 0 28px rgba(56,233,93,.095),8px 0 28px rgba(228,59,66,.085),0 20px 52px rgba(0,0,0,.42),inset 1px 0 0 rgba(56,233,93,.34),inset -1px 0 0 rgba(228,59,66,.30)!important;
}
.zvx-ai-launch .zvx-ai-dot{filter:saturate(1.08) contrast(1.05) drop-shadow(-2px 0 5px rgba(56,233,93,.13)) drop-shadow(2px 0 5px rgba(228,59,66,.12))!important}
.zvx-ai-panel{
  border-color:transparent!important;border-image:linear-gradient(90deg,var(--zref-green),rgba(190,202,198,.20) 50%,var(--zref-red)) 1!important;
  background:linear-gradient(140deg,rgba(8,16,12,.98),rgba(3,7,6,.99) 58%,rgba(22,7,8,.98))!important;
}


/* HOME hero lock — preserve M17 geometry while letting both brand halves read through the right card. */
@media (min-width:1280px){
  body[data-zvx-area="home"] .z2-hero-side{
    border:1px solid transparent!important;
    border-image:linear-gradient(135deg,rgba(56,233,93,.52),rgba(190,202,198,.18) 52%,rgba(228,59,66,.48)) 1!important;
    background:linear-gradient(125deg,rgba(5,13,9,.89),rgba(5,9,8,.91) 58%,rgba(24,7,9,.85))!important;
    box-shadow:-7px 0 30px rgba(56,233,93,.035),7px 0 30px rgba(228,59,66,.030),0 22px 70px rgba(0,0,0,.24)!important;
    backdrop-filter:blur(5px) saturate(.94);
    -webkit-backdrop-filter:blur(5px) saturate(.94);
  }
}

/* Public-site surfaces get the same design language instead of retaining a separate teal style. */
.z2-page{background:linear-gradient(180deg,rgba(2,4,3,.08),rgba(2,4,3,.27))!important}
.z2-path,.z2-detail,.z2-market,.z2-flow-step,.z2-stream-card,.z2-teaser,.m13-home-card,.m13-stream-card{
  border-image:linear-gradient(105deg,rgba(56,233,93,.56),rgba(180,194,190,.14) 48%,rgba(228,59,66,.51)) 1!important;
}

/* Footer remains dark and premium, with the same split light rail. */
#zvx-global-footer{
  background:rgba(2,5,4,.97)!important;border-top:1px solid transparent!important;
  border-image:linear-gradient(90deg,rgba(56,233,93,.42),rgba(177,190,186,.11) 50%,rgba(228,59,66,.42)) 1!important;
}
.zvx-footer-brand{color:#eef3f2!important}.zvx-footer-title{color:#cfd7d5!important}
.zvx-footer-group a:hover{color:#f1f6f4!important;text-shadow:-4px 0 10px rgba(56,233,93,.06),4px 0 10px rgba(228,59,66,.05)}

/* Responsive parity: keep account permanently visible and do not let the member tabs create a dead second row. */
@media(max-width:1180px){
  .zvx-shell-brand-mark{width:31px;height:31px}.zvx-shell-brand{font-size:1.02rem!important;gap:8px!important}
  .za-guest-intro{grid-template-columns:1fr!important}
}
@media(max-width:980px){
  .za-account-nav{grid-template-columns:repeat(5,minmax(142px,1fr))!important;overflow-x:auto!important}
}
@media(max-width:700px){
  .zvx-shell-brand-word{display:none}.zvx-shell-brand-mark{width:34px;height:34px}
  .za-shell{padding-inline:12px!important}.za-guest-intro{padding:24px 20px!important}.za-module{min-height:220px}
}
@media(max-width:430px){
  .zvx-shell-brand-mark{width:30px;height:30px}.zvx-shell-brand{gap:0!important}
}
@media(prefers-reduced-motion:reduce){
  #zvx-ambient-bg{animation:none!important}.za-module,.za-card,.za-library-item{transition:none!important}
}


/* M19U — FINAL VISIBILITY MICRO-POLISH / THEME LOCK
   No palette or saturation change. Only localized luminance and transparency tuning
   based on real 16:9 Preview QA: center +5%, bull/left +3%, lower landscape +2–3%. */
.zvx-ambient-vignette{
  background:
    radial-gradient(ellipse at 50% 35%,rgba(218,226,223,.050) 0%,rgba(218,226,223,.024) 20%,rgba(218,226,223,.008) 36%,transparent 52%),
    radial-gradient(ellipse at 24% 53%,rgba(98,145,111,.026) 0%,rgba(62,110,76,.012) 30%,transparent 56%),
    radial-gradient(ellipse at 50% 88%,rgba(210,218,215,.022) 0%,rgba(180,191,187,.008) 36%,transparent 62%),
    radial-gradient(ellipse at 50% 38%,rgba(214,222,220,.020) 0%,rgba(214,222,220,.010) 20%,rgba(0,0,0,.025) 48%,rgba(0,0,0,.17) 74%,rgba(0,0,0,.39) 100%),
    linear-gradient(90deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,.045) 26%,transparent 52%,rgba(228,59,66,.022) 78%,rgba(228,59,66,.032) 100%),
    linear-gradient(180deg,rgba(0,0,0,.012),rgba(0,0,0,.145))!important;
}

@media (min-width:1280px){
  body[data-zvx-area="home"] .zvx-live-hero-shade{
    background:
      linear-gradient(90deg,
        rgba(6,7,7,.66) 0%,
        rgba(5,9,6,.52) 18%,
        rgba(3,10,5,.28) 31%,
        rgba(3,6,5,.075) 44%,
        rgba(3,5,5,.025) 55%,
        rgba(8,4,4,.085) 65%,
        rgba(12,4,4,.26) 78%,
        rgba(10,4,4,.43) 100%),
      linear-gradient(180deg,rgba(3,4,5,.08),rgba(3,4,5,.025) 42%,rgba(3,4,5,.16))!important;
  }
  body[data-zvx-area="home"] .z2-hero-side{
    background:linear-gradient(125deg,rgba(5,13,9,.86),rgba(5,9,8,.88) 58%,rgba(24,7,9,.82))!important;
  }
}