
/* Coach Neon Blue v2 */
:root{
  --bg:#070b14;
  --panel:rgba(12,18,34,.78);
  --panel2:rgba(10,16,30,.65);
  --stroke:rgba(106,227,255,.22);
  --stroke2:rgba(106,227,255,.34);
  --text:#eaf6ff;
  --muted:#b7d7e5;
  --neon:#6AE3FF;
  --neon2:#3FB9FF;
  --violet:#A78BFA;
  --pink:#FF5BD6;
  --ice:#BFEFFF;
  --danger:#ff4d6d;
  --radius:18px;
  --shadow: 0 18px 60px rgba(0,0,0,.55);
  --shadow2: 0 10px 30px rgba(0,0,0,.35);
}
body.coach-page{
  /* Keep the content crisp; render the blurred cinematic background via pseudo layers */
  position: relative;
  background: var(--bg);
  color:var(--text);
}

/* --- Cinematic matte background (very subtle blur) --- */
body.coach-page::before{
  content:"";
  position: fixed;
  inset: -14px;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(1200px 600px at 15% 10%, rgba(106,227,255,.10), transparent 55%),
    radial-gradient(900px 500px at 80% 20%, rgba(63,185,255,.10), transparent 55%),
    url("../images/coach-wall-bloodseeker.webp") center/cover no-repeat;
  transform:
    translate3d(var(--bgParallaxMX, 0px), calc(var(--bgParallaxY, 0px) + var(--bgParallaxMY, 0px)), 0)
    scale(1.04);
  filter: blur(2px) contrast(1.08) brightness(1.02) saturate(1.05);
}

body.coach-page::after{
  content:"";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(rgba(7,11,20,.70), rgba(7,11,20,.88)),
    radial-gradient(1200px 520px at 50% 50%, rgba(0,0,0,0) 52%, rgba(0,0,0,.55) 100%);
}
.coach-wrap{max-width:1180px;margin:0 auto;padding:0 18px;}
.coach-hero{
  position:relative; overflow:hidden; border-radius:26px;
  margin:22px auto 18px;
  min-height: 420px;
  box-shadow: var(--shadow);
  border:1px solid rgba(106,227,255,.16);
}
.coach-hero::before{
  content:""; position:absolute; inset:0;
  /* Hero uses the clean/previous cinematic gradient (no image) */
  background:
    radial-gradient(1100px 460px at 70% -10%, rgba(120,200,255,.18), transparent 62%),
    radial-gradient(900px 420px at 18% 30%, rgba(106,227,255,.12), transparent 60%),
    linear-gradient(180deg, rgba(6,10,18,.76), rgba(6,10,18,.92));
  filter: blur(1px);
}
.coach-hero::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(900px 420px at 28% 30%, rgba(106,227,255,.22), transparent 60%),
    radial-gradient(820px 420px at 72% 30%, rgba(167,139,250,.16), transparent 62%),
    radial-gradient(700px 360px at 78% 70%, rgba(255,91,214,.10), transparent 60%),
    linear-gradient(90deg, rgba(6,10,18,.88) 0%, rgba(6,10,18,.62) 45%, rgba(6,10,18,.85) 100%),
    radial-gradient(1200px 520px at 50% 50%, rgba(0,0,0,0) 50%, rgba(0,0,0,.55) 100%),
    linear-gradient(180deg, rgba(6,10,18,.28) 0%, rgba(6,10,18,.82) 100%);
}
.hero-content{
  position:relative; z-index:2;
  padding:42px 34px 30px;
  display:grid; gap:16px;
  max-width: 640px;
}
.hero-kicker{
  display:inline-flex; align-items:center; gap:10px;
  color:var(--muted); font-weight:700; letter-spacing:.2px;
}
.hero-kicker .dot{
  width:10px;height:10px;border-radius:50%;
  background: var(--neon);
  box-shadow: 0 0 16px rgba(106,227,255,.9);
}
.hero-title{
  font-size: clamp(30px, 3.5vw, 44px);
  line-height:1.15;
  margin:0;
}

/* --- Subtle glitch (hover + occasional) --- */
.hero-title.glitch{position:relative;}
.hero-title.glitch::before,
.hero-title.glitch::after{
  content: attr(data-text);
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  transform: translate3d(0,0,0);
}
.hero-title.glitch::before{color: rgba(106,227,255,.85); mix-blend-mode: screen;}
.hero-title.glitch::after{color: rgba(255,91,214,.55); mix-blend-mode: screen;}

@keyframes glitchSlice{
  0%{clip-path: inset(0 0 88% 0); transform: translate3d(0,0,0); opacity:.0}
  8%{clip-path: inset(12% 0 64% 0); transform: translate3d(1px,-1px,0); opacity:.55}
  16%{clip-path: inset(42% 0 44% 0); transform: translate3d(-1px,1px,0); opacity:.40}
  24%{clip-path: inset(72% 0 18% 0); transform: translate3d(2px,0,0); opacity:.35}
  32%{clip-path: inset(0 0 88% 0); transform: translate3d(0,0,0); opacity:0}
  100%{clip-path: inset(0 0 88% 0); opacity:0}
}
@keyframes glitchFloat{0%,100%{transform:translate3d(0,0,0)} 50%{transform:translate3d(0,-1px,0)}}

.hero-title.glitch:hover::before,
.hero-title.glitch:hover::after{
  opacity:1;
  animation: glitchSlice .75s ease-in-out 1;
}
.hero-title.glitch{animation: glitchFloat 7.5s ease-in-out infinite;}

@media (prefers-reduced-motion: reduce){
  .hero-title.glitch{animation:none}
  .hero-title.glitch::before,
  .hero-title.glitch::after{display:none}
}
.hero-title span{
  color:var(--neon);
  text-shadow: 0 0 28px rgba(106,227,255,.25);
}
.hero-sub{
  margin:0;
  color: rgba(234,246,255,.85);
  font-size: 15.5px;
  line-height:1.85;
}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px;}
.btn-neon{
  appearance:none; border:1px solid rgba(106,227,255,.35);
  background: linear-gradient(135deg, rgba(106,227,255,.22), rgba(63,185,255,.10));
  color:var(--text);
  padding:12px 16px;border-radius:14px;
  font-weight:800; cursor:pointer;
  box-shadow: 0 10px 26px rgba(106,227,255,.10);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.btn-neon:hover{transform: translateY(-1px); border-color: rgba(106,227,255,.6); box-shadow: 0 14px 40px rgba(106,227,255,.16);}
.btn-ghost{
  appearance:none; border:1px solid rgba(255,255,255,.10);
  background: rgba(10,16,30,.35);
  color: rgba(234,246,255,.92);
  padding:12px 16px;border-radius:14px;
  font-weight:800; cursor:pointer;
  transition: transform .18s ease, border-color .18s ease;
}
.btn-ghost:hover{transform: translateY(-1px); border-color: rgba(106,227,255,.25);}
.trust-row{
  display:flex; gap:10px; flex-wrap:wrap; margin-top:8px;
}
.trust-pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 10px; border-radius:999px;
  background: rgba(10,16,30,.45);
  border: 1px solid rgba(106,227,255,.14);
  color: rgba(234,246,255,.86);
  font-weight:700; font-size: 12.5px;
}
.trust-pill i{color: var(--neon);}
.section{
  margin:18px auto;
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(12,18,34,.80), rgba(10,16,30,.62));
  border: 1px solid rgba(106,227,255,.14);
  box-shadow: var(--shadow2);
  padding: 18px;
}
.section-title{
  margin:0 0 12px;
  font-size: 18px;
  letter-spacing:.2px;
  display:flex; align-items:center; gap:10px;
}
.section-title .line{
  height:2px; width:42px;
  background: linear-gradient(90deg, var(--neon), transparent);
  box-shadow: 0 0 22px rgba(106,227,255,.25);
}
.grid-3{display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:12px;}
@media (max-width: 980px){ .grid-3{grid-template-columns:1fr;} .coach-hero{min-height: 380px;} .hero-content{max-width: unset;} }
.feature-card{
  border-radius:16px;
  background: rgba(8,12,22,.45);
  border: 1px solid rgba(106,227,255,.14);
  padding:14px;
  position:relative;
  overflow:hidden;
}
.feature-card::after{
  content:""; position:absolute; inset:-30px;
  background: radial-gradient(280px 120px at 20% 0%, rgba(106,227,255,.16), transparent 60%);
  pointer-events:none;
}
.feature-card h4{margin:0 0 6px; font-size: 15px;}
.feature-card p{margin:0; color: rgba(234,246,255,.78); font-size: 13.5px; line-height: 1.75;}
/* Form layout */
.form-layout{
  display:grid;
  grid-template-columns: 1.4fr .9fr;
  gap:14px;
}
@media (max-width: 980px){ .form-layout{grid-template-columns:1fr;} }
.panel{
  border-radius: 18px;
  background: rgba(8,12,22,.48);
  border: 1px solid rgba(106,227,255,.14);
  padding: 16px;
  overflow:hidden;
}
.panel h3{margin:0 0 12px; font-size: 16px;}
.field{margin-bottom: 14px;}
.label{display:flex;justify-content:space-between;align-items:center; gap:10px; color: rgba(234,246,255,.88); font-weight:800; font-size: 13px;}
.hint{color: rgba(183,215,229,.72); font-size: 12px; font-weight:600;}
.input, .textarea, .select{
  width:100%;
  padding:12px 12px;
  margin-top:8px;
  border-radius: 14px;
  border: 1px solid rgba(106,227,255,.18);
  background: rgba(7,11,20,.55);
  color: var(--text);
  outline: none;
}
.input:focus,.textarea:focus,.select:focus{border-color: rgba(106,227,255,.55); box-shadow: 0 0 0 4px rgba(106,227,255,.10);}
.textarea{min-height: 120px; resize: vertical;}
/* Position cards */
.choice-grid{display:grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap:10px; margin-top:10px;}
@media (max-width: 980px){ .choice-grid{grid-template-columns: repeat(2, minmax(0,1fr));} }
.choice{
  border-radius: 16px;
  padding: 12px;
  border: 1px solid rgba(106,227,255,.14);
  background: rgba(10,16,30,.35);
  cursor:pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
  position:relative;
}
.choice:hover{transform: translateY(-1px); border-color: rgba(106,227,255,.35); box-shadow: 0 12px 26px rgba(0,0,0,.25);}
.choice.active{border-color: rgba(106,227,255,.65); box-shadow: 0 0 0 4px rgba(106,227,255,.10), 0 14px 34px rgba(0,0,0,.28);}
.choice .t{font-weight:900;}
.choice .s{color: rgba(234,246,255,.72); font-size:12px; margin-top:4px;}
/* Sessions */
.sessions{display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:10px; margin-top:10px;}
@media (max-width: 980px){ .sessions{grid-template-columns: repeat(2, minmax(0,1fr));} }
.session{
  border-radius: 16px;
  padding: 12px;
  border: 1px solid rgba(106,227,255,.14);
  background: rgba(10,16,30,.35);
  cursor:pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.session:hover{transform: translateY(-1px); border-color: rgba(106,227,255,.35);}
.session.active{border-color: rgba(106,227,255,.65); box-shadow: 0 0 0 4px rgba(106,227,255,.10);}
.session .price{color: var(--neon); font-weight:900; margin-top:6px; font-size: 13px;}
/* Rank section with background */
.rank-wrap{
  border-radius: 18px;
  border: 1px solid rgba(106,227,255,.14);
  overflow:hidden;
  background: rgba(10,16,30,.35);
  position:relative;
}
.rank-wrap::before{
  content:""; position:absolute; inset:0;
  background: url("../images/coach-ranks-bg.webp") center/cover no-repeat;
  filter: saturate(1.02) contrast(1.02);
  transform: scale(1.02);
}
.rank-wrap::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(6,10,18,.92) 0%, rgba(6,10,18,.72) 55%, rgba(6,10,18,.90) 100%),
              radial-gradient(900px 420px at 30% 30%, rgba(106,227,255,.12), transparent 60%);
}
.rank-inner{position:relative; z-index:2; padding: 14px;}
.rank-grid{
  display:grid;
  grid-template-columns: repeat(8, minmax(0,1fr));
  gap:10px;
  margin-top:10px;
}
@media (max-width: 980px){ .rank-grid{grid-template-columns: repeat(4, minmax(0,1fr));} }
.rank-card{
  border-radius: 16px;
  padding:10px 8px;
  text-align:center;
  border: 1px solid rgba(106,227,255,.16);
  background: rgba(8,12,22,.45);
  cursor:pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.rank-card:hover{transform: translateY(-1px); border-color: rgba(106,227,255,.38);}
.rank-card.active{border-color: rgba(106,227,255,.75); box-shadow: 0 0 0 4px rgba(106,227,255,.10), 0 16px 40px rgba(0,0,0,.35);}
.rank-card[data-r="Divine"].active,
.rank-card[data-r="Immortal"].active{
  border-color: rgba(255,215,0,.85);
  box-shadow: 0 0 0 4px rgba(255,215,0,.12), 0 16px 46px rgba(0,0,0,.40), 0 0 34px rgba(255,215,0,.25);
  background: linear-gradient(135deg, rgba(255,215,0,.12), rgba(8,12,22,.45));
}

/* Burst animation on Divine/Immortal pick */
.rank-card.rank-burst{position:relative; overflow:hidden;}
.rank-card.rank-burst::after{
  content:""; position:absolute; inset:-80px;
  background:
    radial-gradient(200px 200px at 50% 50%, rgba(255,215,0,.35), transparent 60%),
    radial-gradient(260px 160px at 30% 30%, rgba(106,227,255,.22), transparent 65%),
    radial-gradient(260px 160px at 70% 70%, rgba(255,91,214,.12), transparent 65%);
  opacity:0;
  animation: rankBurst 1.1s ease-out 1;
  pointer-events:none;
}
@keyframes rankBurst{
  0%{transform:scale(.85) rotate(-2deg); opacity:0}
  20%{opacity:.85}
  100%{transform:scale(1.18) rotate(1deg); opacity:0}
}

/* Page theme tweaks */
body.coach-page.rank-divine .total .amt,
body.coach-page.rank-immortal .total .amt{
  color: rgba(255,215,0,.92);
  text-shadow: 0 0 18px rgba(255,215,0,.22);
}
body.coach-page.rank-immortal .btn-neon{
  border-color: rgba(255,215,0,.40);
  background: linear-gradient(135deg, rgba(255,215,0,.22), rgba(106,227,255,.10));
}
.rank-card img{width:54px;height:54px; object-fit:contain; filter: drop-shadow(0 10px 18px rgba(0,0,0,.35));}
.rank-card .n{margin-top:6px; font-size:11.5px; color: rgba(234,246,255,.82); font-weight:800;}
/* Summary */
.summary{
  position: sticky; top: 14px;
}
.summary-row{display:flex; justify-content:space-between; align-items:center; margin:10px 0; color: rgba(234,246,255,.86); font-weight:800;}
.summary-row span{color: rgba(183,215,229,.82); font-weight:700;}
.total{
  margin-top:12px; padding-top:12px;
  border-top: 1px solid rgba(106,227,255,.14);
  display:flex; justify-content:space-between; align-items:center;
  font-weight:900;
}
.total .amt{color: var(--neon); font-size: 18px; text-shadow: 0 0 18px rgba(106,227,255,.20);}
.submit{
  width:100%; margin-top: 12px;
}
.small-note{margin-top:10px; color: rgba(183,215,229,.78); font-size: 12px; line-height: 1.7;}
/* Subtle particles (very light) */
.particles{
  position:absolute; inset:0; pointer-events:none; opacity:.45; mix-blend-mode: screen;
  background-image:
    radial-gradient(2px 2px at 20% 30%, rgba(106,227,255,.55), transparent 55%),
    radial-gradient(2px 2px at 70% 40%, rgba(63,185,255,.50), transparent 55%),
    radial-gradient(2px 2px at 40% 70%, rgba(106,227,255,.40), transparent 55%),
    radial-gradient(1px 1px at 85% 65%, rgba(234,246,255,.28), transparent 55%);
  background-size: 100% 100%;
}


/* v3 polish */
@keyframes floatGlow { 0%{transform:translateY(0)} 50%{transform:translateY(-2px)} 100%{transform:translateY(0)} }
@keyframes borderPulse { 0%{opacity:.35} 50%{opacity:.65} 100%{opacity:.35} }
@keyframes shimmer { 0%{transform:translateX(-60%)} 100%{transform:translateX(140%)} }

.coach-hero{animation: floatGlow 5.5s ease-in-out infinite;}
.coach-hero .hero-title{letter-spacing:-.2px}
.coach-hero .hero-sub{max-width: 56ch}

.section{position:relative}
.section::before{
  content:""; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none;
  background: linear-gradient(90deg, rgba(106,227,255,.22), rgba(63,185,255,.10), rgba(106,227,255,.22));
  opacity:.28; filter: blur(10px);
  animation: borderPulse 4.2s ease-in-out infinite;
}
.panel{
  position:relative;
}
.panel::before{
  content:""; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none;
  background: radial-gradient(420px 120px at 20% 0%, rgba(106,227,255,.18), transparent 60%);
  opacity:.55;
}
.panel::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.06) 40%, transparent 70%);
  transform: translateX(-60%);
  animation: shimmer 6.5s ease-in-out infinite;
  mix-blend-mode: overlay;
  opacity:.35;
}

.btn-neon{
  position:relative; overflow:hidden;
}
.btn-neon::after{
  content:""; position:absolute; inset:-40px;
  background: radial-gradient(220px 120px at 30% 20%, rgba(106,227,255,.35), transparent 60%);
  opacity:.55; pointer-events:none;
}
.btn-neon:active{transform: translateY(0px) scale(.99);}

.badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:999px;
  border:1px solid rgba(106,227,255,.22);
  background: rgba(10,16,30,.45);
  color: rgba(234,246,255,.92);
  font-weight:900; font-size: 12px;
}
.badge i{color: var(--neon);}
.session .badge{margin-top:8px; justify-content:center; width:fit-content}
.session.reco{border-color: rgba(106,227,255,.40);}
.session.reco .badge{border-color: rgba(106,227,255,.40);}

.stepper{
  display:flex; gap:10px; flex-wrap:wrap;
  margin: 6px 0 14px;
}
.step{
  flex:1 1 160px;
  display:flex; align-items:center; gap:10px;
  padding:10px 12px; border-radius:14px;
  background: rgba(7,11,20,.42);
  border:1px solid rgba(106,227,255,.12);
  color: rgba(234,246,255,.85);
}
.step .num{
  width:28px;height:28px;border-radius:10px;
  display:grid; place-items:center;
  background: rgba(106,227,255,.14);
  border:1px solid rgba(106,227,255,.20);
  color: var(--neon);
  font-weight:900;
  box-shadow: 0 0 18px rgba(106,227,255,.14);
}
.step .txt{font-weight:900; font-size: 12.5px;}
.step .sub{font-size: 11.5px; color: rgba(183,215,229,.74); font-weight:700;}

.input,.textarea,.select{
  transition: box-shadow .18s ease, border-color .18s ease, transform .18s ease;
}
.input:hover,.textarea:hover,.select:hover{
  border-color: rgba(106,227,255,.30);
}
.rank-card img{width:58px;height:58px}
.rank-card{padding:12px 8px}
.choice .t,.session b{font-size: 14px}
.choice .s{font-weight:700}
.small-note{padding:10px 12px; border-radius:14px; border:1px solid rgba(106,227,255,.12); background: rgba(7,11,20,.40);}
.summary .btn-neon{margin-top: 14px}

.toast{
  position: fixed; left: 16px; bottom: 16px; z-index: 9999;
  max-width: 320px;
  background: rgba(10,16,30,.85);
  border: 1px solid rgba(106,227,255,.22);
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.55);
  padding: 12px 12px;
  display:none;
}
.toast.show{display:block; animation: floatGlow 2.8s ease-in-out infinite;}
.toast .t{font-weight:900; margin:0 0 4px}
.toast .d{margin:0; color: rgba(183,215,229,.86); font-weight:700; font-size: 12.5px; line-height:1.6}
.toast .x{position:absolute; top:10px; right:10px; cursor:pointer; color: rgba(234,246,255,.8)}


/* --- cinematic grain (very subtle) --- */
.coach-hero .cinema-grain{
  position:absolute; inset:0; pointer-events:none; z-index:1;
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.02) 0, rgba(255,255,255,.02) 1px, transparent 2px, transparent 6px),
    radial-gradient(2px 2px at 20% 30%, rgba(255,255,255,.05), transparent 60%),
    radial-gradient(2px 2px at 70% 55%, rgba(255,255,255,.04), transparent 60%),
    radial-gradient(1px 1px at 40% 80%, rgba(255,255,255,.035), transparent 60%);
  mix-blend-mode: overlay;
  opacity:.26;
  animation: grainMove 9s linear infinite;
}
@keyframes grainMove{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(-1.2%, .8%, 0)}
  100%{transform:translate3d(0,0,0)}
}

/* --- Scroll indicator --- */
.scroll-indicator{
  display:flex; align-items:center; justify-content:center;
  margin: 12px auto 0;
  width: 100%;
}
.scroll-indicator .pill{
  display:flex; align-items:center; gap:10px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(8,12,22,.45);
  border: 1px solid rgba(106,227,255,.18);
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
  color: rgba(234,246,255,.86);
  font-weight: 900;
  font-size: 12.5px;
}
.scroll-indicator i{
  color: var(--neon);
  text-shadow: 0 0 18px rgba(106,227,255,.25);
}
.scroll-indicator .chev{
  display:inline-grid; place-items:center;
  width: 28px; height: 28px;
  border-radius: 12px;
  background: rgba(106,227,255,.10);
  border: 1px solid rgba(106,227,255,.18);
  animation: bounceDown 1.4s ease-in-out infinite;
}
@keyframes bounceDown{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(3px)}
}

/* --- Micro animation on first selection --- */
@keyframes focusGlow{
  0%{box-shadow: 0 0 0 0 rgba(106,227,255,.0)}
  35%{box-shadow: 0 0 0 6px rgba(106,227,255,.12)}
  100%{box-shadow: 0 0 0 0 rgba(106,227,255,.0)}
}
.pulse-focus{
  animation: focusGlow .9s ease-out 1;
}
@keyframes totalPop{
  0%{transform:scale(1)}
  45%{transform:scale(1.03)}
  100%{transform:scale(1)}
}
.total-pop{
  animation: totalPop .55s ease-out 1;
}

/* Back to home */
.back-home{
  position:absolute;
  top:18px;
  right:18px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  font-size:12.5px;
  font-weight:900;
  color:rgba(234,246,255,.92);
  background:rgba(8,12,22,.52);
  border:1px solid rgba(106,227,255,.22);
  backdrop-filter: blur(6px);
  text-decoration:none;
  transition: all .2s ease;
  z-index:6;
}
.back-home i{color:var(--neon);}
.back-home:hover{
  border-color:rgba(106,227,255,.62);
  box-shadow:0 0 18px rgba(106,227,255,.22);
  transform:translateY(-1px);
}


/* === Smart pricing UI (per-session line + best value badge) === */
.session .top{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.session .per{margin-top:6px; font-size:12px; color: rgba(234,246,255,.78); opacity:.92;}
.session .badge.save{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.session.best-value{
  border-color: rgba(255,215,0,.65) !important;
  box-shadow: 0 0 0 4px rgba(255,215,0,.10), 0 16px 40px rgba(0,0,0,.35), 0 0 30px rgba(255,215,0,.20);
  background: linear-gradient(135deg, rgba(255,215,0,.10), rgba(10,16,30,.35));
}
.session.best-value .badge.save{
  border-color: rgba(255,215,0,.55);
  background: rgba(255,215,0,.10);
}

/* Rank-based premium hint (optional styling hook) */
body.rank-divine .total .amt,
body.rank-immortal .total .amt{
  text-shadow: 0 0 20px rgba(255,215,0,.25);
}
