/* Pop It Play Unified v0.15.3 HF4
   Corrective colour treatment: one solid brand colour per H1 word and a solid Book play CTA. */

/* HF3 used a gradient clipped through every letter. Reset that treatment first. */
body.pip-public-hf1 main h1:not(.hero-display) {
    display: inline-block;
    color: #037bfc;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
    text-fill-color: currentColor;
}

/* Each complete word receives one solid Pop It Play colour. */
body.pip-public-hf1 main h1:not(.hero-display) .pip-heading-word {
    display: inline;
    color: var(--pip-word-colour, #037bfc);
    -webkit-text-fill-color: currentColor;
}
body.pip-public-hf1 .pip-heading-word-red { --pip-word-colour: #ef3340; }
body.pip-public-hf1 .pip-heading-word-blue { --pip-word-colour: #037bfc; }
body.pip-public-hf1 .pip-heading-word-green { --pip-word-colour: #04983a; }
body.pip-public-hf1 .pip-heading-word-yellow { --pip-word-colour: #b98500; }
body.pip-public-hf1 .pip-heading-word-purple { --pip-word-colour: #8b48bd; }

/* Keep menu links colourful, but remove HF3's gradient active state. */
body.pip-public-hf1 .site-nav > a.active:not(.nav-book) {
    background-image: none;
    box-shadow: 0 7px 18px rgba(20, 56, 91, .11);
}
body.pip-public-hf1 .site-nav > a:nth-of-type(4n+1).active:not(.nav-book) {
    color: #a91e2a;
    background-color: #ffe4e7;
    border-color: #f8aeb7;
}
body.pip-public-hf1 .site-nav > a:nth-of-type(4n+2).active:not(.nav-book) {
    color: #715700;
    background-color: #fff2b8;
    border-color: #e7cd58;
}
body.pip-public-hf1 .site-nav > a:nth-of-type(4n+3).active:not(.nav-book) {
    color: #066d2a;
    background-color: #dcf8e4;
    border-color: #82dca0;
}
body.pip-public-hf1 .site-nav > a:nth-of-type(4n).active:not(.nav-book) {
    color: #0758a3;
    background-color: #dceeff;
    border-color: #8bc7ff;
}

/* Book play is deliberately one solid colour, not a rainbow/gradient. */
body.pip-public-hf1 .site-nav > .nav-book {
    background: #037bfc;
    background-image: none;
    color: #fff;
    border: 0;
    box-shadow: 0 8px 18px rgba(3, 123, 252, .22);
}
body.pip-public-hf1 .site-nav > .nav-book:hover,
body.pip-public-hf1 .site-nav > .nav-book:focus-visible {
    background: #026bd8;
    background-image: none;
    color: #fff;
    filter: none;
}

@media (forced-colors: active) {
    body.pip-public-hf1 main h1:not(.hero-display),
    body.pip-public-hf1 main h1:not(.hero-display) .pip-heading-word {
        color: CanvasText;
        -webkit-text-fill-color: currentColor;
    }
    body.pip-public-hf1 .site-nav > .nav-book {
        background: ButtonFace;
        color: ButtonText;
        border: 1px solid ButtonText;
    }
}