.elementor-widget-container .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-container .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-6646 .elementor-element.elementor-element-e18b457{--display:flex;}.elementor-widget-shortcode .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-shortcode .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}@media(min-width:768px){.elementor-6646 .elementor-element.elementor-element-e18b457{--content-width:1470px;}}/* Start custom CSS for shortcode, class: .elementor-element-1ecfa86 *//* ==========================================================================
   1. THE ASYMMETRIC 4-COLUMN CORE GRID
   ========================================================================== */
.alm-listing {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important; /* Configures a 4-column base */
    gap: 24px !important;
    width: 100% !important;
}

.alm-reveal {
    display: contents !important; /* Prevents plugin wrappers from breaking the grid */
}

/* ==========================================================================
   2. BASE CARD STYLING (Founded.com Light Gray Containers)
   ========================================================================== */
.founded-card-wrapper {
    background-color: #ededed !important; /* Light off-white/gray card fill */
    border-radius: 14px !important; /* Smooth rounded corners */
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.founded-card-thumb {
    overflow: hidden !important;
    width: 100% !important;
}

.founded-card-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.founded-card-content {
    padding: 28px !important; /* Keeps text safely away from card edges */
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    flex-grow: 1 !important;
}

/* ==========================================================================
   3. THE ALTERNATING GRID SYSTEM (The Asymmetric Magic)
   Using a mathematical formula (6n) to alter sizes sequentially 
   ========================================================================== */

/* WIDE HORIZONTAL CARDS: Applies to the 1st and 6th items in every cycle */
.alm-listing > .founded-card-wrapper:nth-child(6n+1),
.alm-listing > .founded-card-wrapper:nth-child(6n+6) {
    grid-column: span 2 !important; /* Stretches card across 2 columns */
    flex-direction: row !important; /* Forces image left, text right layout */
}

/* Dynamic width adjustments inside Wide Cards */
.alm-listing > .founded-card-wrapper:nth-child(6n+1) .founded-card-thumb,
.alm-listing > .founded-card-wrapper:nth-child(6n+6) .founded-card-thumb {
    width: 50% !important;
}
.alm-listing > .founded-card-wrapper:nth-child(6n+1) .founded-card-content,
.alm-listing > .founded-card-wrapper:nth-child(6n+6) .founded-card-content {
    width: 50% !important;
}

/* VERTICAL SQUARE CARDS: For items 2, 3, 4, and 5 in the cycle */
.alm-listing > .founded-card-wrapper:not(:nth-child(6n+1)):not(:nth-child(6n+6)) .founded-card-thumb {
    aspect-ratio: 16 / 10 !important; /* Locks vertical card image aspect-ratio */
}

/* ==========================================================================
   4. TYPOGRAPHY & INTERNAL ELEMENT ALIGNMENT
   ========================================================================== */
.founded-card-title {
    margin: 0 0 15px 0 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    letter-spacing: -0.3px !important;
}

.founded-card-title a {
    color: #000000 !important;
    text-decoration: none !important;
}

.founded-card-footer {
    display: flex !important;
    align-items: center !important;
    margin-top: auto !important;
    width: 100% !important;
}

/* Wide Cards display red categories and buttons spread apart */
.alm-listing > .founded-card-wrapper:nth-child(6n+1) .founded-card-footer,
.alm-listing > .founded-card-wrapper:nth-child(6n+6) .founded-card-footer {
    justify-content: space-between !important;
}

.founded-card-cat a {
    color: #d9383a !important; /* Clean Crimson Red matching target site */
    text-transform: uppercase !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-decoration: none !important;
}

/* Vertical Cards hide categories and align button to the left (matching target) */
.alm-listing > .founded-card-wrapper:not(:nth-child(6n+1)):not(:nth-child(6n+6)) .founded-card-footer {
    justify-content: flex-start !important;
}
.alm-listing > .founded-card-wrapper:not(:nth-child(6n+1)):not(:nth-child(6n+6)) .founded-card-cat {
    display: none !important; 
}

/* ==========================================================================
   5. FOUNDED-STYLE OUTLINE BUTTONS
   ========================================================================== */
.founded-read-btn {
    display: inline-flex !important;
    align-items: center !important;
    border: 1px solid #000000 !important;
    background: transparent !important;
    color: #000000 !important;
    padding: 6px 14px !important;
    font-family: -apple-system, sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    transition: all 0.2s ease !important;
}

.founded-read-btn:hover {
    background: #000000 !important;
    color: #ffffff !important;
}

/* ==========================================================================
   6. RESPONSIVE DEVICE BREAKPOINTS
   ========================================================================== */
@media (max-width: 1100px) {
    .alm-listing {
        grid-template-columns: repeat(2, 1fr) !important; /* Converts to 2 columns on tablets */
    }
    .alm-listing > .founded-card-wrapper:nth-child(n) {
        grid-column: span 1 !important;
        flex-direction: column !important; /* Drops horizontal rows to columns on smaller screens */
    }
    .alm-listing > .founded-card-wrapper .founded-card-thumb,
    .alm-listing > .founded-card-wrapper .founded-card-content {
        width: 100% !important;
    }
}

@media (max-width: 600px) {
    .alm-listing {
        grid-template-columns: 1fr !important; /* Single column on phones */
    }
    .founded-card-content {
        padding: 20px !important;
    }
}/* End custom CSS */