/* Approved JEM SportsOS signed-out homepage branding.
   Intentionally scoped to .publicShell so tenant dashboards remain untouched. */

.publicShell.jemApprovedHome{
  --jem-home-blue:#148cff;
  --jem-home-cyan:#42b8ff;
  --jem-home-line:rgba(52,154,255,.42);
  --jem-home-text:#f7fbff;
  --jem-home-muted:#b4c8db;
  position:relative;
  min-height:100vh!important;
  background:
    radial-gradient(circle at 78% 18%,rgba(22,126,236,.18),transparent 31%),
    linear-gradient(145deg,#020812 0%,#061321 48%,#020812 100%)!important;
  color:var(--jem-home-text)!important;
  overflow:hidden!important;
}

.publicShell.jemApprovedHome::before{
  content:"";
  position:absolute;
  left:-4vw;
  bottom:72px;
  width:min(760px,62vw);
  height:300px;
  opacity:.92;
  pointer-events:none;
  background:
    linear-gradient(164deg,transparent 0 26%,rgba(0,91,255,.08) 26% 32%,transparent 32% 38%,rgba(7,116,255,.7) 38% 43%,transparent 43% 49%,rgba(0,77,238,.4) 49% 54%,transparent 54%),
    repeating-linear-gradient(166deg,transparent 0 17px,rgba(20,122,255,.11) 18px 22px,transparent 23px 39px);
  transform:skewX(-13deg);
  filter:blur(.1px);
}

.publicShell.jemApprovedHome>.hero{
  position:relative!important;
  top:auto!important;
  z-index:3!important;
  padding:18px max(3vw,28px)!important;
  background:rgba(2,8,18,.88)!important;
  border:0!important;
  border-bottom:1px solid var(--jem-home-line)!important;
  backdrop-filter:blur(12px);
}

.publicShell.jemApprovedHome>.hero .brand{
  max-width:none!important;
  margin:0!important;
  display:flex!important;
  justify-content:flex-start!important;
  align-items:center!important;
  gap:14px!important;
}

.publicShell.jemApprovedHome>.hero .brand .brandLogoWrap{
  width:205px!important;
  height:105px!important;
  flex:0 0 205px!important;
  display:block!important;
}

.publicShell.jemApprovedHome>.hero .brand .headerLogo,
.publicShell.jemApprovedHome>.hero .brand .brandLogo{
  width:205px!important;
  height:105px!important;
  border-radius:0!important;
  object-fit:contain!important;
  object-position:left center!important;
  filter:drop-shadow(0 0 18px rgba(24,132,255,.22))!important;
}

.publicShell.jemApprovedHome>.hero .brand .jemHeaderText{
  display:none!important;
}

.publicShell.jemApprovedHome .jemAuthLanding{
  position:relative;
  z-index:2;
  max-width:1280px!important;
  width:100%!important;
  margin:0 auto!important;
  min-height:calc(100vh - 205px)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(360px,.72fr)!important;
  align-items:center!important;
  gap:72px!important;
  padding:54px 56px 95px!important;
}

.publicShell.jemApprovedHome .jemAuthIntro{
  display:block!important;
  position:relative;
  z-index:2;
  max-width:720px;
}

.publicShell.jemApprovedHome .jemAuthIntro .jemAuthEyebrow{
  display:none!important;
}

.publicShell.jemApprovedHome .jemAuthIntro h2{
  margin:0 0 24px!important;
  max-width:720px!important;
  font-size:clamp(48px,5.3vw,78px)!important;
  line-height:.98!important;
  letter-spacing:-.055em!important;
  font-weight:900!important;
  color:#fff!important;
  text-wrap:balance;
}

.publicShell.jemApprovedHome .jemAuthIntro h2 span{
  display:block;
  color:var(--jem-home-blue)!important;
}

.publicShell.jemApprovedHome .jemAuthIntro p{
  max-width:690px!important;
  margin:0!important;
  font-size:20px!important;
  line-height:1.62!important;
  color:var(--jem-home-muted)!important;
}

.publicShell.jemApprovedHome .jemAuthPoints{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  margin-top:28px!important;
}

.publicShell.jemApprovedHome .jemAuthPoints span{
  padding:10px 15px!important;
  border-radius:999px!important;
  border:1px solid rgba(48,146,239,.65)!important;
  background:rgba(4,20,36,.7)!important;
  color:#e8f5ff!important;
  font-size:13px!important;
  font-weight:800!important;
  box-shadow:inset 0 0 24px rgba(24,116,212,.05)!important;
}

.publicShell.jemApprovedHome .jemAuthPoints span::first-letter{
  color:var(--jem-home-blue);
}

.publicShell.jemApprovedHome .jemAuthCard{
  justify-self:end!important;
  width:min(100%,440px)!important;
  padding:38px 36px!important;
  margin:0!important;
  border-radius:26px!important;
  border:1px solid rgba(44,148,255,.62)!important;
  background:linear-gradient(155deg,rgba(7,27,46,.96),rgba(3,15,28,.98))!important;
  box-shadow:0 30px 90px rgba(0,0,0,.43),0 0 50px rgba(20,130,238,.08)!important;
}

.publicShell.jemApprovedHome .jemAuthCard .jemAuthMark{
  width:94px!important;
  height:94px!important;
  margin:0 auto 18px!important;
  object-fit:contain!important;
}

.publicShell.jemApprovedHome .jemAuthCard .jemAuthEyebrow{
  margin-bottom:13px!important;
  color:var(--jem-home-blue)!important;
  font-size:12px!important;
  letter-spacing:.19em!important;
  font-weight:900!important;
}

.publicShell.jemApprovedHome .jemAuthCard h2{
  margin:0 0 12px!important;
  font-size:27px!important;
  line-height:1.15!important;
  color:#fff!important;
}

.publicShell.jemApprovedHome .jemAuthCard p{
  max-width:320px;
  margin:0 auto 22px!important;
  color:var(--jem-home-muted)!important;
  font-size:16px!important;
  line-height:1.55!important;
}

.publicShell.jemApprovedHome .jemAuthCard .btn{
  min-height:54px!important;
  border-radius:13px!important;
  font-size:16px!important;
}

.publicShell.jemApprovedHome .jemAuthCard .btn:not(.secondary){
  background:linear-gradient(135deg,#087ef3,#24a5ff)!important;
  border:1px solid #39adff!important;
  color:#fff!important;
  box-shadow:0 12px 28px rgba(2,118,232,.24)!important;
}

.publicShell.jemApprovedHome .jemAuthCard .btn.secondary{
  background:rgba(3,16,29,.75)!important;
  border:1px solid #315472!important;
  color:#fff!important;
}

.jemHomeFooter{
  position:absolute;
  z-index:4;
  left:0;
  right:0;
  bottom:0;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding:14px 28px;
  border-top:1px solid rgba(39,139,239,.5);
  background:rgba(1,7,15,.88);
  backdrop-filter:blur(10px);
  color:#d5e5f2;
}

.jemHomeFooter img{
  width:36px;
  height:36px;
  object-fit:contain;
}

.jemHomeFooter strong{
  color:#168cff;
  font-size:17px;
}

.jemHomeFooter .jemHomeFooterTagline{
  padding-left:18px;
  border-left:1px solid rgba(175,205,230,.35);
  font-size:16px;
  letter-spacing:.02em;
}

.jemHomeFooter .jemHomeFooterTagline b{
  color:#168cff;
  padding:0 7px;
}

.jemHomeFooter .jemHomeCopyright{
  margin-left:auto;
  color:#859db1;
  font-size:12px;
}

@media(max-width:899px){
  .publicShell.jemApprovedHome{overflow:auto!important;padding-bottom:0!important}
  .publicShell.jemApprovedHome::before{width:105vw;height:220px;bottom:80px;opacity:.6}
  .publicShell.jemApprovedHome>.hero{padding:13px 18px!important}
  .publicShell.jemApprovedHome>.hero .brand .brandLogoWrap{width:150px!important;height:80px!important;flex-basis:150px!important}
  .publicShell.jemApprovedHome>.hero .brand .headerLogo,.publicShell.jemApprovedHome>.hero .brand .brandLogo{width:150px!important;height:80px!important}
  .publicShell.jemApprovedHome .jemAuthLanding{grid-template-columns:1fr!important;gap:30px!important;min-height:auto!important;padding:46px 20px 120px!important}
  .publicShell.jemApprovedHome .jemAuthIntro h2{font-size:clamp(42px,12vw,62px)!important}
  .publicShell.jemApprovedHome .jemAuthIntro p{font-size:17px!important}
  .publicShell.jemApprovedHome .jemAuthCard{justify-self:stretch!important;width:100%!important;max-width:520px!important;margin:0 auto!important;padding:30px 22px!important}
  .jemHomeFooter{position:relative;min-height:auto;flex-wrap:wrap;justify-content:flex-start;padding:16px 20px;gap:10px}
  .jemHomeFooter .jemHomeCopyright{width:100%;margin:4px 0 0;font-size:11px}
}