/*
 Theme Name:   The Yoga Coach
 Theme URI:    http://example.com/the-yoga-coach/
 Description:  The Yoga Coach Child Theme
 Author:       Your Name
 Author URI:   http://example.com
 Template:     twentytwentyfour
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  theyogacoach
*/

/* Force header above all hero images and symbols */
.wp-block-template-part-header, 
header {
    position: relative !important;
    z-index: 9999 !important;
}

/* Ensure the navigation itself is clickable */
.wp-block-navigation {
    position: relative !important;
    z-index: 10000 !important;
}

/* Force all manual header links to the front */
header a {
    position: relative !important;
    z-index: 100 !important;
    pointer-events: auto !important; /* Ensures the link is actually clickable */
}

.service-card {
	transition: transform 0.3s ease-in-out;
}

.service-card:hover {
	transform: translateY(-5px);
}

/* Increase specificity for header logo to override other styles */
header .wp-block-image {
    max-width: 120px !important;
}

.is-style-theyogacoach-site-title .wp-block-site-title a {
    font-family: var(--wp--preset--font-family--lora);
    font-size: 1.5rem;
    color: var(--wp--preset--color--dark-text);
    text-decoration: none;
}

/* 1. Base Navigation Link Styles */
.nav-link,
.wp-block-navigation-item__content {
    text-decoration: none !important;
    color: #1A1A1A !important;
    font-weight: 500 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 1.1rem !important;
    transition: all 0.2s ease;
}

/* 2. THE FIX: Universal Active Bold State */
/* Targets both JS-added .nav-active and native WP current menu classes */
.nav-link.nav-active,
.wp-block-template-part-header nav a.nav-link.nav-active,
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation .current_page_item > .wp-block-navigation-item__content {
    color: #8F9E8B !important;       /* Sage Green */
    font-weight: 700 !important;      /* FORCE BOLD */
    border-bottom: 2px solid #C18063 !important; /* Terracotta Underline */
    padding-bottom: 5px !important;
}

/* 3. Hover State */
.nav-link:hover,
.wp-block-navigation-item__content:hover {
    color: #C18063 !important; /* Terracotta */
}

/* =========================================
   Museum-Grade Art Gallery & Interaction Fix
========================================= */
/* 1. Force a clean Two-Column Grid across ALL devices */
.art-gallery-container .wp-block-gallery.has-nested-images {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important; /* Forces standard two columns */
gap: 2rem !important; /* Consistent gap */
width: 100% !important;
max-width: var(--wp--style--global--wide-size, 1200px) !important; /* Site margins */
margin-left: auto !important;
margin-right: auto !important;
}

/* 2. Base Tile Styling: Card Preparation */
.wp-block-gallery .wp-block-image {
position: relative !important;
overflow: hidden !important;
border-radius: 15px !important; /* Matches overall site aesthetic */
background: #FFFFFF !important;
padding: 20px !important; /* 'Museum matte' feel */
box-shadow: 0 4px 15px rgba(0,0,0,0.04) !important;
transition: all 0.4s ease-in-out !important; /* Transition for Req 3 */
}

/* 3. Req 3: Subtle Popup/Lift Effect on Hover */
.wp-block-gallery .wp-block-image:hover {
    transform: translateY(-8px) scale(1.02) !important; /* Subtle lift and expansion */
    box-shadow: 0 15px 35px rgba(0,0,0,0.1) !important; /* Sage shadow */
    z-index: 10 !important;
}

/* 4. Req 2: Sliding Caption Info (Info appears on hover) */
.wp-block-gallery .wp-block-image img {
transition: transform 0.6s ease-in-out !important; /* Slightly zoom inner image */
display: block !important;
}

.wp-block-gallery .wp-block-image:hover img {
transform: scale(1.08) !important; /* Complementary zoom */
}

.wp-block-gallery .wp-block-image figcaption,
.wp-block-gallery .wp-block-image .wp-element-caption {
position: absolute !important;
bottom: 0 !important;
left: 0 !important;
width: 100% !important;
margin: 0 !important;
padding: 15px 25px !important;
background: rgba(26, 26, 26, 0.8) !important; /* Dark semi-transparent Charcoal */
color: #F9F6F0 !important; /* Off-white text */
font-family: 'Montserrat', sans-serif !important;
font-size: 0.95rem !important;

/* Animation logic: Starts below frame, slides up */
transform: translateY(100%) !important;
transition: transform 0.4s ease-in-out, opacity 0.4s ease !important;
opacity: 0 !important;
display: block !important;
}

/* Trigger sliding info on card hover */
.wp-block-gallery .wp-block-image:hover figcaption,
.wp-block-gallery .wp-block-image:hover .wp-element-caption {
transform: translateY(0) !important;
opacity: 1 !important;
}

/* =========================================
   Mentoring Page Visuals
========================================= */

/* Frosted Glass Hero */
.mentoring-hero-card {
    background: rgba(249, 246, 240, 0.8) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(200, 200, 200, 0.3) !important;
    border-radius: 15px !important;
}

/* Terracotta Glass CTA Card */
.cta-glass-card {
    background: rgba(193, 128, 99, 0.8) !important; /* Terracotta Glass */
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 15px !important;
}

/* Semi-Transparent Lower Cards */
.is-style-mentoring-card {
    background: rgba(249, 246, 240, 0.85) !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    border-radius: 15px !important;
    z-index: 1;
    margin: 0 !important; /* Reset ALL margins */
    display: flex !important;
    flex-direction: column !important;
}

.is-style-mentoring-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1) !important;
    z-index: 2;
}

/* Divider Dot Spacing - HIDDEN in grid layout */
.mentoring-dot {
   display: none !important; /* Hide separator dots in flex layout */
}

/* CTA Band Spacing */
.next-step-band {
    padding: 40px 20px !important;
    margin-top: 20px !important;
    text-align: center;
}

/* =========================================
   Articles Page Grid Styles
========================================= */

/* Target the main container - applies to page-articles and archive pages */
.page-template-page-articles .wp-block-cover.articles-hero,
.archive .wp-block-cover.articles-hero,
.category .wp-block-cover.articles-hero {
    min-height: 400px !important;
    background-color: #8F9E8B !important; /* Sage green background for cohesive border */
    padding: 40px !important;
}

/* Target the actual image layer WordPress creates */
.wp-block-cover.articles-hero .wp-block-cover__image-background,
.wp-block-cover.articles-hero img {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    object-fit: cover !important;
    object-position: center !important;
    width: 100% !important;
    height: 100% !important;
    /* Remove any parallax/fixed behavior */
    position: absolute !important;
    background-attachment: scroll !important;
}

/* Refine the Glass Card */
.articles-hero-card {
    position: relative;
    z-index: 10;
    background: transparent !important;
    backdrop-filter: none;
    border: none;
    padding: 40px 60px !important;
    max-width: 600px !important;
    margin: 0 auto !important;
}

.articles-hero-card h1,
.articles-hero-card .wp-block-archive-title {
    color: #F9F6F0 !important;
    font-family: 'Lora', serif;
    font-weight: 400;
    font-size: 3rem;
    letter-spacing: 1px;
    line-height: 1.2;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Ensure the overlay doesn't create a 'box' effect */
.wp-block-cover.articles-hero .wp-block-cover__background {
    opacity: 0.2 !important;
}

/* Ensure the cover block has enough vertical height */
.wp-block-cover.is-light {
    min-height: 400px !important;
}

/* Ensure the Article Grid stays centered with padding */
.wp-block-query {
    margin-left: auto !important;
    margin-right: auto !important;
    /* Matches the global padding in theme.json */
    padding-left: var(--wp--preset--spacing--step-4) !important;
    padding-right: var(--wp--preset--spacing--step-4) !important;
}

/* Extra safety for the grid template - applies to page-articles and archive pages */
.page-template-page-articles .wp-block-post-template.is-layout-grid,
.archive .wp-block-post-template.is-layout-grid,
.category .wp-block-post-template.is-layout-grid {
    width: 100% !important;
    max-width: var(--wp--style--global--wide-size, 1200px) !important;
    margin: 0 auto !important;
}

/* Article card base styles - applies to page-articles and archive pages */
.page-template-page-articles .article-card,
.archive .article-card,
.category .article-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    background: #F9F6F0; /* Off-White */
    border-radius: 15px;
    overflow: hidden; /* Ensures image respects border-radius */
    transition: all 0.4s ease;
}

.article-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.article-card .wp-block-post-featured-image {
    margin: 0; /* remove default margins */
}

.article-card .wp-block-post-featured-image img {
    aspect-ratio: 16/9 !important;
    object-fit: cover !important;
    width: 100%;
}

.article-card h2.wp-block-post-title a {
    font-family: 'Lora', serif;
    font-size: 1.4rem;
    color: #C18063; /* Terracotta */
    text-decoration: none;
    letter-spacing: 1px;
    line-height: 1.2;
}

.article-card .wp-block-post-excerpt {
    font-family: 'Montserrat', sans-serif;
    color: #1A1A1A; /* Dark Text */
    flex-grow: 1 !important;
}

/* Footer Spacing & Balance */
footer, .wp-block-template-part-footer {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}
.wp-block-template-part-footer .wp-block-navigation {
    margin-bottom: 30px !important; /* Space between nav and copyright */
}

/*
 * Article Cards Grid Styling
 *
 * Ensures all article cards on the Articles page are the same size
 * and align perfectly in a responsive grid.
 */

/* 1. Grid Alignment - Force perfect box alignment */
.wp-block-post-template,
.wp-block-post-template.is-layout-grid {
    display: grid !important;
    align-items: stretch !important;
    gap: 2rem; /* Consistent gap between cards */
}

/* 1. THE CARD CONTAINER: Tighter Vertical Connection */
.article-card .wp-block-group {
    margin-top: -5px !important; /* Pulls the text block UP into the image space */
    padding-top: 10px !important; /* Creates the 5px-ish gap you want internally */
    padding-left: 35px !important;
    padding-right: 35px !important;
    padding-bottom: 35px !important;
    position: relative !important; /* Ensures it sits correctly over the image container */
    z-index: 2 !important;
    background-color: #F9F6F0 !important; /* Ensure the background covers any overlap */
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important; /* Zero out the default 'Block Gap' between elements */
}

/* 2. THE TITLE: Pull up to Image, Pull Excerpt up to Title */
.article-card h2.wp-block-post-title {
    margin-top: 0 !important; /* Zero margin above title */
    margin-bottom: -5px !important; /* Negative margin to pull the excerpt even closer */
    padding: 0 !important;
    line-height: 1.1 !important;
    margin-left: 15px !important;
    margin-right: 15px !important;
}

/* 3. THE EXCERPT: Eliminate Top Margin */
.article-card .wp-block-post-excerpt {
    margin-top: 0 !important; /* Zero margin above first sentence */
    padding-top: 0 !important;
    margin-left: 15px !important;
    margin-right: 15px !important;
}

.article-card .wp-block-post-excerpt p {
    margin-top: 0 !important; /* Zero margin on the p tag itself */
    margin-bottom: 20px !important; /* Only space is below the text */
}

/* 4. THE BUTTONS: Maintain side spacing */
.article-card .wp-block-buttons {
    margin-left: 15px !important;
    margin-right: 15px !important;
}

/* 5. THE IMAGE: Ensure no bottom margin from WP */
.article-card .wp-block-post-featured-image {
    margin-bottom: 0 !important; /* Force zero margin at bottom of image */
    padding-bottom: 0 !important;
    line-height: 0 !important; /* Prevents descender spacing in some browsers */
    display: block !important;
}

.article-card .wp-block-post-featured-image img {
    display: block !important;
    margin-bottom: 0 !important;
}

/* Force Equal Height Article Cards */
.wp-block-post-template.is-layout-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* Force 2 columns */
    align-items: stretch !important; /* Stretch cards to match tallest neighbor */
    gap: 40px !important;
}
.article-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    background: #F9F6F0 !important; /* Off-White */
}

/* =========================================
   Invocation Button Styling
========================================= */
.invocation-btn {
    background-color: #F9F6F0 !important; /* Off-White / Cream */
    color: #1A1A1A !important; /* Charcoal text */
    border: 2px solid #8F9E8B !important; /* Sage Border for definition */
    padding: 30px 60px !important;
    font-size: 1.2rem !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.invocation-btn:hover {
    background-color: #C18063 !important; /* Terracotta highlight */
    color: #F9F6F0 !important; /* Flip text to off-white for contrast */
    border-color: #C18063 !important;
    transform: translateY(-2px) !important;
}

/* Invocation Text Styling */
/* Updated: Lengthened Invocation Box */
.invocation-text-box {
    background: #F9F6F0 !important;
    border: 1px solid #8F9E8B !important;
    padding: 60px 50px !important; /* Increased padding for 'lengthened' look */
    margin-top: 20px !important;
    border-radius: 12px !important;
    display: inline-block !important;
    max-width: 750px !important; /* Increased from 600px */
    width: 100%;
    box-shadow: 0 15px 40px rgba(0,0,0,0.05);
}

/* New: Invocation 'Learn More' Button */
.invocation-learn-more {
    display: inline-block !important;
    margin-top: 40px !important;
    padding: 12px 25px !important;
    background-color: #C18063 !important; /* Terracotta */
    color: #FFFFFF !important;
    text-decoration: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

.invocation-learn-more:hover {
    background-color: #A66B52 !important;
    transform: translateY(-2px);
}

.invocation-section {
    border-bottom: 1px solid rgba(143, 158, 139, 0.2); /* Sage divider */
    padding-bottom: 25px;
    margin-bottom: 25px;
}

.invocation-section.last-section {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.invocation-transliteration {
    font-family: 'Lora', serif !important;
    font-size: 1.2rem !important;
    font-weight: 500;
    color: #1A1A1A !important;
    line-height: 1.6;
}

.invocation-english {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.95rem !important;
    font-style: italic;
    color: #8F9E8B !important; /* Sage Green */
    line-height: 1.8;
}

.invocation-script {
    font-family: 'Lora', serif !important; /* Most serif fonts handle Devanagari well */
    font-size: 1.5rem !important;
    color: #C18063 !important; /* Terracotta for the script */
    line-height: 1.4;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.payment-details-box {
    background: #F9F6F0; /* Off-white */
    border: 1px solid rgba(143, 158, 139, 0.3);
    border-radius: 12px;
    margin-top: 20px;
    padding: 35px 45px !important; /* Matches article card spacing */
    text-align: left;
    animation: slideDown 0.4s ease forwards;
}

.payment-divider {
    height: 1px;
    background: rgba(143, 158, 139, 0.2);
    margin: 20px 0;
}

.offering-list {
    list-style: none;
    padding: 0;
}

.offering-list li {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
}

.sliding-scale {
    font-style: italic;
    font-size: 0.85rem;
    color: #8F9E8B; /* Sage Green */
    margin-top: 15px;
}

/* Ensure Contact Page Buttons are Fully Clickable */
.contact-glass-card .wp-block-buttons {
    pointer-events: auto !important;
}

.contact-glass-card .wp-block-button {
    pointer-events: auto !important;
}

.contact-glass-card .wp-block-button__link {
    pointer-events: auto !important;
}

/* Internal Padding for Text Boxes */
.article-card .wp-block-group {
    padding-left: 45px !important; /* Increased for Museum-grade breathing room */
    padding-right: 45px !important; /* Increased for Museum-grade breathing room */
    padding-top: 35px !important;
    padding-bottom: 35px !important;
    flex-grow: 1 !important; /* Pushes card footer/excerpt to align */
}

/* 1. Force Authority on Font Size */
.articles-section-wrapper .article-card h2.wp-block-post-title {
    font-size: 2.5rem !important; /* Bold, oversized 'Museum' heading */
    font-family: 'Lora', serif !important;
    line-height: 1.1 !important;
    margin-bottom: 20px !important;
}
.articles-section-wrapper .article-card h2.wp-block-post-title a {
    color: #C18063 !important; /* Terracotta */
    text-decoration: none !important;
}

/* 2. Stretched Link (Makes the WHOLE CARD the link) */
.articles-section-wrapper .article-card h2.wp-block-post-title a::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10; /* Covers the entire card */
}

/* 3. Force Internal Padding (45px Margins) */
.articles-section-wrapper .article-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    background: #F9F6F0 !important; /* Off-White */
}

.articles-section-wrapper .article-card .wp-block-post-title,
.articles-section-wrapper .article-card .wp-block-post-excerpt,
.articles-section-wrapper .article-card .wp-block-buttons {
    padding-left: 45px !important; /* Museum-grade internal margins */
    padding-right: 45px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 4. Fix Button Visibility and Alignment */
.articles-section-wrapper .article-card .wp-block-buttons {
    margin-top: auto !important; /* Pushes button to bottom */
    padding-bottom: 45px !important;
    z-index: 1; /* Sits below the link overlay so clicks pass through to the card link */
}

/* 1. The Static Terracotta Box */
.static-read-more {
    background-color: #C18063 !important; /* Terracotta */
    color: #FFFFFF !important;
    padding: 12px 30px !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    font-size: 0.9rem !important;
    text-align: center !important;
    width: fit-content !important;
    
    /* Vertical Alignment logic */
    margin-top: auto !important; /* Pushes to bottom */
    margin-bottom: 45px !important; /* Matches site-wide spacing */
    
    /* Horizontal Alignment logic */
    margin-left: 55px !important; /* Matches title/excerpt padding + 10px inset */
    align-self: flex-start !important; /* Forces left-justification within the flex card */
    
    pointer-events: none !important; /* Clicks fall through to the card's stretched link */
}

/* 2. Increase Font Size Authority (Force 2.8rem) */
.articles-section-wrapper .article-card h2.wp-block-post-title {
    font-size: 2.8rem !important; /* Large, bold Museum-style */
    font-family: 'Lora', serif !important;
    margin-top: 0 !important;
    margin-bottom: 20px !important;
    line-height: 1.1 !important;
}

/* 3. The Stretched Link Overlay */
.article-card {
    position: relative !important;
    z-index: 1;
}

.article-card h2.wp-block-post-title a::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10; /* Transparent layer over the whole card */
}

/*
 * Contact Page Styling
 */

/* Contact Artwork Interaction */
.contact-artwork {
    border-radius: 15px;
    overflow: hidden;
}

.contact-artwork img {
    width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s ease !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
    display: block;
}

/* Subtle 'Lift and Rotate' effect on hover */
.contact-artwork img:hover {
    transform: scale(1.02) rotate(1deg) !important;
    box-shadow: 0 15px 40px rgba(0,0,0,0.15) !important;
}

/* Contact Hero Card Styling */
.contact-hero-card {
    /* Reduce the negative margin so it sits less aggressively in the banner */
    margin: -60px auto 60px !important; /* Was -100px */
    padding: 35px !important;
    /* Ensure the borders remain prominent */
    border: 2px solid #8F9E8B !important; /* Explicit Sage Green border */
    box-shadow: 0 10px 30px rgba(143, 158, 139, 0.1); /* Softer, Sage-tinted shadow */
}

/* Fallback styling when no featured image is set */
.contact-artwork:not(:has(img)) {
    background: linear-gradient(135deg, #F9F6F0 0%, #F2E8DC 100%);
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
}

.contact-artwork:not(:has(img))::before {
    content: "Set Featured Image";
    font-family: 'Montserrat', sans-serif;
    font-size: 1.2rem;
    color: #8F9E8B;
    font-style: italic;
}

/* Custom Address Hover Behavior */
.address-btn {
    cursor: pointer;
    transition: all 0.3s ease;
}
.address-btn:hover {
    background-color: #C18063 !important; /* Terracotta highlight */
    color: #FFFFFF !important;
}

/* Formatted address appearance animation */
#formatted-address {
    animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

.address-link {
    transition: color 0.3s ease;
    display: inline-block;
}
.address-link:hover {
    color: #C18063 !important; /* Terracotta highlight on hover */
    text-decoration: underline !important;
}

/* Responsive stacking on mobile */
@media (max-width: 781px) {
    .wp-block-columns.are-vertically-aligned-center {
        flex-direction: column;
    }
    
    .contact-artwork {
        margin-bottom: 2rem;
    }
}

/*
 * Homepage Card Equal Heights & Tightened Spacing
 */

/* Force equal heights on Learn More section cards */
.has-tan-background-color .wp-block-columns {
    display: flex !important;
    align-items: stretch !important;
}

.has-tan-background-color .wp-block-column {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

/* Inner mentoring-card flex structure */
.is-style-mentoring-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

.is-style-mentoring-card p {
    flex-grow: 1 !important;
}

/* Reduce homepage section spacing by 30% (60px → 42px) */
body.home .wp-block-group.alignfull {
    padding-top: 42px !important;
    padding-bottom: 42px !important;
}

/* Keep hero section at full height */
body.home .wp-block-group.alignfull[style*="height: 700px"] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* 1. Target the ACTUAL list container created by the Query Loop */
.wp-block-post-template.is-layout-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr); /* Forces 2 columns */
    align-items: stretch !important; /* Forces all cards in a row to the same height */
    gap: 60px 40px !important;
    list-style: none;
    padding: 0;
}

/* 2. Force the card (the 'li' or 'div') to fill the grid cell height */
.wp-block-post-template.is-layout-grid li,
.article-card,
.is-style-mentoring-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    margin: 0 !important; /* Prevents margin from breaking alignment */
}

/* 3. The 'Spring' - Forces the bottom content to align */
.article-card .wp-block-post-excerpt,
.is-style-mentoring-card p:last-of-type {
    flex-grow: 1 !important; /* Pushes the card height to match neighbors */
}

/* 4. Fix Image Aspect Ratio to prevent shifting */
.article-card .wp-block-post-featured-image img {
    aspect-ratio: 16/9 !important;
    object-fit: cover !important;
    width: 100% !important;
    /* Shift the focal point up to preserve heads/tops of photos */
    object-position: center 15% !important;
    height: auto !important;
}

/* View All Articles button styling - Terracotta outline on Off-White */
.fixed-article-grid > .wp-block-buttons .wp-block-button__link {
    background-color: #F9F6F0 !important; /* Off-White */
    color: #C18063 !important; /* Terracotta */
    border: 2px solid #C18063 !important;
    border-radius: 8px !important;
    padding: 15px 40px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.3s ease !important;
}

.fixed-article-grid > .wp-block-buttons .wp-block-button__link:hover {
    background-color: #C18063 !important; /* Terracotta */
    color: #F9F6F0 !important; /* Off-White */
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(193, 128, 99, 0.3) !important;
}

/* Tighten up the homepage airiness */
.home-section-container {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* Fix the 'View All' Button Gap */
.wp-block-query + .wp-block-buttons {
    margin-top: 60px !important; /* Large gap only above the button */
    margin-bottom: 80px !important;
}

/* Fix the 'Learn More' edge bleeding */
.learn-more-container {
    max-width: 1200px !important; /* WideSize from theme.json */
    margin: 0 auto !important;
    padding: 0 40px !important; /* Site margins */
}
/* Welcome Section Styles - Compact Layout */

/* 1. Reduce the vertical footprint of the welcome area */
.welcome-section-container {
    padding-top: 40px !important;    /* Reduced from standard padding */
    padding-bottom: 40px !important;
    margin-bottom: 20px !important;
}

/* 2. Constrain the welcome image size */
.welcome-image img {
    max-height: 450px !important;    /* Prevents the section from stretching */
    width: auto !important;
    margin: 0 auto !important;
    border-radius: 15px !important;  /* Matches site-wide theme */
    object-fit: cover !important;
}

/* 3. Tighten the heading and text spacing */
.welcome-text h2 {
    margin-top: 0 !important;
    margin-bottom: 15px !important;
}

/* Museum Gallery Curated Collection Styles */

/* 1. Force a 4-column grid for a more 'collection' feel */
.wp-block-gallery.has-nested-images {
    grid-template-columns: repeat(4, 1fr) !important; /* Smaller images */
    gap: 30px !important;
    padding: 20px 0 !important;
}

/* 2. Deepen the Museum Matte */
.wp-block-gallery .wp-block-image {
    background: #ffffff !important;
    padding: 35px !important; /* Larger white 'matte' makes art feel smaller/precious */
    box-shadow: 0 2px 15px rgba(0,0,0,0.04) !important;
    border-radius: 2px !important;
    transition: all 0.4s ease !important;
}

.wp-block-gallery .wp-block-image:hover {
    transform: translateY(-8px) scale(1.02) !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1) !important;
}

/* 3. Constrain image size within the matte */
.wp-block-gallery .wp-block-image img {
    max-height: 300px !important; /* Prevents vertical art from getting too big */
    width: auto !important;
    margin: 0 auto !important;
    object-fit: contain !important;
}

/* 4. Tighten the Hero section to match */
.art-gallery-hero {
    padding-top: 80px !important; /* Less 'airiness' at the very top */
    padding-bottom: 40px !important;
}

/* Art Exhibition Hero (Fallback) */
.art-exhibition-hero {
    padding-top: 120px !important;
    background-color: #F9F6F0 !important; /* Off-White */
}

/* =========================================
   Anusara Badge Alignment
========================================= */
.anusara-badge-left {
    float: left !important;
    margin-right: 30px !important; /* Adequate padding around it */
    margin-bottom: 15px !important;
    margin-top: -60px !important; /* Lift badge up 60px */
    max-width: 120px !important; /* Size managed to keep it within section */
    height: auto !important;
}

/* Clearfix for the section to prevent layout breaking */
.training-lineage-section::after {
    content: '';
    display: table;
    clear: both;
}

/* =========================================
   Center the Mentoring/Service Cards (DEPRECATED)
========================================= */
/* Note: Replaced by .mentoring-cards-grid rules below */

/* =========================================
   FORCE MENTORING GRID CENTERING (ACTIVE)
========================================= */
/* Target the correct class name from the HTML template */
.mentoring-cards-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important; /* This centers the group of cards */
    gap: 30px !important;
    width: 100% !important;
    max-width: 1200px !important; /* Constrains the width so it can be centered */
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 60px 20px !important;
}

/* Ensure the inner cards are sized correctly for the flex layout */
.mentoring-cards-grid > .wp-block-group {
    flex: 0 1 350px !important; /* Sets a base width for each card */
    margin: 0 !important; /* Removes default block margins that cause off-centering */
}

/* Footer Layout and Styling */
.wp-block-template-part-footer {
    background-color: #8F9E8B !important;
    padding: 30px 40px 20px !important; /* Tightened top/bottom padding */
    color: #FFFFFF !important;
}

/* Top Row: Brand + YouTube + Contact */
.footer-top-container {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 25px !important; /* Reduced gap */
}

.footer-brand-social {
    display: flex;
    align-items: center;
    gap: 15px; /* Tight gap between title and YouTube */
}

.footer-youtube-link {
    font-size: 0.8rem;
    opacity: 0.9;
    text-decoration: none;
    color: #FFFFFF !important;
    border: 1px solid rgba(255,255,255,0.3);
    padding: 2px 8px;
    border-radius: 4px;
}

/* Bottom Row: Horizontal Links */
.footer-nav-strip {
    display: flex !important;
    justify-content: center !important;
    gap: 30px !important; /* Horizontal spacing */
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 15px;
}

.footer-nav-strip a {
    color: #FFFFFF !important;
    text-decoration: none !important;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Legacy footer classes for backward compatibility */
.footer-header-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    margin-bottom: 50px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 20px;
}

.footer-contact-links {
    display: flex;
    gap: 20px;
    align-items: center;
}

.footer-top-brand {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.footer-top-contact {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
    text-align: right;
}

.footer-contact-right {
    text-align: right;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
}

.footer-contact-right a {
    color: #FFFFFF !important;
    text-decoration: none;
}

.footer-contact-right a:hover {
    color: #C18063 !important; /* Terracotta hover */
}

/* Bottom Navigation: Perfectly Centered Columns */
.footer-nav-grid {
    display: flex !important;
    justify-content: center !important;
    gap: 120px !important; /* Wide gap between the two columns */
    text-align: left;
}

.footer-nav-grid ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.footer-nav-grid a {
    color: #FFFFFF !important;
    text-decoration: none !important;
    font-family: 'Lora', serif;
    font-size: 1.1rem;
    line-height: 2.2;
}

/* Centered Navigation Columns */
.footer-nav-columns {
    border-top: 1px solid rgba(255, 255, 255, 0.2); /* Subtle divider */
    padding-top: 40px;
    display: flex;
    justify-content: center;
    gap: 100px;
}

.footer-nav-columns ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-nav-columns a {
    color: #FFFFFF !important;
    text-decoration: none;
    font-family: 'Lora', serif;
    font-size: 1.1rem;
    line-height: 2;
    transition: color 0.3s ease;
}

.footer-nav-columns a:hover {
    color: #C18063 !important; /* Terracotta hover */
}

/* Footer Contact Information Refinements */
.footer-contact-info a {
    transition: opacity 0.3s ease;
    border-bottom: 1px solid transparent;
}

.footer-contact-info a:hover {
    opacity: 0.8;
    border-bottom: 1px solid #F9F6F0; /* Off-white underline on hover */
}

/* Hide 'Stay Connected' Newsletter on all Blog views */
.blog .wp-block-template-part-newsletter,
.archive .wp-block-template-part-newsletter,
.category .wp-block-template-part-newsletter,
.single-post .wp-block-template-part-newsletter {
    display: none !important;
}

/* Hide 'STAY CONNECTED' Newsletter on Blog, Archive, and Single Post views */
.blog .has-sage-green-background-color,
.archive .has-sage-green-background-color,
.category .has-sage-green-background-color,
.single-post .has-sage-green-background-color {
    /* Specifically targets the group containing the newsletter text */
    display: none !important;
}

/* =========================================
   Mobile Responsive Overrides (< 782px)
========================================= */
@media (max-width: 782px) {
    /* 1. Header: Stack Logo and Nav */
    .wp-block-group.alignfull[style*="justify-content: space-between"] {
        flex-direction: column !important;
        gap: 20px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        text-align: center !important;
    }

    header nav, 
    .wp-block-group nav {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 15px !important;
    }

    /* 2. Footer: Stack Columns and Reset Gaps */
    .footer-top-container {
        flex-direction: column !important;
        gap: 30px !important;
        text-align: center !important;
    }

    .footer-nav-columns {
        flex-direction: column !important;
        gap: 40px !important; /* Reduces the 100px desktop gap */
        align-items: center !important;
    }

    /* 3. Global Width Safety */
    img, .wp-block-cover, .wp-block-group {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 4. Article Grids (Home & Articles Page): Force 1 Column */
    .wp-block-post-template.is-layout-grid {
        grid-template-columns: 1fr !important; /* Stack articles vertically */
        gap: 30px !important;
    }

    /* 5. Art Gallery: Drop from 2 columns to 1 */
    .art-gallery-container .wp-block-gallery.has-nested-images {
        grid-template-columns: 1fr !important; /* Stack art pieces */
    }

    /* 6. Standard WP Columns: Ensure they stack early */
    .wp-block-columns {
        flex-direction: column !important;
    }

    .wp-block-column {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 20px !important;
    }

    /* 7. Text Adjustments for Museum Titles */
    .articles-section-wrapper .article-card h2.wp-block-post-title {
        font-size: 1.8rem !important; /* Scale down titles on mobile */
        padding-left: 25px !important; /* Reduce padding for more text room */
        padding-right: 25px !important;
    }

    .article-card .wp-block-post-excerpt,
    .article-card .wp-block-buttons {
        padding-left: 25px !important;
        padding-right: 25px !important;
    }
}