.elementor-1596 .elementor-element.elementor-element-3fb74056{column-gap:0px;}.elementor-1596 .elementor-element.elementor-element-3fb74056 p{margin-block-end:0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-1596 .elementor-element.elementor-element-7f749acb{width:100%;}}/* Start custom CSS for column, class: .elementor-element-7f749acb */#myblogcol {
  width: 100% !important;
  max-width: 100% !important;
}
#myblogcol > .elementor-widget-wrap.elementor-element-populated {
  width: 100% !important;
  max-width: 100% !important;
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-14812a30 */.single-post .elementor-widget-theme-post-featured-image img,
.single .featured-image img,
article img.wp-post-image {
  max-height: 450px;
  width: 100%;
  object-fit: cover;
  object-position: top;
}/* End custom CSS */
/* Start custom CSS *//* ============================================
   1. SIDEBAR + CONTENT GRID FIX
   ============================================ */
.content-area,
.elementor-widget-theme-post-content {
    align-items: start !important; /* stops sidebar from stretching to match content height */
}

.sidebar,
#secondary,
.widget-area {
    position: sticky;
    top: 100px;
    align-self: start;
}

/* Hide empty "Recent Comments" widget visually if it has no items */
.widget_recent_comments:has(.no-comments) {
    display: none;
}

/* ============================================
   2. FEATURED IMAGE — CONSISTENT ACROSS SCREEN SIZES
   (rem-based, replaces the old % negative margin)
   ============================================ */
header#masthead .elementor-top-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important; /* neutralizes old -7% */
}

.thumbnail img.wp-post-image {
    max-height: 400px !important;
    width: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

/* ============================================
   3. SECTION SPACING — consistent rem-based rhythm
   ============================================ */
.elementor-widget-theme-comments,
.comment-respond {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

/* Space between comment section and CTA banner below it */
.elementor-widget-theme-comments + section,
.comment-respond + section {
    margin-top: 3rem;
}

/* ============================================
   4. GET FREE CONSULTATION — CIRCLE CTA
   ============================================ */
.consultation-circle,
.elementor-shape-circle {
    width: 600px;
    height: 600px;
    max-width: 90vw;
    max-height: 90vw;
    margin: 0 auto;
}

/* ============================================
   5. COMMENT FORM — TOUCH-FRIENDLY
   ============================================ */
#commentform textarea {
    width: 100% !important;
    box-sizing: border-box;
}

#commentform input[type="submit"],
.wp-block-button__link {
    min-height: 44px;
    padding: 0.75rem 1.5rem;
}

/* ============================================
   6. TABLET BREAKPOINT (768px–1024px)
   ============================================ */
@media (max-width: 1024px) and (min-width: 769px) {
    .content-area {
        width: 65% !important;
    }
    .sidebar,
    #secondary {
        width: 33% !important;
    }
}

/* ============================================
   7. MOBILE BREAKPOINT (up to 768px)
   ============================================ */
@media (max-width: 768px) {
    /* Stack sidebar below content, remove sticky on mobile */
    .sidebar,
    #secondary,
    .widget-area {
        position: static;
        width: 100% !important;
        margin-top: 2rem;
    }

    .thumbnail img.wp-post-image {
        max-height: 250px !important;
    }

    /* Circle CTA → rounded rectangle on small screens so text doesn't overflow */
    .consultation-circle,
    .elementor-shape-circle {
        width: 100% !important;
        height: auto !important;
        border-radius: 24px !important;
        padding: 2rem 1.25rem !important;
    }

    .elementor-widget-theme-comments,
    .comment-respond {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
    }

    #commentform input[type="submit"] {
        width: 100%;
    }
}

/* ============================================
   8. SMALL MOBILE (up to 425px)
   ============================================ */
@media (max-width: 425px) {
    .consultation-circle,
    .elementor-shape-circle {
        padding: 1.5rem 1rem !important;
    }
    .consultation-circle h2,
    .elementor-shape-circle h2 {
        font-size: 1.5rem !important;
    }
}/* End custom CSS */