/* ============================================================================
   compare-lit.css — /compare + the three /compare/thread-vs-* pages in the
   lit system, layered on home.css primitives. One dark opening band (hero),
   then paper: the stand line, the honest-read rows, the side-by-side table
   on ink-alpha hairlines, the FAQ, the pilot close. The hub page adds the
   three comparison cards (paper, no accent hues) and the proof pair as lit
   slabs — the named card's copy declares its number verified, so it alone
   carries the green rim. Competitor cells never wear color.
   NOT yet registered in build.py CACHE_BUST_ASSETS — pages link ?v=1.
   ========================================================================== */

/* ── the dark opening band ── */
.chero{background:#0A0A0A;color:var(--p);padding:96px 0 120px;}
.chero .eyebrow{color:var(--pl62);}
.chero .eyebrow a{color:inherit;}
.chero .eyebrow a:hover{color:var(--p);}
.chero h1{font-family:var(--serif);font-optical-sizing:auto;font-weight:400;font-size:clamp(37px,4vw,56px);line-height:1.06;letter-spacing:-.013em;margin:0;max-width:24ch;color:var(--p);}
.chero h1 em{font-style:italic;}
.chero .sub{color:var(--pl62);font-size:15.5px;line-height:1.65;max-width:62ch;margin:18px 0 0;}
.chero .sub strong{color:var(--p);font-weight:600;}
.chero .hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px;}

/* ── back to paper ── */
#stand{padding:110px 0 0;}
#stand p{font-family:var(--serif);font-optical-sizing:auto;font-weight:400;font-size:clamp(24px,2.6vw,34px);line-height:1.35;letter-spacing:-.006em;margin:0;max-width:34ch;color:var(--q);}
#stand p span{color:var(--i);}

.gsec{padding:130px 0 0;}
.gsec h2{font-family:var(--serif);font-optical-sizing:auto;font-weight:400;font-size:clamp(29px,3vw,40px);line-height:1.14;letter-spacing:-.008em;margin:0;max-width:26ch;}
.gsec .sub{color:var(--q);font-size:15.5px;line-height:1.65;max-width:62ch;margin:18px 0 0;}
.gsec .sub strong{color:var(--i);font-weight:600;}
.gsec .sub a{color:var(--i);font-weight:600;}

/* the honest-read rows — numbered, on ink hairlines */
.gap-rows{margin-top:28px;border-top:1px solid rgba(20,20,20,.14);max-width:72ch;}
.gap-row{display:grid;grid-template-columns:56px minmax(0,1fr);gap:24px;padding:20px 0;border-bottom:1px solid rgba(20,20,20,.14);align-items:baseline;}
.gap-row .k{font-variant-numeric:tabular-nums;font-size:13px;font-weight:600;color:var(--q);letter-spacing:.02em;}
.gap-row p{margin:0;font-size:15px;line-height:1.65;color:var(--q);}
.gap-row p b{color:var(--i);font-weight:600;}

/* ── the side-by-side table — paper, ink-alpha hairlines, roomy rows.
   The wrap scrolls on its own axis; the page body never scrolls sideways. ── */
.gtable-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:40px;}
.gtable{width:100%;min-width:680px;border-collapse:collapse;font-variant-numeric:tabular-nums;}
.gtable th{font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--q);text-align:left;padding:0 22px 13px 0;border-bottom:1px solid rgba(20,20,20,.3);}
.gtable td{padding:16px 22px 16px 0;border-bottom:1px solid rgba(20,20,20,.14);font-size:14.5px;line-height:1.55;color:var(--q);vertical-align:top;}
.gtable th:last-child,.gtable td:last-child{padding-right:0;}
.gtable th:first-child{width:30%;}
.gtable th:nth-child(2){width:37%;}
.gtable td:first-child{color:var(--i);font-weight:500;}
.gtable td b{color:var(--i);font-weight:600;}
/* availability marks are capability claims, not verified outcomes — no green */
.gtable .yes{color:var(--i);font-weight:600;margin-right:2px;}
.gtable .no{color:var(--q);}
/* the sourcing note under the table */
.tnote{font-size:13px;margin-top:16px;}

/* ── FAQ — the pricing .faq2 treatment, on this family's .faq markup ── */
.faq{margin-top:40px;border-top:1px solid rgba(20,20,20,.14);}
.faq details{border-bottom:1px solid rgba(20,20,20,.14);}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:19px 0;font-size:15.5px;font-weight:600;color:var(--i);}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-family:var(--sans);font-weight:400;font-size:19px;color:var(--q);flex:none;}
.faq details[open] summary::after{content:"−";}
.faq details p{margin:0;padding:0 0 20px;font-size:14.5px;line-height:1.68;color:var(--q);max-width:72ch;}

/* ── the hub's three comparison cards — paper tiles, no accent hues
   (the old c-blue / c-indigo / c-violet classes deliberately get no color) ── */
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px;}
.case{border:1px solid rgba(20,20,20,.18);border-radius:6px;padding:24px 26px;display:flex;flex-direction:column;gap:12px;background:var(--p);}
a.case{transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;}
a.case:hover{color:var(--i);border-color:rgba(20,20,20,.4);transform:translateY(-3px);box-shadow:0 10px 30px rgba(20,20,20,.08);}
.case .tag{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--q);}
.case h3{font-size:25px;line-height:1.15;}
.case p{margin:0;font-size:13.5px;line-height:1.62;color:var(--q);flex:1;}
.case .go{font-size:13px;font-weight:600;margin-top:auto;padding-top:10px;color:var(--i);}
.case .go::after{content:" →";}

/* ── the proof pair — lit slabs on paper; only the named card's copy
   declares its number verified on their systems, so it alone glows ── */
.proof-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:48px;}
.proof{background:#0A0A0A;color:var(--p);border:1px solid rgba(252,252,251,.3);border-radius:6px;padding:28px 32px;box-shadow:0 0 18px rgba(252,252,251,.09),0 0 48px rgba(252,252,251,.04);}
.proof .who{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--pl62);}
.proof p{margin:14px 0 0;font-family:var(--serif);font-optical-sizing:auto;font-weight:400;font-size:19px;line-height:1.5;color:var(--p);}
.proof p b{color:var(--p);font-weight:600;}
.proof .note{font-family:var(--sans);font-variant-numeric:tabular-nums;font-size:11.5px;letter-spacing:.02em;color:var(--pl62);margin-top:14px;}
.proof.named{border-color:rgba(130,233,170,.6);box-shadow:0 0 18px rgba(69,208,126,.2),0 0 52px rgba(69,208,126,.09);}
.proof.named .who{color:#82E9AA;}
.proof.named .note{color:#45D07E;}

/* ── the pilot close ── */
#pilot{padding-bottom:0;}
.pilot-card{margin-top:44px;}
.pilot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
.pilot-grid .pt{border:1px solid rgba(20,20,20,.18);border-radius:6px;padding:22px 24px;font-size:13.5px;line-height:1.6;color:var(--q);}
.pilot-grid .pt strong{display:block;color:var(--i);font-weight:600;margin-bottom:8px;font-size:14.5px;}
.pilot-card .btn{margin-top:30px;gap:5px;} /* flex eats the source space before .tel */
.pilot-card .tel{font-variant-numeric:tabular-nums;}

@media (max-width:960px){
  .chero{padding:56px 0 80px;}
  #stand{padding-top:84px;}
  .gsec{padding-top:96px;}
  .cases,.proof-cards,.pilot-grid{grid-template-columns:minmax(0,1fr);}
  .cases,.proof-cards{margin-top:40px;}
  .gap-row{grid-template-columns:40px minmax(0,1fr);gap:14px;}
}
