/* Coupons V3 — Featured Offer + Side Feed */
.cpn.v3 {

    /* Heading (h4 → fnt_t-1) — Bayon 100px / lh 0.9 / mixed case */
    --fnt-t-1-tt: none;
    --fnt-t-1-lh: 0.9;

    /* Subhead (h5 → fnt_t-2) — Albert Sans 27px / lh 40px */
    --fnt-t-2-s: 1.5rem;
    --fnt-t-2-lh: 1.48;

    /* Card border-radius — Figma 24px (both outer and inner ticket) */
    --bdr-rds-crd: 1.33rem;

    /* Section theme bg — captured at section root using stable :root tokens
       (--lt-bg / --dk-bg never get redefined by inner .ulk-bg scopes, unlike --main-bg) */
    --cpn-v3-sec-bg: var(--lt-bg);

    &[data-colors="alternate-light"] { --cpn-v3-sec-bg: var(--lt-alt-bg); }
    &[data-colors="primary-dark"]    { --cpn-v3-sec-bg: var(--dk-bg); }
    &[data-colors="alternate-dark"]  { --cpn-v3-sec-bg: var(--dk-alt-bg); }

    /* ─── Featured card (left column) ─────────────────────────────── */

   .five-8ths {
        > .pd_v.pd_h {
            padding: 2.22rem;   
        }

        ul {
            padding-top: 3rem;
            padding-bottom: 0;
        }

        .cpn-ntch {
            &::before, &::after {
                --cpn-ntch-r: 1.33rem;
            }
        }
   }

    .cpn-v3-feat-tkt {
        --fnt-t-cpn-s: 5.56rem;
    }

    .cpn-v3-feat-tag {
        display: inline-block;
        font-weight: 700;
        font-size: 1rem;
        line-height: 1.6;
        padding: 0.22rem 0.89rem;
        border-radius: 50px;
        border: 1px solid var(--callout);
        background: rgb(1 104 120 / 0.1);
        color: var(--text-color);
    }

    /* ─── Side feed cards ─────────────────────────────────────────── */
    .cpn-v3-list {
        padding-top: 0;

        .cpn-ntch {
            &::before, &::after {
                background-color: var(--cpn-v3-sec-bg);
                --cpn-ntch-r: .67rem;
            }
        }

        .cpn-lyt {
            margin-top: 0;
        }
    }

    .cpn-v3-side {
        --fnt-t-cpn-s: 3.78rem;

        .lgo {
            display: none;
        }

    }

    .cpn-v3-side .prc { color: var(--text-color); }

    .cpn-v3-side .ttl {
        font-weight: 600;
        font-size: 1.11rem;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--buttons);
    }

    .cpn-v3-side .dis {
        font-weight: 400;
        font-size: 0.89rem;
        line-height: 1.6;
    }

    /* List gap — Figma 24px between side cards */
    .cpn-v3-list {
        --grd-sp-dyn: 1.33rem;
    }

    /* Desktop padding overrides */
    @media (min-width: 1280px) {
        .cpn-v3-feat .pd_v.pd_h {
            padding: 2.22rem;
        }
        .cpn-v3-feat-tkt.pd_v.pd_h {
            padding: 3.56rem 2.22rem 2.22rem;
        }
        .cpn-v3-side .pd_v.pd_h {
            padding: 2.22rem;
        }
    }
}