/* Phantom Receipt site: shared styles. System fonts only, no external requests. */

:root{
  --navy-950:#08111f; --navy-900:#0c1a2e; --navy-800:#112442; --navy-700:#1a3358;
  --steel-700:#33475f; --steel-600:#46586f; --steel-500:#5b6e85; --steel-300:#b9c5d3; --steel-200:#d5dde7; --steel-100:#e8edf3;
  --bg:#f4f6f9; --surface:#ffffff; --ink:#0f1c2c; --muted:#47586b;
  --accent:#0a7570; --accent-ink:#065a56; --accent-soft:#dff1ef; --accent-bright:#43c9bd;
  --warn:#7a4f00; --warn-soft:#fff3d3; --warn-line:#e2b24a;
  --ok:#14653a; --ok-soft:#dff2e6; --bad:#9a2a2d; --bad-soft:#fbe4e4;
  --line:#d9e0e8; --radius:12px;
  --serif:ui-serif, Georgia, "Times New Roman", serif;
  --sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}
body{margin:0; background:var(--bg); color:var(--ink); font:17px/1.6 var(--sans); -webkit-font-smoothing:antialiased; overflow-wrap:break-word;}
img,svg{max-width:100%; height:auto;}
a{color:var(--accent-ink); text-underline-offset:2px;}
a:hover{color:var(--navy-700);}
:focus-visible{outline:3px solid var(--accent); outline-offset:2px; border-radius:3px;}
[hidden]{display:none !important;}
p{margin:0 0 1em;}
h1,h2,h3,h4{font-family:var(--serif); color:var(--navy-900); line-height:1.2; margin:0 0 .5em; text-wrap:balance;}
h1{font-size:clamp(1.9rem,5.4vw,3rem); letter-spacing:-.01em;}
h2{font-size:clamp(1.5rem,3.6vw,2.05rem);}
h3{font-size:1.2rem;}
h4{font-size:1.02rem;}
ul,ol{margin:0 0 1em; padding-left:1.25em;}
li{margin-bottom:.4em;}
code,.mono{font-family:var(--mono); font-size:.9em; overflow-wrap:anywhere;}
pre{font-family:var(--mono); font-size:.82rem; line-height:1.5; background:var(--navy-900); color:#e7eef7; padding:16px; border-radius:10px; overflow-x:auto; margin:0 0 1em;}
small,.small{font-size:.88rem;}

.wrap{max-width:1080px; margin:0 auto; padding:0 clamp(16px,4vw,28px);}
.narrow{max-width:760px;}
.skip{position:absolute; left:-9999px; top:0; background:#fff; color:var(--navy-900); padding:10px 14px; z-index:100;}
.skip:focus{left:8px; top:8px;}

/* ---- header ---- */
.site-header{background:var(--navy-900); color:#fff; border-bottom:1px solid var(--navy-700);}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:10px 28px; padding-top:12px; padding-bottom:12px; flex-wrap:wrap;}
.brand{display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; font-family:var(--serif); font-weight:700; font-size:1.18rem; letter-spacing:.01em;}
.brand img{width:32px; height:32px; display:block;}
.brand:hover{color:#fff;}
.site-nav{display:flex; flex-wrap:wrap; gap:2px 4px;}
.site-nav a{color:#d3deeb; text-decoration:none; font-size:.95rem; font-weight:500; padding:7px 10px; border-radius:7px;}
.site-nav a:hover{color:#fff; background:var(--navy-700);}
.site-nav a[aria-current="page"]{color:#fff; background:var(--navy-700);}
.site-nav a.nav-cta{background:var(--accent-bright); color:var(--navy-950); font-weight:700;}
.site-nav a.nav-cta:hover{background:#6fe0d5; color:var(--navy-950);}

/* ---- buttons ---- */
.btn{display:inline-flex; align-items:center; justify-content:center; text-align:center; gap:6px; padding:12px 22px; border-radius:9px; border:2px solid transparent; font:600 1rem/1.25 var(--sans); text-decoration:none; cursor:pointer; min-height:46px;}
.btn-primary{background:var(--accent); color:#fff;}
.btn-primary:hover{background:var(--accent-ink); color:#fff;}
.btn-secondary{background:transparent; color:var(--accent-ink); border-color:var(--accent);}
.btn-secondary:hover{background:var(--accent-soft); color:var(--accent-ink);}
.on-dark .btn-primary{background:var(--accent-bright); color:var(--navy-950);}
.on-dark .btn-primary:hover{background:#6fe0d5; color:var(--navy-950);}
.on-dark .btn-secondary{color:#fff; border-color:#6f86a3;}
.on-dark .btn-secondary:hover{background:var(--navy-700); color:#fff;}
.btn-row{display:flex; flex-wrap:wrap; gap:12px; margin:22px 0 0;}

/* ---- hero ---- */
.hero{background:var(--navy-900); color:#e8eff7; padding:clamp(40px,7vw,76px) 0 clamp(36px,6vw,64px);}
.hero h1{color:#fff; max-width:20ch;}
.hero .lede{color:#cdd9e7; font-size:clamp(1.05rem,2.2vw,1.2rem); max-width:62ch;}
.eyebrow{display:inline-block; font-size:.8rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--accent-ink); margin:0 0 .8em;}
.hero .eyebrow{color:var(--accent-bright);}
.glance{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:34px; max-width:820px;}
.glance > div{border-radius:var(--radius); padding:16px 18px; border:1px solid #2a4468; background:var(--navy-800);}
.glance h2{font-family:var(--sans); font-size:.8rem; letter-spacing:.07em; text-transform:uppercase; color:#9fb3cc; margin:0 0 6px;}
.glance p{margin:0; color:#fff; font-size:1rem;}
.glance .yes h2{color:var(--accent-bright);}
.glance .no h2{color:#f0c36a;}

/* ---- sections ---- */
.section{padding:clamp(40px,6vw,68px) 0; border-bottom:1px solid var(--line);}
.section.alt{background:var(--surface);}
.section.dark{background:var(--navy-900); color:#e8eff7; border-bottom:0;}
.section.dark h2,.section.dark h3{color:#fff;}
.section-intro{max-width:66ch; color:var(--muted); font-size:1.05rem;}
.page-head{background:var(--navy-900); color:#e8eff7; padding:clamp(34px,5vw,56px) 0;}
.page-head h1{color:#fff; font-size:clamp(1.8rem,4.6vw,2.6rem); max-width:24ch;}
.page-head .lede{color:#cdd9e7; font-size:1.1rem; max-width:64ch; margin:0;}
.page-head .eyebrow{color:var(--accent-bright);}

.grid-2,.grid-3,.grid-4{display:grid; gap:18px; margin-top:24px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px;}
.section.alt .card{background:var(--bg);}
.card h3{margin-bottom:.35em;}
.card p:last-child,.card ul:last-child{margin-bottom:0;}

.steps{list-style:none; padding:0; margin:24px 0 0; display:grid; grid-template-columns:repeat(4,1fr); gap:18px; counter-reset:step;}
.steps li{counter-increment:step; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px; margin:0;}
.steps li::before{content:counter(step); display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:var(--navy-800); color:#fff; font-weight:700; margin-bottom:12px;}
.steps h3{font-size:1.08rem;}
.steps p{margin:0; color:var(--muted); font-size:.97rem;}

.panel{border-radius:var(--radius); padding:24px; border:1px solid var(--line); background:var(--surface);}
.panel h3{margin-bottom:.5em;}
.panel ul{margin-bottom:0;}
.panel.does{border-color:#9ccfc9; background:#f0f9f8;}
.panel.doesnt{border-color:var(--warn-line); background:var(--warn-soft);}
.panel.doesnt h3{color:var(--warn);}
.panel.does h3{color:var(--accent-ink);}
.tick li,.cross li{list-style:none; position:relative; padding-left:26px;}
.tick,.cross{padding-left:0;}
.tick li::before{content:"\2713"; position:absolute; left:0; color:var(--accent-ink); font-weight:700;}
.cross li::before{content:"\2715"; position:absolute; left:0; color:var(--warn); font-weight:700;}

.callout{border-left:5px solid var(--accent); background:var(--accent-soft); border-radius:0 var(--radius) var(--radius) 0; padding:16px 20px; margin:22px 0;}
.callout.warn{border-left-color:var(--warn-line); background:var(--warn-soft);}
.callout p:last-child{margin-bottom:0;}
.callout strong{color:var(--navy-900);}

.strip{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:22px;}
.strip a.tool{display:block; text-decoration:none; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:20px; border-top:4px solid var(--accent);}
.strip a.tool:hover{border-color:var(--accent); box-shadow:0 2px 10px rgba(12,26,46,.08);}
.strip a.tool strong{display:block; font-family:var(--serif); font-size:1.15rem; color:var(--navy-900); margin-bottom:4px;}
.strip a.tool span{color:var(--muted); font-size:.96rem;}

/* status badges */
.badge{display:inline-block; font-size:.74rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:3px 10px; border-radius:999px; border:1px solid transparent; vertical-align:middle; white-space:nowrap;}
.badge.available{background:var(--ok-soft); color:var(--ok); border-color:#9bd0b0;}
.badge.pilot{background:#e3ecf8; color:#1c3f77; border-color:#a9c0e4;}
.badge.progress{background:var(--warn-soft); color:var(--warn); border-color:var(--warn-line);}
.badge.notbuilt{background:var(--steel-100); color:var(--steel-700); border-color:var(--steel-300);}
.tool-list{display:grid; gap:16px; margin-top:24px;}
.tool-item{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:20px 22px; display:grid; grid-template-columns:1fr auto; gap:6px 18px; align-items:start;}
.tool-item h3{margin:0; font-size:1.15rem;}
.tool-item .badge{justify-self:end;}
.tool-item .body{grid-column:1 / -1;}
.tool-item p{margin:.3em 0 0; color:var(--muted);}
.tool-item p strong{color:var(--ink);}
.legend{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:22px 0 0; font-size:.95rem; color:var(--muted);}
.legend div{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:14px 16px;}
.legend .badge{margin-bottom:6px;}

/* faq */
.faq details{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); margin:0 0 10px; padding:0;}
.faq summary{cursor:pointer; font-weight:600; padding:16px 20px; list-style:none; position:relative; padding-right:48px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; position:absolute; right:20px; top:12px; font-size:1.5rem; line-height:1; color:var(--accent-ink);}
.faq details[open] summary::after{content:"\2212";}
.faq .answer{padding:0 20px 8px; color:var(--ink);}
.faq .answer p,.faq .answer ul{color:var(--muted);}
.faq .answer p:last-child{margin-bottom:12px;}

/* tables */
.table-wrap{overflow-x:auto; margin:20px 0;}
table.plain{border-collapse:collapse; width:100%; background:var(--surface); font-size:.96rem;}
table.plain th,table.plain td{border:1px solid var(--line); padding:10px 12px; text-align:left; vertical-align:top;}
table.plain th{background:var(--steel-100); font-weight:600;}

dl.facts{margin:16px 0; display:grid; grid-template-columns:max-content 1fr; gap:6px 18px;}
dl.facts dt{font-weight:600; color:var(--navy-900);}
dl.facts dd{margin:0; color:var(--muted);}

.draft-note{border:2px dashed var(--warn-line); background:var(--warn-soft); color:var(--warn); border-radius:var(--radius); padding:12px 16px; margin:0 0 24px; font-size:.95rem;}

.prose{max-width:740px;}
.prose h2{margin-top:1.8em; font-size:1.45rem;}
.prose h3{margin-top:1.4em;}

/* ---- footer ---- */
.site-footer{background:var(--navy-950); color:#b6c4d6; padding:34px 0 40px; font-size:.93rem;}
.site-footer a{color:#dfe8f3;}
.footer-grid{display:grid; grid-template-columns:2fr 1fr 1fr; gap:24px; margin-bottom:22px;}
.site-footer h2{font-family:var(--sans); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:#8ea3bd; margin:0 0 8px;}
.site-footer ul{list-style:none; padding:0; margin:0;}
.site-footer li{margin-bottom:5px;}
.footer-legal{border-top:1px solid #1d2f49; padding-top:18px;}
.footer-legal p{margin:0 0 6px;}

/* ---- responsive ---- */
@media (max-width:900px){
  .grid-3,.grid-4,.steps{grid-template-columns:repeat(2,1fr);}
  .strip{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
  body{font-size:16.5px;}
  .grid-2,.grid-3,.grid-4,.steps,.glance,.legend{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .btn-row .btn{width:100%;}
  .tool-item{grid-template-columns:1fr;}
  .tool-item .badge{justify-self:start; grid-row:1;}
  dl.facts{grid-template-columns:1fr; gap:2px;}
  dl.facts dd{margin-bottom:10px;}
  .site-nav a{padding:7px 7px; font-size:.9rem;}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
@media print{
  .site-header,.site-footer,.btn-row,.skip{display:none;}
  body{background:#fff; font-size:11pt;}
  .hero,.page-head,.section.dark{background:#fff; color:#000;}
  .hero h1,.page-head h1{color:#000;}
}

/* wordmark */
.brand-text{display:flex; flex-direction:column; line-height:1.1;}
.brand-text small{font-family:var(--sans); font-weight:500; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:#9fb3cc; margin-top:2px;}
.section-intro.after{margin-top:22px;}
.section.dark .section-intro{color:#cdd9e7;}
.page-head .lede a,.hero .lede a{color:var(--accent-bright);}
