/* ============================================
   TABLET STYLES (641px - 1024px)
   Portfolio 2026 - Loesing Design Incorporated
   ============================================ */

/* ============================================
   CONTACT LINK VISIBILITY (≤1024px)
   ============================================ */

@media only screen and (max-width: 1024px) {
    .qodef-header-widget-area-one,
    #block-10 {
        display: block !important;
    }
    
    .qodef-widget-holder.qodef--one {
        display: block !important;
        margin-left: auto !important;
    }

}

/* ============================================
   TABLET LAYOUT (≤968px)
   ============================================ */

@media (max-width: 968px) {
    .about-how-grid {
        grid-template-columns: 1fr;
        gap: var(--space-5xl);
    }

    .about-how-section {
        padding: var(--space-6xl) var(--space-md);
    }
    
    .photo-grid {
        padding: var(--space-6xl) var(--space-xl) !important;
    }

    .photo-grid-container {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }

    .photo-grid-image {
        order: 2;
    }

    .photo-grid-content {
        order: 1;
    }
    
    .cl-case-study .elementor-container {
        padding-left: var(--space-xl);
        padding-right: var(--space-xl);
    }
    
    .cl-case-study .elementor-column.elementor-col-50:first-child,
    .cl-case-study .elementor-column.elementor-col-50:last-child {
        padding-left: 0;
        padding-right: 0;
    }
}

/* ============================================
   TABLET TYPOGRAPHY (≤768px)
   ============================================ */

@media only screen and (max-width: 768px) {
    h6, .qodef-h6 {
        font-size: var(--type-sm) !important;
        line-height: var(--line-sm) !important;
    }
    
    #qodef-page-content > div > div > div > section.elementor-section.elementor-top-section.elementor-element.elementor-element-5c468d2.elementor-section-full_width.elementor-section-height-default.elementor-section-height-default.qodef-elementor-content-no > div > div > div > div.elementor-element.elementor-element-3f2cd5e.elementor-widget.elementor-widget-text-editor > p {
        font-size: var(--type-2xl) !important;
    }
    
    #qodef-page-content > div > div > div > section.elementor-section.elementor-top-section.elementor-element.elementor-element-5c468d2.elementor-section-full_width.elementor-section-height-default.elementor-section-height-default.qodef-elementor-content-no > div > div > div > div.elementor-element.elementor-element-43eb816.e-grid.e-con-boxed.qodef-elementor-content-no.e-con.e-parent.e-lazyloaded > div > div.elementor-element.elementor-element-ba8c43d.elementor-widget.elementor-widget-text-editor {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
    
    .elementor-element-5c468d2 {
        padding-top: var(--space-5xl) !important;
        padding-bottom: var(--space-5xl) !important;
    }
    
    .elementor-element-5c468d2 .elementor-element-3f2cd5e {
        margin-bottom: var(--space-lg);
    }
    
    /* Case Study Titles - Tablet */
    .cl-case-study .qodef-m-title,
    .elementor-190 .elementor-element.elementor-element-8a4000a .qodef-qi-section-title .qodef-m-title,
    .elementor-190 .elementor-element.elementor-element-29d034d .qodef-qi-section-title .qodef-m-title,
    .elementor-190 .elementor-element.elementor-element-5c4e2a2 .qodef-qi-section-title .qodef-m-title {
        font-size: clamp(32px, 6vw, 48px) !important;
        line-height: 1.1 !important;
    }
    
    /* Hero Heading Spacing - Tablet */
    .elementor-element-2dacf6d h1.qodef-m-title,
    .elementor-element-44053b7 h1.qodef-m-title,
    .elementor-element-7f7e61b h1.qodef-m-title {
        font-size: clamp(80px, 15vw, 140px) !important;
        line-height: 0.9 !important;
    }
    
    .elementor-190 .elementor-element.elementor-element-44053b7 {
        padding-top: var(--space-md) !important;
        padding-bottom: var(--space-md) !important;
    }
}


@media only screen and (min-width: 641px) and (max-width: 1024px) {
    /* "Chet" */
    .elementor-190 .elementor-element.elementor-element-7f7e61b{
        padding-top: 30px !important;
    }
    .elementor-190 .elementor-element.elementor-element-8a9b4bf .qodef-qi-section-title .qodef-m-title {
        font-size: 10vw;
    }
}
