Form JS (wpcode snippet with form js)

// Clean WPForms JavaScript - No Persistent Storage
document.addEventListener('DOMContentLoaded', function() {
    const FORM_ID = 63272;
    const form = document.querySelector('#wpforms-form-' + FORM_ID);
    const indicator = form?.querySelector('.wpforms-page-indicator');
    const progressBar = document.querySelector('#leadFormsProgress');
    if (!form || !indicator || !progressBar) return;
    
    // ===== MINIMAL CROSS-PATH DATA CAPTURE =====
    function captureCurrentPathData() {
        const data = {};
        
        // Only capture the 3 critical fields that get lost in path switches
        const criticalFields = ['2', '15', '49']; // booth, exhibit package, sponsor packages
        
        criticalFields.forEach(fieldId => {
            const inputs = form.querySelectorAll(`[name*="wpforms[fields][${fieldId}]"]`);
            inputs.forEach(input => {
                if (input.type === 'checkbox' && input.checked) {
                    if (!data[fieldId]) data[fieldId] = [];
                    data[fieldId].push(input.value || '1');
                } else if (input.type === 'radio' && input.checked) {
                    data[fieldId] = input.value;
                } else if (input.type !== 'checkbox' && input.type !== 'radio' && input.value) {
                    data[fieldId] = input.value;
                }
            });
        });
        
        return data;
    }
    
    // Send to server only when switching paths (not constantly)
    function sendPathDataToServer(data) {
        if (Object.keys(data).length === 0) return;
        
        const ajaxUrl = window.wpforms_settings?.ajaxurl || '/wp-admin/admin-ajax.php';
        
        fetch(ajaxUrl, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
            },
            body: new URLSearchParams({
                action: 'store_critical_form_data',
                form_id: FORM_ID,
                critical_data: JSON.stringify(data),
                _ajax_nonce: window.wpforms_settings?.nonce || ''
            })
        }).catch(error => {
            console.warn('Path data storage failed:', error);
        });
    }
    
    // ===== SPONSOR PACKAGES DATA =====
    const sponsorPackages = [
        {
            name: "gold sponsor",
            icon: "wallet-sponsor.png",
            price: "€4,000",
            soldOut: false,
            features: [
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on ICBC website sponsor page", icon: "globe-sponsor.png" },
                { text: "VIP Tickets to Conference - Four (4)", icon: "tickets4-sponsor.png" }
            ]
        },
        {
            name: "platinum sponsor",
            icon: "wallet-sponsor.png",
            price: "€6,000",
            soldOut: false,
            features: [ 
                { text: "YOUR AD in Conference Program - Two (2) Page Spread Ad", icon: "open-book-sponsor.png" },
                { text: "Logo on ICBC website sponsor page and on ICBC event HOMEPAGE", icon: "screen-globe-sponsor.png" },
                { text: "VIP Tickets to Conference - Six (6)", icon: "tickets6-sponsor.png" }
            ]
        },
        {
            name: "water and coffee station sponsor",
            icon: "coffee-maker-sponsor.png",
            price: "€5,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities for one of our two water and coffee station areas", icon: "coffee-maker-sponsor.png" },
                { text: "Logo on all printed promo material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as one of two water and coffee station sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as one of two water and coffee station sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "food court area sponsor",
            icon: "cloche-sponsor.png",
            price: "€5,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities for the food court area", icon: "cloche-sponsor.png" },
                { text: "Logo on all printed promo material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the food court area sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the food court area sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "registration desk sponsor",
            icon: "clipboard-sponsor.png",
            price: "€5,000",
            soldOut: true,
            features: [
                { text: "Branding opportunities throughout our registration area", icon: "clipboard-sponsor.png" },
                { text: "Logo on all printed promo material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the registration desk sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the registration desk sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "beer and pizza lounge sponsor",
            icon: "pizza-sponsor.png",
            price: "€7,500",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout the beer and pizza lounge area", icon: "pizza-sponsor.png" },
                { text: "Logo on all printed promo material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the beer and pizza lounge sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the beer and pizza lounge sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "exhibitor lounge sponsor",
            icon: "sofa-sponsor.png",
            price: "€7,500",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout exhibitor lounge area", icon: "sofa-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "book-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Logo on Conference homepage - as the exhibitor lounge sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the exhibitor lounge sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "360° video booth sponsor",
            icon: "camera-sponsor.png",
            price: "€7,500",
            soldOut: false,
            features: [
                { text: "Branding opportunity for 360° video booth with your branding on the booth walls and logo featured on all created videos", icon: "camera-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the 360° video booth sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the 360° video booth sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "corridors sponsor",
            icon: "landscape-sponsor.png",
            price: "€7,500",
            soldOut: false,
            features: [
                { text: "Branding opportunity for expo area corridors between Exhibitor Hall 1 & Exhibitor Hall 2", icon: "landscape-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the corridors sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the corridors sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "pharmacy meetup sponsor",
            icon: "doctor-sponsor.png",
            price: "€7,500",
            soldOut: true,
            features: [
                { text: "Branding opportunities for our Pharmacy Meetup area", icon: "doctor-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the Pharmacy Meetup sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the Pharmacy Meetup sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "event lanyard sponsor",
            icon: "id-badge-sponsor.png",
            price: "€10,000",
            soldOut: false,
            features: [
                { text: "Featuring your company's logo on all attendee lanyards", icon: "id-badge-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Logo on Conference homepage - as the event lanyard sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the event lanyard sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "program sponsor",
            icon: "program-sponsor.png",
            price: "€10,000",
            soldOut: false,
            features: [
                { text: "Featuring your company's logo on the front cover of all conference programs", icon: "program-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "screen-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the program sponsor", icon: "envelope-sponsor.png" },
                { text: "Logo on Conference homepage - as the program sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Featuring ICBC program with your logo on the official event app", icon: "phone-sponsor.png" }
            ]
        },
        {
            name: "badge sponsor",
            icon: "id-badge-sponsor.png",
            price: "€10,000",
            soldOut: false,
            features: [
                { text: "Featuring your company's logo on all conference badges", icon: "id-badge-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Logo on Conference homepage - as the badge sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the badge sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "bag sponsor",
            icon: "bag-sponsor.png",
            price: "€10,000",
            soldOut: false,
            features: [
                { text: "Featuring your company's logo on all conference bags", icon: "bag-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Logo on Conference homepage - as the bag sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the bag sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "on-site lounge sponsor",
            icon: "sofa-sponsor.png",
            price: "€10,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities for one of our three on-site lounges throughout the expo area", icon: "sofa-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the on-site lounge sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the on-site lounge sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Opportunity to feature your company name on the event map", icon: "folded-map-sponsor.png" }
            ]
        },
        {
            name: "key card sponsor",
            icon: "wallet-sponsor.png",
            price: "€12,500",
            soldOut: false,
            features: [
                { text: "Your company's logo as the sole sponsor on all hotel keycards", icon: "wallet-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the key card sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the key card sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "foyer 1 sponsor",
            icon: "box-circle-corners-sponsor.png",
            price: "€15,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout the Foyer 1 area", icon: "box-circle-corners-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Logo on Conference homepage - as the Foyer 1 sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as Foyer 1 sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "foyer 4 sponsor",
            icon: "uneven-box-circle-corners-sponsor.png",
            price: "€15,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout the Foyer 4 area", icon: "uneven-box-circle-corners-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "book-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Logo on Conference homepage - as the Foyer 4 sponsor", icon: "sheet-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the Foyer 4 sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "private evening reception sponsor",
            icon: "clink-glasses-sponsor.png",
            price: "€15,000",
            soldOut: false,
            features: [
                { text: "Space for hosting a private party for up to 30 guests from 18:00 to 20:00", icon: "clink-glasses-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the private evening reception sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the private evening reception sponsor", icon: "envelope-sponsor.png" },
                { text: "Featured listing of your event on the official event app", icon: "globe-sponsor.png" }
            ]
        },
        {
            name: "speed networking sponsor",
            icon: "3-people-sponsor.png",
            price: "€15,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout the speed networking area", icon: "3-people-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Logo on Conference homepage - as the speed networking sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the speed networking sponsor", icon: "envelope-sponsor.png" },
                { text: "Featuring your logo as a speed networking sponsor throughout the official event app", icon: "phone-sponsor.png" }
            ]
        },
        {
            name: "presidential suite sponsor",
            icon: "skyscraper-sponsor.png",
            price: "€15,000",
            soldOut: false,
            features: [
                { text: "Presidential suite room (250 sqm) on the 17th floor for three days", icon: "skyscraper-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the presidential suite sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the presidential suite sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "consumption lounge sponsor",
            icon: "cigarette-smoke-sponsor.png",
            price: "€20,000",
            soldOut: true,
            features: [
                { text: "Branding opportunities throughout the consumption lounge areas", icon: "cigarette-smoke-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the consumption lounge sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the consumption lounge sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "conference app sponsor",
            icon: "phone-sponsor.png",
            price: "€20,000",
            soldOut: false,
            features: [
                { text: "Your company logo on 100% of all conference app ads (starts two weeks before conference)", icon: "phone-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the conference app sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the conference app sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "medical pharma zone sponsor",
            icon: "cross-sponsor.png",
            price: "€25,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout the Medical Pharma Zone", icon: "cross-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the Medical Pharma Zone sponsor", icon: "envelope-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as the Medical Pharma Zone sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "grow pavilion sponsor",
            icon: "map-sponsor.png",
            price: "€25,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout the entire half of Exhibitor Hall 1 (2,500 sqm)", icon: "map-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "YOUR AD in Conference Program - Two (2) Pages Spread Ad", icon: "open-book-sponsor.png" },
                { text: "Logo on Conference homepage - as the Grow Pavilion sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the Grow Pavilion sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "vip reception sponsor",
            icon: "people-talking-sponsor.png",
            price: "€30,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout the VIP networking reception", icon: "people-talking-sponsor.png" },
                { text: "YOUR AD in Conference Program - Two (2) Pages Spread Ad", icon: "open-book-sponsor.png" },
                { text: "Your company's logo on every ICBC Berlin promo email", icon: "berlin-emails-sponsor.png" },
                { text: "Logo on Conference homepage - as the VIP reception sponsor", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the VIP reception sponsor", icon: "envelope-sponsor.png" }
            ]
        },
        {
            name: "icbc main atrium lounge sponsor",
            icon: "dome-sponsor.png",
            price: "€40,000",
            soldOut: false,
            features: [
                { text: "Branding opportunities throughout ICBC Main Atrium Lounge area", icon: "dome-sponsor.png" },
                { text: "YOUR AD in Conference Program - Two (2) Pages Spread Ad", icon: "open-book-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as the ICBC Main Atrium Lounge sponsor", icon: "envelope-sponsor.png" },
                { text: "Logo on Conference homepage - as the ICBC Main Atrium Lounge sponsor", icon: "screen-globe-sponsor.png" }
            ]
        },
        {
            name: "icbc sanctioned event sponsor",
            icon: "flag-sponsor.png",
            price: "€5,000",
            soldOut: false,
            features: [
                { text: "Featured listing of your event on ICBC website & official event app", icon: "flag-sponsor.png" },
                { text: "Logo on all printed conference material and print advertisements", icon: "screen-sponsor.png" },
                { text: "YOUR AD in Conference Program - Full Page Ad", icon: "sheet-sponsor.png" },
                { text: "Logo on Conference homepage - as one of five ICBC sanctioned event sponsors", icon: "screen-globe-sponsor.png" },
                { text: "Email to the entire Conference mailing list announcing your company as one of five ICBC sanctioned event sponsors", icon: "envelope-sponsor.png" },
                { text: "Featured listing of your event on ICBC schedule", icon: "schedule-listing-sponsor.png" }
            ]
        },
        {
            name: "not sure yet? – select this option",
            icon: "not-sure-sponsor.png",
            price: "N/A",
            soldOut: false,
            special: "notSure",
            features: [
                { text: "Contact us to discuss custom sponsorship opportunities", icon: "envelope-sponsor.png" }
            ]
        }
    ];
    
    // Progress bar logic
    function updateProgress(step) {
        progressBar.querySelectorAll('.progress-step').forEach((el, idx) => {
            el.classList.toggle('completed', idx < step - 1);
            el.classList.toggle('active', idx === step - 1);
        });
    }
    updateProgress(parseInt(indicator.getAttribute('aria-valuenow'), 10) || 1);
    new MutationObserver(muts => {
        muts.forEach(m => {
            if (m.attributeName === 'aria-valuenow') {
                const newStep = parseInt(indicator.getAttribute('aria-valuenow'), 10) || 1;
                updateProgress(newStep);
            }
        });
    }).observe(indicator, { attributes: true });
    
    // Unified input handling: radios & checkboxes
    function initInputs(selector) {
        document.querySelectorAll(selector).forEach(item => {
            const input = item.querySelector('input[type="checkbox"], input[type="radio"]');
            if (!input) return;
            item.addEventListener('click', e => {
                if (e.target.closest('.toggle-link')) return;
                if (input.type === 'radio') {
                    document.querySelectorAll(selector).forEach(i => i.classList.remove('selected'));
                    item.classList.add('selected');
                    input.checked = true;
                } else {
                    input.checked = !input.checked;
                    item.classList.toggle('selected', input.checked);
                }
                input.dispatchEvent(new Event('change', { bubbles: true }));
                item.querySelectorAll('.ripple-effect').forEach(r => r.remove());
                const ripple = document.createElement('div');
                ripple.className = 'ripple-effect';
                const rect = item.getBoundingClientRect();
                const x = e.clientX - rect.left, y = e.clientY - rect.top;
                Object.assign(ripple.style, {
                    position: 'absolute', borderRadius: '50%',
                    background: 'rgba(222,118,28,0.3)', width: '60px', height: '60px',
                    animation: 'ripple-expand 0.6s ease-out',
                    pointerEvents: 'none', zIndex: '5', left: `${x-30}px`, top: `${y-30}px`, transform: 'scale(0)'
                });
                item.style.position = 'relative';
                item.appendChild(ripple);
                setTimeout(() => ripple.remove(), 600);
            });
        });
    }
    initInputs('.exform-detail .wpforms-image-choices-item');
    initInputs('.exhibiting-packages .wpforms-image-choices-item');
    initInputs('.sponsor-packages li');
    
    // Helper for hidden path field
    function findHiddenField() {
        return document.querySelector('#wpforms-' + FORM_ID + '-field_52');
    }
    
    function triggerWPFormsConditionalLogic() {
        if (window.wpforms && window.wpforms.conditionalLogic) window.wpforms.conditionalLogic();
        if (window.wpforms && window.wpforms.conditional) window.wpforms.conditional();
        if (window.jQuery) {
            const $ = window.jQuery;
            $(form).trigger('wpformsConditionalLogic');
            $(form).trigger('wpformsFieldUpdate');
            $(form).trigger('wpformsProcessFieldsEnable');
        }
    }
    
    function switchFormPath(path) {
        const hiddenField = findHiddenField();
        if (!hiddenField) return;
        hiddenField.value = path === 'exhibit' ? '1' : '2';
        ['change','input','blur','keyup'].forEach(eventType =>
            hiddenField.dispatchEvent(new Event(eventType, { bubbles:true }))
        );
        setTimeout(triggerWPFormsConditionalLogic, 60);
        form.setAttribute('data-current-path', path);
        if (path === 'sponsor') {
            setTimeout(() => {
                if (window.initSponsorTab) window.initSponsorTab();
            }, 300);
        }
    }
    
    function navigateToPage(targetPage) {
        const currentPage = parseInt(indicator.getAttribute('aria-valuenow'), 10) || 1;
        if (targetPage === currentPage) return;
        if (targetPage > currentPage) form.querySelector('.wpforms-page-next')?.click();
        if (targetPage < currentPage) form.querySelector('.wpforms-page-prev')?.click();
        setTimeout(() => {
            if ((parseInt(indicator.getAttribute('aria-valuenow'), 10) || 1) !== targetPage)
                navigateToPage(targetPage);
        }, 170);
    }

    // ===== PILL-STYLE TAB SWITCHING LOGIC =====
    {
        const pillTabItems = document.querySelectorAll('.pill-tab-switcher .tab-item');
        const oldTabItems = document.querySelectorAll('.form-tabs-nav li');
        const tabItems = pillTabItems.length > 0 ? pillTabItems : oldTabItems;
        
        tabItems.forEach(tab => {
            tab.addEventListener('click', function(e) {
                e.preventDefault();
                
                tabItems.forEach(t => {
                    t.classList.remove('uk-active', 'active');
                    const link = t.querySelector('a');
                    if (link) {
                        link.setAttribute('aria-selected', 'false');
                        link.style.boxShadow = '';
                        link.style.background = '';
                        link.style.borderColor = '';
                    }
                });
                
                this.classList.add(pillTabItems.length > 0 ? 'active' : 'uk-active');
                const link = this.querySelector('a');
                if (link) {
                    link.setAttribute('aria-selected', 'true');
                }
                
                this.offsetHeight;
                
                let path = this.getAttribute('data-path');
                if (!path) {
                    const tabIndex = Array.from(tabItems).indexOf(this);
                    path = tabIndex === 0 ? 'exhibit' : 'sponsor';
                }
                
                switchFormPath(path);
                
                setTimeout(() => {
                    if (path === 'sponsor') {
                        navigateToPage(3);
                        setTimeout(() => window.initSponsorTab?.(), 400);
                    } else {
                        navigateToPage(1);
                    }
                }, 120);
            });
        });
    }

    // Cross-selection checkboxes - CAPTURE DATA ONLY WHEN SWITCHING PATHS
    const sponsorAlso = document.querySelector('#wpforms-' + FORM_ID + '-field_46_1');
    if (sponsorAlso) sponsorAlso.addEventListener('change', function() {
        if (this.checked) {
            // Capture exhibit data BEFORE switching to sponsor path
            const exhibitData = captureCurrentPathData();
            console.log('Capturing exhibit data before switch:', exhibitData);
            sendPathDataToServer(exhibitData);
            
            switchFormPath('sponsor');
            setTimeout(() => {
                navigateToPage(3);
                setTimeout(() => {
                    if (window.initSponsorTab) window.initSponsorTab();
                }, 400);
            }, 120);
        }
    });
    
    const exhibitorAlso = document.querySelector('#wpforms-' + FORM_ID + '-field_51_1');
    if (exhibitorAlso) exhibitorAlso.addEventListener('change', function() {
        if (this.checked) {
            // Capture sponsor data BEFORE switching to exhibit path
            const sponsorData = captureCurrentPathData();
            console.log('Capturing sponsor data before switch:', sponsorData);
            sendPathDataToServer(sponsorData);
            
            switchFormPath('exhibit');
            setTimeout(() => { navigateToPage(1); }, 120);
        }
    });
    
    // Move HTML block ID 5 below submit button (Exhibit Step 1)
    function moveHtmlBlockBelowSubmit() {
        setTimeout(() => {
            const htmlBlock = document.querySelector('#el-5');
            const submitContainer = form.querySelector('.wpforms-pagebreak-center');
            if (htmlBlock && submitContainer && !htmlBlock.classList.contains('moved-below')) {
                htmlBlock.classList.add('moved-below');
                submitContainer.parentNode.insertBefore(htmlBlock, submitContainer.nextSibling);
            }
        }, 500);
    }
    
    // ===== SPONSOR INITIALIZATION FUNCTION =====
    window.initSponsorTab = function() {
        const detailsMap = {};
        const rightMap = {};
        
        sponsorPackages.forEach(pkg => {
            const detailItems = pkg.features.map(f => {
                const iconStyle = pkg.soldOut ? 'filter: grayscale(100%) brightness(0.7);' : '';
                return `<li><img src="/wp-content/uploads/2025/09/${f.icon}" alt="" style="${iconStyle}">${f.text}</li>`;
            }).join('');
            
            detailsMap[pkg.name] = `<ul class="details">${detailItems}</ul>`;
            
            const ticketFeature = pkg.features.find(f => f.text.toLowerCase().includes("vip tickets"));
            if (ticketFeature) {
                rightMap[pkg.name] = `<div class="ticket-text">${ticketFeature.text.split(" - ")[1]}</div>`;
            } else {
                let iconStyle = '';
                let iconSize = '';
                
                if (pkg.special === "notSure") {
                    iconSize = 'width: 145px; height: 90px;';
                } else if (pkg.soldOut) {
                    iconStyle = 'filter: grayscale(100%) brightness(0.7);';
                }
                
                rightMap[pkg.name] = `<img src="/wp-content/uploads/2025/09/${pkg.icon}" alt="${pkg.name} Icon" class="choice-icon" style="${iconStyle}${iconSize}">`;
            }
        });
        
        document.querySelectorAll('.sponsor-packages li').forEach(item => {
            const label = item.querySelector('label');
            if (!label) return;
            
            const text = label.textContent.toLowerCase();
            if (item.querySelector('.sponsor-title-wrapper')) return;
            
            let key = Object.keys(detailsMap).find(k => text.includes(k));
            if (!key) return;
            
            const pkg = sponsorPackages.find(p => p.name === key);
            if (!pkg) return;
            
            let titleStyle = '';
            if (pkg.soldOut) {
                titleStyle = 'color: #ADADAD;';
            } else if (pkg.special === "notSure") {
                titleStyle = 'color: #4B7489;';
            }
            
            const original = label.textContent;
            label.outerHTML = `
                <div class="sponsor-title-wrapper">
                    <div class="sponsor-label-row">
                        <h5 class="sponsor-title" style="${titleStyle}">${original}</h5>
                        ${rightMap[key]}
                    </div>
                </div>
            `;
			
			if (!text.includes('not sure')) {
				item.querySelector('.sponsor-title-wrapper')
					.insertAdjacentHTML('afterend',
						`<a class="toggle-link"><span class="arrow" uk-icon="icon: chevron-down; ratio: 1"></span> View all features</a>`
						+ detailsMap[key]
					);
			} else {
				item.querySelector('.sponsor-title-wrapper')
					.insertAdjacentHTML('afterend',
						`<div class="height-spacer" style="height: 24px; display: block;">&nbsp;</div>`
					);
			}
            
            item.addEventListener('click', function(e) {
                const isToggle = e.target.closest('.toggle-link') || e.target.tagName === 'SVG';
                if (isToggle) {
                    e.preventDefault();
                    const details = this.querySelector('.details');
                    const link = this.querySelector('.toggle-link');
                    const expanded = details?.classList.contains('expanded');
                    
                    document.querySelectorAll('.sponsor-packages .details').forEach(d => d.classList.remove('expanded'));
                    document.querySelectorAll('.sponsor-packages .toggle-link').forEach(t => {
                        t.classList.remove('expanded');
                        t.innerHTML = '<span class="arrow" uk-icon="icon: chevron-down; ratio: 1"></span> View all features';
                    });
                    
                    if (!expanded && details) {
                        details.classList.add('expanded');
                        link.classList.add('expanded');
                        link.innerHTML = '<span class="arrow" uk-icon="icon: chevron-down; ratio: 1"></span> Close';
                    }

                    setTimeout(() => {
                        if (details && details.classList.contains('expanded') && pkg.soldOut) {
                            if (!details.querySelector('.sold-out-overlay')) {
                                const overlay = document.createElement('img');
                                overlay.src = '/wp-content/uploads/2025/09/sold-out-package.png';
                                overlay.alt = 'Sold Out';
                                overlay.className = 'sold-out-overlay';
                                overlay.style.cssText = `
                                    position: absolute;
                                    top: 25%;
                                    left: 25%;
                                    width: 50%;
                                    height: 25%;
                                    pointer-events: none;
                                    z-index: 10;
                                    opacity: 0;
                                    transform: scale(0.8);
                                    transition: all 0.3s ease-out;
                                `;
                                details.style.position = 'relative';
                                details.appendChild(overlay);
                                requestAnimationFrame(() => {
                                    overlay.style.opacity = '0.95';
                                    overlay.style.transform = 'scale(1)';
                                });
                            }
                        }
                    }, 100);
                }
            });
        });
    };
    
    if (document.querySelector('.sponsor-packages')) {
        setTimeout(window.initSponsorTab, 200);
    }
    
    moveHtmlBlockBelowSubmit();
    
    const observer = new MutationObserver(() => {
        moveHtmlBlockBelowSubmit();
    });
    observer.observe(form, { childList: true, subtree: true });
    
    // Start on Exhibit path
    switchFormPath('exhibit');
});

// DISCOVERY SECTION VISIBILITY CONTROL
document.addEventListener('DOMContentLoaded', function() {
    setTimeout(function() {
        initDiscoveryVisibility();
    }, 2000);
});

function initDiscoveryVisibility() {
    const FORM_ID = 63272;
    const form = document.querySelector('#wpforms-form-' + FORM_ID);
    const indicator = form?.querySelector('.wpforms-page-indicator');
    const discoverySection = document.querySelector('.booth-discovery-section');
    
    if (!form || !indicator || !discoverySection) return;
    
    const style = document.createElement('style');
    style.textContent = `
        .booth-discovery-section {
            transition: opacity 0.3s ease-in-out !important;
        }
        
        .booth-discovery-section.discovery-hiding {
            opacity: 0 !important;
            pointer-events: none !important;
        }
        
        .booth-discovery-section.discovery-showing {
            opacity: 1 !important;
            pointer-events: auto !important;
        }
        
        .booth-discovery-section {
            display: flex !important;
            flex-wrap: wrap !important;
            align-items: center !important;
            justify-content: space-between !important;
            position: relative !important;
        }
        
        .booth-discovery-section > div:first-child {
            flex: 1 !important;
            max-width: none !important;
            width: auto !important;
            margin: 0 !important;
        }
        
        .booth-discovery-section > div:last-child {
            flex: 0 0 auto !important;
            max-width: none !important;
            width: auto !important;
            margin: 0 !important;
        }
    `;
    document.head.appendChild(style);
    
    function updateDiscoveryVisibility() {
        const currentPage = parseInt(indicator.getAttribute('aria-valuenow'), 10) || 1;
        const currentPath = form.getAttribute('data-current-path') || 'exhibit';
        
        const isExhibitStep1 = (currentPage === 1 && currentPath === 'exhibit');
        const isSponsorStep1 = (currentPage === 3 && currentPath === 'sponsor');
        const shouldShow = isExhibitStep1 || isSponsorStep1;
        
        discoverySection.classList.remove('discovery-hiding', 'discovery-showing');
        
        if (shouldShow) {
            discoverySection.style.display = 'block';
            discoverySection.style.visibility = 'visible';
            discoverySection.classList.add('discovery-showing');
        } else {
            discoverySection.classList.add('discovery-hiding');
            setTimeout(() => {
                if (discoverySection.classList.contains('discovery-hiding')) {
                    discoverySection.style.display = 'none';
                    discoverySection.style.visibility = 'hidden';
                }
            }, 300);
        }
    }
    
    const indicatorObserver = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (mutation.attributeName === 'aria-valuenow') {
                setTimeout(updateDiscoveryVisibility, 100);
            }
        });
    });
    indicatorObserver.observe(indicator, { attributes: true });
    
    const formObserver = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (mutation.attributeName === 'data-current-path') {
                setTimeout(updateDiscoveryVisibility, 100);
            }
        });
    });
    formObserver.observe(form, { attributes: true });
    
    document.addEventListener('click', function(e) {
        if (e.target.matches('.wpforms-page-next, .wpforms-page-prev')) {
            setTimeout(updateDiscoveryVisibility, 500);
        }
        if (e.target.closest('.form-tabs-nav li')) {
            setTimeout(updateDiscoveryVisibility, 500);
        }
    });
    
    updateDiscoveryVisibility();
}

Form Css (within yootheme html element with shortcode for form)

/* RESET AND GENERAL */
.el-element { 
    background-color: #FFFFFF; 
    padding: 1px; 
    border-radius: 8px;
    margin: 0 auto;
}
.wpforms-field-label { 
    text-align: center; 
}
h4 {
    font-size: 47px;
    margin: 2rem 0 1rem 0;
}

/* HIDE ALL WPFORMS DEFAULT STYLING COMPLETELY */
.wpforms-lead-forms-progress,
.wpforms-page-indicator {
    display: none !important;
}

/* FORCE HIDE WPFORMS IMAGE CHOICE STYLING */
.wpforms-image-choices-modern .wpforms-image-choices-item::before,
.wpforms-image-choices-modern .wpforms-image-choices-item::after,
.wpforms-image-choices .wpforms-image-choices-item::before,
.wpforms-image-choices .wpforms-image-choices-item::after,
.wpforms-image-choices-item .wpforms-image-choices-image::before,
.wpforms-image-choices-item .wpforms-image-choices-image::after {
    display: none !important;
    content: none !important;
}

/* HIDE WPFORMS CHECKMARKS AND OVERLAYS */
.wpforms-image-choices-item .wpforms-image-choices-image .wpforms-image-choices-overlay,
.wpforms-image-choices-item .wpforms-image-choices-image .wpforms-image-choices-selected {
    display: none !important;
}

/* STEP 1 - BOOTH SIZES LAYOUT - INCREASED WIDTH FOR LONGER LABELS */
.exform-detail .wpforms-image-choices {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-content: flex-start !important;
    gap: 20px !important;
    max-width: 900px !important;
    margin: 0 auto !important;
    list-style: none !important;
    padding: 0 !important;
}

/* Force first 5 items to stay together on first row */
.exform-detail .wpforms-image-choices li:nth-child(-n+5) {
    flex: 0 0 calc(20% - 16px) !important;
    max-width: 160px !important;
    margin-bottom: 20px !important;
}

/* Last 4 items with explicit width to center properly */
.exform-detail .wpforms-image-choices li:nth-child(n+6) {
    flex: 0 0 calc(20% - 16px) !important;
    max-width: 160px !important;
}

/* Center the second row by adding margins to first and last items of second row */
.exform-detail .wpforms-image-choices li:nth-child(6) {
    margin-left: calc(10% + 10px) !important;
}
.exform-detail .wpforms-image-choices li:nth-child(9) {
    margin-right: calc(10% + 10px) !important;
}

.exform-detail .wpforms-image-choices li {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding: 1rem !important;
    margin: 0 !important;
    background: rgba(255,255,255,0.8) !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    cursor: pointer !important;
    min-height: 140px !important;
    min-width: 120px !important;
    overflow: hidden !important;
}

.exform-detail .wpforms-image-choices li:hover {
    background: rgba(255,255,255,1) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
    transform: translateY(-2px) !important;
}

/* STEP 1 - COMPLETELY HIDE WPFORMS RADIO */
.exform-detail .wpforms-screen-reader-element {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* STEP 1 - CUSTOM RADIO BUTTON (NORMAL STATE) */
.exform-detail .wpforms-image-choices li::after {
    content: '' !important;
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    border: 2px solid #828282 !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    margin: 12px auto 0 auto !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 10 !important;
    flex-shrink: 0 !important;
}

/* STEP 1 - CUSTOM RADIO BUTTON (SELECTED STATE) */
.exform-detail .wpforms-image-choices li.selected::after {
    border-color: #DE761C !important;
    background: #ffffff !important;
    animation: orange-pulse 0.4s ease !important;
}

/* STEP 1 - ORANGE INNER CIRCLE WITH CHECKMARK */
.exform-detail .wpforms-image-choices li.selected::before {
    content: '\2713' !important;
    position: absolute !important;
    bottom: 1.25rem !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 16px !important;
    height: 16px !important;
    background: #DE761C !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: white !important;
    font-size: 10px !important;
    font-weight: bold !important;
    z-index: 15 !important;
    line-height: 1 !important;
}

/* STEP 1 - LABEL AND IMAGE LAYOUT */
.exform-detail .wpforms-image-choices label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    cursor: pointer !important;
    width: 100% !important;
    position: relative !important;
}

.exform-detail .wpforms-image-choices-label {
    font-size: 27px !important;
    font-family: 'Bebas Neue' !important;
    color: #333 !important;
    margin-bottom: 12px !important;
    order: 1 !important;
    white-space: nowrap !important;
}

.exform-detail .wpforms-image-choices-image {
    width: 80px !important;
    height: 80px !important;
    order: 2 !important;
    position: relative !important;
    overflow: visible !important;
}

.exform-detail .wpforms-image-choices-image img {
    width: 80px !important;
    height: 80px !important;
    display: block !important;
}

/* DISCOVERY SECTION */
.booth-discovery-section {
    position: relative !important;
    background-color: rgba(166, 225, 255, 0.1) !important;
    padding: 32px 16px !important;
    margin: 2rem !important;
    border-radius: 16px !important;
    border: 1px solid rgba(75, 116, 137, 0.2) !important;
}

.discovery-grid {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.discovery-content h5 {
    font-family: 'Bebas Neue', Arial, sans-serif !important;
    font-size: 1.5rem !important;
    color: #333 !important;
    margin: 0 !important;
    text-transform: uppercase !important;
}

.booth-discovery-section .uk-button {
    background: #ffffff !important;
    border: 1px solid #DE761C !important;
    color: #DE761C !important;
    padding: 8px 24px !important;
    border-radius: 16px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.booth-discovery-section .uk-button:hover {
    background: #DE761C !important;
    color: #ffffff !important;
}

/* STEP 2 – "Please note" box with gradient border */
.ltgreen-form {
    text-align: center;
    background-color: #f7fcf5;
    border-radius: 16px;
    padding: 32px 16px;
    max-width: 1000px;
    margin: 0 auto;
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-image:
        linear-gradient(#f7fcf5, #f7fcf5),
        linear-gradient(90deg, #ACE488 0%, #5F7E4B 100%);
    background-origin: padding-box, border-box;
    background-clip: padding-box, border-box;
}

/* STEP 2 - EXHIBITING PACKAGES LAYOUT */
.exhibiting-packages .wpforms-image-choices {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    gap: 20px !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
    list-style: none !important;
    padding: 0 !important;
}

/* First two choices - side by side */
.exhibiting-packages .wpforms-image-choices li:nth-child(1),
.exhibiting-packages .wpforms-image-choices li:nth-child(2) {
    flex: 0 0 calc(50% - 10px) !important;
    max-width: calc(50% - 10px) !important;
}

/* Third choice - full width */
.exhibiting-packages .wpforms-image-choices li:nth-child(3) {
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

.exhibiting-packages .wpforms-image-choices li {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding: 1rem !important;
    margin: 0 !important;
    background: rgba(255,255,255,0.8) !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    cursor: pointer !important;
    min-height: 140px !important;
    min-width: 120px !important;
    overflow: hidden !important;
    border: 2px solid #e5e5e5 !important;
}

.exhibiting-packages .wpforms-image-choices li:hover {
    background: rgba(255,255,255,1) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
    transform: translateY(-2px) !important;
    border-color: #DE761C !important;
}

.exhibiting-packages .wpforms-image-choices li.selected {
    border-color: #DE761C !important;
    background: #fff8f3 !important;
}

/* STEP 2 - HIDE WPFORMS RADIO */
.exhibiting-packages .wpforms-screen-reader-element {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* STEP 2 - CUSTOM RADIO BUTTON */
.exhibiting-packages .wpforms-image-choices li::after {
    content: '' !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    border: 2px solid #828282 !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    position: absolute !important;
    top: 1rem !important;
    right: 1rem !important;
    z-index: 10 !important;
    margin: 0 !important;
    transition: all 0.3s ease !important;
}

/* STEP 2 - SELECTED RADIO BUTTON */
.exhibiting-packages .wpforms-image-choices li.selected::after {
    content: '\2713' !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-color: #DE761C !important;
    background: radial-gradient(circle at center, #DE761C 0%, #DE761C 8px, #ffffff 8px, #ffffff 100%) !important;
    color: white !important;
    font-size: 11px !important;
    font-weight: bold !important;
    font-family: Arial, sans-serif !important;
    line-height: 1 !important;
}

/* Third choice - center radio vertically */
.exhibiting-packages .wpforms-image-choices li:nth-child(3)::after {
    top: 50% !important;
    transform: translateY(-50%) !important;
}

/* STEP 2 - LABELS */
.exhibiting-packages .wpforms-image-choices label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    cursor: pointer !important;
    width: 100% !important;
    position: relative !important;
}

.exhibiting-packages .wpforms-image-choices-label {
    font-size: 24px !important;
    font-family: 'Bebas Neue' !important;
    color: #333 !important;
    margin-bottom: 12px !important;
    order: 1 !important;
    text-transform: uppercase !important;
}

/* STEP 2 - IMAGES */
.exhibiting-packages .wpforms-image-choices-image {
    width: 100% !important;
    height: auto !important;
    order: 2 !important;
    position: relative !important;
    overflow: visible !important;
}

.exhibiting-packages .wpforms-image-choices-image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Third choice - center text and hide image */
.exhibiting-packages .wpforms-image-choices li:nth-child(3) {
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    min-height: 120px !important;
}

.exhibiting-packages .wpforms-image-choices li:nth-child(3) .wpforms-image-choices-image {
    display: none !important;
}

.exhibiting-packages .wpforms-image-choices li:nth-child(3) .wpforms-image-choices-label {
    font-size: 28px !important;
    margin: 0 !important;
}

/* ==============================================
   SPONSOR PACKAGES LAYOUT - STEP 3
   ============================================== */

/* FORCE SPONSOR FIELDS TO BE VISIBLE */
#wpforms-63272-field_48,
#wpforms-63272-field_49,
.wpforms-field-48,
.wpforms-field-49 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    margin: 0 auto !important;
    z-index: auto !important;
}

/* Ensure sponsor content containers are visible */
#wpforms-63272-field_48 .wpforms-field-container,
#wpforms-63272-field_49 .wpforms-field-container,
.wpforms-field-48 .wpforms-field-container,
.wpforms-field-49 .wpforms-field-container {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Override any conditional logic hiding */
[data-wpforms-conditional="hidden"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Force show when sponsor is selected */
#wpforms-form-63272[data-sponsor-active="true"] #wpforms-63272-field_48,
#wpforms-form-63272[data-sponsor-active="true"] #wpforms-63272-field_49,
#wpforms-form-63272[data-current-path="sponsor"] #wpforms-63272-field_48,
#wpforms-form-63272[data-current-path="sponsor"] #wpforms-63272-field_49 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
}

/* Sponsor package layout */
.sponsor-packages,
.sponsor-packages ul,
.sponsor-packages li {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
}

.sponsor-packages ul {
    display: block !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.sponsor-packages li {
    position: relative !important;
    padding: 18px 24px 18px 60px !important;
    margin-bottom: 16px !important;
    cursor: pointer !important;
    border-radius: 8px !important;
    background: #fff !important;
    border: 1px solid #e5e5e5 !important;
    transition: all 0.2s ease !important;
    display: block !important;
    min-height: 60px !important;
}

.sponsor-packages li:hover {
    background: rgba(255,255,255,0.9) !important;
    border-color: #e5e5e5 !important;
}

/* Hide the native checkbox */
.sponsor-packages input[type="checkbox"] {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Custom radio button circle - normal state */
.sponsor-packages li::after {
    content: '' !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    border: 1px solid #828282 !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    position: absolute !important;
    left: 16px !important;
    top: 24px !important;
    transform: none !important;
    transition: all 0.3s ease !important;
    z-index: 10 !important;
    flex-shrink: 0 !important;
}

/* Custom radio button circle - selected state */
.sponsor-packages li.selected::after {
    border-color: #DE761C !important;
    background: #ffffff !important;
    animation: orange-pulse-sponsor-fixed 0.4s ease !important;
}

/* White checkmark over orange circle - selected state */
.sponsor-packages li.selected::before {
    content: '\2713' !important;
    position: absolute !important;
    left: 21px !important;
    top: 29px !important;
    transform: none !important;
    width: 16px !important;
    height: 16px !important;
    background: #DE761C !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: white !important;
    font-size: 10px !important;
    font-weight: bold !important;
    z-index: 15 !important;
    line-height: 1 !important;
}

/* Title wrapper for proper structure */
.sponsor-title-wrapper {
    margin-bottom: 8px;
}

/* Make sponsor label row flex for proper alignment */
.sponsor-label-row {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.sponsor-title {
    margin: 0 !important;
    flex: 1;
    font-size: 27px !important;
    font-weight: normal;
}

/* Right-aligned content styling */
.ticket-text {
    color: #de761c;
    font-weight: 600;
    font-size: 14px;
    margin-left: 15px;
    flex-shrink: 0;
    background: rgba(222,118,28,0.1);
    padding: 4px 8px;
    border-radius: 4px;
    position: absolute !important;
    right: 60px !important;
    top: 24px !important;
    transform: none !important;
}

.choice-icon {
    width: 60px !important;
    height: auto !important;
    margin-left: 15px;
    flex-shrink: 0;
    opacity: 0.7;
    position: absolute !important;
    right: 60px !important;
    top: 24px !important;
    transform: none !important;
    object-fit: contain !important;
}

/* Toggle link styling */
.toggle-link {
    display: block !important;
    color: #de761c;
    text-decoration: none;
    font-weight: 500;
    margin: 0 0 10px -10px !important;
    cursor: pointer;
    font-size: 14px;
}

.toggle-link:hover {
    color: #c5671a;
}

.toggle-link .arrow {
    display: inline-block;
    transition: transform 0.3s ease;
    margin-left: 8px;
}

.toggle-link.expanded .arrow {
    transform: rotate(180deg);
}

/* Section headers */
.sponsor-packages h4 {
    text-align: center;
    margin: 20px 0 16px 0;
    font-weight: 700;
    color: #333;
    font-family: 'Bebas Neue', Arial, sans-serif;
    font-size: 24px;
    text-transform: uppercase;
}

.sponsor-packages h4.popular-packages {
    color: #DE761C;
}

/* Details styling */
.details {
    display: none;
    margin-top: 8px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    border-top: none !important;
    padding-top: 16px;
}

.details.expanded {
    display: block;
    max-height: 600px;
    padding: 16px !important;
    margin: 8px 0 0 -18px !important;
}

.details li {
    padding: 8px 0 !important;
    display: flex;
    align-items: flex-start;
    margin-bottom: 0;
    border-bottom: 1px solid #f5f5f5;
    list-style: none;
    position: static !important;
    background: transparent !important;
    cursor: default !important;
    border: none !important;
}

.details li:last-child {
    border-bottom: none;
}

.details li img {
    width: 60px !important;
    height: auto !important;
    margin-right: 12px;
    flex-shrink: 0;
    object-fit: contain !important;
}

.details ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Remove radio buttons from details list items */
.details li::after,
.details li::before {
    display: none !important;
    content: none !important;
}

/* BUTTONS */
.exform-detail .wpforms-page-next,
.exform-detail .wpforms-page-prev,
.exform-detail .wpforms-submit {
    background: #DE761C !important;
    color: white !important;
    border: none !important;
    border-radius: 25px !important;
    padding: 12px 40px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    margin: 0 8px !important;
}

.exform-detail .wpforms-page-next:hover,
.exform-detail .wpforms-page-prev:hover,
.exform-detail .wpforms-submit:hover {
    background: #c5671a !important;
}

.exform-detail .wpforms-pagebreak-center {
    text-align: center !important;
    margin: 2rem 0 !important;
}

/* TAB STYLING */
.form-type-selector {
    background: #ffffff;
    padding: 20px;
    border-radius: 8px;
    display: inline-block;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}

.form-tabs-nav {
    margin: 0 !important;
}

.form-tabs-nav li a {
    padding: 12px 40px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

.form-tabs-nav li.uk-active a {
    background-color: #ffffff !important;
    color: #DE761C !important;
    box-shadow: 0 2px 8px rgba(222, 118, 28, 0.2) !important;
}

.form-tabs-nav li:not(.uk-active) a {
    background: transparent !important;
    color: #666 !important;
}

.form-tabs-nav li:not(.uk-active) a:hover {
    background: rgba(255,255,255,0.5) !important;
}

/* Locked state after selection */
.form-tabs-nav.locked li:not(.uk-active) {
    opacity: 0.5;
    pointer-events: none;
}

/* ANIMATIONS */
@keyframes orange-pulse {
    0% { 
        transform: scale(1); 
        box-shadow: 0 0 0 0 rgba(222, 118, 28, 0.7); 
    }
    70% { 
        transform: scale(1.1); 
        box-shadow: 0 0 0 8px rgba(222, 118, 28, 0); 
    }
    100% { 
        transform: scale(1); 
        box-shadow: 0 0 0 0 rgba(222, 118, 28, 0); 
    }
}

@keyframes orange-pulse-sponsor-fixed {
    0% { 
        box-shadow: 0 0 0 0 rgba(222, 118, 28, 0.7); 
    }
    70% { 
        box-shadow: 0 0 0 8px rgba(222, 118, 28, 0); 
    }
    100% { 
        box-shadow: 0 0 0 0 rgba(222, 118, 28, 0); 
    }
}

@keyframes ripple-expand {
    0% { 
        transform: scale(0); 
        opacity: 0.8; 
    }
    100% { 
        transform: scale(4); 
        opacity: 0; 
    }
}

/* MOBILE RESPONSIVE */
@media (max-width: 768px) {
    .exform-detail .wpforms-image-choices {
        gap: 15px !important;
    }
    
    .exform-detail .wpforms-image-choices li:nth-child(-n+5),
    .exform-detail .wpforms-image-choices li:nth-child(n+6) {
        flex: 0 0 calc(33.333% - 10px) !important;
        max-width: none !important;
        margin-bottom: 15px !important;
    }
    
    .exform-detail .wpforms-image-choices li:nth-child(6) {
        margin-left: 0 !important;
    }
    
    .exform-detail .wpforms-image-choices li:nth-child(9) {
        margin-right: 0 !important;
    }
    
    .exform-detail .wpforms-image-choices-label {
        font-size: 20px !important;
    }
    
    .exform-detail .wpforms-image-choices-image,
    .exform-detail .wpforms-image-choices-image img {
        width: 60px !important;
        height: 60px !important;
    }
    
    .exhibiting-packages .wpforms-image-choices li:nth-child(1),
    .exhibiting-packages .wpforms-image-choices li:nth-child(2) {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
    
    .discovery-grid {
        flex-direction: column !important;
        gap: 1rem !important;
        text-align: center !important;
    }
}

/* SURGICAL FIX - Remove ONLY the bottom-middle ::before artifact */
.exhibiting-packages .wpforms-image-choices li.selected::before {
    display: none !important;
    content: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* More specific targeting using the page ID */
#page\\#4 .exhibiting-packages .wpforms-image-choices li.selected::before {
    display: none !important;
    content: none !important;
}

Tab switcher Yootheme HTML Element HTML (outside of form)

<div class="uk-container" style="padding:0;margin:0 auto;width:100%;">
  <div class="pill-tab-switcher uk-margin-medium-bottom">
    <ul class="tab-nav" role="tablist">
      <li class="tab-item active" data-path="exhibit">
        <a href="#" class="tab-link" aria-selected="true" role="tab">Exhibit</a>
      </li>
      <li class="tab-item" data-path="sponsor">
        <a href="#" class="tab-link" aria-selected="false" role="tab">Sponsor</a>
      </li>
    </ul>
  </div>
</div>

Tab switcher Yootheme HTML Element CSS

/* Visual styling only - container handles width */
.pill-tab-switcher {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  padding: 20px;
  box-sizing: border-box;
}

.tab-nav {
  display: flex;
  gap: 2px;
  background: #f5f5f5;
  border-radius: 16px;
  padding: 4px;
}
.tab-link {
  text-decoration: none !important;
}
.tab-link:hover, .tab-link:focus {
  text-decoration: none !important;
}
.tab-item {
  flex: 1;
}

.tab-link {
  display: block;
  width: 100%;
  padding: 12px 0;
  font-size: 21px;
  font-weight: 500;
  text-align: center;
  color: #666;
  background: transparent;
  border-radius: 16px;
  transition: all 0.2s ease;
}

.tab-link::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: #fff;
  box-shadow: 0 4px 8px rgba(222,118,28,0.15);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.tab-link:hover,
.tab-item.active .tab-link {
  color: #DE761C;
  background: #fff;
  box-shadow: 0 2px 4px rgba(222,118,28,0.2);
}

.pill-tab-switcher.uk-margin-medium-bottom {
  margin-bottom: 32px !important;
}

@media (max-width: 768px) {
  .tab-link { font-size: 18px; padding: 10px 0; }
}

@media (max-width: 480px) {
  .tab-link { font-size: 16px; padding: 8px 0; border-radius: 12px; }
}
.tab-nav {
  list-style: none !important;
}
.tab-nav li {
  list-style: none !important;
}
/* COMPENSATE FOR LEFT EXTRA PADDING */
.pill-tab-switcher {
  padding: 20px 20px 4px 20px !important; /* 20px top, 10px bottom, 0 sides */
}
@media (min-width: 1400px) {
    .pill-tab-switcher { margin: 0 auto 0 -40px !important; }
}
@media (min-width: 1200px) and (max-width: 1399px) {
    .pill-tab-switcher { margin: 0 auto 0 -14px !important; }
}

Progress bar Yootheme HTML Element HTML (outside of form)

<div id="leadFormsProgress" class="lead-forms-progress">
    <div class="progress-step active">
        <div class="step-circle">
            <span class="step-number">1</span>
        </div>
        <div class="step-label">Booth size</div>
    </div>
    <div class="progress-step">
        <div class="step-circle">
            <span class="step-number">2</span>
        </div>
        <div class="step-label">Exhibiting package</div>
    </div>
    <div class="progress-step">
        <div class="step-circle">
            <span class="step-number">3</span>
        </div>
        <div class="step-label">Personal details</div>
    </div>
</div>

Progress bar Yootheme HTML Element CSS (outside of form)

.el-element { background-color: #FFFFFF; padding: 20px 0 1px 0; border-radius: 8px; }

/* Progress Bar Styles - Fixed Spacing */
#leadFormsProgress.lead-forms-progress {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important; /* Center the progress bar */
    margin: 2rem 0 3rem 0 !important;
    padding: 0 !important;
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

/* Each progress step with circle and text - with proper spacing */
#leadFormsProgress .progress-step {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Large spacing between steps to spread them out */
#leadFormsProgress .progress-step:not(:last-child) {
    margin-right: 14rem !important; /* Much larger spacing */
}

/* Step Circle */
#leadFormsProgress .progress-step .step-circle {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: bold !important;
    font-size: 16px !important;
    background: #EEEEEE !important;
    color: #828282 !important;
    border: none !important;
    transition: all 0.3s ease !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
}

/* Step Label - to the right of circle */
#leadFormsProgress .progress-step .step-label {
    font-size: 14px !important;
    color: #828282 !important;
    text-align: left !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    margin-left: 12px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    flex-shrink: 0 !important;
}

/* Connecting Lines - Fill the 14rem gap between steps */
#leadFormsProgress .progress-step:not(:last-child)::after {
    content: '' !important;
    position: absolute !important;
    top: 20px !important; /* Center on circle */
    left: calc(100% + 1rem) !important; /* Start 1rem after step content */
    width: 12rem !important; /* Fill most of the 14rem gap */
    height: 2px !important;
    background: #EEEEEE !important;
    z-index: 1 !important;
}

/* ACTIVE Step States */
#leadFormsProgress .progress-step.active .step-circle {
    background: white !important;
    border: 2px solid #DE761C !important;
    color: #DE761C !important;
}

#leadFormsProgress .progress-step.active .step-label {
    color: #DE761C !important;
    font-weight: 600 !important;
}

/* COMPLETED Step States */
#leadFormsProgress .progress-step.completed .step-circle {
    background: #DE761C !important;
    border: 2px solid #DE761C !important;
    color: white !important;
}

#leadFormsProgress .progress-step.completed .step-circle::before {
    content: '✓' !important;
    font-size: 12px !important;
    font-weight: bold !important;
}

#leadFormsProgress .progress-step.completed .step-label {
    color: #333 !important;
    font-weight: 600 !important;
}

/* Hide step numbers when completed */
#leadFormsProgress .progress-step.completed .step-number {
    display: none !important;
}

/* Orange lines after completed steps */
#leadFormsProgress .progress-step.completed:not(:last-child)::after {
    background: #DE761C !important;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    #leadFormsProgress .progress-step:not(:last-child) {
        margin-right: 8rem !important; /* Smaller spacing on mobile */
    }

    #leadFormsProgress .progress-step:not(:last-child)::after {
        width: 6rem !important; /* Shorter lines for mobile */
    }

    #leadFormsProgress .progress-step .step-circle {
        width: 35px !important;
        height: 35px !important;
        font-size: 14px !important;
    }

    #leadFormsProgress .progress-step .step-label {
        font-size: 12px !important;
        margin-left: 8px !important;
    }
}

@media (max-width: 480px) {
    #leadFormsProgress .progress-step:not(:last-child) {
        margin-right: 4rem !important; /* Even smaller on very small screens */
    }

    #leadFormsProgress .progress-step:not(:last-child)::after {
        width: 2rem !important;
    }

    #leadFormsProgress .progress-step .step-circle {
        width: 30px !important;
        height: 30px !important;
        font-size: 12px !important;
    }

    #leadFormsProgress .progress-step .step-label {
        font-size: 11px !important;
        margin-left: 6px !important;
    }
}
/* PROGRESS BAR STYLES */
#leadFormsProgress.lead-forms-progress {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 2rem 0 3rem 0 !important;
    padding: 0 !important;
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

#leadFormsProgress .progress-step {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    position: relative !important;
    z-index: 2 !important;
}

#leadFormsProgress .progress-step:not(:last-child) {
    margin-right: 14rem !important;
}

#leadFormsProgress .progress-step .step-circle {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: bold !important;
    font-size: 16px !important;
    background: #EEEEEE !important;
    color: #828282 !important;
    border: none !important;
    transition: all 0.3s ease !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
}

#leadFormsProgress .progress-step .step-label {
    font-size: 14px !important;
    color: #828282 !important;
    text-align: left !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    margin-left: 12px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    flex-shrink: 0 !important;
}

#leadFormsProgress .progress-step:not(:last-child)::after {
    content: '' !important;
    position: absolute !important;
    top: 20px !important;
    left: calc(100% + 1rem) !important;
    width: 12rem !important;
    height: 2px !important;
    background: #EEEEEE !important;
    z-index: 1 !important;
}

/* ACTIVE Step States */
#leadFormsProgress .progress-step.active .step-circle {
    background: white !important;
    border: 2px solid #DE761C !important;
    color: #DE761C !important;
}

#leadFormsProgress .progress-step.active .step-label {
    color: #DE761C !important;
    font-weight: 600 !important;
}

/* COMPLETED Step States */
#leadFormsProgress .progress-step.completed .step-circle {
    background: #DE761C !important;
    border: 2px solid #DE761C !important;
    color: white !important;
}

#leadFormsProgress .progress-step.completed .step-circle::before {
    content: '✓' !important;
    font-size: 12px !important;
    font-weight: bold !important;
}

#leadFormsProgress .progress-step.completed .step-label {
    color: #333 !important;
    font-weight: 600 !important;
}

#leadFormsProgress .progress-step.completed .step-number {
    display: none !important;
}

#leadFormsProgress .progress-step.completed:not(:last-child)::after {
    background: #DE761C !important;
}

/* Mobile responsive for progress bar */
@media (max-width: 768px) {
    #leadFormsProgress .progress-step:not(:last-child) {
        margin-right: 8rem !important;
    }
    
    #leadFormsProgress .progress-step:not(:last-child)::after {
        width: 6rem !important;
    }
    
    #leadFormsProgress .progress-step .step-circle {
        width: 35px !important;
        height: 35px !important;
        font-size: 14px !important;
    }
    
    #leadFormsProgress .progress-step .step-label {
        font-size: 12px !important;
        margin-left: 8px !important;
    }
}
@media (max-width: 1199px) {
    #page\#5 {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .wpforms-container {
        padding: 0 15px !important;
        margin: 0 auto !important;
    }

    .lead-forms-progress {
        justify-content: center !important;
        padding: 0 15px !important;
        flex-wrap: nowrap !important;
        overflow-x: hidden !important; /* Changed to hidden to prevent scroll; elements will scale instead */
    }

    .progress-step:not(:last-child) {
        margin-right: 4rem !important;
    }

    .progress-step:not(:last-child)::after {
        left: calc(100% + 0.75rem) !important;
        width: 2.5rem !important;
    }

    .progress-step .step-label {
        font-size: 13px !important;
        margin-left: 8px !important;
        white-space: nowrap !important;
    }

    .progress-step .step-circle {
        width: 32px !important;
        height: 32px !important;
        font-size: 15px !important;
    }

    /* Tab switcher adjustments */
    .wpforms-field-radio.wpforms_radio_next ul {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        gap: 10px !important;
    }

    .wpforms-field-radio.wpforms_radio_next li {
        flex: 0 1 auto !important;
        width: auto !important;
    }

    .wpforms-field-radio.wpforms_radio_next label {
        padding: 10px 20px !important;
        border-radius: 20px !important;
        background: #f5f5f5 !important;
        color: #333 !important;
        font-weight: bold !important;
        cursor: pointer !important;
    }

    .wpforms-field-radio.wpforms_radio_next input:checked + label {
        background: #DE761C !important;
        color: white !important;
    }
}

@media (min-width: 960px) and (max-width: 1199px) {
    .progress-step:not(:last-child) {
        margin-right: 6rem !important;
    }

    .progress-step:not(:last-child)::after {
        width: 4rem !important;
    }

    .progress-step .step-label {
        font-size: 14px !important;
    }
}

@media (max-width: 959px) {
    .wpforms-field-content h4 {
        font-size: 1.8rem !important;
        margin: 1.5rem 0 !important;
    }

    .discovery-grid {
        flex-direction: column !important;
        text-align: center !important;
    }

    .discovery-button {
        margin-top: 15px !important;
    }
}

@media (max-width: 480px) {
    .lead-forms-progress {
        padding: 0 10px !important;
    }

    .progress-step:not(:last-child) {
        margin-right: 1.5rem !important; /* Tighter spacing */
    }

    .progress-step:not(:last-child)::after {
        left: calc(100% + 0.5rem) !important;
        width: 0.75rem !important; /* Shorter lines */
    }

    .progress-step .step-circle {
        width: 28px !important;
        height: 28px !important;
        font-size: 13px !important;
    }

    .progress-step .step-label {
        font-size: 11px !important;
        margin-left: 5px !important;
        white-space: nowrap !important; /* Prevent wrapping; text will truncate if too long */
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 70px !important; /* Cap label width to fit */
    }

    /* Stack tabs vertically on very small screens */
    .wpforms-field-radio.wpforms_radio_next ul {
        flex-direction: column !important;
    }
}

Discovery Yootheme Element CSS (outside of form)

/* DISCOVERY SECTION VISIBILITY CONTROL */
.discovery {
    transition: opacity 0.3s ease, visibility 0.3s ease !important;
    /* Remove the default display: none so JavaScript can control it */
}

/* Ensure the discovery section can be shown/hidden properly */
.discovery.hidden {
    opacity: 0 !important;
    visibility: hidden !important;
    display: none !important;
}

.discovery.visible {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

Discovery Yootheme Element Row CSS

.el-row {   position: relative !important;
    background-color: rgba(166, 225, 255, 0.1) !important;
    padding: 32px 16px !important;
    margin: 2rem !important;
    border-radius: 16px !important;
    border: 1px solid rgba(75, 116, 137, 0.2) !important; }