/*
Theme Name: Spokane Professional Doula - Hybrid
Description: Custom Theme A colors merged with Twenty Twenty-Five (Theme B) behaviors.
*/

@import url('https://fonts.googleapis.com/css?family=ABeeZee:400,400i');

/* --- 1. GLOBAL BASE (Theme A Identity) --- */
body {
    font-family: 'ABeeZee', sans-serif;
    color: #616261;
    line-height: 1.4;
    background-color: #fff;
}

h1, h2, h3, h4 {
    font-weight: normal;
}

/* Color Overrides */
h2 { color: #47559f; }
h3 { color: #608b42; }

/* --- 2. LAYOUT & NAVIGATION (Theme B Logic + Theme A Colors) --- */

/* Fix for WordPress Admin Bar */
body.admin-bar .site-header { top: 32px !important; }

.site-header {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
    transition: all 0.3s ease-in-out;
    /* Theme A Background Pattern & Color */
    background: #dddfe5 url(img/pattern-compressed.png) repeat; 
    border-bottom: 1px solid #47559f !important;
    padding: 15px 0;
}

.site-header a {
    color: #47559f !important; /* Theme A Primary */
    text-transform: uppercase;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-decoration: none;
}

.site-header a:hover {
    color: #608b42 !important; /* Theme A Secondary */
}

/* Mobile Menu Overlay */
.wp-block-navigation__responsive-container.is-menu-open {
    background-color: #47559f !important;
    color: #ffffff !important;
}

/* --- 3. HERO & BRANDING (Merged) --- */

.collective-hero {
    background: #e0e3dd url(img/pattern-compressed.png) repeat; /* Theme A section background */
    padding: 100px 5% 80px 5%;
    min-height: 80vh;
}

.collective-main-title {
    font-family: 'ABeeZee', sans-serif;
    color: #47559f;
    font-weight: 800;
}

.collective-specialty-subtitle {
    color: #608b42; /* Theme A Green */
    letter-spacing: 0.45em;
    font-weight: 700;
}

.hero-button .wp-block-button__link {
    background-color: #47559f !important; /* Theme A Primary */
    color: #fff !important;
    padding: 18px 35px !important;
    border-radius: 10px !important; /* Theme A radius style */
}

.hero-image-wrap img {
    border-radius: 20px;
    box-shadow: 20px 20px 0px #608b42; /* Green shadow from Theme A palette */
}

/* --- 4. CARDS & SECTIONS --- */

.doula-card {
    border: 1px solid #ddd;
    padding: 25px;
    border-radius: 12px;
    background: #fff;
    transition: 0.3s;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/*.doula-card:hover {
    transform: translateY(-5px);
    border-color: #47559f;
    box-shadow: 0 10px 20px rgba(71, 85, 159, 0.2);
}*/

.specialist-card {
    border-top: 4px solid #608b42; /* Green highlight */
}

.doula-card .wp-block-button__link {
    background-color: #47559f !important;
    border-radius: 10px;
}

.specialist-card .wp-block-button__link {
    background-color: #608b42 !important;
}

/* --- DOULA CARD HOVER EFFECT --- */

.doula-card:hover {
    /* Slight zoom effect (1.03 scale is roughly equivalent to the original visual weight) */
    transform: scale(1.03);
    
    /* Enhance the shadow during zoom to create depth */
    box-shadow: 0 12px 24px rgba(71, 85, 159, 0.15);
    
    /* Ensure the card stays above others during the zoom */
    z-index: 10;
}



/* --- 5. TIMELINE & BLOCKS --- */

@media (min-width: 768px) {
    .timeline-point::after {
        border: 4px solid #47559f !important;
    }
}

.birth-highlight {
    background-color: #f0fdf4 !important; /* Soft green */
    border: 2px solid #608b42 !important;
    border-radius: 12px;
}

div.interview-guide-box {
    background-color: #fff !important;
    border: 2px dashed #47559f !important;
    border-radius: 15px !important;
}

.interview-list li::before {
    content: '✓' !important;
    color: #608b42 !important;
}

/* --- 6. FOOTER --- */

footer {
    background: #47559f url(img/pattern-compressed.png) repeat !important;
    padding: 40px 0;
    color: #fff;
}

footer a {
    color: #fff !important;
}

footer .copyright {
    border-top: 1px solid rgba(255,255,255,0.2);
    margin-top: 20px;
    padding-top: 20px;
}

/* --- 7. MOBILE REFINEMENTS (Theme B) --- */

@media screen and (max-width: 768px) {
    .wp-block-grid {
        grid-template-columns: 1fr !important;
        display: grid !important;
        gap: 20px !important;
    }
    
    .site-header {
        position: relative; /* Often better for mobile accessibility */
    }
}

.content-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}
.entry-content, .search-results-wrapper {
    flex: 1;
    min-width: 300px;
}
.sidebar {
    width: 300px;
}