.wpcm-tpgm,
.wpcm-tpgm * {
    box-sizing: border-box;
}

.wpcm-tpgm {
    width: 100%;
    max-width: var(--wpcm-tpgm-max-width, 1600px);
    min-height: var(--wpcm-tpgm-height, 420px);
    margin: 0 auto 24px;
    position: relative;
    overflow: hidden;
    border-radius: var(--wpcm-tpgm-radius, 16px);
    background: var(--wpcm-tpgm-bg, #0b6508);
    font-family: var(--wpcm-tpgm-body-font, Arial, Helvetica, sans-serif);
}

.wpcm-tpgm-track {
    position: relative;
    width: 100%;
    min-height: var(--wpcm-tpgm-height, 420px);
}

.wpcm-tpgm-slide {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: var(--wpcm-tpgm-image-width, 50%) var(--wpcm-tpgm-content-width, 50%);
    min-height: var(--wpcm-tpgm-height, 420px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .42s ease, visibility .42s ease;
}

.wpcm-tpgm-slide.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 2;
}

.wpcm-tpgm-image {
    display: block;
    width: 100%;
    min-height: var(--wpcm-tpgm-height, 420px);
    background-size: cover;
    background-position: var(--wpcm-tpgm-img-pos, center center);
    background-repeat: no-repeat;
    position: relative;
    text-decoration: none !important;
}

.wpcm-tpgm-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, var(--wpcm-tpgm-overlay, .18));
    pointer-events: none;
}

.wpcm-tpgm-content {
    background: var(--wpcm-tpgm-bg, #0b6508);
    color: var(--wpcm-tpgm-text, #fff);
    min-height: var(--wpcm-tpgm-height, 420px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--wpcm-tpgm-pad-y, 36px) var(--wpcm-tpgm-pad-x, 46px) calc(var(--wpcm-tpgm-pad-y, 36px) + 34px);
}

.wpcm-tpgm-content-inner {
    width: 100%;
    max-width: 720px;
}

.wpcm-tpgm-title {
    margin: 0;
    color: var(--wpcm-tpgm-text, #fff);
    font-family: var(--wpcm-tpgm-title-font, Georgia, "Times New Roman", serif);
    font-size: var(--wpcm-tpgm-title-size, 40px);
    line-height: var(--wpcm-tpgm-title-lh, 1.05);
    font-weight: 700;
    letter-spacing: -0.025em;
}

.wpcm-tpgm-title a,
.wpcm-tpgm-title a:visited,
.wpcm-tpgm-title a:hover,
.wpcm-tpgm-title a:focus {
    color: inherit;
    text-decoration: none !important;
    box-shadow: none !important;
}

.wpcm-tpgm-excerpt {
    margin: 22px auto 0;
    color: var(--wpcm-tpgm-muted, #a9c9a7);
    font-family: var(--wpcm-tpgm-body-font, Arial, Helvetica, sans-serif);
    font-size: var(--wpcm-tpgm-excerpt-size, 16px);
    line-height: 1.55;
    font-weight: 700;
    max-width: 760px;
}

.wpcm-tpgm-meta {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin: 0 0 14px;
    color: var(--wpcm-tpgm-muted, #a9c9a7);
    font-family: var(--wpcm-tpgm-body-font, Arial, Helvetica, sans-serif);
    font-size: var(--wpcm-tpgm-meta-size, 13px);
    line-height: 1.4;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .055em;
}

.wpcm-tpgm-meta span:not(:last-child)::after {
    content: "•";
    margin-left: 14px;
    opacity: .55;
}

.wpcm-tpgm-readmore {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 22px;
    padding: 10px 18px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.32);
    color: var(--wpcm-tpgm-text, #fff) !important;
    text-decoration: none !important;
    font-weight: 800;
    font-size: 13px;
    letter-spacing: .02em;
    transition: background .2s ease, transform .2s ease;
}

.wpcm-tpgm-readmore:hover {
    background: rgba(255,255,255,.12);
    transform: translateY(-1px);
}

.wpcm-tpgm-arrow {
    position: absolute;
    bottom: 18px;
    z-index: 7;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 999px;
    background: var(--wpcm-tpgm-arrow-bg, #1f7d1f);
    color: #fff;
    font-size: 32px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: filter .2s ease, transform .2s ease, opacity .2s ease;
    opacity: .96;
}

.wpcm-tpgm-arrow:hover,
.wpcm-tpgm-arrow:focus {
    filter: brightness(1.08);
    transform: translateY(-1px);
    outline: none;
}

.wpcm-tpgm-prev { left: 18px; }
.wpcm-tpgm-next { right: 18px; }

.wpcm-tpgm-dots {
    position: absolute;
    left: 50%;
    bottom: 34px;
    transform: translateX(-50%);
    z-index: 8;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 84px;
    pointer-events: auto;
}

.wpcm-tpgm-dot {
    width: 12px;
    height: 12px;
    border: 0;
    padding: 0;
    border-radius: 999px;
    background: var(--wpcm-tpgm-dot, #6c956c);
    cursor: pointer;
    opacity: .85;
    transition: width .2s ease, background .2s ease, opacity .2s ease;
}

.wpcm-tpgm-dot.is-active {
    background: var(--wpcm-tpgm-dot-active, #2f7df4);
    opacity: 1;
}

.wpcm-tpgm-empty {
    padding: 14px;
    border: 1px dashed #ccc;
    border-radius: 8px;
    background: #fffbe6;
}

@media (max-width: 1024px) {
    .wpcm-tpgm,
    .wpcm-tpgm-track,
    .wpcm-tpgm-slide,
    .wpcm-tpgm-image,
    .wpcm-tpgm-content {
        min-height: var(--wpcm-tpgm-height-tablet, 360px);
    }

    .wpcm-tpgm-content {
        padding-left: max(24px, calc(var(--wpcm-tpgm-pad-x, 46px) * .72));
        padding-right: max(24px, calc(var(--wpcm-tpgm-pad-x, 46px) * .72));
    }
}

@media (max-width: 760px) {
    .wpcm-tpgm {
        min-height: 0;
        border-radius: min(var(--wpcm-tpgm-radius, 16px), 18px);
    }

    .wpcm-tpgm-track {
        min-height: 0;
    }

    .wpcm-tpgm-slide {
        position: relative;
        display: none;
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .wpcm-tpgm-slide.is-active {
        display: block;
    }

    .wpcm-tpgm-image {
        min-height: var(--wpcm-tpgm-mobile-image-h, 260px);
    }

    .wpcm-tpgm-content {
        min-height: 0;
        padding: 26px 22px 74px;
    }

    .wpcm-tpgm-title {
        font-size: var(--wpcm-tpgm-title-size-m, 28px);
        line-height: 1.08;
    }

    .wpcm-tpgm-excerpt {
        margin-top: 16px;
    }

    .wpcm-tpgm-arrow {
        bottom: 16px;
        width: 38px;
        height: 38px;
        font-size: 28px;
    }

    .wpcm-tpgm-prev { left: 14px; }
    .wpcm-tpgm-next { right: 14px; }

    .wpcm-tpgm-dots {
        bottom: 29px;
        max-width: calc(100% - 108px);
        overflow: hidden;
        gap: 7px;
        padding: 0;
    }

    .wpcm-tpgm-dot {
        width: 10px;
        height: 10px;
        flex: 0 0 auto;
    }
}