/* PCBFIX — shared styles for service/blog subpages (CSP-safe: no inline styles) */

/* ---------- Breadcrumb strip ---------- */
.bcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(156,163,175,.7)}
.bcrumb a{color:rgba(156,163,175,.9);text-decoration:none}
.bcrumb a:hover{color:#10b981}
.bcrumb .sep{color:#2e343b}

/* ---------- Long-copy rhythm ---------- */
.copy p{margin-top:.85rem;line-height:1.7;color:#9ca3af}
.copy p:first-child{margin-top:0}
.copy strong{color:#f3f4f6;font-weight:600}
.copy a{color:#f3f4f6;text-decoration:underline;text-decoration-color:#2e343b;text-underline-offset:4px}
.copy a:hover{text-decoration-color:#10b981}
.copy ul{margin-top:.6rem;display:grid;gap:.4rem}
.copy ul li{position:relative;padding-left:1.1rem;line-height:1.6;color:#9ca3af}
.copy ul li::before{content:"\00B7";position:absolute;left:0;top:0;color:#ea580c;font-weight:700}
.copy .hl-em{color:#10b981;font-weight:600}

/* ---------- FAQ accordion (native details, no JS) ---------- */
details.faq{border:1px solid #2e343b;background:#1e2226;border-radius:2px}
details.faq + details.faq{margin-top:.75rem}
details.faq summary{cursor:pointer;list-style:none;display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;font-family:JetBrains Mono,ui-monospace,monospace;font-size:.8rem;line-height:1.4;color:#f3f4f6}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary .chev{flex:none;margin-top:.1rem;font-family:JetBrains Mono,ui-monospace,monospace;font-size:.7rem;color:#f59e0b;transition:transform .15s ease}
details.faq[open] summary .chev{transform:rotate(90deg)}
details.faq summary:hover{background:rgba(245,158,11,.05)}
details.faq .faq-body{padding:0 1.1rem 1.1rem}
details.faq .faq-body p{margin-top:.6rem;line-height:1.7;color:#9ca3af;font-size:.875rem}
details.faq .faq-body p:first-child{margin-top:0}

/* ---------- Mini price/spec table (grid hairline style) ---------- */
.pricerow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem 1rem;align-items:baseline;border-top:1px solid #2e343b;padding:.8rem 0}
.pricerow:last-child{border-bottom:1px solid #2e343b}
.pricerow .pr-name{font-size:.875rem;color:#f3f4f6}
.pricerow .pr-name small{display:block;margin-top:.15rem;font-size:.75rem;color:#9ca3af}
.pricerow .pr-price{font-family:JetBrains Mono,ui-monospace,monospace;font-size:.875rem;font-weight:700;color:#10b981;white-space:nowrap}

/* ---------- Versus panel (reparatie vs recovery) ---------- */
.vs-col{border:1px solid #2e343b;background:#181b1e;border-radius:2px;padding:1.25rem}
.vs-col.good{border-top:2px solid #10b981}
.vs-col.bad{border-top:2px solid #f59e0b}
.vs-col h3{font-family:JetBrains Mono,ui-monospace,monospace;font-size:.8rem;text-transform:uppercase;letter-spacing:.14em;color:#f3f4f6}
.vs-col .vs-tag{font-family:JetBrains Mono,ui-monospace,monospace;font-size:9px;letter-spacing:.2em;text-transform:uppercase}
