/* Shared objective layout + scroll reveal for injections landing widgets */

.vina-obj-canvas {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.vina-obj-el {
    min-width: 0;
    box-sizing: border-box;
}

.vina-inj {
    --vina-inj-dur: 0.7s;
    --vina-inj-stagger: 0.1s;
    --vina-inj-font-heading: 'Peyda', Tahoma, sans-serif;
    --vina-inj-font-body: 'Yekan Bakh', Tahoma, sans-serif;
    position: relative;
    width: 100%;
}

[class*="elementor-widget-vina_injections"] .vina-inj-t--heading,
[class*="elementor-widget-vina_injections"] h1,
[class*="elementor-widget-vina_injections"] h2,
[class*="elementor-widget-vina_injections"] h3,
[class*="elementor-widget-vina_injections"] h4,
[class*="elementor-widget-vina_injections"] .vina-inj-hero__title,
[class*="elementor-widget-vina_injections"] .vina-inj-trust__value,
[class*="elementor-widget-vina_injections"] .vina-inj-compare__th,
[class*="elementor-widget-vina_injections"] .vina-inj-compare__card-title,
[class*="elementor-widget-vina_injections"] .vina-inj-faq__question {
    font-family: var(--vina-inj-font-heading);
}

[class*="elementor-widget-vina_injections"] .vina-inj-t--body,
[class*="elementor-widget-vina_injections"] p,
[class*="elementor-widget-vina_injections"] li,
[class*="elementor-widget-vina_injections"] span,
[class*="elementor-widget-vina_injections"] label,
[class*="elementor-widget-vina_injections"] input,
[class*="elementor-widget-vina_injections"] select,
[class*="elementor-widget-vina_injections"] textarea,
[class*="elementor-widget-vina_injections"] button,
[class*="elementor-widget-vina_injections"] a {
    font-family: var(--vina-inj-font-body);
}

.vina-inj__inner {
    width: 100%;
    margin-inline: auto;
    padding-inline: clamp(16px, 4vw, 48px);
}

.vina-inj--animate .vina-inj__reveal {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity var(--vina-inj-dur) cubic-bezier(0.22, 1, 0.36, 1),
        transform var(--vina-inj-dur) cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: calc(var(--vina-inj-stagger, 0.1s) * var(--vina-inj-reveal-i, 0));
}

.vina-inj.is-visible .vina-inj__reveal {
    opacity: 1;
    transform: none;
}

.elementor-edit-mode .vina-inj--animate .vina-inj__reveal,
.elementor-editor-active .vina-inj--animate .vina-inj__reveal {
    opacity: 1;
    transform: none;
    transition: none;
}

@media (prefers-reduced-motion: reduce) {
    .vina-inj--animate .vina-inj__reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}