/**
 * Nanban Front World v3 — premium atmosphere + elevation
 * Loads last. Road ink / teal / warm fog. No purple, no cream-card cliché.
 */

#loginScreen.nb-ultra.nb-cinema-v2 {
  --nb-v3-ink: #040a12;
  --nb-v3-panel: #0b1624;
  --nb-v3-fog: #eef6f4;
  --nb-v3-teal: #2dd4bf;
  --nb-v3-deep: #0f766e;
  --nb-v3-amber: #fbbf24;
  --nb-v3-elev:
    0 1px 0 rgba(255, 255, 255, 0.06) inset,
    0 20px 50px rgba(0, 0, 0, 0.28);
}

/* Full landing canvas */
#loginScreen.nb-cinema-v2 {
  background: var(--nb-v3-ink) !important;
}

/* Nav — floating pill bar */
#loginScreen.nb-cinema-v2 .nb-nav {
  margin: 10px 14px 0 !important;
  width: auto !important;
  left: 14px !important;
  right: 14px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  background: rgba(4, 10, 18, 0.72) !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4) !important;
}

/* Hero — deeper cinema wash */
#loginScreen.nb-cinema-v2 .nb-hero-overlay {
  background:
    linear-gradient(180deg, rgba(4, 10, 18, 0.55) 0%, rgba(4, 10, 18, 0.15) 38%, rgba(4, 10, 18, 0.72) 72%, rgba(4, 10, 18, 0.96) 100%),
    linear-gradient(110deg, rgba(15, 118, 110, 0.28) 0%, transparent 48%, rgba(251, 191, 36, 0.08) 100%) !important;
}

#loginScreen.nb-cinema-v2 .nb-hero-content {
  width: min(960px, calc(100% - 36px)) !important;
  margin-bottom: clamp(56px, 10vh, 100px) !important;
}

#loginScreen.nb-cinema-v2 .nb-hero-headline {
  max-width: 18ch !important;
  font-size: clamp(1.25rem, 3.6vw, 1.75rem) !important;
  color: #f8fafc !important;
}

#loginScreen.nb-cinema-v2 .nb-hero-sub {
  color: rgba(226, 232, 240, 0.85) !important;
}

#loginScreen.nb-cinema-v2 .nb-hero-cta .nb-btn-primary {
  min-width: 200px;
  letter-spacing: 0.01em;
}

/* Marquee — thin luminous rail */
#loginScreen .nb-marquee-band {
  background: linear-gradient(90deg, #0f766e, #115e59 40%, #0c4a6e) !important;
  border: none !important;
  box-shadow: 0 12px 40px rgba(15, 118, 110, 0.35) !important;
}

/* Soft page rhythm under hero */
#loginScreen #nbDrivingPublic {
  background:
    radial-gradient(ellipse 80% 40% at 50% 0%, rgba(20, 184, 166, 0.12), transparent 55%),
    linear-gradient(180deg, #040a12 0%, #07131f 18%, #f3f7f6 18.1%, #f8fafc 100%);
}

#loginScreen .nb-photo-gallery,
#loginScreen .nb-section--why,
#loginScreen .nb-section--testimonials,
#loginScreen .nb-section--platform,
#loginScreen .nb-section--learning {
  padding-left: clamp(16px, 4vw, 40px);
  padding-right: clamp(16px, 4vw, 40px);
}

#loginScreen .nb-section--why {
  background:
    radial-gradient(ellipse 60% 50% at 10% 20%, rgba(20, 184, 166, 0.1), transparent 50%),
    linear-gradient(180deg, #f8fafc, #eef6f4) !important;
}

#loginScreen .nb-section--testimonials {
  background:
    radial-gradient(ellipse 50% 40% at 90% 10%, rgba(251, 191, 36, 0.1), transparent 50%),
    #f8fafc !important;
}

#loginScreen .nb-section--platform,
#loginScreen .nb-section--learning {
  background: linear-gradient(180deg, #0b1624 0%, #07111c 100%) !important;
  color: #e2e8f0;
}

#loginScreen .nb-section--platform .nb-section-title,
#loginScreen .nb-section--learning .nb-section-title,
#loginScreen .nb-section--platform .nb-section-lead,
#loginScreen .nb-section--learning .nb-section-lead {
  color: #f8fafc !important;
}

#loginScreen .nb-section--platform .nb-section-kicker,
#loginScreen .nb-section--learning .nb-section-kicker {
  color: #5eead4 !important;
}

#loginScreen .nb-esevai-band {
  background:
    radial-gradient(ellipse 70% 50% at 50% 0%, rgba(20, 184, 166, 0.16), transparent 55%),
    linear-gradient(180deg, #f0fdfa, #ffffff) !important;
}

/* Cards — soft world elevation */
#loginScreen .nb-photo-tile,
#loginScreen .nb-bento-why-cell,
#loginScreen .nb-tm-card,
#loginScreen .nb-public-bento-card,
#loginScreen .nb-esevai-chip {
  box-shadow: var(--nb-v3-elev) !important;
}

#loginScreen .nb-public-bento-card {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #e2e8f0 !important;
}

#loginScreen .nb-public-bento-card h3 {
  color: #f8fafc !important;
}

#loginScreen .nb-btn-public {
  background: linear-gradient(135deg, #14b8a6, #0f766e) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 14px !important;
  min-height: 46px !important;
  font-weight: 800 !important;
  box-shadow: 0 10px 28px rgba(15, 118, 110, 0.35) !important;
}

/* Enquiry — night theatre */
#loginScreen .nb-enquiry-wrap {
  background:
    radial-gradient(ellipse 70% 60% at 80% 20%, rgba(45, 212, 191, 0.16), transparent 50%),
    radial-gradient(ellipse 50% 40% at 10% 80%, rgba(251, 191, 36, 0.08), transparent 50%),
    linear-gradient(165deg, #040a12, #0a1f24 60%, #06201c) !important;
}

#loginScreen .nb-enquiry-copy h2 {
  color: #f8fafc !important;
  font-size: clamp(1.8rem, 4.5vw, 2.6rem) !important;
  font-weight: 900 !important;
}

#loginScreen .nb-enquiry-glass {
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  box-shadow:
    0 0 0 1px rgba(45, 212, 191, 0.12),
    0 30px 80px rgba(0, 0, 0, 0.45) !important;
}

/* Login hub — cinematic doors */
#loginScreen .nb-login-hub {
  background:
    radial-gradient(ellipse 80% 50% at 50% -20%, rgba(45, 212, 191, 0.22), transparent 55%),
    linear-gradient(180deg, #040a12 0%, #0a1a22 50%, #0c241f 100%) !important;
  padding-top: clamp(48px, 8vw, 88px) !important;
}

#loginScreen .nb-login-hub__title {
  text-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

#loginScreen .nb-login-card {
  border: 1px solid rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: blur(8px);
  transform: translateZ(0);
}

#loginScreen .nb-login-card--esevai {
  box-shadow:
    0 0 0 1px rgba(16, 185, 129, 0.25),
    0 24px 56px rgba(0, 0, 0, 0.35) !important;
}

#loginScreen .nb-footer--premium {
  background: #040a12 !important;
  color: #cbd5e1 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

#loginScreen .nb-footer--premium h4 {
  color: #5eead4 !important;
}

/* Hide emoji noise on captions if present */
#loginScreen .nb-photo-tile__cap {
  background: linear-gradient(180deg, transparent, rgba(4, 10, 18, 0.78)) !important;
  color: #fff !important;
  font-size: 0.85rem !important;
}

/* Soft reveal motion */
@keyframes nbV3Rise {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}
#loginScreen.nb-cinema-v2 .nb-c2-reveal {
  animation: nbV3Rise 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}
#loginScreen.nb-cinema-v2 .nb-c2-reveal[data-d="3"] { animation-delay: 0.12s; }
#loginScreen.nb-cinema-v2 .nb-c2-reveal[data-d="4"] { animation-delay: 0.22s; }
#loginScreen.nb-cinema-v2 .nb-c2-reveal[data-d="5"] { animation-delay: 0.32s; }

@media (prefers-reduced-motion: reduce) {
  #loginScreen.nb-cinema-v2 .nb-c2-reveal {
    animation: none !important;
  }
}

/* ── Full-page polish pass ── */
#loginScreen .nb-section-head {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

#loginScreen .nb-section-title {
  font-size: clamp(1.6rem, 4vw, 2.35rem) !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
}

#loginScreen .nb-bento-why {
  gap: 16px !important;
}

#loginScreen .nb-tm-grid {
  gap: 16px !important;
}

#loginScreen .nb-photo-mosaic {
  gap: 12px !important;
}

#loginScreen .nb-login-hub__sub {
  max-width: 40ch;
  margin-left: auto;
  margin-right: auto;
}

#loginScreen .nb-login-card h2 {
  font-size: clamp(1.25rem, 2.8vw, 1.45rem) !important;
}

#loginScreen .nb-ff-quickbar__login {
  box-shadow: 0 8px 20px rgba(20, 184, 166, 0.35);
}

#loginScreen .nb-hero-scroll {
  opacity: 0.85;
}

#loginScreen .nb-enquiry-perk {
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
}