/* The shared pricing section (templates/deedpoll_app/_pricing_panel.html):
   the cost guide and the prenup page. Editorial, not a card: rules between
   rows, the post's own type, one tint on our row so the reader finds it. */

.prc { margin: 2.5rem 0; }
.prc h3 { margin-top: 2rem; }
.prc-lead { margin-bottom: 1rem; }

.prc-table-wrap { overflow-x: auto; margin: 0 0 .75rem; }
.prc-table { width: 100%; border-collapse: collapse; font-size: .95rem; line-height: 1.5; }
.prc-table th,
.prc-table td { text-align: left; vertical-align: top; padding: .75rem .9rem; border-bottom: 1px solid #e2e8f0; }
/* Set outright, not inherited: the blog's own table styles paint the header row navy. */
.prc-table thead th { font-weight: 600; color: #fff; background: #003366; border-bottom: 0; white-space: nowrap; }
.prc-table tbody th { font-weight: 600; width: 22%; }
.prc .visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.prc-table tbody th a { color: #003366; text-decoration: underline; text-underline-offset: 2px; }
.prc-table tbody th small { display: block; font-weight: 400; color: #5b6b80; }
.prc-table .prc-price { font-weight: 600; min-width: 9rem; }
.prc-table tr.prc-ours { background: #f3f7fc; }

.prc-note { font-size: .875rem; color: #5b6b80; }

.prc-packages { display: grid; grid-template-columns: 1fr 1fr; gap: 1.75rem; margin: 1rem 0 0; }
.prc-packages > div { border-top: 1px solid #c8d3e1; padding-top: .9rem; }
.prc-packages dt { font-weight: 600; color: #003366; }
.prc-packages dd { margin: 0 0 .5rem; }
.prc-packages .prc-amount { font-size: 1.6rem; font-weight: 700; color: #003366; line-height: 1.2; margin: .25rem 0 .6rem; }

.prc-excluded { padding-left: 1.2rem; }
.prc-excluded li { margin-bottom: .4rem; }

.prc-links { margin-top: 1.5rem; }
.prc-links span { margin: 0 .5rem; color: #8a97a8; }

@media (max-width: 640px) {
    .prc-packages { grid-template-columns: 1fr; gap: 1.25rem; }

    /* One provider per block: the header row hides and each cell says what it is. */
    .prc-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .prc-table,
    .prc-table tbody,
    .prc-table tr,
    .prc-table th,
    .prc-table td { display: block; width: 100%; }
    .prc-table tr { border-bottom: 1px solid #c8d3e1; padding: .75rem .75rem; }
    /* .prc in front so these beat the blog's own table cell padding and widths. */
    .prc .prc-table tbody th,
    .prc .prc-table td { border: 0; padding: .2rem 0; width: 100%; }
    .prc-table td::before { content: attr(data-label) ": "; font-weight: 600; color: #5b6b80; }
    .prc-table .prc-price { min-width: 0; }
}