/* ==========================================================================
   Lawn Gurus — Mobile Text Fix
   Shrinks oversized text on phones / small tablets.
   Targets the Avada theme + WooCommerce markup used on lawngurus.co.uk.
   Two breakpoints:
     - <= 767px  : phones (the main problem area)
     - <= 480px  : narrow phones — extra trim
   Edit the px / clamp() values below to taste.
   ========================================================================== */

/* ---------- Phones & small tablets (<= 767px) ---------------------------- */
@media (max-width: 767px) {

    /* Base body / paragraph copy ------------------------------------------ */
    body,
    body p,
    body li,
    body td,
    body span,
    body .fusion-text,
    body .fusion-text p,
    body .fusion-text li,
    body .post-content,
    body .post-content p {
        font-size: 15px !important;
        line-height: 1.55 !important;
    }

    /* Headings ------------------------------------------------------------ */
    /* H1 — page titles, hero "Welcome to LawnGurus" */
    body h1,
    body .fusion-title h1,
    body .fusion-title-heading h1,
    body .fusion-title-size-one,
    body .entry-title,
    body .page-title-container h1 {
        font-size: clamp(26px, 7vw, 32px) !important;
        line-height: 1.2 !important;
        letter-spacing: 0 !important;
    }

    /* H2 */
    body h2,
    body .fusion-title h2,
    body .fusion-title-heading h2,
    body .fusion-title-size-two {
        font-size: clamp(22px, 6vw, 26px) !important;
        line-height: 1.25 !important;
    }

    /* H3 */
    body h3,
    body .fusion-title h3,
    body .fusion-title-heading h3,
    body .fusion-title-size-three {
        font-size: clamp(19px, 5vw, 22px) !important;
        line-height: 1.3 !important;
    }

    /* H4 */
    body h4,
    body .fusion-title h4,
    body .fusion-title-heading h4,
    body .fusion-title-size-four {
        font-size: clamp(17px, 4.5vw, 19px) !important;
        line-height: 1.35 !important;
    }

    /* H5 — Avada's "Premium Turf, Fresh Every Time" style cards use H5 */
    body h5,
    body .fusion-title h5,
    body .fusion-title-heading h5,
    body .fusion-title-size-five {
        font-size: clamp(16px, 4.2vw, 18px) !important;
        line-height: 1.35 !important;
    }

    /* H6 */
    body h6,
    body .fusion-title h6,
    body .fusion-title-heading h6,
    body .fusion-title-size-six {
        font-size: 15px !important;
        line-height: 1.4 !important;
    }

    /* Buttons (Avada Fusion + Woo) ---------------------------------------- */
    body .fusion-button,
    body .button,
    body button,
    body input[type="submit"],
    body .wp-block-button__link,
    body .woocommerce a.button,
    body .woocommerce button.button,
    body .woocommerce input.button {
        font-size: 14px !important;
        line-height: 1.3 !important;
        padding: 10px 18px !important;
    }

    /* Main / mobile menu --------------------------------------------------- */
    body .fusion-mobile-menu-design-modern .fusion-main-menu li a,
    body .fusion-mobile-nav-holder a,
    body .fusion-mobile-menu li a,
    body .fusion-main-menu > ul > li > a {
        font-size: 15px !important;
        line-height: 1.4 !important;
    }

    /* WooCommerce — product card titles, prices, "Add to Basket" --------- */
    body .woocommerce ul.products li.product .woocommerce-loop-product__title,
    body .woocommerce ul.products li.product h2,
    body .woocommerce ul.products li.product h3,
    body .woocommerce ul.products li.product h4 {
        font-size: 16px !important;
        line-height: 1.3 !important;
    }

    body .woocommerce ul.products li.product .price,
    body .woocommerce div.product p.price,
    body .woocommerce div.product span.price {
        font-size: 15px !important;
    }

    /* Product page title / description */
    body .woocommerce div.product .product_title {
        font-size: clamp(22px, 6vw, 26px) !important;
        line-height: 1.25 !important;
    }

    /* Single-product short description + tabs */
    body .woocommerce div.product .woocommerce-product-details__short-description,
    body .woocommerce div.product .woocommerce-Tabs-panel,
    body .woocommerce div.product .woocommerce-Tabs-panel p,
    body .woocommerce-tabs .panel {
        font-size: 15px !important;
        line-height: 1.55 !important;
    }

    /* Cart / basket totals */
    body .woocommerce table.shop_table,
    body .woocommerce table.shop_table th,
    body .woocommerce table.shop_table td,
    body .cart_totals,
    body .cart_totals * {
        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    /* Footer + legal links ------------------------------------------------- */
    body .fusion-footer-widget-area,
    body .fusion-footer-widget-area p,
    body .fusion-footer-widget-area li,
    body .fusion-footer-widget-area a,
    body .fusion-footer-copyright-area,
    body .fusion-footer-copyright-area p,
    body .fusion-copyright-notice,
    body .fusion-copyright-notice * {
        font-size: 13px !important;
        line-height: 1.5 !important;
    }

    /* Cookie banner + slide-out cart text --------------------------------- */
    body #cmplz-cookiebanner-container,
    body #cmplz-cookiebanner-container * {
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    /* FAQ / accordion (Avada Fusion toggles used in "Gurus' Guidance") --- */
    body .fusion-toggle-heading,
    body .fusion-panel .panel-title a,
    body .fusion-accordian .panel-title a {
        font-size: 16px !important;
        line-height: 1.35 !important;
    }
    body .fusion-panel .panel-body,
    body .fusion-panel .panel-body p,
    body .fusion-accordian .panel-body,
    body .fusion-accordian .panel-body p {
        font-size: 14px !important;
        line-height: 1.55 !important;
    }
}

/* ---------- Narrow phones (<= 480px) ------------------------------------ */
@media (max-width: 480px) {

    body,
    body p,
    body li,
    body .fusion-text,
    body .fusion-text p {
        font-size: 14px !important;
    }

    body h1,
    body .fusion-title h1,
    body .fusion-title-heading h1,
    body .entry-title {
        font-size: 24px !important;
    }

    body h2,
    body .fusion-title h2,
    body .fusion-title-heading h2 {
        font-size: 20px !important;
    }

    body h3,
    body .fusion-title h3,
    body .fusion-title-heading h3 {
        font-size: 18px !important;
    }

    body h4,
    body .fusion-title h4,
    body .fusion-title-heading h4 {
        font-size: 16px !important;
    }

    body h5,
    body .fusion-title h5,
    body .fusion-title-heading h5 {
        font-size: 15px !important;
    }

    body .fusion-button,
    body .button,
    body .woocommerce a.button,
    body .woocommerce button.button {
        font-size: 13px !important;
        padding: 9px 14px !important;
    }
}

/* ---------- Inline-style override safety net ----------------------------- */
/* Avada / Fusion Builder often writes per-element inline styles like
   <h1 style="font-size:48px"...>. The selectors above use !important to
   beat them. If a stubborn element still escapes, add it here. */
@media (max-width: 767px) {
    body [style*="font-size"] h1,
    body [style*="font-size"] h2,
    body [style*="font-size"] h3 {
        /* No-op placeholder — extend if a specific block needs targeting. */
    }
}
