/* ==========================================================================
   RAPID WOUND CARE - MASTER RESPONSIVE STYLES
   Based on RapidWC.com Implementation Guide
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. UTILITIES & TYPOGRAPHY
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {

    /* Standardize Container Padding */
    .container,
    .container-fluid,
    section {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    /* Base Typography from Guide */
    body {
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
        font-size: 16px;
        line-height: 1.6;
        color: #333;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-weight: 700;
        line-height: 1.2;
        margin-bottom: 1rem;
        word-wrap: break-word;
        /* Prevent overflow */
    }

    h1 {
        font-size: 2rem !important;
    }

    h2 {
        font-size: 1.75rem !important;
    }

    h3 {
        font-size: 1.5rem !important;
    }
}
/* --------------------------------------------------------------------------
   4. HERO SECTION (Mapped from Guide)
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
    .hero-container,
    .hero-wound,
    .paragraph--type--hero-section-urgent-care,
    .field--name-field-hero-section-wound-care{
        display: block;
        gap: 2.4rem;
    }
    .hero-left-container,
    .field--name-field-left-hero-section-urgent-c,
    .paragraph--type--left-hero-wound-care,
    .field--name-field-right-hero-section-wound-c{
        width: 100%;
    }
    /* hero home right section  */
    .hero-right-container,
    .field--name-field-right-hero-section-urgent{
        width: 100%;
        background: #ffffff;
        border-radius: 1rem;
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
        border: 1px solid rgba(226, 232, 240, 0.9);
        padding: 1.4rem 1.3rem;
        font-size: 0.88rem;
    }
    .right-hero-home-title{
        display: block;
    }
    .instruction-right-hero-home{
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
        /* width: 100%; */
    }
    .field--name-field-expert-care,
    .field--name-field-same-day-visits,
    .field--name-field-wound-programs,
    .field--name-field-telehealth{
        background: #f9fafb;
        border-radius: 0.7rem;
        padding: 0.55rem 0.6rem;
        border: 1px dashed rgba(148, 163, 184, 0.6);
        width: 100%;
    }
    /* every page titles sections  */
    .paragraph--type--hero-title,
    .left-hero-wc,
    .field--name-field-title-hero,
    .uc-hero-title-section,
    .hero-legal-section-left,
    .field--name-field-title-black-pr-hero,
    .field--name-field-title-green-pr-hero,
    .field--name-field-title-black-after-pr-hero,
    .field--name-field-title-black-patient-r,
    .field--name-field-title-green-hero-patient-r,
    .field--name-field-black-after-title-patient,
    .field--name-field-black-title-hero-for-provi,
    .field--name-field-green-title-hero-for-provi,
    .field--name-field-title-black-hero-blog,
    .field--name-field-title-black-after-hero-blo,
    .hero-title-contact-page,
    .field--name-field-title-services,
    .field--name-field-title-location,
    .field--name-field-title-green-hero-blog {
        font-weight: bold;
        line-height: 1.1;
        /* display: ruby; */
    }
    .field--name-field-black-hero-titile,
    .field--name-field-title,
    .field--name-field-black-title,
    .field--name-field-black-title-hero-wound-car,
    .field--name-field-black-after-hero-wound-car,
    .field--name-field-title-black-uc-left-hero,
    .field--name-field-title-black-after-uc-left,
    .field--name-field-title-black-hero-legal-res,
    .field--name-field-title-black-after-hero-leg,
    .field--name-field-title-black-pr-hero,
    .field--name-field-title-black-after-pr-hero,
    .field--name-field-title-black-patient-r,
    .field--name-field-black-after-title-patient,
    .field--name-field-black-title-hero-for-provi,
    .field--name-field-title-black-hero-blog,
    .field--name-field-title-black-after-hero-blo,
    .field--name-field-black-title-contact-page,
    .field--name-field-black-title-after-contact,
    .field--name-field-title-services,
    .field--name-field-title-location {
        font-size: 1.7rem;
        line-height: 1.2;
        letter-spacing: -0.03em;
        margin-bottom: 0.7rem;
        display: inline;
    }
    .field--name-field-green-title,
    .field--name-field-green-title-hero-wound-car,
    .field--name-field-title-green-uc-left-hero,
    .field--name-field-green-title-hero-legal-res,
    .field--name-field-title-green-pr-hero,
    .field--name-field-title-green-hero-patient-r,
    .field--name-field-green-title-hero-for-provi,
    .field--name-field-title-green-hero-blog,
    .field--name-field-green-title-contact-page {
        color: #64c1af;
        font-size: 1.7rem;
        line-height: 1.2;
        letter-spacing: -0.03em;
        margin-bottom: 0.7rem;
        display: inline;
    }
    .field--name-field-orange-title,
    .field--name-field-orange-title-contact-page {
        color: #f43f5e !important;
        font-size: 1.7rem;
        line-height: 1.2;
        letter-spacing: -0.03em;
        margin-bottom: 0.7rem;
        display: inline;
    }


    /* Hero Buttons */
    /* .hero-home-button,
    .buttons-wc-hero,
    .hero-uc-btn {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        gap: 12px !important;
        width: 100% !important;
        margin-top: 1.5rem !important;
        flex-wrap: wrap !important;
    } */

    /* .hero-home-button a,
    .buttons-wc-hero a {
        flex: 1 1 auto !important;
        padding: 14px 20px !important;
        font-size: 14px !important;
        white-space: nowrap !important;
        border-radius: 6px !important;
    } */
}

/* --------------------------------------------------------------------------
   5. FEATURES / WHY CHOOSE US
   -------------------------------------------------------------------------- */
/* @media (max-width: 767px) {
    .instruction-right-hero-home {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
        width: 100% !important;
        margin-top: 2rem !important;
    }

    .instruction-right-hero-home>div,
    .field--name-field-expert-care,
    .field--name-field-same-day-visits {
        background: #ffffff !important;
        border-radius: 8px !important;
        padding: 1.5rem !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
        text-align: center !important;
        width: 100% !important;
    }
} */

/* --------------------------------------------------------------------------
   6. SERVICES SECTION
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
    /* .field--name-field-service-carts,
    .field--name-field-list-therapies-section,
    .paragraph--type--cart-location,
    .paragraph--type--wound-care {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    } */
     .home-cart-location{
        background-color: #ffffff;
        border-radius: 12px;
        border: 1px solid #e5e7eb;
        box-shadow: 0 8px 18px rgba(15, 23, 42, 0.03);
        padding: 16px;
        font-size: 14px;
     }
     .form-select{
        background-color: #F5F5F5;
     }

    /* UNIFIED CARD STYLING FOR ALL PAGES (Mobile) */
    .paragraph--type--services-cart,
    .paragraph--type--cart-location
    .paragraph--type--carts-uc-diagnostics,
    .paragraph--type--carts-section-patient-resources,
    .paragraph--type--carts-program-resource,
    .paragraph--type--expert-care,
    .paragraph--type--same-day-visits {
        background: #ffffff !important;
        border-radius: 8px !important;
        overflow: hidden !important;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1) !important;
        padding: 1.5rem !important;
        margin-bottom: 1.5rem !important;
        /* Ensure spacing between stacked cards */
        width: 100% !important;
    }
}

/* --------------------------------------------------------------------------
   7. LOCATIONS SECTION - Tablet Upgrade
   -------------------------------------------------------------------------- */
/* .field--name-field-carts-location{
    display: block;
} */
/* contact page  */
@media (max-width: 767px) {
    .two-sections-contact-form{
        display: block;
    }
    .field--name-field-carts-location{
    display: block;
    } 
    .field--name-field-left-container-contact-pag{
        margin-bottom: 1rem;
    }
    .field--name-field-left-container-contact-pag:hover,
    .contact-location-muted:hover{
        transform: translateY(-3px);
        box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
        border-color: rgba(100, 193, 175, 0.4);
    }
    /* .home-cart-location{
        background: #ffffff;
        border-radius: 12px;
        border: 1px solid #e5e7eb;

        box-shadow: 0 8px 18px rgba(15, 23, 42, 0.03);
        padding: 1rem;
        font-size: 0.9rem;
    } */
}

/* --------------------------------------------------------------------------
   8. FOOTER
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

    .site-footer,
    .footer-top-row .region-footer-first {
        display: flex !important;
        flex-direction: column !important;
        text-align: center !important;
        gap: 2rem !important;
    }
}

/* carts section  */
@media (max-width: 767px) {
    .field--name-field-list-therapies-section,
    .field--name-field-carts-diagnostics-urgent-c,
    .field--name-field-carts-program-section,
    .field--name-field-carts-section-resource-pat,
    .field--name-field-carts-section-for-provider,
    .field--name-field-carts-section-blog-resourc{
        display: block;
    }

    /* .{
        font-weight: 600;
        margin-top: 0.7rem;
        font-size: 0.9rem;
    } */

    .hero-home-button{
        display: flex;
        flex-wrap: wrap;
        gap: 0.75rem;
        margin-bottom: 1rem;
    }
    .hero-home-button .field--name-field-call-now{
        display: none !important;
    }
    .hero-home-button .field--name-field-book-appointment{
        order: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: var(--radius-pill);
        font-size: 0.9rem;
        font-weight: 600;
        /* padding: 0.55rem 1.2rem; */
        border: 1px solid transparent;
        cursor: pointer;
        transition: all var(--transition-fast);
    }
    .field--name-field-explore-wound-care{
        order: 2;
        /* border: 1px solid transparent; */
    }
    .contact-block-navbar{
        display: flex;
        flex-wrap: wrap;
        float: unset;
    }
    .contact-block-navbar .field--name-field-book-appointment{
        width: 100%;
        display: flex;
        order: 1;
    }
    .contact-block-navbar .call-now-seperate-section{
        order: 2;
        margin: auto;
    }

}