/* Shared look for the content pages (field tickets, template, trades, thanks). Same "Ledger"
   colors and type as index.html, which keeps its own inline copy so the home page loads in one file. */
@font-face { font-family:"IBM Plex Sans"; font-weight:400; font-display:swap; src:url(fonts/IBMPlexSans-Regular.woff2) format("woff2"); }
@font-face { font-family:"IBM Plex Sans"; font-weight:600; font-display:swap; src:url(fonts/IBMPlexSans-SemiBold.woff2) format("woff2"); }
@font-face { font-family:"IBM Plex Sans"; font-weight:700; font-display:swap; src:url(fonts/IBMPlexSans-Bold.woff2) format("woff2"); }
:root {
  --navy:#14213d; --orange:#e8590c; --orange-hover:#c94d0a;
  --bg:#f3f5f9; --card:#ffffff; --ink:#14213d; --muted:#5b6678; --line:#dde3ec;
  --tint:#fff4ec; --shadow:0 18px 50px rgba(20,33,61,.18);
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#0b1222; --card:#121c33; --ink:#e7ecf5; --muted:#9aa6bc; --line:#24314f;
          --tint:#22191a; --shadow:0 18px 50px rgba(0,0,0,.45); }
}
* { box-sizing:border-box; }
body { margin:0; font:17px/1.6 "IBM Plex Sans","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;
       background:var(--bg); color:var(--ink); -webkit-font-smoothing:antialiased; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; }
.wrap { max-width:1160px; margin:0 auto; padding:0 24px; }
.narrow { max-width:820px; }
.btn { display:inline-flex; align-items:center; gap:8px; text-decoration:none; font-weight:600;
       padding:12px 22px; border-radius:8px; border:1.5px solid transparent; transition:background .15s, border-color .15s; }
.btn-primary { background:var(--orange); color:#fff; }
.btn-primary:hover { background:var(--orange-hover); }
.btn-ghost { border-color:rgba(255,255,255,.35); color:#fff; }
.btn-ghost:hover { border-color:#fff; }
.btn-line { border-color:var(--line); color:var(--ink); background:var(--card); }
.btn-line:hover { border-color:var(--orange); }
.btn:focus-visible { outline:3px solid var(--orange); outline-offset:2px; }
.eyebrow { text-transform:uppercase; letter-spacing:.12em; font-size:.78rem; font-weight:700; color:var(--orange); margin:0 0 12px; }
h1, h2, h3 { line-height:1.15; margin:0; }
h2 { font-size:clamp(1.6rem,3vw,2.2rem); }

.top { background:var(--navy); color:#fff; }
header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0; }
.brand { display:flex; align-items:center; gap:12px; font-weight:700; font-size:1.15rem; text-decoration:none; }
.brand img { width:34px; height:34px; }
nav { display:flex; align-items:center; gap:28px; }
nav a.link { text-decoration:none; color:#c7d0e0; font-weight:600; font-size:.95rem; }
nav a.link:hover, nav a.link[aria-current] { color:#fff; }
@media (min-width: 561px) { .brand { white-space:nowrap; } }
@media (max-width: 1100px) { nav { gap:18px; } }
@media (max-width: 960px) { nav a.link { display:none; } }
nav a { white-space:nowrap; }
@media (max-width: 560px) { header { gap:10px; } .brand { font-size:1rem; gap:8px; } .brand img { width:30px; height:30px; } nav { gap:8px; } nav .btn { padding:9px 13px; font-size:.92rem; } }
.page-hero { padding:40px 0 64px; display:grid; grid-template-columns:1.05fr .95fr; gap:44px; align-items:center; }
.page-hero.solo { grid-template-columns:1fr; max-width:820px; }
.page-hero h1 { font-size:clamp(2rem,4.2vw,3rem); letter-spacing:-.01em; }
.page-hero h1 span { color:var(--orange); }
.page-hero p { color:#c7d0e0; font-size:1.12rem; margin:18px 0 28px; max-width:600px; }
.page-hero .ctas { display:flex; flex-wrap:wrap; gap:12px; }
.crumbs { font-size:.88rem; color:#9fb0cc; padding-top:6px; }
.crumbs a { color:#c7d0e0; text-decoration:none; } .crumbs a:hover { color:#fff; }
.frame { border-radius:12px; overflow:hidden; background:#fff; box-shadow:var(--shadow); border:1px solid rgba(255,255,255,.12); }
.frame .bar { height:28px; display:flex; align-items:center; gap:6px; padding:0 12px; background:#e9edf4; }
.frame .bar i { width:10px; height:10px; border-radius:50%; background:#c6cfdd; }
@media (max-width: 900px) { .page-hero { grid-template-columns:1fr; } }

section { padding:72px 0; }
.alt { background:var(--card); border-block:1px solid var(--line); }
.lead { color:var(--muted); font-size:1.08rem; max-width:680px; margin:14px 0 0; }
.prose p, .prose li { color:var(--muted); }
.prose h2 { margin:0 0 14px; }
.prose h3 { margin:28px 0 8px; font-size:1.2rem; }
.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:36px; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:36px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:24px; }
.alt .card { background:var(--bg); }
.card h3 { font-size:1.12rem; margin-bottom:6px; display:flex; gap:10px; align-items:center; }
.card h3::before { content:""; width:10px; height:10px; border-radius:3px; background:var(--orange); flex:none; }
.card p { margin:0; color:var(--muted); font-size:.98rem; }
@media (max-width: 860px) { .grid3, .grid2 { grid-template-columns:1fr; } }

/* paper vs app comparison */
.vs { width:100%; border-collapse:collapse; margin-top:32px; background:var(--card); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.vs th, .vs td { text-align:left; padding:14px 18px; border-bottom:1px solid var(--line); vertical-align:top; }
.vs thead th { background:var(--navy); color:#fff; font-size:.95rem; }
.vs td:first-child { font-weight:600; width:26%; }
.vs td { color:var(--muted); } .vs td.yes { color:var(--ink); }
.vs tr:last-child td { border-bottom:0; }
@media (max-width: 640px) { .vs th, .vs td { padding:10px 12px; font-size:.92rem; } }

/* items list on trade pages */
.items { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.items span { border:1.5px solid var(--line); border-radius:999px; padding:4px 12px; font-size:.9rem; font-weight:600; color:var(--muted); background:var(--card); }

/* free download box */
.download { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:24px; }
.dl { display:flex; gap:14px; align-items:center; text-decoration:none; background:var(--card); border:1.5px solid var(--line);
      border-radius:12px; padding:16px 18px; }
.dl:hover { border-color:var(--orange); }
.dl .ext { display:grid; place-items:center; width:48px; height:56px; border-radius:6px; font-weight:700; font-size:.8rem; color:#fff; flex:none; }
.dl .xlsx { background:#1d7a46; } .dl .pdf { background:#c92a2a; }
.dl b { display:block; } .dl small { color:var(--muted); }
@media (max-width: 560px) { .download { grid-template-columns:1fr; } }

/* sample paper template preview */
.paper { background:#fff; color:#1b1b1b; border-radius:6px; padding:22px 24px; box-shadow:var(--shadow); font-size:12.5px; line-height:1.35; transform:rotate(-1.2deg); }
.paper .ph { display:flex; justify-content:space-between; align-items:flex-end; border-bottom:2px solid #1b1b1b; padding-bottom:8px; margin-bottom:10px; }
.paper .ph b { font-size:17px; letter-spacing:.02em; }
.paper .meta { display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; margin-bottom:12px; }
.paper .meta span { border-bottom:1px solid #9a9a9a; padding-bottom:2px; color:#555; }
.paper table { width:100%; border-collapse:collapse; }
.paper th, .paper td { border:1px solid #9a9a9a; padding:5px 6px; text-align:left; }
.paper th { background:#eef1f6; font-size:11.5px; }
.paper td { height:22px; color:#333; }
.paper .sign { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:16px; }
.paper .sign span { border-top:1px solid #1b1b1b; padding-top:4px; color:#555; font-size:11px; }
.paper .stamp { display:flex; justify-content:flex-end; align-items:center; gap:6px; margin-top:14px; color:#e8590c; font-size:9.5px; font-style:italic; text-align:right; line-height:1.25; }

/* closing call to action */
.cta { background:var(--navy); color:#fff; text-align:center; }
.cta p { color:#c7d0e0; max-width:620px; margin:14px auto 26px; font-size:1.08rem; }
.cta .ctas { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* thank-you page */
.thanks { text-align:center; padding:72px 0 88px; }
.thanks .tick { width:72px; height:72px; border-radius:50%; background:var(--orange); display:grid; place-items:center; margin:0 auto 22px; }
.thanks .tick::after { content:""; width:28px; height:14px; border-left:5px solid #fff; border-bottom:5px solid #fff; transform:translateY(-3px) rotate(-45deg); }
.thanks h1 { font-size:clamp(2rem,4vw,2.8rem); }
.thanks p { color:#c7d0e0; font-size:1.12rem; max-width:560px; margin:16px auto 0; }
.next { max-width:820px; margin:0 auto; }
.next ol { margin:18px 0 0; padding-left:22px; color:var(--muted); }
.next li { margin:8px 0; } .next li b { color:var(--ink); }

footer { padding:28px 0; color:var(--muted); font-size:.9rem; }
footer .wrap { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; }
footer .links { justify-content:flex-start; gap:8px 22px; margin-bottom:14px; padding-bottom:14px; border-bottom:1px solid var(--line); }
footer .links a { text-decoration:none; font-weight:600; }
footer .links a:hover { color:var(--orange); }