.cngexpo-hero {
    --cngexpo-hero-accent: var(--e-global-color-primary, #b6252a);
    position: relative;
    background: #252d31;
}

.cngexpo-hero__media {
    position: relative;
    aspect-ratio: 16 / 9;
    background: #111;
}

.cngexpo-hero__media > :is(video, img) {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cngexpo-hero__actions {
    display: flex;
    justify-content: center;
    padding: 16px 20px;
}

.cngexpo-hero__buttons {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    gap: 12px;
    width: max-content;
    max-width: 100%;
}

.cngexpo-hero__buttons .cngexpo-hero__button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 56px;
    padding: 12px 24px;
    border: 2px solid transparent;
    border-radius: 8px;
    font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    text-decoration: none;
    overflow-wrap: anywhere;
    transition: background-color .25s ease, border-color .25s ease, translate .25s ease;
}

.cngexpo-hero__button-icon {
    flex: none;
}

.cngexpo-hero__buttons .cngexpo-hero__button--white {
    background-color: #fff;
    border-color: #fff;
    color: #252d31;
}

.cngexpo-hero__buttons .cngexpo-hero__button--white:hover {
    background-color: #f1f2f3;
    border-color: #f1f2f3;
}

.cngexpo-hero__buttons .cngexpo-hero__button--primary {
    background-color: var(--cngexpo-hero-accent);
    border-color: var(--cngexpo-hero-accent);
    color: #fff;
}

.cngexpo-hero__buttons .cngexpo-hero__button--primary:hover {
    background-color: color-mix(in srgb, var(--cngexpo-hero-accent) 88%, #000);
    border-color: color-mix(in srgb, var(--cngexpo-hero-accent) 88%, #000);
}

.cngexpo-hero__button:hover {
    translate: 0 -2px;
}

.cngexpo-hero .cngexpo-hero__button:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
    box-shadow: 0 0 0 3px #252d31;
}

@media (min-width: 1025px) {
    .cngexpo-hero--has-media .cngexpo-hero__actions {
        position: absolute;
        inset-inline: 0;
        top: 68%;
        padding-block: 0;
    }
}

@media (max-width: 1024px) {
    .cngexpo-hero__buttons {
        width: min(100%, 420px);
    }

    .cngexpo-hero__buttons .cngexpo-hero__button {
        min-height: 48px;
        padding: 10px 12px;
    }
}

@media (max-width: 767px) {
    .elementor-widget-cngexpo-hero:not(.cngexpo-hero--show-mobile-icon) .cngexpo-hero__button-icon {
        display: none;
    }
}

@media (max-width: 359px) {
    .cngexpo-hero__buttons {
        grid-auto-flow: row;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cngexpo-hero__buttons .cngexpo-hero__button {
        transition: none;
        translate: none;
    }
}