/* ========================================= */
/* FIND US - SPLIT SCREEN SECTION STYLES     */
/* INFO (LEFT) / MAP CARD (RIGHT)            */
/* ========================================= */

.find-us-split-section {
    width: 100%;
}

/* The main container for the split layout */
.find-us-split-container {
    display: flex; 
    flex-direction: row; /* Side-by-side on desktop */
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
}

/* === Left Panel: Information === */
.find-us-info-panel {
    flex: 1 1 50%; 
    color: #000;
    padding: 80px 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* === Right Panel: Map Container === */
.find-us-map-panel {
    flex: 1 1 50%; 
    min-height: 600px;
    
    /* KEY CHANGE: Use Flexbox to perfectly center the map card */
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px; /* Adds space around the map card */
}

/* === The Map Iframe as a Card === */
.find-us-map-panel iframe {
    /* KEY CHANGE: Size and Shape */
    width: 100%;
    max-width: 550px; /* Controls the max size of the card */
    aspect-ratio: 16 / 10; /* Keeps a consistent shape */

    /* KEY CHANGE: Card Styling */
    border-radius: 15px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

/* --- All other styling for text, icons, etc. --- */
.find-us-info-panel .section-title { text-align: left; color: #000; margin-bottom: 20px; }
.find-us-info-panel .find-us-intro { font-size: 1.1rem; line-height: 1.7; margin-bottom: 40px; color: #000; }
.find-us-info-panel .contact-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 30px; }
.find-us-info-panel .contact-list li { display: flex; align-items: flex-start; }
.find-us-info-panel .contact-list i { font-size: 1.5rem; color: #f39c12; margin-right: 20px; margin-top: 5px; width: 25px; }
.find-us-info-panel .contact-list h4 { margin: 0 0 5px 0; font-size: 1.1rem; font-weight: 700; color: #000; }
.find-us-info-panel .contact-list p { margin: 0; line-height: 1.6; color: #000; }
.find-us-info-panel .contact-list a { color: #f39c12; text-decoration: none; transition: color 0.3s ease; }
.find-us-info-panel .contact-list a:hover { color: #000; }

/* ========================================= */
/* RESPONSIVE STYLES - Stacking the layout   */
/* ========================================= */

@media (max-width: 992px) {
    .find-us-split-container {
        flex-direction: column; /* Stacks the panels vertically */
    }

    .find-us-info-panel {
        padding: 60px 40px;
        text-align: center;
    }

    .find-us-map-panel {
        min-height: auto; /* Allow height to be flexible */
        padding: 0 40px 60px 40px; /* Adjust padding for stacked layout */
    }
    
    .find-us-info-panel .section-title {
        text-align: center;
    }

    .find-us-info-panel .contact-list li {
       flex-direction: column;
       align-items: center;
       text-align: center;
    }
    
    .find-us-info-panel .contact-list i {
        margin-right: 0;
        margin-bottom: 10px;
        margin-top: 0;
    }
}

@media (max-width: 576px) {
    .find-us-info-panel {
        padding: 50px 20px;
    }
    .find-us-map-panel {
        padding: 0 20px 50px 20px;
    }
}