/* Lisa's Lighthouse Doula Services - Sunflower Theme & Container Cards */
:root {
    --primary-amber: #d4ac0d;
    --primary-dark: #b7950b;
    --deep-brown: #3e2723;
    --warm-bg: #fef9e7;
    --card-bg: rgba(255, 255, 255, 0.75); /* 75% opacity to let background show through */
    --text-main: #2c2c2c;
    --border-soft: #f9e79f;
}

/* Page Setup with Semi-Transparent Watermark Background */
body { 
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
    line-height: 1.6; 
    color: var(--text-main); 
    margin: 0; 
    padding: 0;
    /* Layering a soft warm tint over the background picture for transparency effect */
    background: linear-gradient(rgba(254, 249, 231, 0.85), rgba(254, 249, 231, 0.85)), 
                url('lighthouse-bg.jpg') no-repeat center center fixed;
    background-size: cover;
}

/* Top Header */
header { 
    background: var(--deep-brown); 
    color: #fff; 
    padding: 2rem 1rem 1.5rem 1rem; 
    text-align: center; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

header h1 {
    margin: 0;
    font-size: 2.2rem;
    color: #fcf3cf;
    letter-spacing: 0.5px;
}

header p {
    margin: 5px 0 15px 0;
    font-style: italic;
    color: #f7dc6f;
    font-size: 0.95rem;
}

/* Navigation Menu */
nav { 
    margin-top: 15px; 
    background: rgba(0, 0, 0, 0.2);
    padding: 10px 0;
    border-radius: 8px;
    display: inline-block;
}

nav a { 
    color: #fcf3cf; 
    text-decoration: none; 
    margin: 0 10px; 
    font-weight: bold; 
    padding: 8px 16px; 
    border-radius: 20px;
    transition: all 0.3s ease;
    display: inline-block;
}

nav a:hover, nav a.active { 
    background: var(--primary-amber); 
    color: var(--deep-brown); 
}

/* Hero Header Banner (Bubble Card) */
.hero { 
    background: var(--card-bg); 
    color: var(--deep-brown); 
    padding: 3rem 2rem; 
    text-align: center; 
    max-width: 850px;
    margin: 30px auto 0 auto;
    border-radius: 16px;
    border: 2px solid var(--border-soft);
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}

.hero-sunflower-icon {
    font-size: 2.5rem;
    margin-bottom: 10px;
}

.hero h2 { 
    color: var(--deep-brown); 
    font-size: 2.2rem; 
    margin-bottom: 15px; 
    font-family: Georgia, serif;
}

.hero p { 
    font-size: 1.15rem; 
    max-width: 750px; 
    margin: auto; 
    color: #4a342e;
}

/* Main Content Floating "Bubble" Container */
.container { 
    padding: 3rem 2.5rem; 
    max-width: 850px; 
    margin: 30px auto 40px auto; 
    background: var(--card-bg);
    border-radius: 16px;
    border: 2px solid var(--border-soft);
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}

.section-heading {
    color: var(--deep-brown);
    font-size: 1.8rem;
    margin-bottom: 15px;
    font-family: Georgia, serif;
}

/* Inner Photo Bubble Card */
.photo-card {
    background: rgba(255, 255, 255, 0.85);
    border: 2px dashed var(--primary-amber);
    border-radius: 12px;
    padding: 20px;
    margin: 25px 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.photo-card img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

/* Action Buttons */
.buttons { 
    display: flex; 
    flex-wrap: wrap; 
    justify-content: center; 
    gap: 15px; 
    margin-top: 35px; 
}

.btn { 
    background: var(--primary-amber); 
    color: var(--deep-brown); 
    padding: 14px 24px; 
    text-decoration: none; 
    border-radius: 30px; 
    font-weight: bold; 
    transition