.cpn.v5 {

    /* -- Font overrides ----------------------------------- */
    --tag-ff: var(--fnt-t);
    --tag-tt: uppercase;

    --fnt-t-2-tt: uppercase;

    --fnt-t-nt-lh: 1.5;

    /* -- Strip -------------------------------------------- */
    .coupons-v5-strip {
        border: 2px dashed hsl(from var(--bdr-clr) h s l / 0.22);
        border-radius: 0.889rem;
        padding-inline: 3.11rem;
        padding-block: 2.22rem;
    }

    /* -- Left group --------------------------------------- */
    .coupons-v5-left {
        gap: 1.78rem;
    }

    /* -- Badge -------------------------------------------- */
    .coupons-v5-badge {
        background: var(--accent);
        border-radius: 0.667rem;
        padding: 0.889rem 1.111rem;
        flex-shrink: 0;
    }

    /* -- Offer text --------------------------------------- */
    .coupons-v5-offer {
        max-width: 31.11rem;
    }

    /* -- Right group -------------------------------------- */
    .coupons-v5-right {
        gap: 0.667rem;
        flex-shrink: 0;
    }

    /* -- Expiry ------------------------------------------- */
    .coupons-v5-expiry {
        gap: 0.111rem;
    }

    .fnt_t-6.cstm {
        --fnt-t-6-s-d: 1.111rem;
        --title-color: hsl(from var(--text-color) h s l / 0.75);
    }

    /* -- CTA button --------------------------------------- */
    .coupons-v5-cta {
        border-radius: 0.444rem;
    }

    /* -- Phone line --------------------------------------- */
    .coupons-v5-phone {
        gap: 0.333rem;
    }

    /* -- Label opacity classes ----------------------------- */
    .coupons-v5-lbl-hi {
        color: hsl(from var(--text-color) h s l / 0.7);
        --tag-ls: 0.167em;
        padding: 0;
        border: none;
    }

    .tag.cstm {
        color: hsl(from var(--text-color) h s l / 0.45);
        --tag-ls: 0.25em;
        padding: 0;
        border: none;
    }

    .coupons-v5-badge .coupons-v5-lbl-hi:last-child {
        --tag-ls: 0.083em;
    }

    .fnt_t-nt.cstm {
        --fnt-t-nt-s-d: 0.778rem;
        --title-color: hsl(from var(--text-color) h s l / 0.4);
    }

    @media screen and (min-width:1280px) {
        & {
            --fnt-t-cpn-s: 2.444rem;
            --tag-s: .667rem;
            --fnt-phn-s: 0.889rem;
        }
    }

    /* -- Mobile ------------------------------------------- */
    @media screen and (max-width: 1279px) {
        .coupons-v5-strip {
            padding: 2.22rem 1.78rem;
            text-align: center;
        }

        .coupons-v5-left {
            flex-direction: column;
            align-items: center;
            gap: 1.33rem;
        }

        .coupons-v5-offer {
            max-width: 100%;
        }

        .coupons-v5-right {
            margin-top: 1.78rem;
        }
    }
}