/* ==========================================================================
   1. FORCE HORIZONTAL TOP NAVIGATION ONLY
   ========================================================================== */
html, body {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important; 
    background-color: #050505 !important;
}

/* Enforce the header bar firmly across the top */
#masthead, .site-header, #site-header {
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    background: #121212 !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.3) !important;
    border-right: none !important;
    padding: 15px 30px !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    z-index: 99999 !important;
    box-sizing: border-box !important;
}

/* Force menu links to run horizontally */
.site-header .site-navigation ul.menu,
.main-navigation ul {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 20px !important;
    width: auto !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Reset any left margins on the page content layout */
#page, .site, #content, .site-content, main, #primary, .site-main, .site-footer {
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: none !important;
}

/* ==========================================================================
   2. WIDE & PERFECTLY CONTAINED BENTO POST CARDS (ARCHIVE PAGES)
   ========================================================================== */
.archive #main .site-main, 
.blog #main .site-main,
.archive .elementor-posts-container,
.blog .elementor-posts-container,
.archive-container,
.elementor-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important; 
    gap: 40px !important; 
    padding: 40px 20px !important;
    max-width: 1200px !important; 
    margin: 0 auto !important;
    width: 100% !important;
}

/* Wide Independent Bento Box Wrapper */
.archive article, .archive .elementor-post,
.blog article, .blog .elementor-post,
.hfe-post-card {
    background-color: #121212 !important;
    border: 1px solid rgba(212, 175, 55, 0.25) !important;
    border-radius: 16px !important;
    padding: 40px !important;
    margin: 0 0 20px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; 
    text-align: center !important;   
    position: relative !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    flex: 1 1 100% !important; 
}

/* Strict Image Containment */
.archive article img, 
.archive .elementor-post__thumbnail img,
.blog article img, 
.blog .elementor-post__thumbnail img,
.hfe-post-image img,
.elementor-post__thumbnail img {
    aspect-ratio: 21 / 9 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    border-radius: 12px !important;
    margin-bottom: 25px !important;
    display: block !important;
}

.elementor-post__card, .elementor-post__thumbnail, .hfe-post-image, .entry-header, .entry-content, .elementor-post__text {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
}

/* ==========================================================================
   3. TYPOGRAPHY (ULTIMATE CRACKING WHITE POST TEXT OVERRIDE)
   ========================================================================== */
/* Titles styling */
h1.entry-title, h1.post-title, h1.page-title, .elementor-page-title, .hfe-post-title,
h1, h2, h3, h4, h5, h6 {
    text-align: center !important;
}

h1.entry-title, h1.post-title, h1.page-title, .elementor-page-title {
    margin-bottom: 30px !important;
    background: linear-gradient(135deg, #f9d976 0%, #d4af37 50%, #ab8212 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* FORCE INDIVIDUAL POST ELEMENTS AND INNER TEXT SNIPPETS TO WHITE */
body, 
.single-post,
.single-post p, 
.single-post span, 
.single-post div,
.single-post section,
.entry-content, 
.entry-content p, 
.entry-content span,
.elementor-text-editor,
.elementor-text-editor *,
.elementor-widget-theme-post-content,
.elementor-widget-theme-post-content *,
.single-post main p,
.archive article, .blog article, .elementor-post,
.archive article p, .blog article p, .elementor-post__excerpt {
    color: #ffffff !important; 
}

/* Keep clickable link headings Gold */
.archive article h2 a, .blog article h2 a, .elementor-post__title a {
    color: #d4af37 !important;
    text-decoration: none !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
}

/* ==========================================================================
   4. HUNTER GREEN INTERACTIVE FOCUS HOVER ACCENT
   ========================================================================== */
.archive article:hover, .blog article:hover, .hfe-post-card:hover {
    background-color: #161616 !important;
    border-color: #1b4d3e !important; 
    transform: translateY(-4px) !important;
    box-shadow: 0 15px 35px rgba(27, 77, 62, 0.35) !important;
}

/* ==========================================================================
   5. HIDE "Homepage" PAGE TITLE H1
   ========================================================================== */
.page-id-1466 .page-header,
.page-id-1466 .entry-header,
.page-id-1466 h1.page-title {
  display: none !important;
}

/* Center all text and images on single blog posts and static pages (excluding custom homepage) */
.single-post .entry-content,
.single-post .elementor-text-editor,
.single-post .entry-content p,
.page:not(.page-id-1466) .entry-content,
.page:not(.page-id-1466) .elementor-text-editor,
.page:not(.page-id-1466) .entry-content p {
    text-align: center !important;
}

.single-post .entry-content img,
.single-post figure.wp-block-image,
.single-post .wp-caption,
.page:not(.page-id-1466) .entry-content img,
.page:not(.page-id-1466) figure.wp-block-image,
.page:not(.page-id-1466) .wp-caption {
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
    text-align: center !important;
}