/*
 * Crown One Mobile Optimization V2.2
 * Desktop 768px+ remains untouched.
 */

.como-mobile-cta { display:none; }

@media (max-width: 767px) {

    html, body {
        width:100%;
        max-width:100%;
        overflow-x:clip;
    }

    img, video, iframe, svg { max-width:100%; }
    img, video { height:auto; }

    body p, body li, body h1, body h2, body h3, body h4 {
        overflow-wrap:break-word;
    }

    /* ----------------------------------------------------------
       HIDE WOODMART RETAIL MOBILE TOOLBAR
       Shop / Sidebar / Wishlist / Cart / My Account
       ---------------------------------------------------------- */
    .wd-toolbar,
    .wd-toolbar-shop,
    .wd-sticky-toolbar,
    .wd-bottom-toolbar,
    .mobile-nav-toolbar,
    .sticky-toolbar {
        display:none !important;
    }

    /*
     * WoodMart adds bottom space when its toolbar is enabled.
     * Remove that space; our own CTA adds its own space below.
     */
    body.sticky-toolbar-on,
    body.wd-toolbar-on {
        padding-bottom:0 !important;
    }

    /* Header */
    .whb-header .site-logo img,
    .whb-header .wd-logo img,
    .site-logo img {
        max-height:40px;
        width:auto;
    }

    .whb-header .wd-header-text,
    .whb-header .wd-header-html {
        line-height:1.2;
    }

    /* Homepage hero */
    body.home h1,
    body.home .rev_slider h1,
    body.home .rev_slider_wrapper h1,
    body.home rs-module h1,
    body.home rs-layer h1,
    body.home .tp-caption h1,
    body.home h1.tp-caption {
        font-size:clamp(29px,8.2vw,36px)!important;
        line-height:1.08!important;
        letter-spacing:-0.025em!important;
        max-width:100%!important;
        text-wrap:balance;
    }

    body.home .rev_slider p,
    body.home .rev_slider_wrapper p,
    body.home rs-module p,
    body.home rs-layer p {
        font-size:15px!important;
        line-height:1.48!important;
    }

    body.home .rev_slider_wrapper,
    body.home .rev_slider,
    body.home rs-module-wrap,
    body.home rs-module {
        max-width:100%!important;
        overflow:hidden!important;
    }

    body.home h2 {
        font-size:clamp(24px,6.7vw,30px)!important;
        line-height:1.16!important;
        letter-spacing:-0.018em;
        text-wrap:balance;
    }

    body.home h3 { line-height:1.22; }
    body.home p { line-height:1.58; }

    body.home .elementor-widget-heading { margin-bottom:4px; }
    body.home .elementor-widget-text-editor { margin-bottom:10px; }

    /* Tap targets */
    body.home a.elementor-button,
    body.home .wd-button-wrapper a,
    body.home .btn,
    body.home button,
    .wpcf7-submit,
    .woocommerce a.button,
    .woocommerce button.button {
        min-height:44px;
    }

    body.home a.elementor-button,
    body.home .wd-button-wrapper a,
    body.home .btn {
        padding:11px 16px!important;
        line-height:1.25!important;
        white-space:normal;
        text-align:center;
    }

    body.home .elementor-widget-image img,
    body.home .wd-image img,
    body.home .category-image img,
    body.home .product-category img {
        width:100%;
        max-width:100%;
        height:auto;
    }

    /* Quote form */
    .wpcf7-form,
    .wpcf7-form p,
    .wpcf7-form-control-wrap {
        width:100%;
        max-width:100%;
    }

    .wpcf7-form input[type="text"],
    .wpcf7-form input[type="email"],
    .wpcf7-form input[type="tel"],
    .wpcf7-form input[type="number"],
    .wpcf7-form input[type="url"],
    .wpcf7-form select,
    .wpcf7-form textarea {
        width:100%;
        max-width:100%;
        font-size:16px!important;
        line-height:1.35;
        box-sizing:border-box;
    }

    .wpcf7-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="file"]),
    .wpcf7-form select {
        min-height:48px;
    }

    .wpcf7-form textarea {
        min-height:128px;
        resize:vertical;
    }

    .wpcf7-form input[type="file"] {
        width:100%;
        max-width:100%;
        font-size:14px;
    }

    .wpcf7-submit {
        width:100%;
        min-height:50px;
        padding:13px 18px!important;
    }

    /* Our mobile CTA */
    body.como-has-mobile-cta {
        padding-bottom:calc(72px + env(safe-area-inset-bottom)) !important;
    }

    .como-mobile-cta {
        position:fixed;
        z-index:999999;
        left:0;
        right:0;
        bottom:0;
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:8px;
        padding:9px 10px calc(9px + env(safe-area-inset-bottom));
        background:rgba(255,255,255,.97);
        border-top:1px solid rgba(18,42,61,.12);
        box-shadow:0 -6px 24px rgba(22,43,58,.10);
        backdrop-filter:blur(10px);
        -webkit-backdrop-filter:blur(10px);
    }

    .como-mobile-cta a {
        min-width:0;
        min-height:48px;
        display:flex;
        align-items:center;
        justify-content:center;
        border-radius:8px;
        padding:10px 12px;
        font-size:14px;
        font-weight:700;
        line-height:1.15;
        text-decoration:none!important;
        text-align:center;
    }

    .como-mobile-cta__quote {
        background:#173a56;
        color:#fff!important;
    }

    .como-mobile-cta__wa {
        background:#25D366;
        color:#fff!important;
    }

    .como-mobile-cta a:active {
        transform:translateY(1px);
    }

    /* Hide old floating WhatsApp bubble on mobile only */
    .joinchat,
    .ht-ctc,
    .wa__btn_popup,
    .whatsapp-floating,
    .floating-whatsapp,
    .como-hide-old-whatsapp {
        display:none!important;
    }

    /* Footer */
    .footer-container,
    footer.footer-container,
    footer {
        overflow-x:clip;
    }

    .footer-container .widget,
    .footer-container .wd-widget,
    footer .widget {
        margin-bottom:20px;
    }

    .footer-container p,
    .footer-container li,
    footer p,
    footer li {
        line-height:1.5;
    }

    body.copp-privacy-page .copp-policy {
        padding-left:18px!important;
        padding-right:18px!important;
    }
}

@media (max-width:380px) {
    body.home h1,
    body.home .rev_slider h1,
    body.home .rev_slider_wrapper h1,
    body.home rs-module h1,
    body.home rs-layer h1,
    body.home .tp-caption h1,
    body.home h1.tp-caption {
        font-size:28px!important;
    }

    body.home h2 { font-size:23px!important; }

    .como-mobile-cta {
        gap:7px;
        padding-left:8px;
        padding-right:8px;
    }

    .como-mobile-cta a { font-size:13px; }
}
