/* ============================================
   Park.dog — About Page CSS
   Owns: about-page-only styling (person/story image
   containers, etc.). Add about-page rules here.
   ============================================ */

/* Person/story image containers (Elementor ignores flex_shrink on containers) */
.elementor-element-pd4f8 {
    flex-shrink: 0 !important;
    min-width: 300px !important;
    max-width: 300px !important;
}
.elementor-element-pd507 {
    flex-shrink: 0 !important;
    min-width: 300px !important;
    max-width: 400px !important;
    width: 400px !important;
}

/* ============================================================
   RESPONSIVE — tablet (≤1024) and mobile (≤767).
   Person/story images are fixed-width; release the locks so they
   can stack above the text on narrower screens.
   ============================================================ */

/* ---- Tablet (≤1024px) ---- */
@media (max-width: 1024px) {
    .elementor-element-pd4f8,
    .elementor-element-pd507 {
        width: 50% !important;
        min-width: 0 !important;
        max-width: 50% !important;
    }
}

/* ---- Mobile (≤767px) ---- */
@media (max-width: 767px) {
    /* Person/story image stacks full-width above its text block */
    .elementor-element-pd4f8,
    .elementor-element-pd507 {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Mission heading "MAKE DOG PARKS FUN" — 64px display feels heavy at 375;
       Elementor styles it on the page; we trim it here for mobile only. */
    .page-id-41 .parkdog-mission-block .elementor-widget-heading h2 {
        font-size: 36px !important;
        line-height: 1.05 !important;
    }
    .page-id-41 .elementor-widget-heading h2 { font-size: 26px !important; line-height: 1.2 !important; }
    .page-id-41 .elementor-widget-heading h3 { font-size: 20px !important; }
    .parkdog-page-header { padding: 40px 24px !important; }
}
