/* ---------------------------------------------------------------------------
   Print

   The utility tables are the most printed thing on this site, a tenant
   setting up power and water at a new address wants them on paper or in a PDF.
   Printed as-designed they arrive behind a full-bleed slate hero and a dark
   footer, so this strips the furniture and keeps the table.
   --------------------------------------------------------------------------- */
@media print {
    *,
    *::before,
    *::after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    .site-header,
    .utility-bar,
    .section-tabs,
    .site-footer,
    .cta-band,
    .area-map,
    .porch-hero .hero-photo,
    .skip-link,
    .nav-toggle,
    .flash {
        display: none !important;
    }

    .section {
        padding: 12pt 0 !important;
    }

    /* A portrait page takes the phone hero, whose top padding is there to
       show the photo. With the photo hidden it is an empty third of a page. */
    .porch-hero .hero-inner {
        padding-top: 0 !important;
    }

    /* A printed link is useless unless it says where it goes. Tel and mailto
       already read as their own text, so only http(s) gets the treatment. */
    a[href^="http"]::after {
        content: " (" attr(href) ")";
        font-size: 9pt;
        word-break: break-all;
    }

    table {
        border-collapse: collapse;
        page-break-inside: auto;
    }

    tr,
    .faq details {
        page-break-inside: avoid;
    }

    th,
    td {
        border: 1px solid #999 !important;
        padding: 4pt 6pt !important;
    }

    /* The print reset strips every background, so our column loses its juniper
       wash on paper. It keeps the emphasis in ink instead: a heavier rule down
       both sides and bold figures, so an owner reading the printed comparison
       still sees which column is ours. */
    .fee-table thead th:nth-child(2),
    .fee-table tbody td:nth-child(2) {
        border-left: 1.5pt solid #000 !important;
        border-right: 1.5pt solid #000 !important;
        font-weight: 700;
    }

    /* Collapsed answers print as nothing at all otherwise. */
    .faq details > div {
        display: block !important;
    }

    /* Masks and background-images do not print (the reset zeros backgrounds,
       and Chrome skips CSS masks). Real borders always ink. */
    .checklist li::before {
        -webkit-mask: none !important;
        mask: none !important;
        background: #000 !important;
        width: 7.5pt !important;
        height: 6.5pt !important;
        border: 0 !important;
        clip-path: polygon(50% 0, 100% 37%, 79% 37%, 79% 100%, 21% 100%, 21% 37%, 0 37%);
    }

    .checklist-open li::before {
        background: none !important;
        -webkit-mask: none !important;
        mask: none !important;
        border: 1.35pt solid #000 !important;
        border-left-width: 1.35pt !important;
        border-right-width: 1.35pt !important;
        border-bottom-width: 1.35pt !important;
        border-radius: 2pt;
        width: 11pt !important;
        height: 11pt !important;
    }
}