/* Benefits section layout */
        .benefits-grid {
            display: flex;
            flex-wrap: wrap;
            align-items: flex-start;
            max-width: 100%;
        }

        .benefits-image {
            flex: 0 1 30%;
            display: flex;
            justify-content: flex-end;
        }

        .benefits-image-wrapper {
            max-width: 338px;
            width: 100%;
        }

        .benefits-image img {
            width: 100%;
            height: auto;
            object-fit: cover;
        }

        .benefit-box {
            flex: 1 1 300px;
            /* grow/shrink as needed, min width 300px */
            display: flex;
            /* enable vertical centering of content */
            align-items: center;
            /* vertically center text */
            justify-content: center;
            /* horizontally center text */
            text-align: center;
            background: #f8f9fa;
            border: 1px solid #ddd;
            padding: 1rem;
            box-sizing: border-box;
        }

        @media (max-width: 768px) {
            h2[style*="font-size:36px"] {
                font-size: 30px !important;
            }

            .text-lg {
                font-size: 0.975rem !important;
                line-height: 1.5 !important;
            }

            /* Benefits section responsive adjustments */
            .benefits-grid {
                flex-direction: column;
                gap: 1.5rem;
            }

            .benefits-image {
                flex: 0 1 100%;
                justify-content: center;
            }

            .benefits-image-wrapper {
                max-width: 100%;
                padding: 0 1rem;
            }
        }

        /* Steps container: default desktop padding, mobile override below */
        .steps-padding {
            padding: 2.6rem 3rem 4rem;
        }

        /* Remove container padding on mobile */
        @media (max-width: 768px) {
            .container {
                padding-left: 0 !important;
                padding-right: 0 !important;
            }

            /* Adjust delivery area card spacing on mobile */
            .border.border-light-black.rounded-lg h2.mb-4.p-5 {
                margin-bottom: 0.25rem !important;
                padding: 0.75rem !important;
            }

            .border.border-light-black.rounded-lg p.mb-4.p-5 {
                margin-bottom: 0.25rem !important;
                padding: 0.75rem !important;
            }

        }

        /* Ensure on small devices the mobile hero shows first and the content sits below it */
        @media (max-width: 768px) {

            /* Hide the desktop hero section (it uses the large background) */
            section.desktop[style*="vegan-meal-delivery-sydney-banner.webp"] {
                display: none !important;
            }

            /* Make sure mobile hero is visible and content below doesn't overlap */
            section.mobile {
                display: block !important;
                position: relative;
            }

            /* Adjust mobile hero height and margins */
            section.mobile {
                height: 280px !important;
                margin-bottom: 0 !important;
            }

            /* Remove excess spacing in mobile text section */
            section.mobile-text {
                padding-top: 2rem !important;
                padding-bottom: 2rem !important;
            }

            /* Adjust text container spacing */
            section.mobile-text .container {
                padding-top: 0 !important;
                padding-bottom: 0 !important;
            }

            /* Fix mobile text margins */
            .mobile-text .max-w-xl {
                padding-left: 0 !important;
                margin: 0 auto !important;
            }

            /* Make the steps container use smaller left/right padding on mobile */
            .steps-padding {
                padding: 0 1.5rem 0 1.5rem !important;
                /* padding-right: 1.5rem !important; */
            }

            /* .steps-padding { padding: 2.6rem 3rem 4rem; } */
        }

        /* On larger devices ensure desktop hero shows and mobile hero is hidden */
        @media (min-width: 769px) {
            section.desktop[style*="vegan-meal-delivery-sydney-banner.webp"] {
                display: block;
            }

            section.mobile,
            section.mobile-text {
                display: none;
            }
        }

        /* FAQ styling: ensure FAQ items use the requested pale-green background across city pages
   Use a specific selector and !important to override the existing Tailwind `bg-white` class
   applied in the blade templates. */
        .faq-wrapper .faq-item.faq-open {
            background-color: #f6ffc2 !important;
        }