/* =====================================================================
   app-light.css — LIGHT theme overlay (Chase-inspired palette)
   Load AFTER app.css. Re-maps the design tokens + the few hard-coded
   dark rules. Chase blue #117ACA, navy #103A6B, white, light gray.
   ===================================================================== */
:root {
  --bg:        #FFFFFF;
  --bg-2:      #F4F7FB;
  --surface:   #FFFFFF;
  --surface-2: #EEF3F9;
  --border:    rgba(16,42,86,0.12);
  /* accent (was gold) -> Chase blue */
  --gold:      #117ACA;
  --gold-br:   #2E92E0;
  --gold-soft: rgba(17,122,202,0.10);
  /* "white" token is used for heading text in app.css -> make it Chase navy */
  --white:     #0B2A52;
  --text:      #1C2733;
  --text-mid:  #54616F;
  --text-dim:  #8B97A6;
  --shadow:    0 18px 40px -22px rgba(16,42,86,0.30);
}

/* ambient page wash: subtle blue tints on white instead of gold-on-dark */
body {
  background-color:#FFFFFF;
  color:var(--text);
  background-image:
    radial-gradient(900px 480px at 82% -6%, rgba(17,122,202,0.10), transparent 60%),
    radial-gradient(700px 560px at -5% 8%, rgba(17,122,202,0.05), transparent 55%);
}

/* heading gradient: navy -> Chase blue (still legible on white) */
.grad {
  background:linear-gradient(135deg, #0B2A52 0%, #117ACA 120%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}

/* frosted header/tabbar become light glass */
.site-header { background:rgba(255,255,255,0.62); border-bottom:1px solid rgba(16,42,86,0.06); }
.site-header.scrolled { background:rgba(255,255,255,0.9); border-bottom-color:var(--border); box-shadow:0 6px 24px -18px rgba(16,42,86,0.5); }
.tabbar { background:rgba(255,255,255,0.9); border-top:1px solid var(--border); }
.sticky-cta { background:linear-gradient(to top, rgba(255,255,255,0.96), rgba(255,255,255,0)); }

/* cards: solid white with soft elevation (banking-clean) */
.card { background:#FFFFFF; border:1px solid var(--border); box-shadow:0 1px 2px rgba(16,42,86,0.04); }
.card:hover { border-color:rgba(17,122,202,0.35); background:#FFFFFF; box-shadow:0 16px 36px -20px rgba(16,42,86,0.28); }

/* primary button: Chase blue gradient, white text */
.btn-primary { color:#FFFFFF; box-shadow:0 10px 24px -12px rgba(17,122,202,0.6); }
.nav-cta { color:#FFFFFF !important; box-shadow:0 6px 16px -8px rgba(17,122,202,0.6); }

/* footer on light gray */
.site-footer { background:var(--bg-2); }