/* Add your custom Tailwind base styles or component styles here if needed */
body {
    font-family: 'Poppins', sans-serif;
}

/* You can also define specific styles for headings if you want a different weight */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', sans-serif; /* Ensures headings also use Poppins */
}

header {
    background-color: #007bff; /* Example primary color */
}

.card {
    border: none;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* Fade transitions and testimonial styling */
.fade-out {
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
}

.fade-in {
    opacity: 1;
    transition: opacity 0.4s ease-in-out;
}

#hero-title,
#hero-paragraph,
.testimonial-item {
    transition: opacity 0.4s ease-in-out;
}

.testimonial-item {
    min-height: 300px; /* Adjust as needed to prevent layout shifts */
}

/* Custom styles for article content */
.prose h2 {
    font-weight: 600; /* Corresponds to Tailwind's font-semibold or font-bold depending on the exact look you want. 700 for bold. */
    /* Tailwind's default prose h2 is often already quite bold, but this ensures it if there's a conflict or different base. */
    /* If you specifically want it bolder than default prose, use 700 or bold */
}

/* Hero Section Styles */
.hero-video-container {
    background-color: black; /* Fallback for video */
}

#hero-video-element {
    opacity: 0.9;
}

#hero-title {
    /* display: inline-block; Tailwind class 'inline-block' can be used instead if preferred */
    /* background-size: cover; Tailwind class 'bg-cover' can be used */
    /* background-position: center; Tailwind class 'bg-center' can be used */
    /* Note: The inline styles for background were removed as per previous request, 
       but if a background *image* were to be applied via CSS, these would be relevant.
       The 'display: inline-block' is kept here as it was part of the inline styles to be moved. */
    display: inline-block;
    /* If a background image is ever set on #hero-title via CSS: */
    /* background-size: cover; */
    /* background-position: center; */
}