/* PDF Eye — "paper & lens" theme for every page of the site (loaded after /assets/site.css).
   Warm ivory paper, the signal red of the app icon, graphite ink and New York-style serif headings. */
:root {
  --paper: #f6f3ea; --paper-2: #ece7da; --sheet: #fefdfa; --ink: #1c1f24; --ink-2: #4b5059; --ink-3: #868b93;
  --signal: #e5141b; --crimson: #a30d12; --ember: #ff5f3d; --iris: #7fa39a; --lens: #2e333b; --marker: #ffd84d; --pen: #304fbb;
  --bg: var(--paper); --bg-soft: var(--paper-2); --bg-card: var(--sheet); --text: var(--ink); --text-2: var(--ink-2); --text-3: var(--ink-3);
  --line: rgba(28,31,36,.10); --nav-bg: rgba(246,243,234,.78); --accent: var(--signal); --accent-2: var(--crimson);
  --shadow-sm: 0 1px 1px rgba(28,31,36,.05), 0 6px 18px -8px rgba(28,31,36,.18);
  --shadow-lg: 0 2px 3px rgba(28,31,36,.05), 0 30px 70px -20px rgba(28,31,36,.32);
  --font-display: "New York", ui-serif, "Iowan Old Style", "Charter", Georgia, serif;
  color-scheme: light;
}
body {
  background-color: var(--paper);
  background-image: radial-gradient(rgba(28,31,36,.07) 1.1px, transparent 1.2px);
  background-size: 22px 22px;
}
h1, h2, h3, .display, .h1, .h2 { font-family: var(--font-display); letter-spacing: -0.015em; }
.h3 { font-family: var(--font); }
.display { font-weight: 800; }
.eyebrow { letter-spacing: .18em; text-transform: uppercase; font-size: 12.5px; font-weight: 800; color: var(--signal); }
.grad-text { background: linear-gradient(100deg, var(--ember), var(--signal) 45%, var(--crimson)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nav { border-bottom: 1px solid var(--line); }
.brand span { font-family: var(--font-display); font-weight: 800; letter-spacing: .02em; }
.nav-cta { background: linear-gradient(100deg, var(--signal), var(--crimson)); color: #fff !important; box-shadow: 0 8px 20px -8px rgba(229,20,27,.7); }
.btn-primary { background: linear-gradient(100deg, var(--signal), var(--crimson)); color: #fff; box-shadow: 0 10px 24px -10px rgba(229,20,27,.8); }
.soft { background: color-mix(in srgb, var(--paper-2) 70%, transparent); }
.card, .faq details, .contact-form { background: var(--sheet); border-color: var(--line); }
.page-head { position: relative; }
.page-head .h1 { font-size: clamp(38px, 5.4vw, 64px); }
.page-head::after {   /* viewfinder corner under page titles */
  content: ""; display: block; width: 64px; height: 4px; margin-top: 18px; border-radius: 4px;
  background: linear-gradient(90deg, var(--signal), var(--crimson));
}
.prose h2 { font-family: var(--font-display); }
.prose a { text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--signal) 35%, transparent); text-underline-offset: 3px; }
.prose .callout { background: var(--sheet); border: 1px solid var(--line); border-left: 4px solid var(--signal); border-radius: 12px; padding: 14px 18px; }
.prose img.shot-inline { border-radius: 26px; box-shadow: var(--shadow-lg); margin: 18px auto; max-width: 320px; }
.toc a.active { color: var(--signal); }
.footer { background: var(--paper-2); }
::selection { background: color-mix(in srgb, var(--marker) 70%, transparent); }