/* Apply the retro texture to the main site canvas */
body, .site, .site-content {
    background-color: #F0E7D8 !important; /* Soft, warm antique cream background */
    background-image: url("https://www.transparenttextures.com/patterns/fabric-of-squares.png") !important;
    background-repeat: repeat !important;
}

/* ==========================================
   1. SHRINK JETPACK SUBSCRIPTION BOX & BUTTON
   ========================================== */

/* Force form items onto a single line */
html body #page .jetpack_subscription_widget form,
html body #page .jetpack_subscription_widget p {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    margin: 0 !important;
    padding: 10px !important; 
}

/* Shrink the Email Input Box */
html body #page .jetpack_subscription_widget input[type="email"] {
    font-size: 12px !important;
    height: 24px !important; 
    padding: 4px 10px !important;
    margin: 0 !important;
    border: 1px solid #ebdcb9 !important; /* Antique cream border color */
    background-color: rgba(255, 255, 255, 0.1) !important; /* Semitransparent */
    color: #ebdcb9 !important;
    border-radius: 4px 0 0 4px !important; /* Round left corners only */
    width: 140px !important; 
}

/* Clear placeholder styling */
html body #page .jetpack_subscription_widget input[type="email"]::placeholder {
    color: rgba(235, 220, 185, 0.6) !important;
}

/* Format and attach the Subscribe Button */
html body #page .jetpack_subscription_widget input[type="submit"],
html body #page .jetpack_subscription_widget button[type="submit"] {
    font-size: 11px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    height: 24px !important; 
    line-height: 24px !important; 
    padding: 0 8px !important;
    margin: 0 0 0 -1px !important; /* Snaps flush to input box */
    background-color: #d5fc51 !important; 
    color: #222222 !important; 
    border: 1px solid #ebdcb9 !important;
    border-radius: 0 4px 4px 0 !important; /* Round right corners only */
    cursor: pointer !important;
    transition: background 0.2s ease-in-out !important;
    box-sizing: border-box !important;
}

/* Hover style */
html body #page .jetpack_subscription_widget input[type="submit"]:hover,
html body #page .jetpack_subscription_widget button[type="submit"]:hover {
    background-color: #ffffff !important; 
    border-color: #ffffff !important;
    color: #222222 !important;
}

/* ==========================================
   2 & 3. LAYOUT FIX: ADJUSTED SPACING & ALIGNMENT
   ========================================== */

/* Move Socials/Subscribe further UP and to the right */
.ast-above-header-wrap,
.site-below-header-wrap {
    position: absolute !important;
    top: -3px !important; /* Pulls the subscription row flush with the top screen edge */
    right: 20px !important; 
    width: auto !important;
    z-index: 9999 !important;
    background: transparent !important;
}

.main-header-bar-wrap,
.main-header-bar {
    display: flex !important;
    flex-direction: row !important; 
    justify-content: flex-end !important;
    align-items: flex-end !important;
    padding-top: 0px !important; /* Shaved off 30px of dead space to shift everything UP */
    padding-bottom: 15px !important;
    width: 100% !important;
}

/* Push the Navigation Menu DOWN a bit (Cleaned up duplicate declaration) */
.ast-primary-header-bar,
.site-primary-header-wrap,
.main-header-bar-navigation {
    display: block !important;
    transform: none !important;
    margin-top: 0px !important; 
    margin-bottom: 10px !important; /* Pushes the menu DOWN */
}

/* Shift the Logo LEFT and down from top edge (Unified) */
.site-branding, 
.site-logo-img {
    margin-left: -175px !important; 
    margin-top: 0px !important;  /* Slides the logo UP */
    padding-left: 0 !important; 
    display: block !important;
    z-index: 10 !important;
}

/* ==========================================
   4. PULL HERO SECTION UP TO JOIN THE HEADER
   ========================================== */

/* Force the main page content wrapper up to close the white gap */
#content,
.site-content,
.ast-container {
    margin-top: 0 !important; 
    position: relative !important;
    z-index: 1 !important; 
}

/* Ensure the header container itself doesn't block the transparent overlay */
.site-header-primary-header-wrap,
.site-header {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* ==========================================
   5. GLOBAL STICKY HEADER & BACKGROUND FIX
   ========================================== */

/* Target Astra's outermost container to stick ALL rows together */
.site-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 9999 !important; /* Keeps everything on top of the page content */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important; /* Subtle shadow when scrolling */
}

/* Outer pages get a solid dark header background by default */
body:not(.home) .site-header,
body:not(.home) .ast-above-header-bar,
body:not(.home) .main-header-bar-wrap,
body:not(.home) .main-header-bar {
    background-color: #2a2a2a !important; 
}

/* ==========================================
   6. HEADER COMPACTNESS & ROW HEIGHT FIXES
   ========================================== */

/* Reduce Logo Size & Padding */
.site-header .site-branding img,
.site-header .custom-logo-link img {
    max-height: 170px !important; 
    width: auto !important;
    padding-top: 0px !important;
    padding-bottom: 5px !important;
}

/* Shrink Above-Header Row (Social Menu Row) */
.ast-above-header-bar {
    max-height: 35px !important; /* Cap the row height */
    line-height: 35px !important; 
}
.ast-above-header-bar .ast-above-header-container {
    min-height: 35px !important; 
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Shrink Main Header Row (Navigation Menu Row) */
.main-header-bar {
    line-height: 60px !important; 
}
.main-header-bar .main-header-bar-navigation {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Adjust Main Menu Link Spacing */
.main-header-bar .main-header-menu > .menu-item > a {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 60px !important; /* Matches the line-height so text stays centered */
    line-height: 60px !important;
}

/* Reduce the body padding to match the new compact header layout */
body {
    padding-top: 175px !important; 
}

/* ==========================================
   7. HOMEPAGE TRANSPARENT VS. SCROLLING STICKY FIX
   ========================================== */

/* 1. Force absolute transparency on the homepage initially */
body.home .site-header,
body.home .ast-above-header-bar,
body.home .main-header-bar-wrap,
body.home .main-header-bar {
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important; /* Remove shadow while it is transparent */
}

/* 2. Bring back the solid charcoal background only when scrolling on the homepage */
body.home .ast-sticky-header-active .site-header,
body.home .ast-sticky-header-active .ast-above-header-bar,
body.home .ast-sticky-header-active .main-header-bar-wrap,
body.home .ast-sticky-header-active .main-header-bar {
    background-color: #2a2a2a !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}