/* We want to hide the browser's default arrow marker on summary elements. Admittedly, it's complicated. */
    details.c-faq-item summary {
        /* Blink 89+ and Firefox will hide the arrow when display is changed from (new) default of `list-item` to block.  https://chromestatus.com/feature/6730096436051968*/
        display: block;
    }
    /* Safari and Blink <=88 require using the -webkit-details-marker selector */
    details.c-faq-item summary::-webkit-details-marker {
        display: none;
    }
    details.c-faq-item .c-faq-item__summary {
        display: flex;
        align-items: center;
        cursor: pointer;
    }
    details.c-faq-item .c-faq-item__summary:focus {
            outline: none;
            /* box-shadow: 0 0 0 1px hsl(217, 89%, 61%); */
        }
    details.c-faq-item .c-faq-item__summary__title {
            flex: 1;
            font-weight: bold;
            font-size: 1.5em;
        }
    details.c-faq-item .c-faq-item__summary__icon {
            width: 24px;
            height: 24px;
        }
    details.c-faq-item .c-faq-item__summary__icon g {
                transform: translateY(17%);
            }
    details.c-faq-item .c-faq-item__summary__icon rect {
                fill: currentColor;
                stroke: currentColor;
                transform-origin: 50%;
                transition: transform 300ms;
            }
    details.c-faq-item .c-faq-item__summary__icon rect:first-child {
                    transform: rotate(-42deg);
                }
    details.c-faq-item .c-faq-item__summary__icon rect:last-child {
                    transform: rotate(42deg);
                }
    details.c-faq-item .c-faq-item__summary:hover,
    details.c-faq-item .c-faq-item__summary:focus,
    details.c-faq-item[open] > .c-faq-item__summary {
        color: var(--orange);
    }
    details.c-faq-item[open] > .c-faq-item__summary .c-faq-item__summary__icon g {
            transform: translateY(-17%);
        }
    details.c-faq-item[open] > .c-faq-item__summary .c-faq-item__summary__icon rect:first-child {
                transform: rotate(42deg);
            }
    details.c-faq-item[open] > .c-faq-item__summary .c-faq-item__summary__icon rect:last-child {
                transform: rotate(-42deg);
            }
