.elementor-169 .elementor-element.elementor-element-aeb34dd{--display:flex;}.elementor-169 .elementor-element.elementor-element-a804d00{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.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-169 .elementor-element.elementor-element-5a35fbf .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:400;text-transform:uppercase;color:var( --e-global-color-text );}.elementor-169 .elementor-element.elementor-element-eae06c8{padding:0px 0px 20px 0px;}.elementor-169 .elementor-element.elementor-element-6046bfd{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-169 .elementor-element.elementor-element-1f26668{--display:flex;}.elementor-169 .elementor-element.elementor-element-2b49973 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:400;text-transform:uppercase;color:var( --e-global-color-text );}.elementor-169 .elementor-element.elementor-element-c8f0bb9{padding:0px 0px 20px 0px;}.elementor-169 .elementor-element.elementor-element-539f114{padding:0px 0px 40px 0px;}.elementor-169 .elementor-element.elementor-element-e0b2d21{--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-169 .elementor-element.elementor-element-186bc6c{--display:flex;border-style:none;--border-style:none;}.elementor-169 .elementor-element.elementor-element-4e5ffef{padding:0px 0px 0px 0px;}@media(min-width:768px){.elementor-169 .elementor-element.elementor-element-e0b2d21{--width:70%;}}/* Start custom CSS for html, class: .elementor-element-da392dc *//* ==========================================================================
   Home Hero Flex Grid Layout (3/4 vs 1/4 Split)
   ========================================================================== */
body .hero-grid-container {
    display: flex !important;
    gap: 20px !important;
    width: 100% !important;
    max-width: 1200px !important;
    margin: 30px auto !important;
    box-sizing: border-box !important;
}

/* Big Post Column (75% Width) */
body .hero-grid-main {
    flex: 0 0 calc(75% - 10px) !important;
    width: calc(75% - 10px) !important;
}

/* Sidebar Column (25% Width) */
body .hero-grid-sidebar {
    flex: 0 0 calc(25% - 10px) !important;
    width: calc(25% - 10px) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

/* Global Card Foundations */
body .hero-grid-card {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;
    height: 100% !important;
}

/* Branded Gradient Variables */
body .hero-card-img {
    --thumb-start: #4e6cbc;
    --thumb-end: #1c2e6c;
    background: linear-gradient(135deg, var(--thumb-start, var(--color-support-blue)), var(--thumb-end, var(--color-brand-primary))) !important;
    background-size: cover !important;
    background-position: center !important;
    width: 100% !important;
    flex-shrink: 0 !important;
}

/* ==========================================================================
   STRUCTURE 1: The 1 Big Main Post Layout
   ========================================================================== */
/* Image: Fixed at 380px */
body .hero-grid-main .hero-card-img {
    height: 380px !important;
}

/* Text Container: Compact footer footprint */
body .hero-grid-main .hero-card-content {
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    flex-grow: 1 !important;
}

/* ==========================================================================
   STRUCTURE 2: The 2 Smaller Stacked Sidebar Posts (50/50 Split)
   ========================================================================== */
body .hero-grid-sidebar .hero-grid-card {
    min-height: 300px !important; /* Establishes a comfortable height for the smaller items */
}

/* Image takes up exactly 50% height */
body .hero-grid-sidebar .hero-card-img {
    flex: 0 0 50% !important;
    height: 50% !important;
}

/* Content takes up exactly 50% height */
body .hero-grid-sidebar .hero-card-content {
    padding: 15px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    flex: 0 0 50% !important;
    height: 50% !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
   Metadata, Tags & Typography Styles
   ========================================================================== */
body .hero-card-meta {
    display: flex !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}

body .cat-tag {
    font-size: 10px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    padding: 2px 6px !important;
    border-radius: 3px !important;
}

body .parent-tag {
    background-color: #0073aa !important;
    color: #ffffff !important;
}

body .sub-tag {
    background-color: #e1f0fa !important;
    color: #0073aa !important;
}

body .hero-card-title {
    margin: 0 !important;
    line-height: 1.3 !important;
}

body .hero-grid-main .hero-card-title {
    font-size: 22px !important;
}

body .hero-grid-sidebar .hero-card-title {
    font-size: 15px !important;
}

body .hero-card-title a {
    color: #222222 !important;
    text-decoration: none !important;
}

body .hero-card-excerpt {
    margin: 0 !important;
    font-size: 13px !important;
    color: #666666 !important;
    line-height: 1.4 !important;
}

/* ==========================================================================
   Mobile Responsiveness (900px and below)
   ========================================================================== */
@media (max-width: 900px) {
    body .hero-grid-container {
        flex-direction: column !important;
    }
    body .hero-grid-main, 
    body .hero-grid-sidebar {
        flex: 0 0 100% !important;
        width: 100% !important;
    }
    body .hero-grid-main .hero-card-img {
        height: 250px !important; /* Scales down gracefully on mobile displays */
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9ee6733 *//* ==========================================================================
   Secondary Home Feed Grid (5 Columns Desktop / 2 Columns Mobile)
   ========================================================================== */
body .sub-grid-container {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important; /* Uniform 5 Columns across Desktop widths */
    gap: 20px !important;
    width: 100% !important;
    max-width: 1200px !important;
    margin: 30px auto !important;
    box-sizing: border-box !important;
}

/* Sub Card Container Architecture */
body .sub-grid-card {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 280px !important; /* Standard layout floor boundaries */
    box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;
}

/* Image Element (Forces strict 50% vertical split) */
body .sub-card-img {
    --thumb-start: #4e6cbc;
    --thumb-end: #1c2e6c;
    background: linear-gradient(135deg, var(--thumb-start, var(--color-support-blue)), var(--thumb-end, var(--color-brand-primary))) !important;
    background-size: cover !important;
    background-position: center !important;
    width: 100% !important;
    flex: 0 0 50% !important;
    height: 50% !important;
}

/* Content Element (Forces strict 50% vertical split) */
body .sub-card-content {
    padding: 12px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    flex: 0 0 50% !important;
    height: 50% !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
}

/* Meta Labels & Typography adjustments */
body .sub-card-meta {
    display: flex !important;
    gap: 4px !important;
    flex-wrap: wrap !important;
}

body .sub-card-title {
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
}

body .sub-card-title a {
    color: #222222 !important;
    text-decoration: none !important;
}

/* ==========================================================================
   Responsive Mobile Architecture Blueprint (768px and down) - Clean Pairs (2s)
   ========================================================================== */
@media (max-width: 768px) {
    body .sub-grid-container {
        /* Changes to 2 equal columns on mobile viewports */
        grid-template-columns: repeat(2, 1fr) !important; 
        gap: 15px !important;
    }

    /* Makes the 5th post stretch cleanly across the bottom row */
    body .sub-grid-container .sub-grid-card:nth-child(5) {
        grid-column: span 2 !important;
    }
}

/* Tiny Mobile Viewports (480px and down) */
@media (max-width: 480px) {
    /* Optional: Keep it as 2s, or change to 1fr if text gets too squished */
    body .sub-grid-container {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-539f114 *//* ==========================================================================
   Archive List Section (Title + Excerpt Stacked Row)
   ========================================================================== */
body .archive-list-wrapper {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 40px auto !important;
    box-sizing: border-box !important;
    padding: 0 15px !important;
}

body .archive-list-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 25px !important;
}

/* Row Item Divider Border styling */
body .archive-list-item {
    border-bottom: 1px solid #eaeaea !important;
    padding-bottom: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

body .archive-list-item:last-child {
    border-bottom: none !important;
}

body .archive-item-title {
    margin: 0 !important;
    /**font-size: 18px !important;**/
    line-height: 1.4 !important;
}

body .archive-item-title a {
    color: #111111 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: color 0.2s ease !important;
}

body .archive-item-title a:hover {
    color: #0073aa !important; /* Accent brand hover shift color */
}

body .archive-item-excerpt {
    margin: 0 !important;
    font-size: 14px !important;
    color: #555555 !important;
    line-height: 1.5 !important;
}

/* AJAX Action Loading Trigger Component */
body .archive-loadmore-actions {
    text-align: center !important;
    margin-top: 40px !important;
}

body #load-more-archive-btn {
    background-color: #1c2e6c !important; /* Pulls from your branding parameters */
    color: #ffffff !important;
    border: none !important;
    padding: 12px 35px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, opacity 0.2s ease !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important;
}

body #load-more-archive-btn:hover {
    background-color: #4e6cbc !important;
}

body #load-more-archive-btn:disabled {
    background-color: #cccccc !important;
    cursor: not-allowed !important;
    opacity: 0.7 !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-b91bbdd *//* ==========================================================================
   Spotlight Feature Block (Vertical Tower Architecture)
   ========================================================================== */
body .spotlight-tower-wrapper {
    width: 100% !important;
   /*  max-width: 400px; Locks the layout container into a sleek, narrow column format 
    margin: 20px auto !important;*/
    box-sizing: border-box !important;
}

body .spotlight-tower-card {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 580px !important; /* Creates a clean, elongated vertical tower layout */
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
    height: 100% !important;
}

/* Tower Image Element (Occupies the upper portion of the column) */
body .spotlight-tower-img {
    --thumb-start: #4e6cbc;
    --thumb-end: #1c2e6c;
    background: linear-gradient(135deg, var(--thumb-start, var(--color-support-blue)), var(--thumb-end, var(--color-brand-primary))) !important;
    background-size: cover !important;
    background-position: center !important;
    width: 100% !important;
    height: 340px !important; /* Tall, high-impact asset display framing */
    flex-shrink: 0 !important;
}

/* Lower Text Information Zone */
body .spotlight-tower-content {
    padding: 24px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    flex-grow: 1 !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}

body .spotlight-tower-meta {
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

/* Typographic Layout Parameters */
body .spotlight-tower-title {
    margin: 0 !important;
    font-size: var(--step-3, 24px) !important; /* Uses your global fluid typography system */
    line-height: 1.25 !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
}

body .spotlight-tower-title a {
    color: #111111 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

body .spotlight-tower-title a:hover {
    color: #0073aa !important;
}

body .spotlight-tower-excerpt {
    margin: 0 !important;
    font-size: var(--step-0, 16px) !important;
    color: #555555 !important;
    line-height: 1.5 !important;
}

/* Mobile Viewports Adaptations */
@media (max-width: 480px) {
    body .spotlight-tower-wrapper {
        max-width: 100% !important; /* Expands to full screen width on compact viewports */
    }
    body .spotlight-tower-card {
        min-height: 500px !important;
    }
    body .spotlight-tower-img {
        height: 260px !important;
    }
}/* End custom CSS */