/* ============================================================
   Inkperch Travel Companion — Landing v2 DARK overrides
   Load after page-premium.css. The page shell goes dark ink;
   the phone screens stay parchment (the app itself is parchment),
   so the frames pop off the background.
   ============================================================ */
body{
  /* dark ink tokens for everything outside the phone screens */
  --bg:#1B140C; --bg-glow:#261C10; --bg-shade:#120D07;
  --card-bg:#282012;
  --tonal:rgba(240,228,200,0.06);
  --ink:#F2E7CC; --ink2:#C9B891; --muted:#8F7D5E;
  --hairline:rgba(240,228,200,0.10); --hairline-strong:rgba(240,228,200,0.15);
  --crimson:#C24B3A;
  --forest:#8FB463; --rust:#C4703F; --steel:#7C99B5;
  --tabbar-bg:rgba(27,20,12,0.86);
  --shadow-card:0 1px 2px rgba(0,0,0,0.3), 0 14px 30px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.06);
  --shadow-card-sm:0 1px 2px rgba(0,0,0,0.3), 0 8px 18px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.06);

  background:var(--bg);
  background-image:radial-gradient(120% 70% at 50% 0%, var(--bg-glow) 0%, var(--bg) 55%, var(--bg-shade) 100%);
  color:var(--ink2);
}

/* grain reads as light dust on dark ground */
.pagegrain{ mix-blend-mode:screen; opacity:0.045; }

/* nav */
.lp-nav{ box-shadow:0 1px 0 var(--foil-ring), 0 10px 30px rgba(0,0,0,0.35); }

/* hero figure: drop the paper-white bevel, add an ember glow */
.lp-hero-fig{
  background:linear-gradient(180deg, #E87B5E 0%, #C24B3A 42%, #7E2417 100%);
  -webkit-background-clip:text; background-clip:text;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,0.4)) drop-shadow(0 18px 44px rgba(194,75,58,0.35));
}
.lp-close-fig{
  background:linear-gradient(180deg, #E87B5E 0%, #C24B3A 42%, #7E2417 100%);
  -webkit-background-clip:text; background-clip:text;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,0.4)) drop-shadow(0 14px 34px rgba(194,75,58,0.3));
}
.lp-hero-fig .net, .lp-close-fig .net{ -webkit-text-fill-color:var(--ink); color:var(--ink); }

/* beat number medallions: cream numeral on crimson */
.lp-eyebrow .n{ color:#F7EFDA; }

/* scrawls burn a little brighter on ink */
.scrawl{ color:#D96A50; }
.scrawl--ink{ color:#C9B891; }

/* close band: slightly lifted ink slab instead of parchment */
.lp-close-band{ background:#221A0E; box-shadow:inset 0 1px 0 rgba(255,255,255,0.05), inset 0 -1px 0 rgba(255,255,255,0.05); }
.waitlist-input{ background:#1E170D; box-shadow:var(--shadow-card-sm), inset 0 0 0 1px var(--hairline-strong); }
.waitlist-input:focus{ box-shadow:var(--shadow-card-sm), inset 0 0 0 2px var(--gold-foil); }

/* footer: darker than the page so it still reads as a base */
.lp-footer{ background:#0F0A05; }

/* phone frame sits on dark: heavier drop, warmer ring */
.phone{ box-shadow:0 50px 100px rgba(0,0,0,0.6), 0 8px 24px rgba(0,0,0,0.45), 0 0 0 2px #3A3226; }

/* ---- restore parchment tokens INSIDE the phone screens ---- */
.screen{
  --bg:#F0E4C8; --bg-glow:#F7EFDA; --bg-shade:#E9DBB8;
  --card-bg:#FBF4E3;
  --tonal:rgba(26,18,8,0.055);
  --ink:#201509; --ink2:#5a4a30; --muted:#9c8a68;
  --hairline:rgba(26,18,8,0.09); --hairline-strong:rgba(26,18,8,0.12);
  --crimson:#A32B20;
  --forest:#2D5016; --rust:#8B3A1A; --steel:#4A6B8A;
  --tabbar-bg:rgba(251,244,227,0.86);
  --shadow-card:0 1px 2px rgba(26,18,8,0.05), 0 14px 30px rgba(26,18,8,0.14), inset 0 1px 0 rgba(255,255,255,0.5);
  --shadow-card-sm:0 1px 2px rgba(26,18,8,0.05), 0 8px 18px rgba(26,18,8,0.10), inset 0 1px 0 rgba(255,255,255,0.5);
}