.elementor-1637 .elementor-element.elementor-element-e357ea3{--display:flex;}.elementor-1637 .elementor-element.elementor-element-2ba91f6{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1637 .elementor-element.elementor-element-3bd5949 > .elementor-widget-container{--e-transform-scaleX:1;margin:0px 0px -150px 0px;padding:0px 0px 0px 0px;}.elementor-1637 .elementor-element.elementor-element-3bd5949.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1637 .elementor-element.elementor-element-556bdcc{--display:flex;}.elementor-1637 .elementor-element.elementor-element-fe5f410 > .elementor-widget-container{--e-transform-scale:0.3;}.elementor-1637 .elementor-element.elementor-element-a04ae37{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1637 .elementor-element.elementor-element-bc0f237{text-align:center;}@media(max-width:767px){.elementor-1637 .elementor-element.elementor-element-3bd5949 > .elementor-widget-container{margin:0px 0px -50px 0px;}}/* Start custom CSS for bdevs-content-about, class: .elementor-element-3bd5949 *//* ============================================
   FIX: Stop Text Overlapping Images + Mobile Reorder
   ============================================ */

/* 1. Reset the row to prevent negative margins causing overlap */
.at-about-3-wrapper .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
}

/* 2. Ensure columns have standard padding and no negative margins */
.at-about-3-wrapper .col-xl-7,
.at-about-3-wrapper .col-xl-5,
.at-about-3-wrapper .col-lg-6 {
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    position: relative !important;
}

/* 3. CRITICAL FIX: Reset the text box positioning */
.at-about-title-box {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important; 
    margin-top: 20px !important; 
    padding-left: 20px !important; 
}

/* 4. Ducati Image - Constrained and slightly smaller width */
.at-about-thumb-main {
    height: 350px;
    overflow: hidden;
    border-radius: 8px;
    margin-bottom: 30px;
    max-width: 90%; 
}

.at-about-thumb-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

/* 5. Swing image + Opening Hours layout */
.at-about-thumb-secondary {
    display: flex;
    gap: 20px;
    align-items: center;
    position: relative !important;
    top: auto !important;
    right: auto !important;
}

.at-about-thumb-secondary > a {
    flex: 0 0 45%;
    height: 350px;
    overflow: hidden;
    border-radius: 8px;
}

.at-about-thumb-secondary > a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

.at-about-opening {
    flex: 1;
}

.at-about-opening h3 {
    font-size: 26px;
    margin-bottom: 15px;
    color: #2a66a4;
}

/* ============================================
   MOBILE RESPONSIVE & REORDERING
   ============================================ */
@media (max-width: 991px) {
    /* 1. Turn the row into a simple vertical list */
    .at-about-3-wrapper .row {
        display: flex !important;
        flex-direction: column !important;
    }
    
    /* 2. Make the columns "invisible" so we can reorder their children */
    .at-about-3-wrapper .col-xl-7,
    .at-about-3-wrapper .col-xl-5 {
        display: contents !important; 
        width: 100% !important;
    }

    /* 3. CRITICAL FIX: Make the image wrapper "invisible" too so images can be reordered */
    .at-about-thumb-wrapp {
        display: contents !important;
    }

    /* 4. Add padding back to the items */
    .at-about-thumb-main,
    .at-about-thumb-secondary,
    .at-about-title-box {
        padding-left: 15px !important;
        padding-right: 15px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 5. THE REORDERING - Now this will actually work! */
    
    /* 1st: Ducati Image */
    .at-about-thumb-main {
        order: 1 !important;
        height: 300px; 
        margin-bottom: 0px;
        max-width: 100%;
    }
    
    /* 2nd: Corporate Text */
    .at-about-title-box {
        order: 2 !important;
        margin-bottom: 30px;
        padding-left: 0 !important; 
        margin-top: -0 !important;
        text-align: center;
    }
    
    /* 3rd: Swing Image + Opening Hours */
    .at-about-thumb-secondary {
        order: 3 !important;
        display: flex !important;
        flex-direction: column;
        gap: 20px;
        margin-top: -0px !important;
    }

    /* Swing Image styling */
    .at-about-thumb-secondary > a {
        display: block !important;
        width: 100% !important;
        height: 250px;
        flex: auto !important;
        margin-bottom: -30px !important;
    }
    
    .at-about-thumb-secondary > a img {
        height: 100%;
        width: 100%;
        object-fit: cover;
        border-radius: 8px;
    }

    /* Opening Hours styling */
    .at-about-opening {
        width: 100%;
        text-align: center;
    }
}/* End custom CSS */